初始根据服务器语言显示

注册页面添加镜像输出选项和语言设置

package.json

@@ -1,6 +1,6 @@
 {
   "name": "media_player_client",
-  "version": "1.4.10",
+  "version": "1.4.11",
   "description": "A Quasar Framework app",
   "productName": "MediaPlayerClient",
   "author": "fangxiang <fangxiang@cloudview.work>",

public/media_control_client_language.js

@@ -0,0 +1 @@
+window.media_control_client_language = "zh-CN";

src/boot/i18n.ts

@@ -4,7 +4,16 @@ import { Cookies } from "quasar";
 
 import messages from "src/i18n";
 
+console.log();
+
 let language = Cookies.get("language");
+
+// 如果 cookie 中没有语言信息,则使用服务器给的语言
+if (!language) {
+  language = (<any>window).media_control_client_language;
+}
+
+// 如果服务器也没有给语言, 默认中文
 if (!language) {
   language = "zh-CN";
 }
@@ -13,7 +22,9 @@ if (language != "zh-CN" && language != "en-US") {
   language = "zh-CN";
 }
 
-Cookies.set("language", language);
+Cookies.set("language", language, {
+  expires: 365,
+});
 
 const i18n = createI18n({
   locale: language,

src/common/ClientConnection.ts

@@ -994,6 +994,12 @@ export default class ClientConnection {
     );
   }
 
+  public setServerLanguage(language: string) {
+    this.ws?.send(
+      JSON.stringify(new Protocol.SetLanguageRequestEntity(language))
+    );
+  }
+
   public async getConnectList() {
     return await this.doRpc<Protocol.GetConnectionListResponseEntity>(
       new Protocol.GetConnectionListRequestEntity()

src/components/AdvancedDebugDialog.vue

@@ -58,6 +58,16 @@
                   :disable="loading"
                 />
               </q-item-section>
+              <q-item-section>
+                <q-checkbox
+                  v-model="function_mirroring_output"
+                  :label="$t('mirroring output')"
+                  color="cyan"
+                  class="offset-md-1 col"
+                  :loading="loading"
+                  :disable="loading"
+                />
+              </q-item-section>
               <q-item-section>
                 <q-btn
                   @click="setDeviceAttribute"
@@ -115,12 +125,14 @@ export default defineComponent({
 
     const function_center_control = ref(false);
     const function_output_board = ref(false);
+    const function_mirroring_output = ref(false);
 
     return {
       show_dialog,
       loading,
       function_center_control,
       function_output_board,
+      function_mirroring_output,
 
       showDialog() {
         show_dialog.value = true;
@@ -140,6 +152,10 @@ export default defineComponent({
                   (response.attribute &
                     Protocol.EDeviceAttribute.OutputBoard) !=
                   0;
+                function_mirroring_output.value =
+                  ($store.state.device_attribute &
+                    Protocol.EDeviceAttribute.MirroringOutput) !=
+                  0;
               });
             }
           } catch {}
@@ -163,6 +179,9 @@ export default defineComponent({
         if (function_output_board.value) {
           attribute |= Protocol.EDeviceAttribute.OutputBoard;
         }
+        if (function_mirroring_output.value) {
+          attribute |= Protocol.EDeviceAttribute.MirroringOutput;
+        }
         GlobalData.getInstance()
           .getCurrentClient()
           ?.setDeviceAttribute(attribute);

src/components/RegisterDialog.vue

@@ -279,6 +279,42 @@
                     :loading="loading"
                     :disable="loading"
                   />
+                  <q-checkbox
+                    v-model="function_mirroring_output"
+                    :label="$t('mirroring output')"
+                    color="cyan"
+                    class="offset-md-1 col"
+                    :loading="loading"
+                    :disable="loading"
+                  />
+                </div>
+              </q-item-section>
+            </q-item>
+
+            <q-item v-if="register_type == 'online'">
+              <q-item-section avatar class="header_label">
+                {{ $t("language") }}
+              </q-item-section>
+              <q-item-section>
+                <div class="row q-gutter-sm">
+                  <q-radio
+                    color="cyan"
+                    :loading="loading"
+                    :disable="loading"
+                    class="offset-md-1 col"
+                    v-model="target_language"
+                    val="zh-CN"
+                    :label="$t('chinese')"
+                  />
+                  <q-radio
+                    color="cyan"
+                    :loading="loading"
+                    :disable="loading"
+                    class="offset-md-1 col"
+                    v-model="target_language"
+                    val="en-US"
+                    :label="$t('english')"
+                  />
                 </div>
               </q-item-section>
             </q-item>
@@ -348,6 +384,8 @@ export default defineComponent({
 
     const select_file_dialog: Ref<any> = ref(null);
 
+    const target_language = ref("zh-CN");
+
     const licence_file: Ref<any> = ref(null);
     const register_type = ref("offline");
     const register_code: Ref<string> = ref("");
@@ -360,6 +398,7 @@ export default defineComponent({
 
     const function_center_control = ref(false);
     const function_output_board = ref(false);
+    const function_mirroring_output = ref(false);
 
     const trial_days = ref(0);
     const last_days = ref(0);
@@ -380,6 +419,7 @@ export default defineComponent({
 
       function_center_control.value = false;
       function_output_board.value = false;
+      function_mirroring_output.value = false;
     };
 
     const showDialog = async () => {
@@ -403,6 +443,19 @@ export default defineComponent({
         console.log(e);
         show_dialog.value = false;
       }
+
+      function_center_control.value =
+        ($store.state.device_attribute &
+          Protocol.EDeviceAttribute.CenterControl) !=
+        0;
+      function_output_board.value =
+        ($store.state.device_attribute &
+          Protocol.EDeviceAttribute.OutputBoard) !=
+        0;
+      function_mirroring_output.value =
+        ($store.state.device_attribute &
+          Protocol.EDeviceAttribute.MirroringOutput) !=
+        0;
     };
 
     return {
@@ -424,6 +477,8 @@ export default defineComponent({
       server_address,
       function_output_board,
       function_center_control,
+      function_mirroring_output,
+      target_language,
       copyToClipboard,
       isShow() {
         return show_dialog.value;
@@ -542,9 +597,17 @@ export default defineComponent({
             if (function_output_board.value) {
               attribute |= Protocol.EDeviceAttribute.OutputBoard;
             }
+            if (function_mirroring_output.value) {
+              attribute |= Protocol.EDeviceAttribute.MirroringOutput;
+            }
+
             GlobalData.getInstance()
               .getCurrentClient()
               ?.setDeviceAttribute(attribute);
+
+            GlobalData.getInstance()
+              .getCurrentClient()
+              ?.setServerLanguage(target_language.value);
           }
 
           $q.notify({

src/components/SystemSettingDialog.vue

@@ -57,7 +57,11 @@
           <q-tab
             name="graphics"
             icon="img:new_icon/graphics_setting.png"
-            :label="$t('graphics setting')"
+            :label="
+              function_output_board_attribute
+                ? $t('graphics setting')
+                : $t('output setting')
+            "
             :disable="loading"
           />
           <q-tab
@@ -284,7 +288,7 @@
                         </q-btn>
                       </q-item-section>
                     </q-item>
-                    <q-item>
+                    <q-item v-if="function_mirroring_output">
                       <q-item-section avatar class="width_5_2_2"
                         >{{ $t("mirroring output") }}:</q-item-section
                       >
@@ -297,7 +301,7 @@
                         />
                       </q-item-section>
                     </q-item>
-                    <q-item>
+                    <q-item v-if="!function_output_board_attribute">
                       <q-item-section avatar class="width_5_2_2"
                         >{{ $t("output type") }}:</q-item-section
                       >
@@ -340,7 +344,10 @@
                       </q-item-section>
                     </q-item>
                     <q-item
-                      v-if="device_resolution_type.toUpperCase() == 'EDID'"
+                      v-if="
+                        !function_output_board_attribute &&
+                        device_resolution_type.toUpperCase() == 'EDID'
+                      "
                     >
                       <q-item-section avatar class="width_5_2_2"
                         >{{ $t("target resolution") }}:</q-item-section
@@ -355,7 +362,10 @@
                       </q-item-section>
                     </q-item>
                     <q-item
-                      v-if="device_resolution_type.toUpperCase() == 'CVT'"
+                      v-if="
+                        !function_output_board_attribute &&
+                        device_resolution_type.toUpperCase() == 'CVT'
+                      "
                     >
                       <q-item-section avatar class="width_5_2_2"
                         >{{ $t("target resolution") }}:</q-item-section
@@ -370,7 +380,10 @@
                       </q-item-section>
                     </q-item>
                     <q-item
-                      v-if="device_resolution_type.toUpperCase() == 'CUSTOM'"
+                      v-if="
+                        !function_output_board_attribute &&
+                        device_resolution_type.toUpperCase() == 'CUSTOM'
+                      "
                     >
                       <q-item-section avatar class="width_5_2_2"
                         >{{ $t("custom")
@@ -1038,6 +1051,12 @@ export default defineComponent({
 
     const timing_task_dialog: Ref<any> = ref(null);
 
+    const function_mirroring_output = ref(
+      ($store.state.device_attribute &
+        Protocol.EDeviceAttribute.MirroringOutput) !=
+        0
+    );
+
     let tab = ref("network");
 
     let auto_ip = ref($t.t("enable"));
@@ -1062,6 +1081,11 @@ export default defineComponent({
       (value) => {
         function_output_board_attribute.value =
           (value & Protocol.EDeviceAttribute.OutputBoard) != 0;
+
+        function_mirroring_output.value =
+          ($store.state.device_attribute &
+            Protocol.EDeviceAttribute.MirroringOutput) !=
+          0;
       }
     );
 
@@ -1337,6 +1361,9 @@ export default defineComponent({
         request.target_resolution_timing = device_resolution_timing.value;
         request.rotate = parseInt(device_rotate.value.toString());
         request.hdmi_output_count = mirroring_output.value ? 2 : 1;
+        if (!function_mirroring_output.value) {
+          request.hdmi_output_count = 1;
+        }
 
         let success = false;
         try {
@@ -1522,6 +1549,7 @@ export default defineComponent({
       e_week_Days: ref(EWeekDays),
       timing_task_dialog,
       timing_tasks,
+      function_mirroring_output,
       function_output_board_attribute,
       loading,
       tab,

src/entities/WSProtocol.ts

@@ -432,6 +432,10 @@ export namespace Protocol {
       return Commands.PROTOCOL_PREFIX + "RpcGetPowerState";
     }
 
+    public static get kSetLanguage() {
+      return Commands.PROTOCOL_PREFIX + "SetLanguage";
+    }
+
     static _all_commands = new Set([
       Commands.kUnKnowCommand,
       Commands.kSearchDevice,
@@ -2523,7 +2527,7 @@ export namespace Protocol {
     None = 0x0001,
     OutputBoard = 0x0002,
     CenterControl = 0x0004,
-    Reserve2 = 0x0008,
+    MirroringOutput = 0x0008,
     Reserve3 = 0x0010,
     Reserve4 = 0x0020,
     Reserve5 = 0x0040,
@@ -2744,4 +2748,15 @@ export namespace Protocol {
 
     is_power_on = false;
   }
+
+  export class SetLanguageRequestEntity extends PacketEntity {
+    constructor(language: string) {
+      super();
+      super.command = Commands.kSetLanguage;
+      super.flag = PacketEntity.FLAG_REQUEST;
+      super.rpc_id = 0;
+      this.language = language ?? "zh-CN";
+    }
+    language = "zh-CN";
+  }
 }

src/i18n/zh-CN/index.ts

@@ -551,4 +551,8 @@ export default {
   "after mirroring output is enabled, the second output may need to wait 1 or 2 minutes before the screen appears!":
     "启用镜像输出后第二个输出可能需要等待1~2分钟才会有画面!",
   "i have known": "我已知晓",
+  "output setting": "输出设置",
+  language: "中文",
+  english: "英文",
+  chinese: "中文",
 };

src/index.template.html

@@ -52,6 +52,8 @@
     />
     <link rel="icon" type="image/ico" href="favicon.ico" />
   </head>
+  <script src="./media_control_client_language.js"></script>
+
   <body>
     <!-- DO NOT touch the following DIV -->
     <div id="q-app"></div>

src/pad/Login.vue

@@ -437,16 +437,36 @@ export default defineComponent({
                 // TODO add self to setConnects
 
                 if (remember_password.value) {
-                  Cookies.set("remember_password", JSON.stringify(true));
+                  if (
-                  Cookies.set("auto_login", JSON.stringify(auto_login.value));
+                    data.password != cache_password &&
-                  Cookies.set("name", data.ip_address);
+                    Md5.hashStr("admin") != cache_password
-                  Cookies.set("user_name", data.user_name ?? "admin");
+                  ) {
-                  Cookies.set(
+                    Cookies.set("remember_password", JSON.stringify(true), {
-                    "password",
+                      expires: 15,
-                    data.password == cache_password
+                    });
-                      ? data.password ?? Md5.hashStr("admin")
+                    Cookies.set(
-                      : Md5.hashStr(data.password ?? "admin")
+                      "auto_login",
-                  );
+                      JSON.stringify(auto_login.value),
+                      {
+                        expires: 15,
+                      }
+                    );
+                    Cookies.set("name", data.ip_address, {
+                      expires: 15,
+                    });
+                    Cookies.set("user_name", data.user_name ?? "admin", {
+                      expires: 15,
+                    });
+                    Cookies.set(
+                      "password",
+                      data.password == cache_password
+                        ? data.password ?? Md5.hashStr("admin")
+                        : Md5.hashStr(data.password ?? "admin"),
+                      {
+                        expires: 15,
+                      }
+                    );
+                  }
                 } else {
                   Cookies.remove("remember_password");
                   Cookies.remove("auto_login");

src/pad/TopToolbar.vue

@@ -387,7 +387,9 @@ export default defineComponent({
         } else {
           language = language == "zh-CN" ? "en-US" : "zh-CN";
         }
-        Cookies.set("language", language);
+        Cookies.set("language", language, {
+          expires: 365,
+        });
         window.location.reload();
       },
       logout() {

src/pages/Login.vue

@@ -368,16 +368,36 @@ export default defineComponent({
                 // TODO add self to setConnects
 
                 if (remember_password.value) {
-                  Cookies.set("remember_password", JSON.stringify(true));
+                  if (
-                  Cookies.set("auto_login", JSON.stringify(auto_login.value));
+                    data.password != cache_password &&
-                  Cookies.set("name", data.ip_address);
+                    Md5.hashStr("admin") != cache_password
-                  Cookies.set("user_name", data.user_name ?? "admin");
+                  ) {
-                  Cookies.set(
+                    Cookies.set("remember_password", JSON.stringify(true), {
-                    "password",
+                      expires: 15,
-                    data.password == cache_password
+                    });
-                      ? data.password ?? Md5.hashStr("admin")
+                    Cookies.set(
-                      : Md5.hashStr(data.password ?? "admin")
+                      "auto_login",
-                  );
+                      JSON.stringify(auto_login.value),
+                      {
+                        expires: 15,
+                      }
+                    );
+                    Cookies.set("name", data.ip_address, {
+                      expires: 15,
+                    });
+                    Cookies.set("user_name", data.user_name ?? "admin", {
+                      expires: 15,
+                    });
+                    Cookies.set(
+                      "password",
+                      data.password == cache_password
+                        ? data.password ?? Md5.hashStr("admin")
+                        : Md5.hashStr(data.password ?? "admin"),
+                      {
+                        expires: 15,
+                      }
+                    );
+                  }
                 } else {
                   Cookies.remove("remember_password");
                   Cookies.remove("auto_login");

src/pages/TopToolBar.vue

@@ -648,7 +648,9 @@ export default defineComponent({
         } else {
           language = language == "zh-CN" ? "en-US" : "zh-CN";
         }
-        Cookies.set("language", language);
+        Cookies.set("language", language, {
+          expires: 365,
+        });
         window.location.reload();
       },
       logout() {