魔墙：恢复按钮以及实时更新
This commit is contained in:
miao
parent
c21585bdba
commit
4ecd2ab89d
|
|
@ -52,7 +52,7 @@
|
|||
"
|
||||
>
|
||||
<q-card class="overflow-hidden" style="overflow-y: scroll; max-width: 60vw">
|
||||
<q-form @submit="onSubmit" >
|
||||
<q-form @submit="onSubmit">
|
||||
<q-card-section class="q-ma-none q-pa-sm">
|
||||
<div class="row">
|
||||
<div class="col-auto text-h6">
|
||||
|
|
@ -438,6 +438,14 @@
|
|||
color="primary"
|
||||
v-close-popup
|
||||
/>
|
||||
<q-btn
|
||||
:loading="loading"
|
||||
flat
|
||||
no-caps
|
||||
:label="$t('revert')"
|
||||
color="primary"
|
||||
@click="refresh_all()"
|
||||
/>
|
||||
<q-btn
|
||||
ref="accept"
|
||||
flat
|
||||
|
|
@ -578,6 +586,42 @@ export default defineComponent({
|
|||
const bh = 90;
|
||||
//调整与背景的百分比
|
||||
const percenter = ref(1);
|
||||
let last_percenter = ref(1);
|
||||
const realtime_upload = async () => {
|
||||
const settings = await GlobalData.getInstance()
|
||||
.getCurrentClient()
|
||||
?.getOutputBoardSetting();
|
||||
const cloud_monitor_list = new MagicWallConfig();
|
||||
const wall_dom = wall.value;
|
||||
if (wall_dom && settings) {
|
||||
cloud_monitor_list.magic_wall_enable = true;
|
||||
cloud_monitor_list.col = parseInt(settings.wall_col.toString());
|
||||
cloud_monitor_list.row = parseInt(settings.wall_row.toString());
|
||||
test_monitor_wall.value.forEach((element, index) => {
|
||||
if (element.isShow) {
|
||||
cloud_monitor_list.windows.push({
|
||||
index: element.id,
|
||||
lt: new PointF(
|
||||
element.currentx / wall_dom.offsetWidth,
|
||||
element.currenty / wall_dom.offsetHeight
|
||||
),
|
||||
h: element.h / wall_dom.offsetHeight,
|
||||
w: element.w / wall_dom.offsetWidth,
|
||||
angle: parseInt(element.angle.toString()),
|
||||
initial_h: element.InitialH,
|
||||
initial_w: element.InitialW,
|
||||
percenter: percenter.value,
|
||||
background_h: wall_dom.offsetHeight,
|
||||
background_w: wall_dom.offsetWidth,
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
let client = GlobalData.getInstance().getCurrentClient();
|
||||
if(client){
|
||||
const setMagic = await client.setMagicWallConfig(cloud_monitor_list);
|
||||
}
|
||||
};
|
||||
const ar = 0.5;
|
||||
const br = 0.6;
|
||||
let test_monitor_list: Ref<test_monitor[]> = ref([
|
||||
|
|
@ -667,6 +711,8 @@ export default defineComponent({
|
|||
}
|
||||
};
|
||||
let test_monitor_wall: Ref<test_monitor[]> = ref([]);
|
||||
let last_wall: Ref<test_monitor[]> = ref([]);
|
||||
|
||||
let multiple_select: Ref<number[]> = ref([]);
|
||||
const set_x = () => {
|
||||
const wall_dom = wall.value;
|
||||
|
|
@ -721,8 +767,10 @@ export default defineComponent({
|
|||
return Math.floor(
|
||||
item.currentx + item.w / 2 - (maxx - wall_dom.offsetWidth)
|
||||
);
|
||||
}else {
|
||||
return Math.floor(item.currentx + item.w / 2 - (maxx - wall_dom.offsetWidth));
|
||||
} else {
|
||||
return Math.floor(
|
||||
item.currentx + item.w / 2 - (maxx - wall_dom.offsetWidth)
|
||||
);
|
||||
}
|
||||
} else {
|
||||
return Math.floor(wall_dom.offsetWidth - item.w / 2);
|
||||
|
|
@ -784,7 +832,9 @@ export default defineComponent({
|
|||
item.currenty + item.h / 2 - (maxy - wall_dom.offsetHeight)
|
||||
);
|
||||
} else {
|
||||
return Math.floor(item.currenty + item.h / 2 - (maxy - wall_dom.offsetHeight));
|
||||
return Math.floor(
|
||||
item.currenty + item.h / 2 - (maxy - wall_dom.offsetHeight)
|
||||
);
|
||||
}
|
||||
} else {
|
||||
return Math.floor(wall_dom.offsetHeight - item.h / 2);
|
||||
|
|
@ -842,6 +892,7 @@ export default defineComponent({
|
|||
item.centerx = Math.floor(item.currentx + item.w / 2);
|
||||
item.centery = Math.floor(item.currenty + item.h / 2);
|
||||
}
|
||||
realtime_upload();
|
||||
};
|
||||
const exceedrange = (item: test_monitor) => {
|
||||
const wall_dom = wall.value;
|
||||
|
|
@ -918,6 +969,7 @@ export default defineComponent({
|
|||
test_monitor_list,
|
||||
test_monitor_wall,
|
||||
percenter,
|
||||
last_percenter,
|
||||
wall,
|
||||
set_x,
|
||||
min_x,
|
||||
|
|
@ -930,10 +982,10 @@ export default defineComponent({
|
|||
loga(a: any) {
|
||||
console.log(a);
|
||||
},
|
||||
|
||||
async showDialog() {
|
||||
show_dialog.value = true;
|
||||
let client = GlobalData.getInstance().getCurrentClient();
|
||||
|
||||
if (client) {
|
||||
const response = await client.getMagicWallConfig();
|
||||
const a = response?.config.windows;
|
||||
|
|
@ -947,6 +999,7 @@ export default defineComponent({
|
|||
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;
|
||||
|
|
@ -956,6 +1009,7 @@ export default defineComponent({
|
|||
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;
|
||||
|
|
@ -976,6 +1030,7 @@ export default defineComponent({
|
|||
percenter.value = 1;
|
||||
multiple_select.value = [];
|
||||
multiple.value = false;
|
||||
last_wall.value = [];
|
||||
test_monitor_list.value.forEach((element) => {
|
||||
element.isHide = false;
|
||||
});
|
||||
|
|
@ -989,12 +1044,10 @@ export default defineComponent({
|
|||
.getCurrentClient()
|
||||
?.getOutputBoardSetting();
|
||||
if (client && wall_dom && settings) {
|
||||
const response = await client.getMagicWallConfig();
|
||||
const cloud_monitor_list = new MagicWallConfig();
|
||||
cloud_monitor_list.magic_wall_enable = true; //response?.config.magic_wall_enable ?? true;
|
||||
cloud_monitor_list.magic_wall_enable = true;
|
||||
cloud_monitor_list.col = parseInt(settings.wall_col.toString());
|
||||
cloud_monitor_list.row = parseInt(settings.wall_row.toString());
|
||||
let tep_width = 0;
|
||||
test_monitor_wall.value.forEach((element, index) => {
|
||||
if (element.isShow) {
|
||||
cloud_monitor_list.windows.push({
|
||||
|
|
@ -1110,6 +1163,7 @@ export default defineComponent({
|
|||
}
|
||||
current_index.value = test_monitor_wall.value.length - 1;
|
||||
}
|
||||
realtime_upload();
|
||||
},
|
||||
onDragEnter(e: DragEvent, index: string) {
|
||||
e.stopPropagation();
|
||||
|
|
@ -1139,7 +1193,7 @@ export default defineComponent({
|
|||
current_index.value = -1;
|
||||
test_monitor_list.value[item.id].isHide = false;
|
||||
test_monitor_wall.value[index].isShow = false;
|
||||
multiple_select.value=[]
|
||||
multiple_select.value = [];
|
||||
},
|
||||
closeOtherWindows(item: test_monitor, index: number) {
|
||||
current_index.value = index;
|
||||
|
|
@ -1161,7 +1215,7 @@ export default defineComponent({
|
|||
test_monitor_wall.value.forEach((element) => {
|
||||
element.isShow = false;
|
||||
});
|
||||
multiple_select.value=[]
|
||||
multiple_select.value = [];
|
||||
},
|
||||
box_width(row: number, col: number) {
|
||||
let tep = JSON.parse(
|
||||
|
|
@ -1182,11 +1236,13 @@ export default defineComponent({
|
|||
const wall_dom = wall.value;
|
||||
const item = test_monitor_wall.value[current_index.value];
|
||||
item.currentx = item.centerx - item.w / 2;
|
||||
realtime_upload();
|
||||
},
|
||||
center_y() {
|
||||
const wall_dom = wall.value;
|
||||
const item = test_monitor_wall.value[current_index.value];
|
||||
item.currenty = item.centery - item.h / 2;
|
||||
realtime_upload();
|
||||
},
|
||||
changePercenter() {
|
||||
const wall_dom = wall.value;
|
||||
|
|
@ -1211,6 +1267,7 @@ export default defineComponent({
|
|||
tep = true;
|
||||
}
|
||||
});
|
||||
realtime_upload();
|
||||
},
|
||||
canel_active() {
|
||||
Unchecked.value = true;
|
||||
|
|
@ -1227,23 +1284,24 @@ export default defineComponent({
|
|||
const wall_dom = wall.value;
|
||||
let item = test_monitor_wall.value[current_index.value];
|
||||
exceedrange(item);
|
||||
realtime_upload();
|
||||
},
|
||||
sub_x() {
|
||||
let item = test_monitor_wall.value[current_index.value];
|
||||
let minx=1000;
|
||||
let minx = 1000;
|
||||
if (multiple_select.value.length > 1) {
|
||||
multiple_select.value.forEach((element) => {
|
||||
if (element != -1) {
|
||||
let tep_item=test_monitor_wall.value[element];
|
||||
let tep_item = test_monitor_wall.value[element];
|
||||
let min = min_x(tep_item) ?? 0;
|
||||
if (tep_item.centerx > min) {
|
||||
if(minx>tep_item.centerx&&tep_item.angle!=0){
|
||||
minx=tep_item.centerx;
|
||||
current_index.value=element
|
||||
}
|
||||
tep_item.currentx--;
|
||||
tep_item.centerx--;
|
||||
if (tep_item.centerx > min) {
|
||||
if (minx > tep_item.centerx && tep_item.angle != 0) {
|
||||
minx = tep_item.centerx;
|
||||
current_index.value = element;
|
||||
}
|
||||
tep_item.currentx--;
|
||||
tep_item.centerx--;
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
|
|
@ -1253,22 +1311,23 @@ export default defineComponent({
|
|||
item.centerx--;
|
||||
}
|
||||
}
|
||||
realtime_upload();
|
||||
},
|
||||
sub_y() {
|
||||
let item = test_monitor_wall.value[current_index.value];
|
||||
let miny=1000;
|
||||
let miny = 1000;
|
||||
if (multiple_select.value.length > 1) {
|
||||
multiple_select.value.forEach((element) => {
|
||||
if (element != -1) {
|
||||
let tep_item=test_monitor_wall.value[element];
|
||||
let tep_item = test_monitor_wall.value[element];
|
||||
let min = min_y(tep_item) ?? 0;
|
||||
if (tep_item.centery > min) {
|
||||
if(miny>tep_item.centery){
|
||||
miny=tep_item.centery;
|
||||
current_index.value=element
|
||||
}
|
||||
tep_item.currenty--;
|
||||
tep_item.centery--;
|
||||
if (miny > tep_item.centery) {
|
||||
miny = tep_item.centery;
|
||||
current_index.value = element;
|
||||
}
|
||||
tep_item.currenty--;
|
||||
tep_item.centery--;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -1279,21 +1338,22 @@ export default defineComponent({
|
|||
item.centery--;
|
||||
}
|
||||
}
|
||||
realtime_upload();
|
||||
},
|
||||
add_x() {
|
||||
let item = test_monitor_wall.value[current_index.value];
|
||||
let maxx=0;
|
||||
let maxx = 0;
|
||||
if (multiple_select.value.length > 1) {
|
||||
multiple_select.value.forEach((element) => {
|
||||
if (element != -1) {
|
||||
let tep_item=test_monitor_wall.value[element];
|
||||
let tep_item = test_monitor_wall.value[element];
|
||||
let max = max_x(tep_item) ?? 0;
|
||||
|
||||
if (tep_item.centerx < max) {
|
||||
if(maxx<tep_item.centerx&&tep_item.angle!=0){
|
||||
maxx=tep_item.centerx;
|
||||
current_index.value=element
|
||||
}
|
||||
if (maxx < tep_item.centerx && tep_item.angle != 0) {
|
||||
maxx = tep_item.centerx;
|
||||
current_index.value = element;
|
||||
}
|
||||
tep_item.currentx++;
|
||||
tep_item.centerx++;
|
||||
}
|
||||
|
|
@ -1306,20 +1366,21 @@ export default defineComponent({
|
|||
item.centerx++;
|
||||
}
|
||||
}
|
||||
realtime_upload();
|
||||
},
|
||||
add_y() {
|
||||
let item = test_monitor_wall.value[current_index.value];
|
||||
let maxy=0;
|
||||
let maxy = 0;
|
||||
if (multiple_select.value.length > 1) {
|
||||
multiple_select.value.forEach((element) => {
|
||||
if (element != -1) {
|
||||
let tep_item=test_monitor_wall.value[element];
|
||||
let tep_item = test_monitor_wall.value[element];
|
||||
let max = max_y(tep_item) ?? 0;
|
||||
if (tep_item.centery < max) {
|
||||
if(maxy<tep_item.centery&&tep_item.angle!=0){
|
||||
maxy=tep_item.centery;
|
||||
current_index.value=element
|
||||
}
|
||||
if (maxy < tep_item.centery && tep_item.angle != 0) {
|
||||
maxy = tep_item.centery;
|
||||
current_index.value = element;
|
||||
}
|
||||
tep_item.currenty++;
|
||||
tep_item.centery++;
|
||||
}
|
||||
|
|
@ -1332,6 +1393,24 @@ export default defineComponent({
|
|||
item.centery++;
|
||||
}
|
||||
}
|
||||
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();
|
||||
},
|
||||
};
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue