From 938cb8ed834a238ed34023c7acedb1d9434925d3 Mon Sep 17 00:00:00 2001 From: miao <2514145421@qq.com> Date: Mon, 26 Dec 2022 10:10:29 +0800 Subject: [PATCH] =?UTF-8?q?=E9=AD=94=E5=A2=99=E6=B7=BB=E5=8A=A0=E4=B8=8A?= =?UTF-8?q?=E4=BC=A0=E6=97=B6=E7=9A=84=E5=8F=82=E6=95=B0-=E8=83=8C?= =?UTF-8?q?=E6=99=AF=E5=A2=99=E7=9A=84=E5=88=86=E8=BE=A8=E7=8E=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/ControlPanelDialog.vue | 144 ++++++++++++++++++-------- src/entities/RectF.ts | 2 + 2 files changed, 103 insertions(+), 43 deletions(-) diff --git a/src/components/ControlPanelDialog.vue b/src/components/ControlPanelDialog.vue index 9179be4..61bce5b 100644 --- a/src/components/ControlPanelDialog.vue +++ b/src/components/ControlPanelDialog.vue @@ -42,7 +42,7 @@ + oninput="if(value<0)value=0;if(value>360)value=360;" hint="" @update:model-value="changeAngle()"> @@ -144,8 +144,8 @@
- .monitor_selected { outline-style: dashed; - outline-color: #166fab; + outline-color: transparent; background-color: dimgrey; } @@ -274,10 +274,10 @@ class test_monitor { start_y = 0; InitialW = 0; InitialH = 0; - w = 0; - h = 0; - currentx = 0; - currenty = 0; + w = 0.0; + h = 0.0; + currentx = 0.0; + currenty = 0.0; centerx = 0; centery = 0; angle = 0; @@ -290,10 +290,10 @@ class test_monitor { this.active = false; this.start_x = 0; this.start_y = 0; - this.w = 0; - this.h = 0; - this.currentx = 0; - this.currenty = 0; + this.w = 0.0; + this.h = 0.0; + this.currentx = 0.0; + this.currenty = 0.0; this.centerx = 0; this.centery = 0; this.angle = 0; @@ -376,10 +376,10 @@ export default defineComponent({ const rx: number = item.currentx + item.w; if (wall_dom) { if (rx > wall_dom.offsetWidth) { - item.currentx = Math.round(wall_dom.offsetWidth - item.w) - return parseInt(item.currentx.toString()); + item.currentx = wall_dom.offsetWidth - item.w + return item.currentx; } else { - return item.currentx + return item.currentx; } } @@ -395,7 +395,7 @@ export default defineComponent({ const wall_dom = wall.value const item = test_monitor_wall.value[current_index.value] if (wall_dom) { - return Math.round(wall_dom.offsetWidth - item.w / 2) + return Math.floor(wall_dom.offsetWidth - item.w / 2) } }; const set_y = () => { @@ -405,10 +405,10 @@ export default defineComponent({ const ry: number = item.currenty + item.h; if (wall_dom) { if (ry > wall_dom.offsetHeight) { - item.currenty = Math.round(wall_dom.offsetHeight - item.h) - return parseInt(item.currenty.toString()); + item.currenty = wall_dom.offsetHeight - item.h + return item.currenty; } else { - return parseInt(item.currenty.toString()); + return item.currenty; } } }; @@ -423,7 +423,7 @@ export default defineComponent({ const wall_dom = wall.value const item = test_monitor_wall.value[current_index.value] if (wall_dom) { - return Math.round(wall_dom.offsetHeight - item.h / 2) + return Math.floor(wall_dom.offsetHeight - item.h / 2) } }; let Unchecked = ref(false); @@ -440,10 +440,10 @@ export default defineComponent({ item.w = item.InitialW * percenter.value; } item.active = true; - item.currentx = parseInt(rect.left.toString()) - item.currenty = parseInt(rect.top.toString()) - item.centerx = Math.round(item.currentx + item.w / 2) - item.centery = Math.round(item.currenty + item.h / 2) + item.currentx =rect.left + item.currenty = rect.top + item.centerx = Math.floor(item.currentx + item.w / 2) + item.centery = Math.floor(item.currenty + item.h / 2) if (Number.isNaN(rect.left || rect.left < 0)) { item.currentx = 0 } @@ -457,27 +457,57 @@ export default defineComponent({ } else if (wall_dom && rect.left > wall_dom.offsetWidth - item.w) { item.currentx = set_x() ?? 0; } else { - item.currentx = parseInt(rect.left.toString()) + item.currentx = rect.left } if (rect.top < 0) { item.currenty = 0 } else if (wall.value && rect.top > wall.value.offsetHeight - item.h) { item.currenty = set_y() ?? 0; } else { - item.currenty = parseInt(rect.top.toString()) + item.currenty = rect.top } item.centerx = Math.floor(item.currentx + item.w / 2) item.centery = Math.floor(item.currenty + item.h / 2) }; + const isexceed=(element:test_monitor)=>{ + // element.currentx / wall_dom.offsetWidth + const wall_dom = wall.value; + if(wall_dom){ + let tepx=element.currentx / wall_dom.offsetWidth; + let tepy=element.currenty / wall_dom.offsetWidth; + if(tepx<0){ + element.currentx=0; + }else if(tepx>1){ + element.currentx=wall_dom.offsetWidth; + + } + if(tepy<0){ + element.currenty=0; + }else if(tepy>1){ + element.currenty=wall_dom.offsetHeight; + + } + } + + return element; + }; let test_delete_flag = false; EventBus.getInstance().on(EventNamesDefine.WindowResize, () => { const wall_dom = wall.value if (wall_dom) { test_monitor_wall.value.forEach((element) => { + console.log(element.currentx+"111") element.InitialH = wall_dom.offsetHeight * element.resize; element.InitialW = wall_dom.offsetWidth * element.resize; element.h = element.InitialH * percenter.value; element.w = element.InitialW * percenter.value; + element.currentx=element.currentx*percenter.value; + element.currenty=element.currenty*percenter.value; + element.centerx = Math.floor(element.currentx + element.w / 2); + element.centery = Math.floor(element.currenty + element.h/ 2); + console.log(percenter.value+"222") + console.log(element.currentx*percenter.value+"222") + }) } }); @@ -499,27 +529,30 @@ export default defineComponent({ max_y, moveMonitor, moveingMonitor, + isexceed, 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; const wall_dom = wall.value + console.log(response) 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]) - item.currentx = Math.round(element.lt.x * wall_dom.offsetWidth); - item.currenty = Math.round(element.lt.y * wall_dom.offsetHeight); + item.currentx = element.lt.x * wall_dom.offsetWidth; + item.currenty = element.lt.y * wall_dom.offsetHeight; percenter.value = parseFloat((element.percenter).toString()); item.InitialH = element.initial_h; item.InitialW = element.initial_w; - item.h = parseInt((item.InitialH * percenter.value).toString()); - item.w = parseInt((item.InitialW * percenter.value).toString()); + 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 @@ -553,15 +586,20 @@ export default defineComponent({ loading.value = true; let client = GlobalData.getInstance().getCurrentClient(); const wall_dom = wall.value - if (client && wall_dom) { + const settings = await GlobalData.getInstance().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.col = parseInt((GlobalData.getInstance().applicationConfig?.wall_col ?? 2).toString()) // response?.config.col ?? 2; - cloud_monitor_list.row = parseInt((GlobalData.getInstance().applicationConfig?.wall_row ?? 2).toString()) // response?.config.row ?? 2; + cloud_monitor_list.col = parseInt((settings.wall_col).toString()) // response?.config.col ?? 2; + cloud_monitor_list.row =parseInt((settings.wall_row).toString()) // response?.config.row ?? 2; let tep_width = 0; test_monitor_wall.value.forEach((element, index) => { if (element.isShow) { + //处理缩放后超出 + // element=isexceed(element); + // console.log(wall_dom.offsetHeight) + console.log(element) cloud_monitor_list.windows.push({ index: element.id, lt: new PointF(element.currentx / wall_dom.offsetWidth, element.currenty / wall_dom.offsetHeight), @@ -570,10 +608,13 @@ export default defineComponent({ 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, }) } }); const setMagic = await client.setMagicWallConfig(cloud_monitor_list); + console.log(setMagic) $q.notify({ color: setMagic?.success ? "positive" : "negative", icon: setMagic?.success ? "done" : "warning", @@ -644,13 +685,13 @@ export default defineComponent({ item.h = item.InitialH * percenter.value; item.w = item.InitialW * percenter.value; if (item.currentx > wall_dom?.offsetWidth - item.w) { - item.currentx = Math.round(wall_dom?.offsetWidth - item.w) + item.currentx = wall_dom?.offsetWidth - item.w } if (item.currenty > wall_dom?.offsetHeight - item.h) { - item.currenty = Math.round(wall_dom?.offsetHeight - item.h) + item.currenty = wall_dom?.offsetHeight - item.h } - item.centerx = Math.round(item.currentx + item.w / 2); - item.centery = Math.round(item.currenty + item.h / 2); + item.centerx = Math.floor(item.currentx + item.w / 2); + item.centery = Math.floor(item.currenty + item.h / 2); } if (test_monitor_wall.value.indexOf(item) == -1) { test_monitor_wall.value.push(item); @@ -658,7 +699,6 @@ export default defineComponent({ } current_index.value = test_monitor_wall.value.length - 1 } - }, onDragEnter(e: DragEvent, index: string) { e.stopPropagation(); @@ -724,25 +764,38 @@ export default defineComponent({ center_x() { const wall_dom = wall.value const item = test_monitor_wall.value[current_index.value] - item.currentx = Math.round(item.centerx - item.w / 2); + item.currentx =item.centerx - item.w / 2; }, center_y() { const wall_dom = wall.value const item = test_monitor_wall.value[current_index.value] - item.currenty = Math.round(item.centery - item.h / 2); + item.currenty = item.centery - item.h / 2; }, changePercenter() { + const wall_dom = wall.value let tep = false; test_monitor_wall.value.forEach((element) => { element.w = element.InitialW * percenter.value; element.h = element.InitialH * percenter.value; - element.centerx = element.currentx + Math.floor(element.w / 2); - element.centery = element.currenty + Math.floor(element.h / 2); + const rx: number = element.currentx + element.w; + const ry:number=element.currenty + element.h; + + const wall_dom = wall.value; + + if(wall_dom){ + if (rx > wall_dom.offsetWidth) { + element.currentx = wall_dom.offsetWidth - element.w + } + if(ry>wall_dom.offsetHeight){ + element.currenty = wall_dom.offsetHeight - element.h + } + } + element.centerx = Math.floor(element.currentx +element.w / 2); + element.centery = Math.floor(element.currenty + element.h / 2); if (element.isShow) { tep = true; } }) - }, canel_active() { Unchecked.value = true; @@ -753,6 +806,11 @@ export default defineComponent({ }) } }, + changeAngle(){ + const wall_dom = wall.value + const item = test_monitor_wall.value[current_index.value] + console.log(item.currentx) + } }; }, }); diff --git a/src/entities/RectF.ts b/src/entities/RectF.ts index 8ef4b1a..72f8f6e 100644 --- a/src/entities/RectF.ts +++ b/src/entities/RectF.ts @@ -37,4 +37,6 @@ export class RotatedRectFWithIndex extends RotatedRectF{ percenter:number=0; initial_h:number=0; initial_w:number=0; + background_h:number=0; + background_w:number=0; }