魔墙：添加根据输出版设置显示器个数
This commit is contained in:
miao
parent
35d5a3fdb9
commit
ae6eb30af5
|
|
@ -241,7 +241,7 @@
|
|||
markers
|
||||
switch-marker-labels-side
|
||||
label-always
|
||||
:min="0.10"
|
||||
:min="0.1"
|
||||
:max="2"
|
||||
:step="0.05"
|
||||
/>
|
||||
|
|
@ -353,16 +353,13 @@
|
|||
<q-card-section horizontal>
|
||||
<q-list key="uuid" class="full-width">
|
||||
<div
|
||||
v-for="item in Math.ceil(test_monitor_list.length / 4)"
|
||||
v-for="item in Math.ceil(output_length / 4)"
|
||||
class="row justify-around"
|
||||
>
|
||||
<div
|
||||
v-for="j in 4"
|
||||
style="display: inline-block"
|
||||
v-if="
|
||||
item < test_monitor_list.length / 4 ||
|
||||
test_monitor_list.length % 4 == 0
|
||||
"
|
||||
v-if="item < output_length / 4 || output_length % 4 == 0"
|
||||
:style="{ lineHeight: box_height(item, j) }"
|
||||
>
|
||||
<div
|
||||
|
|
@ -391,13 +388,14 @@
|
|||
@dragend="(evt) => onDragend(evt, item, j)"
|
||||
>
|
||||
{{ test_monitor_list[(item - 1) * 4 + (j - 1)].uuid }}
|
||||
W:{{ test_monitor_list[(item - 1) * 4 + (j - 1)].w }}
|
||||
H:{{ test_monitor_list[(item - 1) * 4 + (j - 1)].h }}
|
||||
W:{{ test_monitor_list[(item - 1) * 4 + (j - 1)].w }} H:{{
|
||||
test_monitor_list[(item - 1) * 4 + (j - 1)].h
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
v-for="j in test_monitor_list.length % 4"
|
||||
v-for="j in output_length % 4"
|
||||
style="display: inline-block; text-align: center"
|
||||
:style="{ lineHeight: box_height(item, j) }"
|
||||
>
|
||||
|
|
@ -422,8 +420,9 @@
|
|||
@dragend="(evt) => onDragend(evt, item, j)"
|
||||
>
|
||||
{{ test_monitor_list[(item - 1) * 4 + (j - 1)].uuid }}
|
||||
W:{{ test_monitor_list[(item - 1) * 4 + (j - 1)].w }}
|
||||
H:{{ test_monitor_list[(item - 1) * 4 + (j - 1)].h }}
|
||||
W:{{ test_monitor_list[(item - 1) * 4 + (j - 1)].w }} H:{{
|
||||
test_monitor_list[(item - 1) * 4 + (j - 1)].h
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -589,13 +588,66 @@ export default defineComponent({
|
|||
const ah = 72;
|
||||
const bw = 160;
|
||||
const bh = 90;
|
||||
const cw = 192;
|
||||
const ch = 108;
|
||||
//调整与背景的百分比
|
||||
const percenter = ref(1);
|
||||
let last_percenter = ref(1);
|
||||
const ar = 0.5;
|
||||
const br = 0.6;
|
||||
const cr = 0.7;
|
||||
let test_monitor_list: Ref<test_monitor[]> = ref([
|
||||
new test_monitor(0, "01", aw, ah, ar),
|
||||
new test_monitor(1, "02", aw, ah, ar),
|
||||
new test_monitor(2, "03", aw, ah, ar),
|
||||
new test_monitor(3, "04", aw, ah, ar),
|
||||
new test_monitor(4, "05", bw, bh, br),
|
||||
new test_monitor(5, "06", bw, bh, br),
|
||||
new test_monitor(6, "07", bw, bh, br),
|
||||
new test_monitor(7, "08", bw, bh, br),
|
||||
new test_monitor(8, "09", cw, ch, cr),
|
||||
new test_monitor(9, "10", cw, ch, cr),
|
||||
new test_monitor(10, "11", cw, ch, cr),
|
||||
new test_monitor(11, "12", cw, ch, cr),
|
||||
// new test_monitor(12, "13", cw, ch, cr)
|
||||
]);
|
||||
interface show__Rect {
|
||||
width: number;
|
||||
height: number;
|
||||
x: number;
|
||||
y: number;
|
||||
left: number;
|
||||
top: number;
|
||||
angle: number;
|
||||
}
|
||||
let showMonitor = reactive({
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: 0,
|
||||
height: 0,
|
||||
active: false,
|
||||
});
|
||||
const realtime_upload = async () => {
|
||||
let client = GlobalData.getInstance().getCurrentClient();
|
||||
const settings = await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.getOutputBoardSetting();
|
||||
if (settings) {
|
||||
output_length.value =
|
||||
parseInt(settings.wall_col.toString()) *
|
||||
parseInt(settings.wall_row.toString());
|
||||
if (output_length.value > test_monitor_list.value.length) {
|
||||
let num = output_length.value - test_monitor_list.value.length;
|
||||
while (num > 0) {
|
||||
let index = test_monitor_list.value.length;
|
||||
let uuid = (index + 1).toString();
|
||||
test_monitor_list.value.push(
|
||||
new test_monitor(index, uuid, aw, ah, ar)
|
||||
);
|
||||
num--;
|
||||
}
|
||||
}
|
||||
}
|
||||
const cloud_monitor_list = new MagicWallConfig();
|
||||
const wall_dom = wall.value;
|
||||
if (wall_dom && settings) {
|
||||
|
|
@ -622,53 +674,22 @@ export default defineComponent({
|
|||
}
|
||||
});
|
||||
}
|
||||
let client = GlobalData.getInstance().getCurrentClient();
|
||||
if(client){
|
||||
const setMagic = await client.setMagicWallConfig(cloud_monitor_list);
|
||||
if(setMagic?.success){
|
||||
$q.notify({
|
||||
color: setMagic?.success ? "positive" : "negative",
|
||||
icon: setMagic?.success ? "done" : "warning",
|
||||
message:
|
||||
$t.t("update magic wall") +
|
||||
$t.t("fail") +
|
||||
"!",
|
||||
position: "top",
|
||||
timeout: 2500,
|
||||
});
|
||||
}
|
||||
}
|
||||
// if(client){
|
||||
// const setMagic = await client.setMagicWallConfig(cloud_monitor_list);
|
||||
// if(setMagic?.success){
|
||||
// $q.notify({
|
||||
// color: setMagic?.success ? "positive" : "negative",
|
||||
// icon: setMagic?.success ? "done" : "warning",
|
||||
// message:
|
||||
// $t.t("update magic wall") +
|
||||
// $t.t("fail") +
|
||||
// "!",
|
||||
// position: "top",
|
||||
// timeout: 2500,
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
};
|
||||
const ar = 0.5;
|
||||
const br = 0.6;
|
||||
let test_monitor_list: Ref<test_monitor[]> = ref([
|
||||
new test_monitor(0, "01", aw, ah, ar),
|
||||
new test_monitor(1, "02", aw, ah, ar),
|
||||
new test_monitor(2, "03", aw, ah, ar),
|
||||
new test_monitor(3, "04", aw, ah, ar),
|
||||
new test_monitor(4, "05", bw, bh, br),
|
||||
new test_monitor(5, "06", bw, bh, br),
|
||||
new test_monitor(6, "07", bw, bh, br),
|
||||
new test_monitor(7, "08", bw, bh, br),
|
||||
// new test_monitor(8, "09", bw, bh, br),
|
||||
]);
|
||||
const copy_monitor_list = test_monitor_list.value;
|
||||
interface show__Rect {
|
||||
width: number;
|
||||
height: number;
|
||||
x: number;
|
||||
y: number;
|
||||
left: number;
|
||||
top: number;
|
||||
angle: number;
|
||||
}
|
||||
let showMonitor = reactive({
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: 0,
|
||||
height: 0,
|
||||
active: false,
|
||||
});
|
||||
const radians = () => {
|
||||
const item = test_monitor_wall.value[current_index.value];
|
||||
return /*a*/ (item.angle * Math.PI) / 180;
|
||||
|
|
@ -729,7 +750,7 @@ export default defineComponent({
|
|||
};
|
||||
let test_monitor_wall: Ref<test_monitor[]> = ref([]);
|
||||
let last_wall: Ref<test_monitor[]> = ref([]);
|
||||
|
||||
let output_length = ref(0);
|
||||
let multiple_select: Ref<number[]> = ref([]);
|
||||
const set_x = () => {
|
||||
const wall_dom = wall.value;
|
||||
|
|
@ -973,6 +994,7 @@ export default defineComponent({
|
|||
}
|
||||
});
|
||||
return {
|
||||
output_length,
|
||||
multiple_select,
|
||||
multiple,
|
||||
exceedrange,
|
||||
|
|
@ -999,44 +1021,76 @@ export default defineComponent({
|
|||
loga(a: any) {
|
||||
console.log(a);
|
||||
},
|
||||
|
||||
async showDialog() {
|
||||
show_dialog.value = true;
|
||||
let client = GlobalData.getInstance().getCurrentClient();
|
||||
if (client) {
|
||||
const settings = await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.getOutputBoardSetting();
|
||||
const response = await client.getMagicWallConfig();
|
||||
const a = response?.config.windows;
|
||||
const wall_dom = wall.value;
|
||||
if (a && wall_dom) {
|
||||
a.forEach((element) => {
|
||||
let item: test_monitor = new test_monitor(0, "0", 0, 0, 0);
|
||||
extend(true, item, test_monitor_list.value[element.index]);
|
||||
let sizeh = wall_dom.offsetHeight / element.background_h;
|
||||
let sizew = wall_dom.offsetWidth / element.background_w;
|
||||
item.currentx = element.lt.x * wall_dom.offsetWidth;
|
||||
item.currenty = element.lt.y * wall_dom.offsetHeight;
|
||||
percenter.value = parseFloat(element.percenter.toString());
|
||||
last_percenter.value = percenter.value;
|
||||
item.InitialH = element.initial_h * sizeh;
|
||||
item.InitialW = element.initial_w * sizew;
|
||||
item.h = item.InitialH * percenter.value;
|
||||
item.w = item.InitialW * percenter.value;
|
||||
item.centerx = Math.floor(item.currentx + item.w / 2);
|
||||
item.centery = Math.floor(item.currenty + item.h / 2);
|
||||
item.angle = element.angle;
|
||||
item.isShow = true;
|
||||
test_monitor_wall.value.push(item);
|
||||
last_wall.value.push(JSON.parse(JSON.stringify(item)));
|
||||
test_monitor_list.value.forEach((ele) => {
|
||||
if (element.index == ele.id) {
|
||||
ele.isHide = true;
|
||||
}
|
||||
});
|
||||
});
|
||||
if (a.length == 1) {
|
||||
current_index.value = 0;
|
||||
} else {
|
||||
if (response && settings) {
|
||||
const a = response?.config.windows;
|
||||
output_length.value =
|
||||
parseInt(settings.wall_col.toString()) *
|
||||
parseInt(settings.wall_row.toString());
|
||||
if (output_length.value > test_monitor_list.value.length) {
|
||||
let num = output_length.value - test_monitor_list.value.length;
|
||||
while (num > 0) {
|
||||
let index = test_monitor_list.value.length;
|
||||
let uuid = (index + 1).toString();
|
||||
test_monitor_list.value.push(
|
||||
new test_monitor(index, uuid, aw, ah, ar)
|
||||
);
|
||||
num--;
|
||||
}
|
||||
}
|
||||
if (
|
||||
output_length.value !=
|
||||
response.config.col * response.config.row
|
||||
) {
|
||||
test_monitor_wall.value = [];
|
||||
current_index.value = -1;
|
||||
percenter.value = 1;
|
||||
multiple_select.value = [];
|
||||
multiple.value = false;
|
||||
last_wall.value = [];
|
||||
test_monitor_list.value.forEach((element) => {
|
||||
element.isHide = false;
|
||||
});
|
||||
loading.value = false;
|
||||
} else if (a && wall_dom) {
|
||||
a.forEach((element) => {
|
||||
let item: test_monitor = new test_monitor(0, "0", 0, 0, 0);
|
||||
extend(true, item, test_monitor_list.value[element.index]);
|
||||
let sizeh = wall_dom.offsetHeight / element.background_h;
|
||||
let sizew = wall_dom.offsetWidth / element.background_w;
|
||||
item.currentx = element.lt.x * wall_dom.offsetWidth;
|
||||
item.currenty = element.lt.y * wall_dom.offsetHeight;
|
||||
percenter.value = parseFloat(element.percenter.toString());
|
||||
last_percenter.value = percenter.value;
|
||||
item.InitialH = element.initial_h * sizeh;
|
||||
item.InitialW = element.initial_w * sizew;
|
||||
item.h = item.InitialH * percenter.value;
|
||||
item.w = item.InitialW * percenter.value;
|
||||
item.centerx = Math.floor(item.currentx + item.w / 2);
|
||||
item.centery = Math.floor(item.currenty + item.h / 2);
|
||||
item.angle = element.angle;
|
||||
item.isShow = true;
|
||||
test_monitor_wall.value.push(item);
|
||||
last_wall.value.push(JSON.parse(JSON.stringify(item)));
|
||||
test_monitor_list.value.forEach((ele) => {
|
||||
if (element.index == ele.id) {
|
||||
ele.isHide = true;
|
||||
}
|
||||
});
|
||||
});
|
||||
if (a.length == 1) {
|
||||
current_index.value = 0;
|
||||
} else {
|
||||
current_index.value = -1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1212,7 +1266,6 @@ export default defineComponent({
|
|||
test_monitor_wall.value[index].isShow = false;
|
||||
multiple_select.value = [];
|
||||
realtime_upload();
|
||||
|
||||
},
|
||||
closeOtherWindows(item: test_monitor, index: number) {
|
||||
current_index.value = index;
|
||||
|
|
|
|||
Loading…
Reference in New Issue