lingling
/
media_player_client
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加魔墙在主页面的显示

This commit is contained in:
miao 2023-01-29 15:07:46 +08:00
parent a20a1c916c
commit 3c20ba2461
4 changed files with 1769 additions and 1369 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

128
src/components/ControlPanelDialog.vue
View File

@ -568,7 +568,7 @@
no-caps no-caps
:label="$t('revert')" :label="$t('revert')"
color="primary" color="primary"
@click="refresh_all()" @click="refresh_all"
/> />
<q-btn <q-btn
ref="accept" ref="accept"
@ -637,7 +637,7 @@ import EventBus, { EventNamesDefine } from "src/common/EventBus";
import { number } from "@intlify/core-base"; import { number } from "@intlify/core-base";
// import VeeValidate from 'vee-validate'; // import VeeValidate from 'vee-validate';
class test_monitor { export class test_monitor {
uuid = ""; uuid = "";
active = false; active = false;
start_x = 0; start_x = 0;
@ -822,7 +822,7 @@ export default defineComponent({
); );
num--; num--;
} }
getpx() getpx();
} }
} }
const cloud_monitor_list = new MagicWallConfig(); const cloud_monitor_list = new MagicWallConfig();
@ -851,21 +851,39 @@ export default defineComponent({
} }
}); });
} }
if (client) { // if (client) {
const setMagic = await client.setMagicWallConfig(cloud_monitor_list); // const setMagic = await client.setMagicWallConfig(cloud_monitor_list);
if(!setMagic?.success){ // if (setMagic?.success) {
$q.notify({ // let monitorList:any=[]
color: "negative", // test_monitor_wall.value.forEach((element, index) => {
icon: "warning", // if (element.isShow&&wall_dom) {
message: // monitorList.push({
$t.t("update magic wall") + // id: element.id,
$t.t("fail") + // currentx: element.currentx / wall_dom.offsetWidth,
"!", // currenty: element.currenty / wall_dom.offsetHeight,
position: "top", // h: element.h / wall_dom.offsetHeight,
timeout: 2500, // w: element.w / wall_dom.offsetWidth,
}); // angle: parseInt(element.angle.toString()),
} // centerx: element.centerx/ wall_dom.offsetWidth,
} // centery: element.centery / wall_dom.offsetHeight,
// });
// }
// });
// $store.commit("setShowMonitorList", monitorList);
// }
// if(!setMagic?.success){
// $q.notify({
// color: "negative",
// icon: "warning",
// message:
// $t.t("update magic wall") +
// $t.t("fail") +
// "!",
// position: "top",
// timeout: 2500,
// });
// }
// }
}; };
const getpx = () => { const getpx = () => {
const wall_dom = wall.value; const wall_dom = wall.value;
@ -1171,12 +1189,27 @@ export default defineComponent({
test_monitor_list.value[index].active = true; test_monitor_list.value[index].active = true;
}; };
let test_delete_flag = false; let test_delete_flag = false;
const refresh_all=()=> {
test_monitor_wall.value = [];
current_index.value = -1;
percenter.value = last_percenter.value;
multiple_select.value = [];
multiple.value = false;
loading.value = false;
test_monitor_list.value.forEach((element) => {
element.isHide = false;
});
last_wall.value.forEach((element) => {
element.isShow = true;
test_monitor_wall.value.push(JSON.parse(JSON.stringify(element)));
test_monitor_list.value[element.id].isHide = true;
});
realtime_upload();
};
EventBus.getInstance().on(EventNamesDefine.WindowResize, () => { EventBus.getInstance().on(EventNamesDefine.WindowResize, () => {
const wall_dom = wall.value; const wall_dom = wall.value;
console.log(test_monitor_wall.value)
if (wall_dom) { if (wall_dom) {
getpx();
let size_h = offsetHeight.value / wall_dom.offsetHeight;
let size_w = offsetWidth.value / wall_dom.offsetWidth;
test_monitor_wall.value.forEach((element) => { test_monitor_wall.value.forEach((element) => {
let teph = element.InitialH; let teph = element.InitialH;
let tepw = element.InitialW; let tepw = element.InitialW;
@ -1191,9 +1224,11 @@ export default defineComponent({
element.centerx = Math.floor(element.currentx + element.w / 2); element.centerx = Math.floor(element.currentx + element.w / 2);
element.centery = Math.floor(element.currenty + element.h / 2); element.centery = Math.floor(element.currenty + element.h / 2);
}); });
getpx();
} }
}); });
return { return {
refresh_all,
getpx, getpx,
lcm, lcm,
model, model,
@ -1260,6 +1295,7 @@ export default defineComponent({
); );
num--; num--;
} }
getpx();
} }
if ( if (
output_length.value != output_length.value !=
@ -1293,7 +1329,7 @@ export default defineComponent({
item.centery = Math.floor(item.currenty + item.h / 2); item.centery = Math.floor(item.currenty + item.h / 2);
item.angle = element.angle; item.angle = element.angle;
item.isShow = true; item.isShow = true;
test_monitor_wall.value.push(item); test_monitor_wall.value.push(JSON.parse(JSON.stringify(item)));
last_wall.value.push(JSON.parse(JSON.stringify(item))); last_wall.value.push(JSON.parse(JSON.stringify(item)));
test_monitor_list.value.forEach((ele) => { test_monitor_list.value.forEach((ele) => {
if (element.index == ele.id) { if (element.index == ele.id) {
@ -1354,6 +1390,24 @@ export default defineComponent({
} }
}); });
const setMagic = await client.setMagicWallConfig(cloud_monitor_list); const setMagic = await client.setMagicWallConfig(cloud_monitor_list);
if (setMagic?.success) {
let monitorList:any=[]
test_monitor_wall.value.forEach((element, index) => {
if (element.isShow&&wall_dom) {
monitorList.push({
id: element.id,
currentx: element.currentx / wall_dom.offsetWidth,
currenty: element.currenty / wall_dom.offsetHeight,
h: element.h / wall_dom.offsetHeight,
w: element.w / wall_dom.offsetWidth,
angle: parseInt(element.angle.toString()),
centerx: element.centerx/ wall_dom.offsetWidth,
centery: element.centery / wall_dom.offsetHeight,
});
}
});
$store.commit("setShowMonitorList", monitorList);
}
$q.notify({ $q.notify({
color: setMagic?.success ? "positive" : "negative", color: setMagic?.success ? "positive" : "negative",
icon: setMagic?.success ? "done" : "warning", icon: setMagic?.success ? "done" : "warning",
@ -1721,23 +1775,7 @@ export default defineComponent({
} }
realtime_upload(); realtime_upload();
}, },
refresh_all() {
test_monitor_wall.value = [];
current_index.value = -1;
percenter.value = last_percenter.value;
multiple_select.value = [];
multiple.value = false;
loading.value = false;
test_monitor_list.value.forEach((element) => {
element.isHide = false;
});
last_wall.value.forEach((element) => {
element.isShow = true;
test_monitor_wall.value.push(JSON.parse(JSON.stringify(element)));
test_monitor_list.value[element.id].isHide = true;
});
realtime_upload();
},
changewidth() { changewidth() {
let item = test_monitor_list.value[monitor_list_current_index.value]; let item = test_monitor_list.value[monitor_list_current_index.value];
item.w = Number(item.cmw) * lcm.value; item.w = Number(item.cmw) * lcm.value;
@ -1747,7 +1785,7 @@ export default defineComponent({
item.h = item.cmh * lcm.value; item.h = item.cmh * lcm.value;
}, },
alignTop() { alignTop() {
let item=test_monitor_wall.value[multiple_select.value[0]]; let item = test_monitor_wall.value[multiple_select.value[0]];
multiple_select.value.forEach((element) => { multiple_select.value.forEach((element) => {
if (element != -1) { if (element != -1) {
let tep_item = test_monitor_wall.value[element]; let tep_item = test_monitor_wall.value[element];
@ -1758,28 +1796,28 @@ export default defineComponent({
realtime_upload(); realtime_upload();
}, },
alignBottom() { alignBottom() {
let item=test_monitor_wall.value[multiple_select.value[0]]; let item = test_monitor_wall.value[multiple_select.value[0]];
multiple_select.value.forEach((element) => { multiple_select.value.forEach((element) => {
if (element != -1) { if (element != -1) {
let tep_item = test_monitor_wall.value[element]; let tep_item = test_monitor_wall.value[element];
tep_item.currenty = item.currenty+item.h-tep_item.h; tep_item.currenty = item.currenty + item.h - tep_item.h;
} }
}); });
realtime_upload(); realtime_upload();
}, },
alignRight() { alignRight() {
let item=test_monitor_wall.value[multiple_select.value[0]]; let item = test_monitor_wall.value[multiple_select.value[0]];
multiple_select.value.forEach((element) => { multiple_select.value.forEach((element) => {
if (element != -1) { if (element != -1) {
let tep_item = test_monitor_wall.value[element]; let tep_item = test_monitor_wall.value[element];
tep_item.currentx = item.currentx+item.w-tep_item.w; tep_item.currentx = item.currentx + item.w - tep_item.w;
} }
}); });
realtime_upload(); realtime_upload();
}, },
alignLeft() { alignLeft() {
let item=test_monitor_wall.value[multiple_select.value[0]]; let item = test_monitor_wall.value[multiple_select.value[0]];
multiple_select.value.forEach((element) => { multiple_select.value.forEach((element) => {
if (element != -1) { if (element != -1) {
let tep_item = test_monitor_wall.value[element]; let tep_item = test_monitor_wall.value[element];

2
src/pages/TopToolBar.vue
View File

@ -292,7 +292,7 @@
<q-item <q-item
clickable clickable
:disable="!$store.state.power_state" :disable="!$store.state.power_state"
v-if="$store.state.isLedPlayer()" v-if="$store.state.isLedPlayer()&&!$store.state.custom_defines.function_magic_wall"
v-close-popup v-close-popup
@click=" @click="
($store.state.isSpecialVideo() ($store.state.isSpecialVideo()

2980
src/pages/WallPage.vue
View File

File diff suppressed because it is too large Load Diff

28
src/store/index.ts
View File

@ -39,7 +39,27 @@ export class CustomDefines {
function_mirroring_output = false; function_mirroring_output = false;
function_magic_wall=false; function_magic_wall=false;
} }
class test_monitor {
w = 0.0;
h = 0.0;
currentx = 0.0;
currenty = 0.0;
centerx = 0.0;
centery = 0.0;
angle = 0;
id = 0;
constructor(id: number, w: number, h: number) {
this.currentx = 0.0;
this.currenty = 0.0;
this.angle = 0;
this.centerx = 0;
this.centery = 0;
this.id = id;
this.w = w;
this.h = h;
}
}
export interface StateInterface { export interface StateInterface {
// Define your own store structure, using submodules if needed // Define your own store structure, using submodules if needed
// example: ExampleStateInterface; // example: ExampleStateInterface;
@ -77,7 +97,7 @@ export interface StateInterface {
device_attribute: number; device_attribute: number;
power_state: boolean; power_state: boolean;
product_name: string; product_name: string;
show_monitor_list:test_monitor[];
custom_defines: CustomDefines; custom_defines: CustomDefines;
isLedPlayer: () => boolean; isLedPlayer: () => boolean;
@ -340,9 +360,8 @@ export default store(function (/* { ssrContext } */) {
device_attribute: 0, device_attribute: 0,
power_state: false, power_state: false,
product_name: EProductNames.LED_PLAYER, product_name: EProductNames.LED_PLAYER,
show_monitor_list:[],
custom_defines: new CustomDefines(), custom_defines: new CustomDefines(),
isLedPlayer: () => { isLedPlayer: () => {
return ( return (
Store.state.product_name == EProductNames.LED_PLAYER || Store.state.product_name == EProductNames.LED_PLAYER ||
@ -358,6 +377,9 @@ export default store(function (/* { ssrContext } */) {
setInitialized(state: StateInterface, playload?: any) { setInitialized(state: StateInterface, playload?: any) {
state.initialized = true; state.initialized = true;
}, },
setShowMonitorList(state: StateInterface, playload?: any) {
state.show_monitor_list = playload
},
updateLandspace(state: StateInterface, playload?: any) { updateLandspace(state: StateInterface, playload?: any) {
if (typeof playload == "boolean") { if (typeof playload == "boolean") {
state.landspace = playload; state.landspace = playload;