添加信号源增删改通知功能

src/common/ClientConnection.ts

@@ -183,10 +183,17 @@ export default class ClientConnection {
                 this.rpc_map.delete(packet.rpc_id);
               }
             } else {
-              EventBus.getInstance().emit(EventNamesDefine.ResponseMessage, {
+              EventBus.getInstance().emit(
-                packet: packet,
+                packet.flag == Protocol.PacketEntity.FLAG_NOTIFY
-                data: ev.data,
+                  ? EventNamesDefine.NotifyMessage
-              });
+                  : packet.flag == Protocol.PacketEntity.FLAG_RESPONSE
+                  ? EventNamesDefine.ResponseMessage
+                  : EventNamesDefine.UnKnow,
+                {
+                  packet: packet,
+                  data: ev.data,
+                }
+              );
             }
           }
         } else {

src/common/EventBus.ts

@@ -17,10 +17,12 @@ export default class EventBus extends EventEmitter {
 }
 
 export namespace EventNamesDefine {
+  export const UnKnow = "onUnKnow";
   export const UnSelectAllWindows = "onUnSelectAllWindows";
   export const UnFocusAllWindows = "onUnFocusAllWindows";
   export const WindowResize = "onWindowResize";
   export const ResponseMessage = "onResponseData";
+  export const NotifyMessage = "onNotifyMessage";
   export const WebSocketClose = "onWebSocketClose";
   export const WebSocketError = "onWebSocketError";
   export const WebSocketConnected = "onWebSocketConnected";

src/components/SignalSourceDialog.vue

@@ -314,7 +314,7 @@ export default defineComponent({
         value: "EwindowType::Multimedia",
       },
       {
-        label: $t.t("web"),
+        label: $t.t("Web"),
         value: "EwindowType::Web",
       },
       {
@@ -350,23 +350,6 @@ export default defineComponent({
       }
     );
 
-    const setItemData = (new_item_data?: SignalSourceEntity) => {
-      if (!new_item_data) {
-        new_item_data = new SignalSourceEntity();
-      }
-
-      item_data.uuid = new_item_data.uuid;
-      item_data.base_note = new_item_data.base_note;
-      item_data.name = new_item_data.name;
-      item_data.window_type = new_item_data.window_type;
-      item_data.media_url = new_item_data.media_url;
-      item_data.user_name = new_item_data.user_name;
-      item_data.password = new_item_data.password;
-      item_data.ext_data = new_item_data.ext_data;
-      item_data.group_uuid = new_item_data.group_uuid;
-      item_data.system_default = new_item_data.system_default;
-    };
-
     const setMediaUrlLabel = (value: string) => {
       switch (value) {
         case "EwindowType::Web":
@@ -433,9 +416,16 @@ export default defineComponent({
         if (options) {
           type.value = options.type ?? 1;
           if (options.data && options.data.item_data) {
-            setItemData(JSON.parse(JSON.stringify(options.data.item_data)));
+            SignalSourceEntity.copy(
+              item_data,
+              JSON.parse(JSON.stringify(options.data.item_data))
+            );
+          }
+          if (type.value == 2) {
+            selected.value = item_data.group_uuid;
+          } else {
+            selected.value = options.parent_node ?? "";
           }
-          selected.value = item_data.group_uuid;
         }
         if (item_data) {
           setMediaUrlLabel(item_data.window_type);
@@ -445,7 +435,7 @@ export default defineComponent({
       resetData() {
         loading.value = false;
         selected.value = null;
-        setItemData();
+        SignalSourceEntity.copy(item_data);
         type.value = 1;
       },
       treeNodesFilter(node: any, filter: any) {

src/entities/SignalSourceEntity.ts

@@ -9,6 +9,23 @@ export class SignalSourceEntity extends BaseEntity {
   ext_data: string = "";
   group_uuid = "";
   system_default: boolean = false;
+
+  public static copy(dest: SignalSourceEntity, src?: SignalSourceEntity) {
+    if (!src) {
+      src = new SignalSourceEntity();
+    }
+
+    dest.uuid = src.uuid;
+    dest.base_note = src.base_note;
+    dest.name = src.name;
+    dest.window_type = src.window_type;
+    dest.media_url = src.media_url;
+    dest.user_name = src.user_name;
+    dest.password = src.password;
+    dest.ext_data = src.ext_data;
+    dest.group_uuid = src.group_uuid;
+    dest.system_default = src.system_default;
+  }
 }
 
 export class SignalSourceTreeItemEntity {

src/entities/WSProtocol.ts

@@ -446,4 +446,36 @@ export namespace Protocol {
       this.command = Protocol.Commands.kRpcDeleteSignalSource;
     }
   }
+
+  export class SignalSourceGroupEntity extends Protocol.PacketEntity {
+    parent_uuid: string = "";
+    name: string = "";
+    system_default: boolean = false;
+  }
+
+  export class SignalSourceAddNotifyEntity extends Protocol.PacketEntity {
+    signal_source: SignalSourceEntity = new SignalSourceEntity();
+  }
+
+  export class SignalSourceDeleteNotifyEntity extends Protocol.PacketEntity {
+    uuid: string = "";
+  }
+
+  export class SignalSourceEditNotifyEntity extends Protocol.PacketEntity {
+    signal_source: SignalSourceEntity = new SignalSourceEntity();
+  }
+
+  export class SignalSourceGroupAddNotifyEntity extends Protocol.PacketEntity {
+    signal_source_group: SignalSourceGroupEntity =
+      new SignalSourceGroupEntity();
+  }
+
+  export class SignalSourceGroupDeleteNotifyEntity extends Protocol.PacketEntity {
+    uuid: string = "";
+  }
+
+  export class SignalSourceGroupEditNotifyEntity extends Protocol.PacketEntity {
+    signal_source_group: SignalSourceGroupEntity =
+      new SignalSourceGroupEntity();
+  }
 }

src/pages/LeftToolBar.vue

@@ -131,6 +131,8 @@ import { Common } from "src/common/Common";
 import GlobalData from "src/common/GlobalData";
 import { useQuasar } from "quasar";
 import { useI18n } from "vue-i18n";
+import EventBus, { EventNamesDefine } from "src/common/EventBus";
+import { Protocol } from "src/entities/WSProtocol";
 
 export default defineComponent({
   name: "PageLeftToolBar",
@@ -156,8 +158,104 @@ export default defineComponent({
       tree.value?.setExpanded("", true);
     });
 
+    interface _ResponseMessage {
+      packet: Protocol.PacketEntity;
+      data: string;
+    }
+    EventBus.getInstance().on(
+      EventNamesDefine.NotifyMessage,
+      (response: _ResponseMessage) => {
+        if (response) {
+          switch (response.packet.command) {
+            case Protocol.Commands.kRpcAddSignalSource:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as Protocol.SignalSourceAddNotifyEntity;
+                if (temp) {
+                  GlobalData.getInstance().signal_source.push(
+                    temp.signal_source
+                  );
+                  $store.commit("addSignalSourceTreeItem", {
+                    parent: temp.signal_source.group_uuid,
+                    is_group: false,
+                    item_data: temp.signal_source,
+                  });
+                }
+              }
+              break;
+            case Protocol.Commands.kRpcDeleteSignalSource:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as Protocol.SignalSourceDeleteNotifyEntity;
+                if (temp) {
+                  $store.commit("deleteSignalSourceTreeItem", {
+                    is_group: false,
+                    uuid: temp.uuid,
+                  });
+                }
+              }
+              break;
+            case Protocol.Commands.kRpcEditSignalSource:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as Protocol.SignalSourceEditNotifyEntity;
+                if (temp) {
+                  $store.commit("setSignalSourceTreeItem", {
+                    is_group: false,
+                    item_data: temp.signal_source,
+                  });
+                }
+              }
+              break;
+            case Protocol.Commands.kRpcAddSignalSourceGroup:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as Protocol.SignalSourceGroupAddNotifyEntity;
+                if (temp) {
+                  $store.commit("addSignalSourceTreeItem", {
+                    parent: temp.signal_source_group.parent_uuid,
+                    is_group: true,
+                    item_data: temp.signal_source_group,
+                  });
+                }
+              }
+              break;
+            case Protocol.Commands.kRpcDeleteSignalSourceGroup:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as Protocol.SignalSourceGroupDeleteNotifyEntity;
+                if (temp) {
+                  $store.commit("deleteSignalSourceTreeItem", {
+                    is_group: true,
+                    uuid: temp.uuid,
+                  });
+                }
+              }
+              break;
+            case Protocol.Commands.kRpcEditSignalSourceGroup:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as Protocol.SignalSourceGroupEditNotifyEntity;
+                if (temp) {
+                  $store.commit("setSignalSourceTreeItem", {
+                    is_group: true,
+                    item_data: temp.signal_source_group,
+                  });
+                }
+              }
+              break;
+          }
+        }
+      }
+    );
+
     return {
-      est() {},
       tree,
       tree_nodes,
       loga(a: any) {

src/pages/WallPage.vue

@@ -29,10 +29,7 @@
           width: item.width / wall_width_scaler + 'px',
           height: item.height / wall_height_scaler + 'px',
         }"
-      >
+      />
-        {{ wall_height_scaler }}
-        {{ wall_width_scaler }}
-      </window>
     </div>
     <div ref="wall_grids" @click="onWallGridsClick">
       <div
@@ -248,107 +245,102 @@ export default defineComponent({
       data: string;
     }
     EventBus.getInstance().on(
-      EventNamesDefine.ResponseMessage,
+      EventNamesDefine.NotifyMessage,
       (response: _ResponseMessage) => {
         try {
-          if ((response.packet.flag = Protocol.PacketEntity.FLAG_NOTIFY)) {
+          switch (response.packet.command) {
-            switch (response.packet.command) {
+            case Protocol.Commands.kCloseWindow:
-              case Protocol.Commands.kCloseWindow:
+              {
-                {
+                const temp = JSON.parse(response.data);
-                  const temp = JSON.parse(response.data);
+                if (temp && temp.window_id) {
-                  if (temp && temp.window_id) {
+                  $store.commit("removeWindow", {
-                    $store.commit("removeWindow", {
+                    window_id: temp.window_id,
-                      window_id: temp.window_id,
+                  });
+                }
+              }
+              break;
+            case Protocol.Commands.kMoveWindow:
+              {
+                const temp = JSON.parse(response.data);
+                if (temp && temp.window_id) {
+                  const window = $store.state.windows.find(
+                    (item) => item.window_id == temp.window_id
+                  );
+                  if (window) {
+                    $store.commit("setWindowPropertys", [
+                      {
+                        window,
+                        property_name: "x",
+                        value: temp.x ?? 0,
+                      },
+                      {
+                        window,
+                        property_name: "y",
+                        value: temp.y ?? 0,
+                      },
+                    ]);
+                  }
+                }
+              }
+              break;
+            case Protocol.Commands.kResizeWindow:
+              {
+                const temp = JSON.parse(response.data);
+                if (temp && temp.window_id) {
+                  const window = $store.state.windows.find(
+                    (item) => item.window_id == temp.window_id
+                  );
+                  if (window) {
+                    $store.commit("setWindowPropertys", [
+                      {
+                        window,
+                        property_name: "width",
+                        value: temp.width ?? 0,
+                      },
+                      {
+                        window,
+                        property_name: "height",
+                        value: temp.height ?? 0,
+                      },
+                    ]);
+                  }
+                }
+              }
+              break;
+            case Protocol.Commands.kOpenWindow:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as WindowOpenNotifyEntity;
+                if (temp) {
+                  $store.commit("pushWindow", temp);
+                }
+              }
+              break;
+            case Protocol.Commands.kWindowOtherStateChanged:
+              {
+                const temp = JSON.parse(
+                  response.data
+                ) as WindowOtherStateChangeNotifyEntity;
+                if (temp && temp.window_id) {
+                  const window = $store.state.windows.find(
+                    (item) => item.window_id == temp.window_id
+                  );
+                  if (window) {
+                    window.window_state; //
+                    $store.commit("setWindowProperty", {
+                      window,
+                      property_name: "window_state",
+                      value: new WindowStates(
+                        temp.playing,
+                        temp.focus,
+                        temp.muted
+                      ),
                     });
                   }
                 }
-                break;
+              }
-              case Protocol.Commands.kMoveWindow:
+              break;
-                {
-                  const temp = JSON.parse(response.data);
-                  if (temp && temp.window_id) {
-                    const window = $store.state.windows.find(
-                      (item) => item.window_id == temp.window_id
-                    );
-                    if (window) {
-                      $store.commit("setWindowPropertys", [
-                        {
-                          window,
-                          property_name: "x",
-                          value: temp.x ?? 0,
-                        },
-                        {
-                          window,
-                          property_name: "y",
-                          value: temp.y ?? 0,
-                        },
-                      ]);
-                    }
-                  }
-                }
-                break;
-              case Protocol.Commands.kResizeWindow:
-                {
-                  const temp = JSON.parse(response.data);
-                  if (temp && temp.window_id) {
-                    const window = $store.state.windows.find(
-                      (item) => item.window_id == temp.window_id
-                    );
-                    if (window) {
-                      $store.commit("setWindowPropertys", [
-                        {
-                          window,
-                          property_name: "width",
-                          value: temp.width ?? 0,
-                        },
-                        {
-                          window,
-                          property_name: "height",
-                          value: temp.height ?? 0,
-                        },
-                      ]);
-                    }
-                  }
-                }
-                break;
-              case Protocol.Commands.kOpenWindow:
-                {
-                  const temp = JSON.parse(
-                    response.data
-                  ) as WindowOpenNotifyEntity;
-                  if (temp) {
-                    $store.commit("pushWindow", temp);
-                  }
-                }
-                break;
-              case Protocol.Commands.kWindowOtherStateChanged:
-                {
-                  const temp = JSON.parse(
-                    response.data
-                  ) as WindowOtherStateChangeNotifyEntity;
-                  if (temp && temp.window_id) {
-                    const window = $store.state.windows.find(
-                      (item) => item.window_id == temp.window_id
-                    );
-                    if (window) {
-                      window.window_state; //
-                      $store.commit("setWindowProperty", {
-                        window,
-                        property_name: "window_state",
-                        value: new WindowStates(
-                          temp.playing,
-                          temp.focus,
-                          temp.muted
-                        ),
-                      });
-                    }
-                  }
-                }
-                break;
-              default:
-                console.log(response.packet);
-                break;
-            }
           }
         } catch {}
       }
@@ -393,7 +385,6 @@ export default defineComponent({
         }
 
         let uuid = e.dataTransfer?.getData("uuid");
-        console.log(uuid);
         if (uuid) {
           let signal_sources = GlobalData.getInstance().signal_source.filter(
             (item) => (item as any)?.uuid == uuid
@@ -405,8 +396,6 @@ export default defineComponent({
               let dom: HTMLElement | null = e.target as HTMLElement;
               if (wall.value && dom) {
                 if (dom.classList.contains("wall_item_flag")) {
-                  console.log(wall.value.offsetTop);
-                  console.log(wall.value.offsetLeft);
                   GlobalData.getInstance()
                     .getCurrentClient()
                     ?.openWindow(

src/store/index.ts

@@ -1,6 +1,9 @@
 import { store } from "quasar/wrappers";
 import { WindowOpenNotifyEntity } from "src/entities/MultimediaWindowEntity";
-import { SignalSourceTreeItemEntity } from "src/entities/SignalSourceEntity";
+import {
+  SignalSourceEntity,
+  SignalSourceTreeItemEntity,
+} from "src/entities/SignalSourceEntity";
 import { InjectionKey, reactive } from "vue";
 import {
   createStore,
@@ -40,6 +43,42 @@ declare module "@vue/runtime-core" {
   }
 }
 
+class _TreeHelper {
+  public static findNode(node: any, key: string, value: string): any {
+    if (node && node.children && key && value != null && value != undefined) {
+      if (node[key] == value) {
+        return node;
+      }
+
+      for (let child of <any[]>node.children) {
+        if (child && child[key] == value) {
+          return child;
+        } else {
+          let _r = _TreeHelper.findNode(child, key, value);
+          if (_r) {
+            return _r;
+          }
+        }
+      }
+    }
+  }
+
+  public static findNodeParent(node: any, key: string, value: string): any {
+    if (node && node.children && key && value != null && value != undefined) {
+      for (let child of <any[]>node.children) {
+        if (child && child[key] == value) {
+          return node;
+        } else {
+          let _r = _TreeHelper.findNodeParent(child, key, value);
+          if (_r) {
+            return _r;
+          }
+        }
+      }
+    }
+  }
+}
+
 // provide typings for `useStore` helper
 export const storeKey: InjectionKey<VuexStore<StateInterface>> =
   Symbol("vuex-key");
@@ -169,6 +208,68 @@ export default store(function (/* { ssrContext } */) {
           state.signal_source_tree.push(playload);
         }
       },
+      addSignalSourceTreeItem(state: StateInterface, playload?: any) {
+        if (playload) {
+          const parent = playload.parent ?? "";
+          const is_group = playload.is_group ?? false;
+          let item_data = playload.item_data ?? new SignalSourceEntity();
+          let node = _TreeHelper.findNode(
+            state.signal_source_tree[0],
+            "uuid",
+            item_data.uuid
+          );
+          if (node) {
+            return;
+          }
+
+          node = _TreeHelper.findNode(
+            state.signal_source_tree[0],
+            "uuid",
+            parent
+          );
+          if (node) {
+            const node_item = new SignalSourceTreeItemEntity(
+              item_data.uuid,
+              parent,
+              item_data.name,
+              is_group
+            );
+            node_item.item_data = item_data;
+            (<any[]>node.children).push(node_item);
+          }
+        }
+      },
+      setSignalSourceTreeItem(state: StateInterface, playload?: any) {
+        if (playload) {
+          let item_data = playload.item_data ?? new SignalSourceEntity();
+          let node = _TreeHelper.findNode(
+            state.signal_source_tree[0],
+            "uuid",
+            item_data.uuid
+          );
+          if (node) {
+            SignalSourceEntity.copy(node.item_data, item_data);
+            node.name = item_data.name;
+          }
+        }
+      },
+      deleteSignalSourceTreeItem(state: StateInterface, playload?: any) {
+        if (playload && playload.uuid) {
+          let parent = _TreeHelper.findNodeParent(
+            state.signal_source_tree[0],
+            "uuid",
+            playload.uuid
+          );
+          if (parent) {
+            let node_index = (<any[]>parent.children).findIndex(
+              (item) => item && item.uuid == playload.uuid
+            );
+            if (node_index != -1) {
+              (<any[]>parent.children).splice(node_index, 1);
+            }
+          }
+        }
+      },
       buildSignalSourceTree(state: StateInterface, playload?: any) {
         const buildGroup = (
           parent: SignalSourceTreeItemEntity,