魔墙：恢复按钮以及实时更新

2023-01-03 15:00:54 +08:00 · 2023-01-03 15:00:54 +08:00 · 4ecd2ab89d
parent c21585bdba
commit 4ecd2ab89d
1 changed files with 118 additions and 39 deletions
--- a/src/components/ControlPanelDialog.vue
+++ b/src/components/ControlPanelDialog.vue
@ -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;
@ -722,7 +768,9 @@ export default defineComponent({
              item.currentx + item.w / 2 - (maxx - wall_dom.offsetWidth)
            );
          } else {
-            return Math.floor(item.currentx + item.w / 2 - (maxx - wall_dom.offsetWidth));
+            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,6 +1284,7 @@ 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];
@ -1239,7 +1297,7 @@ export default defineComponent({
              if (tep_item.centerx > min) {
                if (minx > tep_item.centerx && tep_item.angle != 0) {
                  minx = tep_item.centerx;
-                    current_index.value=element
+                  current_index.value = element;
                }
                tep_item.currentx--;
                tep_item.centerx--;
@ -1253,6 +1311,7 @@ export default defineComponent({
            item.centerx--;
          }
        }
+        realtime_upload();
      },
      sub_y() {
        let item = test_monitor_wall.value[current_index.value];
@ -1265,7 +1324,7 @@ export default defineComponent({
              if (tep_item.centery > min) {
                if (miny > tep_item.centery) {
                  miny = tep_item.centery;
-                    current_index.value=element
+                  current_index.value = element;
                }
                tep_item.currenty--;
                tep_item.centery--;
@ -1279,6 +1338,7 @@ export default defineComponent({
            item.centery--;
          }
        }
+        realtime_upload();
      },
      add_x() {
        let item = test_monitor_wall.value[current_index.value];
@ -1292,7 +1352,7 @@ export default defineComponent({
              if (tep_item.centerx < max) {
                if (maxx < tep_item.centerx && tep_item.angle != 0) {
                  maxx = tep_item.centerx;
-                    current_index.value=element
+                  current_index.value = element;
                }
                tep_item.currentx++;
                tep_item.centerx++;
@ -1306,6 +1366,7 @@ export default defineComponent({
            item.centerx++;
          }
        }
+        realtime_upload();
      },
      add_y() {
        let item = test_monitor_wall.value[current_index.value];
@ -1318,7 +1379,7 @@ export default defineComponent({
              if (tep_item.centery < max) {
                if (maxy < tep_item.centery && tep_item.angle != 0) {
                  maxy = tep_item.centery;
-                    current_index.value=element
+                  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();
      },
    };
  },