添加旋转界面
This commit is contained in:
parent
c3a549f46d
commit
810f213bc2
|
@ -189,6 +189,8 @@ export default class ClientConnection {
|
|||
if (packet) {
|
||||
if (packet.has_exception) {
|
||||
console.error(ev.data);
|
||||
this.rpc_map.get(packet.rpc_id)?.reject();
|
||||
this.rpc_map.delete(packet.rpc_id);
|
||||
}
|
||||
if (Protocol.Commands.AllCommands.has(packet.command)) {
|
||||
if (
|
||||
|
|
|
@ -85,7 +85,6 @@ export default class Initializer {
|
|||
global_data.applicationConfig = (
|
||||
await global_data.getCurrentClient()?.getApplicationSettins()
|
||||
)?.config;
|
||||
console.log(global_data.applicationConfig);
|
||||
|
||||
const options = this.options;
|
||||
let $store = options.$store;
|
||||
|
|
|
@ -66,7 +66,7 @@
|
|||
<q-tab-panel name="network" class="_panel">
|
||||
<q-card class="fit">
|
||||
<q-card-section>
|
||||
<q-form ref="network_form">
|
||||
<q-form ref="network_form" @submit="applyNetwork">
|
||||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section avatar class="width_5_1">{{
|
||||
|
@ -179,7 +179,7 @@
|
|||
<q-tab-panel name="graphics" class="_panel">
|
||||
<q-card class="fit">
|
||||
<q-card-section>
|
||||
<q-form ref="graphics_form">
|
||||
<q-form ref="graphics_form" @submit="applyGraphics">
|
||||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section avatar class="width_5_2">{{
|
||||
|
@ -191,6 +191,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -204,6 +212,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -217,6 +233,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -233,6 +257,21 @@
|
|||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section avatar class="width_5_2_2">{{
|
||||
$t("device rotate") + ":"
|
||||
}}</q-item-section>
|
||||
<q-item-section>
|
||||
<q-select
|
||||
v-model="device_rotate"
|
||||
:loading="loading"
|
||||
:disable="loading"
|
||||
:options="device_rotate_options"
|
||||
emit-value
|
||||
map-options
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
<q-item>
|
||||
<q-item-section avatar class="width_5_2_2">{{
|
||||
$t("output board resolution") + ":"
|
||||
|
@ -255,7 +294,7 @@
|
|||
<q-tab-panel name="other" class="_panel">
|
||||
<q-card class="fit">
|
||||
<q-card-section>
|
||||
<q-form ref="other_form">
|
||||
<q-form ref="other_form" @submit="applyOther">
|
||||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section avatar class="width_5_3">{{
|
||||
|
@ -279,6 +318,12 @@
|
|||
v-model="ntp_server"
|
||||
:loading="loading"
|
||||
:disable="loading"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val && val.length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -292,6 +337,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -305,6 +358,12 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="date"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val && val.length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
<q-item-section>
|
||||
|
@ -313,6 +372,12 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="time"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val && val.length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -339,7 +404,7 @@
|
|||
<q-card class="fit">
|
||||
<q-card-section>
|
||||
<q-scroll-area style="height: 55vh">
|
||||
<q-form ref="output_board_form">
|
||||
<q-form ref="output_board_form" @submit="applyOutputBoard">
|
||||
<q-list>
|
||||
<q-item>
|
||||
<q-item-section avatar class="width_5_4">{{
|
||||
|
@ -351,6 +416,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -364,6 +437,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -390,6 +471,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -403,6 +492,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -431,6 +528,14 @@
|
|||
:loading="loading"
|
||||
:disable="loading"
|
||||
type="number"
|
||||
:rules="[
|
||||
(val) =>
|
||||
(val != null &&
|
||||
val != undefined &&
|
||||
val.toString().length > 0) ||
|
||||
$t('Please type something'),
|
||||
]"
|
||||
lazy-rules
|
||||
/>
|
||||
</q-item-section>
|
||||
</q-item>
|
||||
|
@ -587,8 +692,45 @@ export default defineComponent({
|
|||
let contrast = ref(0);
|
||||
let hue = ref(0);
|
||||
|
||||
let old_resolution: string = "";
|
||||
let old_rotate: number = 0;
|
||||
let device_resolution = ref("");
|
||||
let device_resolution_options = ref(["11", "22", "33"]);
|
||||
let device_rotate = ref(0);
|
||||
let device_rotate_options = ref([
|
||||
{
|
||||
label: "0°",
|
||||
value: 0,
|
||||
},
|
||||
{
|
||||
label: "90°",
|
||||
value: 1,
|
||||
},
|
||||
{
|
||||
label: "180°",
|
||||
value: 2,
|
||||
},
|
||||
{
|
||||
label: "270°",
|
||||
value: 3,
|
||||
},
|
||||
{
|
||||
label: $t.t("horizontal flipped"),
|
||||
value: 4,
|
||||
},
|
||||
{
|
||||
label: $t.t("horizontal flipped") + "90°",
|
||||
value: 5,
|
||||
},
|
||||
{
|
||||
label: $t.t("horizontal flipped") + "180°",
|
||||
value: 6,
|
||||
},
|
||||
{
|
||||
label: $t.t("horizontal flipped") + "270°",
|
||||
value: 7,
|
||||
},
|
||||
]);
|
||||
let output_board_resolution = ref("");
|
||||
let output_board_resolution_options = ref(["1", "2", "3"]);
|
||||
|
||||
|
@ -680,9 +822,14 @@ export default defineComponent({
|
|||
}
|
||||
}, 1);
|
||||
|
||||
brightness.value = config.graphics_brightness;
|
||||
contrast.value = config.graphics_contrast;
|
||||
hue.value = config.graphics_hue;
|
||||
brightness.value = parseInt(config.graphics_brightness.toString());
|
||||
contrast.value = parseInt(config.graphics_contrast.toString());
|
||||
hue.value = parseInt(config.graphics_hue.toString());
|
||||
|
||||
device_rotate.value = parseInt(config.device_rotate.toString());
|
||||
|
||||
old_resolution = device_resolution.value;
|
||||
old_rotate = device_rotate.value;
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -734,113 +881,123 @@ export default defineComponent({
|
|||
};
|
||||
|
||||
const applyNetwork = async () => {
|
||||
const ret = await network_form.value.validate();
|
||||
if (ret) {
|
||||
let request = new Protocol.SetSystemNetworkRequestEntity();
|
||||
request.auto_ip = auto_ip.value == $t.t("enable");
|
||||
request.ip_address = ip_address.value;
|
||||
request.gtateway = gateway.value;
|
||||
request.net_mask = netmask.value;
|
||||
request.mac_address = mac_address.value;
|
||||
const request = new Protocol.SetSystemNetworkRequestEntity();
|
||||
request.auto_ip = auto_ip.value == $t.t("enable");
|
||||
request.ip_address = ip_address.value;
|
||||
request.gtateway = gateway.value;
|
||||
request.net_mask = netmask.value;
|
||||
request.mac_address = mac_address.value;
|
||||
|
||||
let success = false;
|
||||
try {
|
||||
setTimeout(() => {
|
||||
if (request.ip_address != $store.state.device_ip_address) {
|
||||
setTimeout(() => {
|
||||
SessionStorage.clear();
|
||||
if (
|
||||
window.location.hostname.toLowerCase() == "192.168.1.1" ||
|
||||
window.location.hostname.toLowerCase() == "localhost"
|
||||
) {
|
||||
window.location.reload();
|
||||
} else {
|
||||
window.location.hostname = request.ip_address;
|
||||
}
|
||||
}, 1500);
|
||||
}
|
||||
}, 1000 * 10);
|
||||
/*await*/ GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.setSystemNetwork(request);
|
||||
success = true;
|
||||
} catch {}
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set system network") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
}
|
||||
let success = false;
|
||||
try {
|
||||
await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.setSystemNetwork(request);
|
||||
setTimeout(() => {
|
||||
if (request.ip_address != $store.state.device_ip_address) {
|
||||
setTimeout(() => {
|
||||
SessionStorage.clear();
|
||||
if (
|
||||
window.location.hostname.toLowerCase() == "192.168.1.1" ||
|
||||
window.location.hostname.toLowerCase() == "localhost"
|
||||
) {
|
||||
window.location.reload();
|
||||
} else {
|
||||
window.location.hostname = request.ip_address;
|
||||
}
|
||||
}, 2500);
|
||||
}
|
||||
}, 1000 * 10);
|
||||
success = true;
|
||||
} catch {}
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set system network") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
};
|
||||
const applyGraphics = async () => {
|
||||
const ret = await graphics_form.value.validate();
|
||||
if (ret) {
|
||||
let request = new Protocol.SetSystemGraphicsRequestEntity();
|
||||
request.brightness = brightness.value;
|
||||
request.contrast = contrast.value;
|
||||
request.hue = hue.value;
|
||||
request.output_board_resolution = output_board_resolution.value;
|
||||
request.device_resolution = device_resolution.value;
|
||||
const request = new Protocol.SetSystemGraphicsRequestEntity();
|
||||
request.brightness = brightness.value;
|
||||
request.contrast = contrast.value;
|
||||
request.hue = hue.value;
|
||||
request.output_board_resolution = output_board_resolution.value;
|
||||
request.device_resolution = device_resolution.value;
|
||||
request.rotate = device_rotate.value;
|
||||
|
||||
let success = false;
|
||||
let success = false;
|
||||
try {
|
||||
await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.setSystemGraphics(request);
|
||||
success = true;
|
||||
} catch {}
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set system graphics") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
if (
|
||||
old_resolution != device_resolution.value ||
|
||||
old_rotate != device_rotate.value
|
||||
) {
|
||||
try {
|
||||
await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.setSystemGraphics(request);
|
||||
success = true;
|
||||
$q.dialog({
|
||||
title: "Confirm",
|
||||
message:
|
||||
$t.t(
|
||||
"major graphics parameters have been changed and need to be restarted to take effect. Restart the system"
|
||||
) + "?",
|
||||
cancel: true,
|
||||
persistent: true,
|
||||
}).onOk(() => {
|
||||
GlobalData.getInstance().getCurrentClient()?.restartDevice();
|
||||
});
|
||||
} catch {}
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set system graphics") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const applyOther = async () => {
|
||||
const ret = await other_form.value.validate();
|
||||
if (ret) {
|
||||
let request = new Protocol.SetSystemOtherRequestEntity();
|
||||
request.use_ntp = use_ntp.value == $t.t("enable");
|
||||
request.ntp_sync_delay = ntp_sync_delay.value;
|
||||
request.ntp_server = ntp_server.value;
|
||||
request.time_zone = time_zone_options.value.findIndex(
|
||||
(element) => element && element == time_zone.value
|
||||
);
|
||||
if (request.time_zone < 0) {
|
||||
request.time_zone =
|
||||
GlobalData.getInstance().applicationConfig?.time_zone ?? 21;
|
||||
}
|
||||
request.datetime = current_date.value + " " + current_time.value;
|
||||
|
||||
let success = false;
|
||||
try {
|
||||
await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.setSystemOther(request);
|
||||
success = true;
|
||||
} catch {}
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set system other") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
const request = new Protocol.SetSystemOtherRequestEntity();
|
||||
request.use_ntp = use_ntp.value == $t.t("enable");
|
||||
request.ntp_sync_delay = ntp_sync_delay.value;
|
||||
request.ntp_server = ntp_server.value;
|
||||
request.time_zone = time_zone_options.value.findIndex(
|
||||
(element) => element && element == time_zone.value
|
||||
);
|
||||
if (request.time_zone < 0) {
|
||||
request.time_zone =
|
||||
GlobalData.getInstance().applicationConfig?.time_zone ?? 21;
|
||||
}
|
||||
request.datetime = current_date.value + " " + current_time.value;
|
||||
|
||||
let success = false;
|
||||
try {
|
||||
await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.setSystemOther(request);
|
||||
success = true;
|
||||
} catch {}
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set system other") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
};
|
||||
|
||||
const applyOutputBoard = async () => {
|
||||
|
@ -860,21 +1017,38 @@ export default defineComponent({
|
|||
.getCurrentClient()
|
||||
?.setOutputBoardSetting(request);
|
||||
success = true;
|
||||
} catch {
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set output board") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
} catch {}
|
||||
$q.notify({
|
||||
color: success ? "positive" : "negative",
|
||||
icon: success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("set output board") +
|
||||
(success ? $t.t("success") : $t.t("fail")) +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 1000,
|
||||
});
|
||||
};
|
||||
|
||||
const apply = () => {
|
||||
switch (tab.value) {
|
||||
case "network":
|
||||
network_form.value.submit();
|
||||
break;
|
||||
case "graphics":
|
||||
graphics_form.value.submit();
|
||||
break;
|
||||
case "other":
|
||||
other_form.value.submit();
|
||||
|
||||
break;
|
||||
case "output_board":
|
||||
output_board_form.value.submit();
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
const apply = async () => {
|
||||
const apply1 = async () => {
|
||||
loading.value = true;
|
||||
try {
|
||||
switch (tab.value) {
|
||||
|
@ -913,6 +1087,8 @@ export default defineComponent({
|
|||
brightness,
|
||||
contrast,
|
||||
hue,
|
||||
device_rotate,
|
||||
device_rotate_options,
|
||||
device_resolution,
|
||||
device_resolution_options,
|
||||
output_board_resolution,
|
||||
|
@ -940,6 +1116,10 @@ export default defineComponent({
|
|||
refresh_all,
|
||||
apply,
|
||||
restoreOutputBoard,
|
||||
applyNetwork,
|
||||
applyGraphics,
|
||||
applyOther,
|
||||
applyOutputBoard,
|
||||
loga(a: any) {
|
||||
console.log(a);
|
||||
},
|
||||
|
|
|
@ -21,4 +21,5 @@ export default class ApplicationConfigEntity {
|
|||
graphics_brightness: number = 100;
|
||||
graphics_contrast: number = 100;
|
||||
graphics_hue: number = 100;
|
||||
device_rotate: number = 0;
|
||||
}
|
||||
|
|
|
@ -1176,6 +1176,7 @@ export namespace Protocol {
|
|||
brightness: number = 100;
|
||||
contrast: number = 100;
|
||||
hue: number = 100;
|
||||
rotate: number = 0;
|
||||
device_resolution: string = "3840x2160@60";
|
||||
output_board_resolution: string = "1920x1080";
|
||||
|
||||
|
|
|
@ -258,4 +258,9 @@ export default {
|
|||
"update file upload": "升级文件上传",
|
||||
"the system automatically restarts after the upgrade is complete":
|
||||
"系统将在升级完成后自动重启",
|
||||
"device rotate": "旋转",
|
||||
"horizontal flipped": "水平翻转",
|
||||
"set output board": "设置输出板",
|
||||
"major graphics parameters have been changed and need to be restarted to take effect. Restart the system":
|
||||
"重要图形参数已更改,需要重启后生效,是否重启",
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue