From a3df6f77b240063c669a2dc31b9b9101b38a9bab Mon Sep 17 00:00:00 2001
From: lideqin <694785430@qq.com>
Date: Fri, 6 Sep 2024 14:58:16 +0800
Subject: [PATCH] =?UTF-8?q?[update]=20=E4=BF=AE=E6=94=B9UAT=E9=97=AE?=
 =?UTF-8?q?=E9=A2=98=EF=BC=9A=E5=A4=96=E6=9D=A5=E6=A0=87=E5=87=86=E5=92=8C?=
 =?UTF-8?q?=E4=BC=81=E6=A0=87=E5=A2=9E=E5=8A=A0=E5=B7=A6=E4=BE=A7=E6=A0=91?=
 =?UTF-8?q?=E6=94=B6=E8=B5=B7=E5=B1=95=E5=BC=80=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../standard/EnterpriseStandardList.vue       | 133 ++++++++++-------
 .../foreignStandard/ForeignStandardList.vue   | 139 +++++++++++-------
 2 files changed, 169 insertions(+), 103 deletions(-)

diff --git a/src/views/enterpriseStandardLibrary/standard/EnterpriseStandardList.vue b/src/views/enterpriseStandardLibrary/standard/EnterpriseStandardList.vue
index 1334509..d33d27b 100644
--- a/src/views/enterpriseStandardLibrary/standard/EnterpriseStandardList.vue
+++ b/src/views/enterpriseStandardLibrary/standard/EnterpriseStandardList.vue
@@ -1,55 +1,60 @@
 <template>
   <a-card :bordered="false" class="page-left-right-layout">
-    <div class="page-left-box">
-      <a-input-search v-model="treeInput"
-                      class="tree-search"
-                      :placeholder="$t('pleaseEnterTreeSystem')"
-                      @search="handleTreeSearch" />
-      <div class="page-tree-box page-tree-box-has-search">
-        <a-spin :spinning="treeLoading">
-          <a-tree
-            v-if="treeData.length > 0"
-            :show-line="true"
-            :show-icon="true"
-            :tree-data="treeData"
-            :expanded-keys.sync="expandedKeys"
-            :selectedKeys="currentTreeNode"
-            :default-expand-all="defaultExpandAll"
-            draggable
-            @drop="onDropCataSort">
-            <template #title="record">
-              <div class="tree-operate-node"
-                   @mouseenter="handleTreeMouseover(record.key)"
-                   @mouseleave="handleTreeMouseout(record.key)"
-                   @click="treeSelect(record)">
-                <a-icon class="parent-node-icon" type="folder" v-if="record.dataRef.children && record.dataRef.children.length > 0" />
-                <a-tooltip placement="topLeft">
-                  <template #title>
-                    {{ record.title }}
-                  </template>
-                  <span class="tree-node-custom-title">{{ record.title }}</span>
-                </a-tooltip>
-                <div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey || record.key === 'myCollect'}">
-                  <!--  新增  -->
-                  <a-button icon="plus" class="tree-operate-node-btn" v-has="'enterpriseStandard:tree:add'"
-                            @click="handleTreeAdd(record)"></a-button>
-                  <!--  编辑  -->
-                  <a-button v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value"
-                            v-has="'enterpriseStandard:tree:edit'"
-                            class="tree-operate-node-btn" @click="handleTreeEdit(record)">
-                    <i class="iconfont icon-bianji"></i>
-                  </a-button>
-                  <!--  删除  -->
-                  <a-button v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value"
-                            v-has="'enterpriseStandard:tree:delete'"
-                            class="tree-operate-node-btn" @click="handleTreeDelete(record.id)">
-                    <i class="iconfont icon-shanchu_"></i>
-                  </a-button>
+    <div class="page-left-box" :style="isLeftExpand ? {width: '0px', padding: '0px', borderRight: 'none'} : {}">
+      <template v-if="!isLeftExpand">
+        <a-input-search v-model="treeInput"
+                        class="tree-search"
+                        :placeholder="$t('pleaseEnterTreeSystem')"
+                        @search="handleTreeSearch" />
+        <div class="page-tree-box page-tree-box-has-search">
+          <a-spin :spinning="treeLoading">
+            <a-tree
+              v-if="treeData.length > 0"
+              :show-line="true"
+              :show-icon="true"
+              :tree-data="treeData"
+              :expanded-keys.sync="expandedKeys"
+              :selectedKeys="currentTreeNode"
+              :default-expand-all="defaultExpandAll"
+              draggable
+              @drop="onDropCataSort">
+              <template #title="record">
+                <div class="tree-operate-node"
+                     @mouseenter="handleTreeMouseover(record.key)"
+                     @mouseleave="handleTreeMouseout(record.key)"
+                     @click="treeSelect(record)">
+                  <a-icon class="parent-node-icon" type="folder" v-if="record.dataRef.children && record.dataRef.children.length > 0" />
+                  <a-tooltip placement="topLeft">
+                    <template #title>
+                      {{ record.title }}
+                    </template>
+                    <span class="tree-node-custom-title">{{ record.title }}</span>
+                  </a-tooltip>
+                  <div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey || record.key === 'myCollect'}">
+                    <!--  新增  -->
+                    <a-button icon="plus" class="tree-operate-node-btn" v-has="'enterpriseStandard:tree:add'"
+                              @click="handleTreeAdd(record)"></a-button>
+                    <!--  编辑  -->
+                    <a-button v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value"
+                              v-has="'enterpriseStandard:tree:edit'"
+                              class="tree-operate-node-btn" @click="handleTreeEdit(record)">
+                      <i class="iconfont icon-bianji"></i>
+                    </a-button>
+                    <!--  删除  -->
+                    <a-button v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value"
+                              v-has="'enterpriseStandard:tree:delete'"
+                              class="tree-operate-node-btn" @click="handleTreeDelete(record.id)">
+                      <i class="iconfont icon-shanchu_"></i>
+                    </a-button>
+                  </div>
                 </div>
