修改魔墙背景为16：9

src/components/ControlPanelDialog.vue

@@ -127,12 +127,12 @@
               <q-card-section @dragenter="onDragEnter" @dragleave="onDragLeave" @dragover="onDragOver" @drop="onDrop"
                 style="max-height: 80vh; width: 55vw ; position: relative;">
                 <div class="text-h6 row">
-                  <div for="" class="col-1"> 缩放</div>
+                  <div for="" class="col-2"> {{ $t("resize") }}</div>
                   <q-slider class="col" style="font-size:0.7rem" v-model="percenter"
                     @update:model-value="changePercenter()" label :label-value="percenter" markers
                     switch-marker-labels-side label-always :min="0.1" :max="2" :step="0.1" />
                 </div>
-                <div style="position: absolute;  height: 85%; width: 95%; text-align: center;"
+                <div style="position: absolute;  height: 20.7vw; width: 36.8vw; text-align: center;"
                   :class="$store.state.power_state ? 'wall' : ''">
                   <div class="row" v-for="i in (64 / 8)" :key="i" style="height:12.5%;align-items: center;"
                     :class="(i % 2) == 0 ? 'wall_row' : ''">
@@ -142,7 +142,7 @@
                   </div>
                 </div>
                 <div ref="wall" v-if="$store.state.power_state"
-                  style="position: absolute;  height: 85%; width: 95%; overflow: hidden;" @click="canel_active()">
+                  style="position: absolute;  height: 20.7vw; width: 36.8vw;overflow: hidden;" @click="canel_active()">
                   <div v-for=" (item, index) of test_monitor_wall" @click.stop="Unchecked == false">
                     <vue3-resize-drag v-if="item.isShow" :w="item.w" :h="item.h" :x="item.currentx"
                       :y="item.currenty" :isActive="true" :isGuide="(true && item.angle == 0)"
@@ -496,18 +496,18 @@ export default defineComponent({
       const wall_dom = wall.value
       if (wall_dom) {
         test_monitor_wall.value.forEach((element) => {
-          console.log(element.currentx+"111")
+          let teph=element.InitialH;
+          let tepw=element.InitialW;
           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;
+          let sizeh=element.InitialH/teph;
-          element.currenty=element.currenty*percenter.value;
+          let sizew=element.InitialW/tepw;
+          element.currentx=element.currentx*sizew;
+          element.currenty=element.currenty*sizeh;
           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")
-
         })
       }
     });
@@ -779,9 +779,7 @@ export default defineComponent({
           element.h = element.InitialH * percenter.value;
           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
@@ -795,6 +793,9 @@ export default defineComponent({
           if (element.isShow) {
             tep = true;
           }
+          if(element.angle!=0){
+
+          }
         })
       },
       canel_active() {

src/i18n/en-US/index.ts

@@ -408,4 +408,5 @@ export default {
   "topology diagram":"Topology Diagram",
   "physical central location":"Central Location",
   "monitors list":"Monitors List",
+  "resize":"Resize"
 };

src/i18n/zh-CN/index.ts

@@ -677,4 +677,5 @@ export default {
   "Please input vaild host. example: 192.168.1.1 or 192.168.1.1:8080":
     "请输入合法地址. 例: 192.168.1.1 或 192.168.1.1:8080",
   "equipment data": "联动设备",
+  "resize":"缩放",
 };