隐藏菜单添加语言设置

This commit is contained in:
fangxiang 2022-06-15 11:15:32 +08:00
parent 081c1a27ee
commit 3d3dfd505f
7 changed files with 171 additions and 94 deletions

View File

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

View File

@ -42,6 +42,16 @@ export default defineComponent({
console.log(e); console.log(e);
} }
{
const user_search = (<any>window).user_search || {};
if (typeof user_search == "object") {
$store.commit(
"setAvancedDebug",
typeof user_search["debug"] != "undefined"
);
}
}
window.onresize = (evt: any) => window.onresize = (evt: any) =>
EventBus.getInstance().emit(EventNamesDefine.WindowResize, evt); EventBus.getInstance().emit(EventNamesDefine.WindowResize, evt);

View File

@ -39,7 +39,7 @@
<q-card-section style="max-height: 50vh; width: 35vw" class="scroll"> <q-card-section style="max-height: 50vh; width: 35vw" class="scroll">
<q-list> <q-list>
<q-item> <q-item>
<q-item-section avatar>{{ $t("function") }}:</q-item-section> <q-item-section avatar>{{ $t("function") }}</q-item-section>
<q-item-section> <q-item-section>
<q-checkbox <q-checkbox
v-model="function_output_board" v-model="function_output_board"
@ -68,7 +68,7 @@
:disable="loading" :disable="loading"
/> />
</q-item-section> </q-item-section>
<q-item-section> <q-item-section avatar>
<q-btn <q-btn
@click="setDeviceAttribute" @click="setDeviceAttribute"
:label="$t('commit')" :label="$t('commit')"
@ -77,8 +77,51 @@
/> />
</q-item-section> </q-item-section>
</q-item> </q-item>
<q-item>
<q-item-section avatar>
{{ $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-section avatar>
<q-btn
@click="setSystemLanguage"
:label="$t('commit')"
outline
color="primary"
/>
</q-item-section>
</q-item>
<q-separator class="q-mt-md" /> <q-separator class="q-mt-md" />
<q-item class="q-mt-md"> <q-item class="q-mt-md">
<q-item-section>
<q-btn @click="showDeviceInfo"> {{ $t("device info") }} </q-btn>
</q-item-section>
</q-item>
<q-item class="q-mt-xs">
<q-item-section> <q-item-section>
<q-btn @click="restartDevice"> {{ $t("restart") }} </q-btn> <q-btn @click="restartDevice"> {{ $t("restart") }} </q-btn>
</q-item-section> </q-item-section>
@ -107,7 +150,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, ref, watch, computed, nextTick } from "vue"; import { defineComponent, ref, watch, computed, nextTick } from "vue";
import { useStore } from "src/store"; import { useStore } from "src/store";
import { useQuasar } from "quasar"; import { useQuasar, date as $date } from "quasar";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import GlobalData from "src/common/GlobalData"; import GlobalData from "src/common/GlobalData";
import { Protocol } from "src/entities/WSProtocol"; import { Protocol } from "src/entities/WSProtocol";
@ -126,6 +169,7 @@ export default defineComponent({
const function_center_control = ref(false); const function_center_control = ref(false);
const function_output_board = ref(false); const function_output_board = ref(false);
const function_mirroring_output = ref(false); const function_mirroring_output = ref(false);
const target_language = ref("zh-CN");
return { return {
show_dialog, show_dialog,
@ -133,6 +177,7 @@ export default defineComponent({
function_center_control, function_center_control,
function_output_board, function_output_board,
function_mirroring_output, function_mirroring_output,
target_language,
showDialog() { showDialog() {
show_dialog.value = true; show_dialog.value = true;
@ -171,6 +216,78 @@ export default defineComponent({
restartDevice() { restartDevice() {
GlobalData.getInstance().getCurrentClient()?.restartDevice(); GlobalData.getInstance().getCurrentClient()?.restartDevice();
}, },
async showDeviceInfo() {
const get_time_text = (s: number, show_ss: boolean = true) => {
console.log(s);
var time = "";
var second = s % 60;
var minute = parseInt((parseInt(s.toString()) / 60).toString()) % 60;
if (show_ss) {
time = second + $t.t("SS");
}
if (minute >= 1) {
time = minute + $t.t("MM") + time;
}
var hour =
parseInt((parseInt((s / 60).toString()) / 60).toString()) % 24;
if (hour >= 1) {
time = hour + $t.t("HH") + time;
}
var day = parseInt(
(
parseInt((parseInt((s / 60).toString()) / 60).toString()) / 24
).toString()
);
if (day >= 1) {
time = day + $t.t("DD") + time;
}
return time;
};
let system_run_time = 0;
let system_idle_time = 0;
let current_system_time = 0;
let server_run_time = 0;
let server_all_run_time = 0;
try {
const response = await GlobalData.getInstance()
.getCurrentClient()
?.getSystemTimes();
if (response) {
system_run_time = response.system_run_time;
system_idle_time = response.system_idle_time;
current_system_time = response.current_system_time;
server_run_time = response.server_run_time;
server_all_run_time = response.server_all_run_time;
}
} catch (e) {
console.log(e);
}
$q.dialog({
html: true,
title: "<div class='text-h4'>" + $t.t("device info") + "</div>",
message: `<div class="text-h6">
${$t.t("device resolution")} : ${$store.state.device_screen_width}X${
$store.state.device_screen_height
}@${$store.state.device_screen_refresh_rate}<br />
${$t.t("system run time")} : ${get_time_text(system_run_time)} <br />
${$t.t("system idle rate")} : ${(
(system_idle_time / (system_run_time * 4)) *
100
).toFixed(0)} % <br />
${$t.t("server run time")} : ${get_time_text(server_run_time)} <br />
${$t.t("server all run time")} : ${get_time_text(
server_all_run_time,
false
)} <br />
${$t.t("current server system time")} : ${$date.formatDate(
new Date(current_system_time),
"YYYY-MM-DD HH:mm:ss"
)}<br />
</div>`,
});
},
setDeviceAttribute() { setDeviceAttribute() {
let attribute = Protocol.EDeviceAttribute.None; let attribute = Protocol.EDeviceAttribute.None;
if (function_center_control.value) { if (function_center_control.value) {
@ -194,6 +311,18 @@ export default defineComponent({
timeout: 1500, timeout: 1500,
}); });
}, },
setSystemLanguage() {
GlobalData.getInstance()
.getCurrentClient()
?.setServerLanguage(target_language.value);
$q.notify({
color: "positive",
icon: "done",
message: $t.t("set language") + $t.t("success") + "!",
position: "top",
timeout: 1500,
});
},
}; };
}, },
}); });

View File

@ -3,8 +3,8 @@
export default { export default {
title: "MediaPlayerWebAPP", title: "MediaPlayerWebAPP",
failed: "Action failed", failed: " failed",
success: "Action was successful", success: " successful",
CN_BERWEEN_SUFFIX: "", CN_BERWEEN_SUFFIX: "",
"clean screen": "Clear", "clean screen": "Clear",
"full screen window": "Maximize", "full screen window": "Maximize",

View File

@ -53,6 +53,24 @@
<link rel="icon" type="image/ico" href="favicon.ico" /> <link rel="icon" type="image/ico" href="favicon.ico" />
</head> </head>
<script src="./media_control_client_language.js"></script> <script src="./media_control_client_language.js"></script>
<script type="text/javascript">
window.user_search = {};
var search = window.location.search;
if (search.indexOf("?") != -1) {
search = search.substr(1);
var temp = search.split("&");
for (var i = 0; i < temp.length; i++) {
var info = temp[i].split("=");
if (info) {
if (info.length >= 2) {
window.user_search[info[0]] = decodeURI(info[1]);
} else if (info.length >= 1) {
window.user_search[info[0]] = null;
}
}
}
}
</script>
<body> <body>
<!-- DO NOT touch the following DIV --> <!-- DO NOT touch the following DIV -->

View File

@ -292,15 +292,6 @@
{{ $t("CN/EN switch") }} {{ $t("CN/EN switch") }}
</q-item-section> </q-item-section>
</q-item> </q-item>
<q-item clickable v-close-popup @click="showDeviceInfo">
<q-item-section avatar>
<!-- <q-icon name="devices" /> -->
<q-icon name="img:new_icon/device_info.png" />
</q-item-section>
<q-item-section>
{{ $t("device info") }}
</q-item-section>
</q-item>
<q-item <q-item
clickable clickable
v-close-popup v-close-popup
@ -408,13 +399,7 @@ import { Protocol } from "src/entities/WSProtocol";
import GlobalData from "src/common/GlobalData"; import GlobalData from "src/common/GlobalData";
import { api } from "boot/axios"; import { api } from "boot/axios";
import { HttpProtocol } from "src/entities/HttpProtocol"; import { HttpProtocol } from "src/entities/HttpProtocol";
import { import { SessionStorage, Cookies, openURL, useQuasar } from "quasar";
SessionStorage,
Cookies,
openURL,
useQuasar,
date as $date,
} from "quasar";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { ConnectTableEntity } from "src/entities/ConnectTableEntity"; import { ConnectTableEntity } from "src/entities/ConnectTableEntity";
import ClientConnection from "src/common/ClientConnection"; import ClientConnection from "src/common/ClientConnection";
@ -453,44 +438,12 @@ export default defineComponent({
0 0
); );
let system_run_time = 0;
let system_idle_time = 0;
let current_system_time = 0;
let server_run_time = 0;
let server_all_run_time = 0;
const window_rect_edit_dialog: Ref<any> = ref(null); const window_rect_edit_dialog: Ref<any> = ref(null);
const plan_running = computed( const plan_running = computed(
() => $store.state.current_running_plan.trim() != "" () => $store.state.current_running_plan.trim() != ""
); );
const get_time_text = (s: number, show_ss: boolean = true) => {
console.log(s);
var time = "";
var second = s % 60;
var minute = parseInt((parseInt(s.toString()) / 60).toString()) % 60;
if (show_ss) {
time = second + $t.t("SS");
}
if (minute >= 1) {
time = minute + $t.t("MM") + time;
}
var hour = parseInt((parseInt((s / 60).toString()) / 60).toString()) % 24;
if (hour >= 1) {
time = hour + $t.t("HH") + time;
}
var day = parseInt(
(
parseInt((parseInt((s / 60).toString()) / 60).toString()) / 24
).toString()
);
if (day >= 1) {
time = day + $t.t("DD") + time;
}
return time;
};
const checkRegistered = () => { const checkRegistered = () => {
if ( if (
GlobalData.getInstance().getCurrentClient()?.is_connected && GlobalData.getInstance().getCurrentClient()?.is_connected &&
@ -666,45 +619,6 @@ export default defineComponent({
window.location.reload(); window.location.reload();
} }
}, },
async showDeviceInfo() {
try {
const response = await GlobalData.getInstance()
.getCurrentClient()
?.getSystemTimes();
if (response) {
system_run_time = response.system_run_time;
system_idle_time = response.system_idle_time;
current_system_time = response.current_system_time;
server_run_time = response.server_run_time;
server_all_run_time = response.server_all_run_time;
}
} catch (e) {
console.log(e);
}
$q.dialog({
html: true,
title: "<div class='text-h4'>" + $t.t("device info") + "</div>",
message: `<div class="text-h6">
${$t.t("device resolution")} : ${$store.state.device_screen_width}X${
$store.state.device_screen_height
}@${$store.state.device_screen_refresh_rate}<br />
${$t.t("system run time")} : ${get_time_text(system_run_time)} <br />
${$t.t("system idle rate")} : ${(
(system_idle_time / (system_run_time * 4)) *
100
).toFixed(0)} % <br />
${$t.t("server run time")} : ${get_time_text(server_run_time)} <br />
${$t.t("server all run time")} : ${get_time_text(
server_all_run_time,
false
)} <br />
${$t.t("current server system time")} : ${$date.formatDate(
new Date(current_system_time),
"YYYY-MM-DD HH:mm:ss"
)}<br />
</div>`,
});
},
async powerOff() { async powerOff() {
let success = false; let success = false;
try { try {

View File

@ -284,7 +284,7 @@ export default store(function (/* { ssrContext } */) {
state: { state: {
// state // state
initialized: false, initialized: false,
advanced_debug: window.location.href.indexOf("advanced_debug=1") != -1, advanced_debug: false,
signal_source_tree: [], signal_source_tree: [],
polling_tree: [], polling_tree: [],
mode_tree: [], mode_tree: [],
@ -332,6 +332,12 @@ export default store(function (/* { ssrContext } */) {
state.device_attribute = num; state.device_attribute = num;
} }
}, },
setAvancedDebug(state: StateInterface, playload?: any) {
if (playload || playload == "true") {
console.log("debug", playload);
}
state.advanced_debug = playload;
},
setArrayValue(state: StateInterface, playload?: any) { setArrayValue(state: StateInterface, playload?: any) {
if (Array.isArray(playload.value)) { if (Array.isArray(playload.value)) {
const arr: Array<any> = (<any>state)[playload.name]; const arr: Array<any> = (<any>state)[playload.name];