修改窗口大小对话框改成数据即时发送

src/components/Window.vue

@@ -46,7 +46,6 @@
         <q-item
           clickable
           v-close-popup
-          v-if="$store.state.isLedPlayer()"
           :disable="$props.disable"
           @click="$emit('edit_rect', $props.window.window_id)"
         >

src/components/WindowRectEditDialog.vue

@@ -83,6 +83,7 @@
                           parseInt(val) >= 0 ||
                           $t('the number must be greater than 0'),
                       ]"
+                      @update:model-value="onXChanged"
                       lazy-rules
                     >
                       <template v-slot:append>
@@ -103,6 +104,7 @@
                       type="number"
                       min="0"
                       v-model="window_rect.y"
+                      @update:model-value="onYChanged"
                       :rules="[
                         (val) =>
                           (val != null &&
@@ -133,6 +135,7 @@
                     <q-input
                       type="number"
                       min="1"
+                      @update:model-value="onWidthChanged"
                       v-model="window_rect.width"
                       :rules="[
                         (val) =>
@@ -163,6 +166,7 @@
                     <q-input
                       type="number"
                       min="1"
+                      @update:model-value="onHeightChanged"
                       v-model="window_rect.height"
                       :rules="[
                         (val) =>
@@ -191,14 +195,25 @@
 
         <q-card-actions align="right">
           <q-btn
+            v-if="mod == 'sync'"
             :loading="loading"
             flat
-            :label="$t('Cancel')"
+            :label="$t('Revert')"
+            no-caps
+            color="primary"
+            @click="revertWindowRect"
+          />
+          <q-btn
+            :loading="loading"
+            flat
+            :label="$t('Close')"
             no-caps
             color="primary"
             v-close-popup
           />
+
           <q-btn
+            v-if="mod == 'async'"
             ref="accept"
             flat
             :label="$t('Accept')"
@@ -268,8 +283,34 @@ export default defineComponent({
         this.width = parseInt(<any>this.width);
         this.height = parseInt(<any>this.height);
       },
+
+      getRealRect: function (screen_height: number, screen_width: number) {
+        const result = {
+          x: this.x,
+          y: this.y,
+          width: this.width,
+          height: this.height,
+        };
+
+        result.x /= screen_width;
+        result.y /= screen_height;
+        result.width /= screen_width;
+        result.height /= screen_height;
+        return result;
+      },
     });
 
+    let back_window_rect = {
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0,
+    };
+
+    // async 为异步模式,不发送窗口指令,只返回坐标
+    // sync 为同步模式,坐标修改后直接发送窗口指令,不返回任何数据
+    const mod = ref("async"); // sync
+
     let _resolve: any = null;
     let _reject: any = null;
 
@@ -285,15 +326,69 @@ export default defineComponent({
       } catch {}
     };
 
