From af4271c33954a112ed70ee52b633cf90ab08b2b5 Mon Sep 17 00:00:00 2001 From: fangxiang Date: Thu, 12 Aug 2021 08:28:52 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=BF=A1=E5=8F=B7=E6=BA=90?= =?UTF-8?q?=E5=A2=9E=E5=88=A0=E6=94=B9=E9=80=9A=E7=9F=A5=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/ClientConnection.ts | 15 +- src/common/EventBus.ts | 2 + src/components/SignalSourceDialog.vue | 32 ++--- src/entities/SignalSourceEntity.ts | 17 +++ src/entities/WSProtocol.ts | 32 +++++ src/pages/LeftToolBar.vue | 100 ++++++++++++- src/pages/WallPage.vue | 195 ++++++++++++-------------- src/store/index.ts | 103 +++++++++++++- 8 files changed, 366 insertions(+), 130 deletions(-) diff --git a/src/common/ClientConnection.ts b/src/common/ClientConnection.ts index 3383fde..4a1913d 100644 --- a/src/common/ClientConnection.ts +++ b/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, { - packet: packet, - data: ev.data, - }); + EventBus.getInstance().emit( + packet.flag == Protocol.PacketEntity.FLAG_NOTIFY + ? EventNamesDefine.NotifyMessage + : packet.flag == Protocol.PacketEntity.FLAG_RESPONSE + ? EventNamesDefine.ResponseMessage + : EventNamesDefine.UnKnow, + { + packet: packet, + data: ev.data, + } + ); } } } else { diff --git a/src/common/EventBus.ts b/src/common/EventBus.ts index 7538a1c..0d572ee 100644 --- a/src/common/EventBus.ts +++ b/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"; diff --git a/src/components/SignalSourceDialog.vue b/src/components/SignalSourceDialog.vue index 8fa542f..9a327f8 100644 --- a/src/components/SignalSourceDialog.vue +++ b/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) { diff --git a/src/entities/SignalSourceEntity.ts b/src/entities/SignalSourceEntity.ts index 4bb46f3..953adfc 100644 --- a/src/entities/SignalSourceEntity.ts +++ b/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 { diff --git a/src/entities/WSProtocol.ts b/src/entities/WSProtocol.ts index 26b7f02..b1cedcf 100644 --- a/src/entities/WSProtocol.ts +++ b/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(); + } } diff --git a/src/pages/LeftToolBar.vue b/src/pages/LeftToolBar.vue index 1091740..328c962 100644 --- a/src/pages/LeftToolBar.vue +++ b/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) { diff --git a/src/pages/WallPage.vue b/src/pages/WallPage.vue index ceecf94..c13abfa 100644 --- a/src/pages/WallPage.vue +++ b/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 }} - + />
{ try { - if ((response.packet.flag = Protocol.PacketEntity.FLAG_NOTIFY)) { - switch (response.packet.command) { - case Protocol.Commands.kCloseWindow: - { - const temp = JSON.parse(response.data); - if (temp && temp.window_id) { - $store.commit("removeWindow", { - window_id: temp.window_id, + switch (response.packet.command) { + case Protocol.Commands.kCloseWindow: + { + const temp = JSON.parse(response.data); + if (temp && temp.window_id) { + $store.commit("removeWindow", { + 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: - { - 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; - } + } + 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( diff --git a/src/store/index.ts b/src/store/index.ts index 6119b6b..7a9c781 100644 --- a/src/store/index.ts +++ b/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 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 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> = 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; + (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 = (parent.children).findIndex( + (item) => item && item.uuid == playload.uuid + ); + if (node_index != -1) { + (parent.children).splice(node_index, 1); + } + } + } + }, buildSignalSourceTree(state: StateInterface, playload?: any) { const buildGroup = ( parent: SignalSourceTreeItemEntity,