完成注册激活功能

src/common/ClientConnection.ts

@@ -659,10 +659,25 @@ export default class ClientConnection {
     }
   }
 
-  public async registerDevice(register_code: string, active_code: string) {
+  public async registerDevice(
+    register_code: string,
+    active_code: string,
+    online: boolean,
+    active_forever: boolean,
+    secret_key?: string,
+    hour?: number
+  ) {
     try {
       return await this.doRpc<Protocol.RegisterDeviceResponseEntity>(
-        new Protocol.RegisterDeviceRequestEntity(register_code, active_code, 0)
+        new Protocol.RegisterDeviceRequestEntity(
+          register_code,
+          active_code,
+          online,
+          active_forever,
+          secret_key,
+          hour,
+          0
+        )
       );
     } catch (e) {
       console.error(e);

src/components/RegisterDialog.vue

@@ -7,6 +7,16 @@
       (evt) => {
         if (evt.keyCode == 27) {
           show_dialog = false;
+        } else if (
+          evt.keyCode == 85 &&
+          evt.ctrlKey &&
+          evt.altKey &&
+          evt.shiftKey
+        ) {
+          ext_flag = !ext_flag;
+          if (!ext_flag) {
+            register_type = 'offline';
+          }
         }
       }
     "
@@ -17,6 +27,23 @@
           <div class="row">
             <div class="col-auto text-h6">
               {{ $t("register dialog") }}
+              <span>
+                (
+                <span v-if="!register_flag" class="text-red">{{
+                  $t("not registered")
+                }}</span>
+                <span v-else class="text-green">{{ $t("registered") }}</span>
+                <span v-if="trial_days"
+                  >,{{ $t("trial days") }}:{{ trial_days }}{{ $t("day") }}</span
+                >
+                <span v-if="trial_days"
+                  >,{{ $t("last days") }}:{{ last_days }}{{ $t("day") }}</span
+                >
+                <span v-if="register_flag"
+                  >,{{ $t("register date") }}: {{ register_date }}</span
+                >
+                )
+              </span>
             </div>
             <q-space />
             <div>
@@ -40,7 +67,32 @@
 
         <q-card-section class="scroll" style="width: 60vw">
           <q-list>
-            <q-item>
+            <q-item v-if="ext_flag">
+              <q-item-section avatar class="header_label">
+                {{ $t("register type") }}
+              </q-item-section>
+              <q-item-section>
+                <div class="row q-gutter-sm">
+                  <q-radio
+                    v-model="register_type"
+                    checked-icon="task_alt"
+                    unchecked-icon="panorama_fish_eye"
+                    val="offline"
+                    :label="$t('offline register')"
+                    class="offset-md-1 col"
+                  />
+                  <q-radio
+                    v-model="register_type"
+                    checked-icon="task_alt"
+                    unchecked-icon="panorama_fish_eye"
+                    val="online"
+                    :label="$t('online register')"
+                    class="col"
+                  />
+                </div>
+              </q-item-section>
+            </q-item>
+            <q-item v-if="register_type == 'offline'">
               <q-item-section avatar class="header_label">
                 {{ $t("register code") }}
               </q-item-section>
@@ -50,7 +102,12 @@
                 </div>
               </q-item-section>
               <q-item-section avatar>
-                <qrcode-vue :value="register_code" level="H" />
+                <qrcode-vue
+                  :value="register_code"
+                  level="H"
+                  render-as="svg"
+                  :size="195"
+                />
               </q-item-section>
               <q-item-section avatar>
                 <q-btn
@@ -76,7 +133,7 @@
                 </q-btn>
               </q-item-section>
             </q-item>
-            <q-item>
+            <q-item v-if="register_type == 'offline'">
               <q-item-section avatar class="header_label">
                 {{ $t("active code") }}
               </q-item-section>
@@ -85,6 +142,7 @@
                   type="textarea"
                   v-model="active_code"
                   lazy-rules
+                  autofocus
                   :rules="[
                     (val) =>
                       (val && val.length > 0) || $t('Please type something'),
@@ -92,6 +150,73 @@
                 />
               </q-item-section>
             </q-item>
+            <q-item v-if="register_type == 'offline'">
+              <q-item-section avatar class="header_label">
+                {{ $t("secret key") }}
+              </q-item-section>
+              <q-item-section>
+                <q-input v-model="secret_key"> </q-input>
+              </q-item-section>
+              <q-item-section avatar> ({{ $t("optional") }}) </q-item-section>
+            </q-item>
+            <q-item v-if="register_type == 'online'">
+              <q-item-section avatar class="header_label">
+                {{ $t("server ipaddress") }}
+              </q-item-section>
+              <q-item-section>
+                <q-input
+                  v-model="active_code"
+                  autofocus
+                  lazy-rules
+                  :rules="[
+                    (val) =>
+                      isIpAddress(val) || $t('Please input vaild ip address'),
+                  ]"
+                />
+              </q-item-section>
+            </q-item>
+            <q-item v-if="register_type == 'online'">
+              <q-item-section avatar class="header_label">
+                {{ $t("active type") }}
+              </q-item-section>
+              <q-item-section>
+                <div class="row q-gutter-sm">
+                  <q-radio
+                    v-model="active_type"
+                    checked-icon="task_alt"
+                    unchecked-icon="panorama_fish_eye"
+                    val="forever"
+                    :label="$t('forever active')"
+                    class="offset-md-1 col"
+                  />
+                  <q-radio
+                    v-model="active_type"
+                    checked-icon="task_alt"
+                    unchecked-icon="panorama_fish_eye"
+                    val="limit"
+                    :label="$t('time limit active')"
+                    class="col"
+                  />
+                </div>
+              </q-item-section>
+            </q-item>
+            <q-item v-if="register_type == 'online' && active_type == 'limit'">
+              <q-item-section avatar class="header_label">
+                {{ $t("active time") }}
+              </q-item-section>
+              <q-item-section>
+                <q-input
+                  v-model="active_hour"
+                  type="number"
+                  min="1"
+                  max="65535"
+                >
+                  <template v-slot:append>
+                    {{ $t("day") }}
+                  </template>
+                </q-input>
+              </q-item-section>
+            </q-item>
           </q-list>
         </q-card-section>
 
@@ -152,47 +277,76 @@ export default defineComponent({
 
     let show_dialog = ref(false);
     let loading = ref(false);
-    let register_code: Ref<string> = ref("");
+
-    let active_code: Ref<string> = ref("");
+    const register_type = ref("offline");
+    const register_code: Ref<string> = ref("");
+    const active_code: Ref<string> = ref("");
+    const active_type = ref("forever");
+    const secret_key = ref("");
+    const active_hour = ref(1);
+    const ext_flag = ref(false);
+
+    const trial_days = ref(0);
+    const last_days = ref(0);
+    const register_date = ref("");
+    const register_flag = ref(false);
+
+    const resetData = () => {
+      ext_flag.value = false;
+      register_type.value = "offline";
+      secret_key.value = "";
+      active_type.value = "forever";
+      loading.value = false;
+      active_code.value = "";
+      register_code.value = "";
+      trial_days.value = 0;
+      register_date.value = "";
+      last_days.value = 0;
+    };
+
+    const showDialog = async () => {
+      resetData();
+
+      show_dialog.value = true;
+
+      try {
+        let response = await GlobalData.getInstance()
+          .getCurrentClient()
+          ?.getRegisterInfo();
+        if (response) {
+          register_code.value = response.register_code;
+          trial_days.value = response.trial_days;
+          last_days.value = response.last_days;
+          register_date.value = response.register_date;
+          register_flag.value = response.registered;
+        }
+        loading.value = false;
+      } catch (e) {
+        console.log(e);
+        show_dialog.value = false;
+      }
+    };
 
     return {
       show_dialog,
       loading,
       register_code,
       active_code,
+      register_type,
+      active_type,
+      active_hour,
+      ext_flag,
+      secret_key,
+      trial_days,
+      last_days,
+      register_date,
+      register_flag,
       copyToClipboard,
       isShow() {
         return show_dialog.value;
       },
-      async showDialog() {
+      showDialog,
-        show_dialog.value = true;
+      resetData,
-        loading.value = true;
-
-        try {
-          let response = await GlobalData.getInstance()
-            .getCurrentClient()
-            ?.getRegisterInfo();
-          if (response) {
-            if (response.registered) {
-              const app_config = GlobalData.getInstance().applicationConfig;
-              if (app_config) {
-                app_config.registered = true;
-                show_dialog.value = false;
-              }
-            }
-            register_code.value = response.register_code;
-          }
-          loading.value = false;
-        } catch (e) {
-          console.log(e);
-          show_dialog.value = false;
-        }
-      },
-      resetData() {
-        loading.value = false;
-        active_code.value = "";
-        register_code.value = "";
-      },
 
       async onSubmit() {
         loading.value = true;
@@ -200,7 +354,14 @@ export default defineComponent({
           let success = false;
           const response = await GlobalData.getInstance()
             .getCurrentClient()
-            ?.registerDevice(register_code.value, active_code.value);
+            ?.registerDevice(
+              register_code.value,
+              active_code.value,
+              register_type.value == "online",
+              active_type.value == "forever",
+              secret_key.value,
+              parseInt(active_hour.value.toString())
+            );
           if (response) {
             success = response.success;
           }
@@ -219,6 +380,14 @@ export default defineComponent({
         } catch {}
         loading.value = false;
       },
+      isIpAddress(str: string) {
+        return (
+          str == "localhost" ||
+          /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/.test(
+            str
+          )
+        );
+      },
     };
   },
 });

src/entities/WSProtocol.ts

@@ -1466,6 +1466,9 @@ export namespace Protocol {
   export class GetRegisterInfoResponseEntity extends Protocol.PacketEntity {
     registered: boolean = false;
     register_code: string = "";
+    trial_days: number = 0;
+    last_days: number = 0;
+    register_date: string = "";
 
     constructor() {
       super();
@@ -1476,13 +1479,36 @@ export namespace Protocol {
   export class RegisterDeviceRequestEntity extends Protocol.PacketEntity {
     timestamp: number = new Date().getMilliseconds();
     register_code: string = "";
+    secret_key: string = "";
     active_code: string = "";
-    constructor(register_code: string, active_code: string, rcp_id?: number) {
+    online: boolean = false;
+    active_forever: boolean = false;
+    hour: number = 0;
+    constructor(
+      register_code: string,
+      active_code: string,
+      online: boolean,
+      active_forever: boolean,
+      secret_key?: string,
+      hour?: number,
+      rcp_id?: number
+    ) {
       super();
       this.rpc_id = rcp_id ?? 0;
+      this.timeout = 1000 * 60 * 5; // 6911写固件比较耗时, 请求超时5分钟
       this.command = Protocol.Commands.kRpcRegisterDevice;
+      this.timestamp = new Date().getMilliseconds();
       this.register_code = register_code;
+
       this.active_code = active_code;
+      this.online = online;
+      this.active_forever = active_forever;
+      this.secret_key = secret_key ?? "";
+      if (active_forever) {
+        this.hour = 0;
+      } else {
+        this.hour = hour ?? 1;
+      }
     }
   }
 

src/i18n/zh-CN/index.ts

@@ -365,6 +365,7 @@ export default {
     "由于显示设备的不同，实际输出分辨率可能与目标分辨率有出入",
   or: "或者",
   "not registered": "未注册",
+  registered: "已注册",
   register: "注册",
   "EDID: list of resolutions recommended by the display device":
     "EDID: 显示设备推荐的分辨率列表",
@@ -397,4 +398,22 @@ export default {
   DD: "天",
   "automatically restarts after the upgrade is complete": "升级完成后自动重启",
   "plan running! can't call mode!": "预案正在运行！不能调用模式！",
+  hour: "小时",
+  "register type": "注册类型",
+  online: "在线",
+  offline: "离线",
+  "online register": "在线注册",
+  "offline register": "离线注册",
+  "server ipaddress": "服务器地址",
+  "time limit active": "限时激活",
+  "forever active": "永久激活",
+  "active type": "激活类型",
+  "active time": "激活时间",
+  "register device": "设备注册",
+  "secret key": "密钥",
+  optional: "选填",
+  "trial days": "试用天数",
+  day: "天",
+  "last days": "剩余天数",
+  "register date": "注册日期",
 };

src/pages/Index.vue

@@ -3,7 +3,6 @@
     <wall-page />
     <media-control-page />
   </q-page>
-  <register-dialog ref="register_dialog" />
 </template>
 
 <script lang="ts">
@@ -18,11 +17,9 @@ import Initializer from "src/common/Initializer";
 import GlobalData from "src/common/GlobalData";
 import RemoteDataExangeProcesser from "src/common/RemoteDataExangeProcesser";
 
-import RegisterDialog from "src/components/RegisterDialog.vue";
-
 export default defineComponent({
   name: "PageIndex",
-  components: { WallPage, MediaControlPage, RegisterDialog },
+  components: { WallPage, MediaControlPage },
   setup() {
     const $store = useStore();
     const $q = useQuasar();
@@ -34,8 +31,6 @@ export default defineComponent({
       $q,
     };
 
-    const register_dialog: Ref<any> = ref(null);
-
     new Initializer(options).initialize().then(() => {
       $store.commit("setInitialized");
     });
@@ -64,53 +59,7 @@ export default defineComponent({
       GlobalData.getInstance().getCurrentClientName()
     );
 
-    const checkRegistered = () => {
+    return {};
-      if (
-        GlobalData.getInstance().getCurrentClient()?.is_connected &&
-        GlobalData.getInstance().getCurrentClient()?.is_login
-      ) {
-        let register: any =
-          GlobalData.getInstance().applicationConfig?.registered;
-        try {
-          register = JSON.parse(register);
-        } catch {
-          register = false;
-        }
-        if (
-          !register &&
-          (!register_dialog.value || !register_dialog.value.isShow())
-        ) {
-          $q.notify({
-            color: "negative",
-            icon: "report_problem",
-            message:
-              "<span class='text-h4'>" +
-              $t.t("not registered") +
-              "!!!" +
-              "</span>",
-            position: "center",
-            actions: [
-              {
-                label: $t.t("register"),
-                color: "blue",
-                handler: () => {
-                  if (register_dialog.value) {
-                    register_dialog.value.showDialog();
-                  }
-                },
-              },
-            ],
-            html: true,
-            timeout: 2500,
-          });
-        }
-      }
-    };
-    setInterval(checkRegistered, 5000);
-
-    return {
-      register_dialog,
-    };
   },
 });
 </script>

src/pages/TopToolBar.vue

@@ -208,6 +208,15 @@
               {{ $t("upgrade") }}
             </q-item-section>
           </q-item>
+          <q-item clickable v-close-popup @click="switchLanguage">
+            <q-item-section avatar>
+              <!-- <q-icon name="info_outline" /> -->
+              <q-icon name="translate" />
+            </q-item-section>
+            <q-item-section>
+              {{ $t("CN/EN switch") }}
+            </q-item-section>
+          </q-item>
           <q-item clickable v-close-popup @click="showDeviceInfo">
             <q-item-section avatar>
               <!-- <q-icon name="devices" /> -->
@@ -217,14 +226,17 @@
               {{ $t("device info") }}
             </q-item-section>
           </q-item>
-
+          <q-item
-          <q-item clickable v-close-popup @click="switchLanguage">
+            clickable
+            v-close-popup
+            @click="$refs.register_dialog.showDialog()"
+          >
             <q-item-section avatar>
-              <!-- <q-icon name="info_outline" /> -->
+              <!-- <q-icon name="devices" /> -->
-              <q-icon name="translate" />
+              <q-icon name="lock_open" />
             </q-item-section>
             <q-item-section>
-              {{ $t("CN/EN switch") }}
+              {{ $t("register device") }}
             </q-item-section>
           </q-item>
           <q-item
@@ -265,6 +277,7 @@
   <system-setting-dialog ref="system_setting_dialog" />
   <about-dialog ref="about_dialog" />
   <edge-blending-dialog ref="edge_blending_dialog" />
+  <register-dialog ref="register_dialog" />
 </template>
 
 <style scoped>
@@ -297,6 +310,7 @@ import SubtitleDialog from "src/components/SubtitleDialog.vue";
 import SystemSettingDialog from "src/components/SystemSettingDialog.vue";
 import AboutDialog from "src/components/AboutDialog.vue";
 import EdgeBlendingDialog from "src/components/EdgeBlendingDialog.vue";
+import RegisterDialog from "src/components/RegisterDialog.vue";
 
 import EventBus, { EventNamesDefine } from "src/common/EventBus";
 import { Protocol } from "src/entities/WSProtocol";
@@ -305,7 +319,6 @@ import { api } from "boot/axios";
 import { HttpProtocol } from "src/entities/HttpProtocol";
 import { SessionStorage, openURL, useQuasar, date as $date } from "quasar";
 import { useI18n } from "vue-i18n";
-import { NotifyMessage } from "src/common/ClientConnection";
 
 export default defineComponent({
   name: "PageTopToolBar",
@@ -320,6 +333,7 @@ export default defineComponent({
     SystemSettingDialog,
     AboutDialog,
     EdgeBlendingDialog,
+    RegisterDialog,
   },
 
   setup() {
@@ -329,6 +343,7 @@ export default defineComponent({
 
     let show_advanced_menu = ref(true);
     const edge_blending_dialog: Ref<any> = ref(null);
+    const register_dialog: Ref<any> = ref(null);
 
     let system_run_time = 0;
     let system_idle_time = 0;
@@ -366,10 +381,55 @@ export default defineComponent({
       return time;
     };
 
+    const checkRegistered = () => {
+      if (
+        GlobalData.getInstance().getCurrentClient()?.is_connected &&
+        GlobalData.getInstance().getCurrentClient()?.is_login
+      ) {
+        let register: any =
+          GlobalData.getInstance().applicationConfig?.registered;
+        try {
+          register = JSON.parse(register);
+        } catch {
+          register = false;
+        }
+        if (
+          !register &&
+          (!register_dialog.value || !register_dialog.value.isShow())
+        ) {
+          $q.notify({
+            color: "negative",
+            icon: "report_problem",
+            message:
+              "<span class='text-h4'>" +
+              $t.t("not registered") +
+              "!!!" +
+              "</span>",
+            position: "center",
+            actions: [
+              {
+                label: $t.t("register"),
+                color: "blue",
+                handler: () => {
+                  if (register_dialog.value) {
+                    register_dialog.value.showDialog();
+                  }
+                },
+              },
+            ],
+            html: true,
+            timeout: 2500,
+          });
+        }
+      }
+    };
+    setInterval(checkRegistered, 5000);
+
     return {
       show_advanced_menu,
       plan_running,
       edge_blending_dialog,
+      register_dialog,
 
       async backupDB() {
         let client = GlobalData.getInstance().getCurrentClient();