-              </div>
-            </template>
-          </a-tree>
-        </a-spin>
+              </template>
+            </a-tree>
+          </a-spin>
+        </div>
+      </template>
+      <div class="control-standard-left-expand" @click="expandLeft">
+        <a-icon :type="isLeftExpand ? 'right' : 'left'" />
       </div>
     </div>
     <div class="page-right-box">
@@ -265,7 +270,8 @@ export default {
       defaultSearchParams: { // 默认查询条件
         standard_state: `${EnterpriseStandardStatus.CURRENTLY_EFFECTIVE.value}`
       },
-      disabledMixinsCreate: true
+      disabledMixinsCreate: true,
+      isLeftExpand: false // 是否左侧收齐
     }
   },
   computed: {
@@ -305,6 +311,10 @@ export default {
     this.initTreeData()
   },
   methods: {
+    // 左侧树收起展开
+    expandLeft () {
+      this.isLeftExpand = !this.isLeftExpand
+    },
     // 获取左侧树数据
     initTreeData (params, isPackUpExpand = true) {
       this.treeLoading = true
@@ -845,4 +855,27 @@ export default {
 .icon-star {
   color: rgba(243, 129, 65, 0.50);
 }
+
+.page-left-box {
+  position: relative;
+}
+.control-standard-left-expand {
+  width: 12px;
+  height: 24px;
+  border-radius: 0 12px 12px 0;
+  background-color: @primary-color;
+  color: white;
+  position: absolute;
+  z-index: 3;
+  left: 100%;
+  top: calc(50% - 52px);
+
+  .anticon {
+    position: absolute;
+    top: 50%;
+    left: -2px;
+    transform: translateY(-50%);
+    cursor: pointer;
+  }
+}
 </style>
diff --git a/src/views/standardRegulationLibrary/foreignStandard/ForeignStandardList.vue b/src/views/standardRegulationLibrary/foreignStandard/ForeignStandardList.vue
index e77456b..382e174 100644
--- a/src/views/standardRegulationLibrary/foreignStandard/ForeignStandardList.vue
+++ b/src/views/standardRegulationLibrary/foreignStandard/ForeignStandardList.vue
@@ -1,59 +1,64 @@
 <template>
   <a-card :bordered="false" class="page-left-right-layout">
     <!--    树部分-->
-    <div class="page-left-box">
-      <a-input-search v-model="treeInput" class="tree-search"
-                      :placeholder="$t('standardRegulationLibrary.foreignStandard.treeSearchPlaceholder')"
-                      @search="handleTreeSearch" />
-      <div class="page-tree-box page-tree-box-has-search">
-        <a-spin :spinning="treeLoading">
-          <a-tree :show-line="true"
-                  :show-icon="true"
-                  :tree-data="treeData"
-                  :expanded-keys.sync="expandedKeys"
-                  :selected-keys="selectedTreeKeys"
-                  draggable
-                  @drop="onDropCataSort">
-            <template #title="record">
-              <div class="tree-operate-node"
-                   @mouseenter="handleTreeMouseover(record.key)"
-                   @mouseleave="handleTreeMouseout(record.key)"
-                   @click="handleSelectTreeNode(record)">
-                <a-icon class="parent-node-icon"
-                        type="folder"
-                        v-if="record.dataRef.children && record.dataRef.children.length > 0" />
-                <a-tooltip placement="topLeft">
-                  <template #title>
-                    {{ record.title }}
-                  </template>
-                  <span class="tree-node-custom-title">{{ record.title }}</span>
-                </a-tooltip>
-                <div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey}">
-                  <!--              新增-->
-                  <a-button icon="plus"
-                            class="tree-operate-node-btn"
-                            @click.stop="handleAddTreeNode(record)"
-                            v-if="record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
-                            v-has="'domesticStandard:tree:add'"></a-button>
-                  <!--              编辑，根节点不能编辑-->
-                  <a-button class="tree-operate-node-btn"
-                            @click.stop="handleEditTreeNode(record)"
-                            v-has="'domesticStandard:tree:edit'"
-                            v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value">
-                    <i class="iconfont icon-bianji" />
-                  </a-button>
-                  <!--              删除，根节点不能删除-->
-                  <a-button class="tree-operate-node-btn"
-                            v-has="'domesticStandard:tree:delete'"
-                            v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
-                            @click.stop="handleDelTreeNode(record)">
-                    <i class="iconfont icon-shanchu_" />
-                  </a-button>
+    <div class="page-left-box" :style="isLeftExpand ? {width: '0px', padding: '0px', borderRight: 'none'} : {}">
+      <template v-if="!isLeftExpand">
+        <a-input-search v-model="treeInput" class="tree-search"
+                        :placeholder="$t('standardRegulationLibrary.foreignStandard.treeSearchPlaceholder')"
+                        @search="handleTreeSearch" />
+        <div class="page-tree-box page-tree-box-has-search">
+          <a-spin :spinning="treeLoading">
+            <a-tree :show-line="true"
+                    :show-icon="true"
+                    :tree-data="treeData"
+                    :expanded-keys.sync="expandedKeys"
+                    :selected-keys="selectedTreeKeys"
+                    draggable
+                    @drop="onDropCataSort">
+              <template #title="record">
+                <div class="tree-operate-node"
+                     @mouseenter="handleTreeMouseover(record.key)"
+                     @mouseleave="handleTreeMouseout(record.key)"
+                     @click="handleSelectTreeNode(record)">
+                  <a-icon class="parent-node-icon"
+                          type="folder"
+                          v-if="record.dataRef.children && record.dataRef.children.length > 0" />
+                  <a-tooltip placement="topLeft">
+                    <template #title>
+                      {{ record.title }}
+                    </template>
+                    <span class="tree-node-custom-title">{{ record.title }}</span>
+                  </a-tooltip>
+                  <div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey}">
+                    <!--              新增-->
+                    <a-button icon="plus"
+                              class="tree-operate-node-btn"
+                              @click.stop="handleAddTreeNode(record)"
+                              v-if="record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
+                              v-has="'domesticStandard:tree:add'"></a-button>
+                    <!--              编辑，根节点不能编辑-->
+                    <a-button class="tree-operate-node-btn"
+                              @click.stop="handleEditTreeNode(record)"
+                              v-has="'domesticStandard:tree:edit'"
+                              v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value">
+                      <i class="iconfont icon-bianji" />
+                    </a-button>
+                    <!--              删除，根节点不能删除-->
+                    <a-button class="tree-operate-node-btn"
+                              v-has="'domesticStandard:tree:delete'"
+                              v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
+                              @click.stop="handleDelTreeNode(record)">
+                      <i class="iconfont icon-shanchu_" />
+                    </a-button>
+                  </div>
                 </div>
-              </div>
-            </template>
-          </a-tree>
-        </a-spin>
+              </template>
+            </a-tree>
+          </a-spin>
+        </div>
+      </template>
+      <div class="control-standard-left-expand" @click="expandLeft">
+        <a-icon :type="isLeftExpand ? 'right' : 'left'" />
       </div>
     </div>
     <!--    表格部分-->
@@ -313,7 +318,8 @@ export default {
       treeLoading: false,
       isCollection: false,
       expandedKeys: [], // 展开的节点
-      needFilterTableBtn: true
+      needFilterTableBtn: true,
+      isLeftExpand: false // 是否左侧收齐
     }
   },
   computed: {
@@ -326,6 +332,10 @@ export default {
     this.initTreeData()
   },
   methods: {
+    // 左侧树收起展开
+    expandLeft () {
+      this.isLeftExpand = !this.isLeftExpand
+    },
     /**
      * 获取树数据
      */
@@ -828,4 +838,27 @@ export default {
 .icon-star {
   color: rgba(243, 129, 65, 0.50);
 }
+
+.page-left-box {
+  position: relative;
+}
+.control-standard-left-expand {
+  width: 12px;
+  height: 24px;
+  border-radius: 0 12px 12px 0;
+  background-color: @primary-color;
+  color: white;
+  position: absolute;
+  z-index: 3;
+  left: 100%;
+  top: calc(50% - 52px);
+
+  .anticon {
+    position: absolute;
+    top: 50%;
+    left: -2px;
+    transform: translateY(-50%);
+    cursor: pointer;
+  }
+}
 </style>