+    let current_window_id = 0;
+
+    const sendSetWindowGeometryMessage = () => {
+      if (mod.value == "async") {
+        return;
+      }
+      const rect = window_rect.getRealRect(
+        screen_height.value,
+        screen_width.value
+      );
+      GlobalData.getInstance()
+        .getCurrentClient()
+        ?.setWindowGeometry(
+          current_window_id,
+          rect.x,
+          rect.y,
+          rect.width,
+          rect.height
+        );
+    };
+
     return {
       show_dialog,
       loading,
       window_rect,
       screen_height,
       screen_width,
+      mod,
 
-      showDialog() {
+      showDialog(window_id: number) {
-        throw "please use showDialogAsync function";
+        const window = $store.state.windows.find(
+          (e) => e && e.window_id == window_id
+        );
+        if (window) {
+          screen_width.value = $store.state.device_screen_width;
+          screen_height.value = $store.state.device_screen_height;
+
+          if ($store.state.isSpecialVideo()) {
+            const screen_info = SpecialVideoHelper.getScreenInfo(
+              $store.state.wall_col,
+              $store.state.wall_row
+            );
+            screen_width.value = screen_info.screen_width;
+            screen_height.value = screen_info.screen_height;
+          }
+
+          window_rect.clean();
+          window_rect.x = Math.round(window.x * screen_width.value);
+          window_rect.y = Math.round(window.y * screen_height.value);
+          window_rect.width = Math.round(window.width * screen_width.value);
+          window_rect.height = Math.round(window.height * screen_height.value);
+          back_window_rect.x = window_rect.x;
+          back_window_rect.y = window_rect.y;
+          back_window_rect.width = window_rect.width;
+          back_window_rect.height = window_rect.height;
+
+          current_window_id = window_id;
+
+          mod.value = "sync";
+          show_dialog.value = true;
+        } else {
+          console.error("can't find window.", window_id);
+        }
       },
       showDialogAsync(x: number, y: number, width: number, height: number) {
         return new Promise((resolve, reject) => {
@@ -320,12 +415,17 @@ export default defineComponent({
           _resolve = resolve;
           _reject = reject;
 
+          mod.value = "async";
           show_dialog.value = true;
         });
       },
       resetData() {
         show_dialog.value = false;
         loading.value = false;
+
+        current_window_id = 0;
+        back_window_rect = { x: 0, y: 0, height: 0, width: 0 };
+
         if (_reject) {
           try {
             _reject(null);
@@ -379,6 +479,25 @@ export default defineComponent({
           resolve_data();
         }
       },
+      revertWindowRect() {
+        window_rect.x = back_window_rect.x;
+        window_rect.y = back_window_rect.y;
+        window_rect.width = back_window_rect.width;
+        window_rect.height = back_window_rect.height;
+        sendSetWindowGeometryMessage();
+      },
+      onHeightChanged(value: number) {
+        sendSetWindowGeometryMessage();
+      },
+      onWidthChanged(value: number) {
+        sendSetWindowGeometryMessage();
+      },
+      onXChanged(value: number) {
+        sendSetWindowGeometryMessage();
+      },
+      onYChanged(value: number) {
+        sendSetWindowGeometryMessage();
+      },
     };
   },
 });

src/pad/ContentWall.vue

@@ -891,30 +891,7 @@ export default defineComponent({
       },
       async editRect(window_id: number) {
         if (window_rect_edit_dialog.value) {
-          try {
+          window_rect_edit_dialog.value.showDialog(window_id);
-            const window = $store.state.windows.find(
-              (element) => element && element.window_id == window_id
-            );
-            if (window) {
-              const result =
-                await window_rect_edit_dialog.value.showDialogAsync(
-                  window.x * $store.state.device_screen_width,
-                  window.y * $store.state.device_screen_height,
-                  window.width * $store.state.device_screen_width,
-                  window.height * $store.state.device_screen_height
-                );
-              if (result) {
-                let { x, y, width, height } = result;
-                x /= $store.state.device_screen_width;
-                y /= $store.state.device_screen_height;
-                width /= $store.state.device_screen_width;
-                height /= $store.state.device_screen_height;
-                GlobalData.getInstance()
-                  .getCurrentClient()
-                  ?.setWindowGeometry(window_id, x, y, width, height);
-              }
-            }
-          } catch {}
         }
       },
       topWindow(window_id: number) {

src/pad/TopToolbar.vue

@@ -468,24 +468,7 @@ export default defineComponent({
                 element && element.uuid == $store.state.selected_window
             );
             if (window) {
-              const result =
+              window_rect_edit_dialog.value.showDialog(window.window_id);
-                await window_rect_edit_dialog.value.showDialogAsync(
-                  window.x * $store.state.device_screen_width,
-                  window.y * $store.state.device_screen_height,
-                  window.width * $store.state.device_screen_width,
-                  window.height * $store.state.device_screen_height
-                );
-              if (result) {
-                let { x, y, width, height } = result;
-
-                x /= $store.state.device_screen_width;
-                y /= $store.state.device_screen_height;
-                width /= $store.state.device_screen_width;
-                height /= $store.state.device_screen_height;
-                GlobalData.getInstance()
-                  .getCurrentClient()
-                  ?.setWindowGeometry(window.window_id, x, y, width, height);
-              }
             }
           } catch {}
         }

src/pages/TopToolBar.vue

@@ -151,7 +151,6 @@
       />
 
       <q-btn
-        v-if="$store.state.isLedPlayer()"
         stretch
         no-caps
         flat
@@ -796,24 +795,7 @@ export default defineComponent({
                 element && element.uuid == $store.state.selected_window
             );
             if (window) {
-              const result =
+              window_rect_edit_dialog.value.showDialog(window.window_id);
-                await window_rect_edit_dialog.value.showDialogAsync(
-                  window.x * $store.state.device_screen_width,
-                  window.y * $store.state.device_screen_height,
-                  window.width * $store.state.device_screen_width,
-                  window.height * $store.state.device_screen_height
-                );
-              if (result) {
-                let { x, y, width, height } = result;
-
-                x /= $store.state.device_screen_width;
-                y /= $store.state.device_screen_height;
-                width /= $store.state.device_screen_width;
-                height /= $store.state.device_screen_height;
-                GlobalData.getInstance()
-                  .getCurrentClient()
-                  ?.setWindowGeometry(window.window_id, x, y, width, height);
-              }
             }
           } catch {}
         }

src/pages/WallPage.vue

@@ -1077,31 +1077,7 @@ export default defineComponent({
       },
       async editRect(window_id: number) {
         if (window_rect_edit_dialog.value) {
-          try {
+          window_rect_edit_dialog.value.showDialog(window_id);
-            const window = $store.state.windows.find(
-              (element) => element && element.window_id == window_id
-            );
-            if (window) {
-              const result =
-                await window_rect_edit_dialog.value.showDialogAsync(
-                  window.x * $store.state.device_screen_width,
-                  window.y * $store.state.device_screen_height,
-                  window.width * $store.state.device_screen_width,
-                  window.height * $store.state.device_screen_height
-                );
-              if (result) {
-                let { x, y, width, height } = result;
-
-                x /= $store.state.device_screen_width;
-                y /= $store.state.device_screen_height;
-                width /= $store.state.device_screen_width;
-                height /= $store.state.device_screen_height;
-                GlobalData.getInstance()
-                  .getCurrentClient()
-                  ?.setWindowGeometry(window_id, x, y, width, height);
-              }
-            }
-          } catch {}
         }
       },
       async polling_setting(window_id: number) {