From ba04ab3f70b02d336857178ebb273bd0da3898a7 Mon Sep 17 00:00:00 2001 From: fangxiang Date: Thu, 28 Apr 2022 15:48:10 +0800 Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E6=8C=89ALT=E9=94=AE?= =?UTF-8?q?=E6=8B=96=E6=8B=BD=E4=BF=A1=E5=8F=B7=E6=BA=90=E8=87=AA=E5=AE=9A?= =?UTF-8?q?=E4=B9=89=E7=9F=A9=E5=BD=A2=E5=BC=80=E7=AA=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/WallPage.vue | 243 +++++++++++++++++++++++------------------ 1 file changed, 136 insertions(+), 107 deletions(-) diff --git a/src/pages/WallPage.vue b/src/pages/WallPage.vue index b766af9..3a3831f 100644 --- a/src/pages/WallPage.vue +++ b/src/pages/WallPage.vue @@ -701,9 +701,40 @@ export default defineComponent({ loga(a: any) { console.log(a); }, - onDrop(e: DragEvent) { + async onDrop(e: DragEvent) { e.preventDefault(); let target = e.target as any; + + // 有可能是窗口的子节点收到了拖拽信息，需要找到真正的窗口节点来判断 + const find_parent_dom = (dom: HTMLElement, classess: string[]) => { + let parent: HTMLElement | null = dom; + while (parent) { + if (parent) { + for (const clazz of classess) { + if (clazz) { + if (parent.classList.contains(clazz)) { + return parent; + } + } + } + parent = parent.parentElement; + } else { + break; + } + } + return parent; + }; + + if (target) { + const temp = find_parent_dom(target, [ + "wall_item_flag", + "window_flag", + ]); + if (temp) { + target = temp; + } + } + if (target) { target.classList.remove("drag-enter"); } @@ -726,8 +757,19 @@ export default defineComponent({ ); { - const dom_element: HTMLElement | null = e.target as HTMLElement; + const dom_element: HTMLElement | null = target as HTMLElement; if (wall.value && dom_element) { + let x = 0; + let y = 0; + let width = 0; + let height = 0; + let muted = true; + let volume = 20; + let paused = false; + let play_speed = 1; + let find_flag = false; + let find_window = 0; + if (dom_element.classList.contains("wall_item_flag")) { // 开窗 const cell_width = 1 / $store.state.wall_col; @@ -747,44 +789,10 @@ export default defineComponent({ } } catch {} - const x = col * cell_width; - const y = row * cell_height; - const width = cell_width; - const height = cell_height; - - switch (type) { - case "polling": - GlobalData.getInstance() - .getCurrentClient() - ?.openPolling( - new Protocol.OpenPollingRequestEntity( - uuid, - x, - y, - width, - height - ) - ); - break; - case "signal_source" /**OpenPollingRequestEntity */: - if (signal_sources.length) { - const signal_source = signal_sources[0]; - if (signal_source) { - GlobalData.getInstance() - .getCurrentClient() - ?.openWindow( - new Protocol.OpenWindowRequestEntity( - signal_source.uuid, - x, - y, - width, - height - ) - ); - } - } - break; - } + x = col * cell_width; + y = row * cell_height; + width = cell_width; + height = cell_height; } else if (dom_element.classList.contains("window_flag")) { // 拖拽信号源替换窗口 后面还有一处替换窗口 const rep_uuid = dom_element.getAttribute("uuid"); @@ -793,15 +801,60 @@ export default defineComponent({ (item) => item.uuid == rep_uuid ); if (window) { - let client = GlobalData.getInstance().getCurrentClient(); - if (client) { - let x = window.x; - let y = window.y; - let width = window.width; - let height = window.height; + x = window.x; + y = window.y; + width = window.width; + height = window.height; + muted = window.muted; + volume = window.volume; + paused = window.paused; + play_speed = window.play_speed; + find_window = window.window_id; + find_flag = true; + } + } + } - client.closeWindow(window.window_id); - const open_window_request = + if (e.altKey) { + if (window_rect_edit_dialog.value) { + try { + const result = + await window_rect_edit_dialog.value.showDialogAsync( + x * $store.state.device_screen_width, + y * $store.state.device_screen_height, + width * $store.state.device_screen_width, + height * $store.state.device_screen_height + ); + if (result) { + x = result.x / $store.state.device_screen_width; + y = result.y / $store.state.device_screen_height; + width = result.width / $store.state.device_screen_width; + height = + result.height / $store.state.device_screen_height; + } else { + // 点击了取消按钮 + return; + } + } catch { + return; + } + } + } + + if (find_flag) { + GlobalData.getInstance() + .getCurrentClient() + ?.closeWindow(find_window); + } + + setTimeout(() => { + if (!window) { + return; + } + switch (type) { + case "polling": + { + const open_polling_request = new Protocol.OpenPollingRequestEntity( uuid, x, @@ -809,67 +862,43 @@ export default defineComponent({ width, height ); - open_window_request.muted = window.muted; - open_window_request.volume = window.volume; - open_window_request.paused = window.paused; - open_window_request.play_speed = window.play_speed; - - setTimeout(() => { - if (!window) { - return; - } - switch (type) { - case "polling": - { - const open_polling_request = - new Protocol.OpenPollingRequestEntity( - uuid, - x, - y, - width, - height - ); - open_polling_request.muted = window.muted; - open_polling_request.volume = window.volume; - open_polling_request.paused = window.paused; - open_polling_request.play_speed = - window.play_speed; - GlobalData.getInstance() - .getCurrentClient() - ?.openPolling(open_polling_request); - } - - break; - case "signal_source": - { - const open_window_request = - new Protocol.OpenWindowRequestEntity( - uuid, - x, - y, - width, - height - ); - open_window_request.muted = window.muted; - open_window_request.volume = window.volume; - open_window_request.paused = window.paused; - open_window_request.play_speed = - window.play_speed; - if (signal_sources.length) { - const signal_source = signal_sources[0]; - if (signal_source) { - client?.openWindow(open_window_request); - } - } - } - - break; - } - }, 50); + open_polling_request.muted = muted; + open_polling_request.volume = volume; + open_polling_request.paused = paused; + open_polling_request.play_speed = play_speed; + GlobalData.getInstance() + .getCurrentClient() + ?.openPolling(open_polling_request); } - } + + break; + case "signal_source": + { + const open_window_request = + new Protocol.OpenWindowRequestEntity( + uuid, + x, + y, + width, + height + ); + open_window_request.muted = muted; + open_window_request.volume = volume; + open_window_request.paused = paused; + open_window_request.play_speed = play_speed; + if (signal_sources.length) { + const signal_source = signal_sources[0]; + if (signal_source) { + GlobalData.getInstance() + .getCurrentClient() + ?.openWindow(open_window_request); + } + } + } + + break; } - } + }, 50); } } }