From 1b7ee0ada73ee0bc3fe6ff060646b17c9ad8370a Mon Sep 17 00:00:00 2001
From: danshihao <danshihao@syxysoft.com>
Date: Thu, 26 Sep 2024 12:17:54 +0800
Subject: [PATCH] =?UTF-8?q?[update=2090328]=20=E6=8B=86=E5=88=86=E6=8B=96?=
 =?UTF-8?q?=E6=8B=BD=EF=BC=8C=E4=BC=98=E5=8C=96=E6=8B=96=E6=8B=BD=E6=80=A7?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../documentSplit/DocumentSplitDetail.vue     | 19 ++++++++++++-------
 .../modules/SplitTreeOrderModal.vue           | 14 +++++++-------
 2 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/src/views/documentTool/documentSplit/DocumentSplitDetail.vue b/src/views/documentTool/documentSplit/DocumentSplitDetail.vue
index 962ec80..c31e60a 100644
--- a/src/views/documentTool/documentSplit/DocumentSplitDetail.vue
+++ b/src/views/documentTool/documentSplit/DocumentSplitDetail.vue
@@ -20,11 +20,9 @@
                     @dragstart="changeDraggingStatus(true)"
                     @dragend="changeDraggingStatus(false)"
                     @drop="onDrop">
-              <template #title="record">
-                <div class="tree-operate-node"
-                     @mouseenter="handleTreeMouseover(record.id)"
-                     @mouseleave="handleTreeMouseout(record.id)"
-                     @click="handleSelectTreeNode(record)">
+              <!-- 拖拽期间插槽频繁触发执行，导致卡顿，拖拽期间只显示节点名 -->
+              <template #title="record" v-if="!dragging">
+                <div class="tree-operate-node" @click="handleSelectTreeNode(record)">
                   <a-icon class="parent-node-icon"
                           type="folder"
                           v-if="record.dataRef.children && record.dataRef.children.length > 0" />
@@ -36,8 +34,7 @@
                     <span class="tree-node-custom-title">{{ record.name }} {{ record.itemName }}</span>
                   </a-tooltip>
                   <span class="tree-node-custom-title" v-else>{{ record.name }} {{ record.itemName }}</span>
-                  <div class="tree-operate-node-btn-box"
-                       :class="{'tree-operate-node-btn-box-hide': record.id !== mouseInNodeKey}">
+                  <div class="tree-operate-node-btn-box tree-operate-node-btn-box-hide" v-if="!dragging">
                     <!--新增-->
                     <a-button icon="plus"
                               class="tree-operate-node-btn"
@@ -74,6 +71,9 @@
                   </div>
                 </div>
               </template>
+              <template v-else>
+                <span class="tree-node-custom-title">{{ record.name }} {{ record.itemName }}</span>
+              </template>
             </a-tree>
           </a-spin>
         </div>
@@ -883,4 +883,9 @@ export default {
   font-size: 16px;
   margin-right: 10px;
 }
+// 鼠标滑动到节点，显示操作按钮
+.tree-node-custom-title:hover + .tree-operate-node-btn-box-hide {
+  opacity: 1;
+  pointer-events: auto;
+}
 </style>
diff --git a/src/views/documentTool/documentSplit/modules/SplitTreeOrderModal.vue b/src/views/documentTool/documentSplit/modules/SplitTreeOrderModal.vue
index ba62cf8..78ec106 100644
--- a/src/views/documentTool/documentSplit/modules/SplitTreeOrderModal.vue
+++ b/src/views/documentTool/documentSplit/modules/SplitTreeOrderModal.vue
@@ -29,21 +29,21 @@
               @dragstart="changeDraggingStatus(true)"
               @dragend="changeDraggingStatus(false)"
               @drop="onDrop">
-        <template #title="record">
+        <!-- 拖拽期间插槽频繁触发执行，导致卡顿，拖拽期间只显示节点名 -->
+        <template #title="record" v-if="!dragging">
           <div class="tree-operate-node">
             <a-icon class="parent-node-icon"
                     type="folder"
                     v-if="record.dataRef.children && record.dataRef.children.length > 0" />
-            <!-- 拖拽中不显示 -->
-            <a-tooltip placement="topLeft" v-if="!dragging">
-              <template #title>
-                {{ record.name }}{{ record.itemName }}
-              </template>
+            <a-tooltip placement="topLeft">
+              <template #title>{{ record.name }} {{ record.itemName }}</template>
               <span class="tree-node-custom-title">{{ record.name }} {{ record.itemName }}</span>
             </a-tooltip>
-            <span class="tree-node-custom-title" v-else>{{ record.name }} {{ record.itemName }}</span>
           </div>
         </template>
+        <template v-else>
+          <span class="tree-node-custom-title">{{ record.name }} {{ record.itemName }}</span>
+        </template>
       </a-tree>
     </a-spin>
   </j-modal>