From 1f9111a89d80d71154f552eb16c2299bbb1179bc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=99=BD=E4=BA=86=E4=B8=AA=E7=99=BD?= <543593352@qq.com>
Date: Thu, 26 Dec 2024 10:25:54 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AF=BE=E5=A0=82=E5=B1=95=E7=A4=BA=EF=BC=9A?=
 =?UTF-8?q?=E7=94=BB=E5=B8=83=E6=8B=96=E9=80=89=E9=97=AE=E9=A2=98=E4=BF=AE?=
 =?UTF-8?q?=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/whiteboard/whiteboard.vue  | 66 ++++++++++---------
 1 file changed, 34 insertions(+), 32 deletions(-)

diff --git a/src/renderer/src/components/whiteboard/whiteboard.vue b/src/renderer/src/components/whiteboard/whiteboard.vue
index 029126d..c0e2d5a 100644
--- a/src/renderer/src/components/whiteboard/whiteboard.vue
+++ b/src/renderer/src/components/whiteboard/whiteboard.vue
@@ -1,6 +1,12 @@
 <template>
   <div class="whiteboart-container" :style="{ height: height + 'px' }">
-    <div class="canvasBox" ref="box" @mouseleave="handleMouseLeave" ></div>
+    <div class="canvasBox" ref="box" 
+      @mousedown="handleMouseDown"
+      @mousemove="handleMouseMove"
+      @mouseup="handleMouseUp"
+      @mouseleave="handleMouseLeave" 
+    
+    ></div>
 
     <div class="footerLeft" @click.stop
       :style="type == 'design' ? ['top: 10px', 'justify-content: space-between'] : ['bottom: 10px', 'justify-content: center']">
@@ -352,6 +358,10 @@ const currentType = ref('selection')
 
 // dom节点
 const box = ref(null)
+const  startX= ref(0)
+const  startY= ref(0) 
+const  endX= ref(0) 
+const  endY= ref(0) 
 
 // 应用实例
 let app = null
@@ -745,6 +755,7 @@ const init = () => {
   })
   // 监听元素激活事件
   app.on('activeElementChange', element => {
+    console.log('点击元素 监听 activeElementChange-----------', element)
     if (activeElement.value) {
       activeElement.value.off('elementRotateChange', onElementRotateChange)
     }
@@ -794,44 +805,35 @@ const init = () => {
   })
 }
 
+const isDragging = ref(false);
 /**
  * 课堂展示-鼠标离开白板监听事件：该事件是避免，选中状态，在其他地方点击、后退、删除等事件，会删除白板内选中的元素
  */
 const handleMouseLeave = () => {
   console.log('离开白板')
-  // 清除激活项
-  // app.cancelActiveElement()
+  // 清除激活项--点击事件的激活项
+  app.cancelActiveElement()
 
-  const rect = proxy.$refs.box.getBoundingClientRect();
-      const x = event.clientX - rect.left;
-      const y = event.clientY - rect.top;
-      const selectedShape = this.shapes.find(shape => {
-        return x >= shape.x && x <= shape.x + shape.width && y >= shape.y && y <= shape.y + shape.height;
-      });
-      if (selectedShape) {
-        console.log('选中的元素:', selectedShape);
-      }
- 
-  // 当前操作类型
-  // console.log("当前操作类型,默认 selection：", currentType.value)
-
-  // // 是否有 当前激活的元素？有则取消激活
-  // console.log("当前激活的元素：", activeElement.value)
-  // // if (activeElement.value) {
-  // //   console.log("取消激活")
-  // //   activeElement.value = null
-  // // }
-
-  // // // 是否有当前多选的元素？有则取消多选
-  // console.log("当前多选的元素：", selectedElements.value)
-  // if( selectedElements.value.length > 0) {
-  //   console.log("取消多选")
-  //   selectedElements.value = []
-  // }
-
-  // const canvas = box.value;
-  // canvas.blur(); // 失焦
+  // this.isDragging = false;
+  //     this.drawRectangle();
 };
+const handleMouseDown = (event) =>{
+  // this.isDragging = true;
+  // this.startX = event.clientX;
+  // this.startY = event.clientY;
+}
+const  handleMouseMove =(event)=> {
+  // if (this.isDragging) {
+  //   this.endX = event.clientX;
+  //   this.endY = event.clientY;
+  //   this.drawRectangle();
+  // }
+}
+const handleMouseUp = () =>{
+  // this.isDragging = false;
+  // this.drawRectangle();
+}
+
 
 // 暴露方法
 defineExpose({