From 5f2fad790a3eb4f8f1fc3de4a9047cc300366afc Mon Sep 17 00:00:00 2001
From: Zhufu <1176354795@qq.com>
Date: Tue, 7 May 2024 17:40:11 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E5=AD=97=E5=85=B8=E5=88=86=E7=B1=BB?=
 =?UTF-8?q?=E3=80=91=E5=88=97=E8=A1=A8=E6=8C=89=E9=92=AE=E5=86=8D=E6=94=BE?=
 =?UTF-8?q?=E5=9B=9E=E5=8E=BB=EF=BC=8C=E9=BB=98=E8=AE=A4=E9=80=89=E4=B8=AD?=
 =?UTF-8?q?=E7=9A=84=E9=AB=98=E4=BA=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/demo/Categories/index.vue | 26 ++++++++++++++------------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/src/views/demo/Categories/index.vue b/src/views/demo/Categories/index.vue
index 675e9d6..48f9311 100644
--- a/src/views/demo/Categories/index.vue
+++ b/src/views/demo/Categories/index.vue
@@ -1,8 +1,11 @@
 <template>
   <div class="page-div categories-page">
     <div class="left-div w-1/4 xl:w-1/5 m-4 mr-0">
-      <div class="header mb-1">
-        <div class='header-title'>分类列表</div>
+      <div class="header">
+        <div class="buttons-div">
+          <a-button type="primary" color='error' @click="buttonClick('left-del')">删除分类</a-button>
+          <a-button type="primary" color='info' @click="buttonClick('left-add')">添加分类</a-button>
+        </div>
         <div class="search-div">
           <a-input-search size="small" v-model:value="LValue" placeholder="搜索" enter-button @search="searchData('left')"/>
         </div>
@@ -10,7 +13,7 @@
       </div>
       <div class="content">
         <div class="showTree">
-          <BasicTree :treeData="showLTree" :loading="lLoading" @select="(selectedKeys,{node}) => {getLeftSelectId(node.id);changeTypeId(node.key)}"/>
+          <BasicTree ref="treeRef" :treeData="showLTree" :loading="lLoading" @select="(selectedKeys,{node}) => {getLeftSelectId(node.id);changeTypeId(node.key)}"/>
         </div>
       </div>
     </div>
@@ -40,7 +43,7 @@ import UseModal from './Modal/index.vue'
 import { BasicTree } from '@/components/Tree';
 import {BasicTable,useTable} from '@/components/Table'
 import { PermissionBtn } from '@/components/PermissionBtn/index';
-import {ref,onMounted,reactive,watch,createVNode } from "vue"
+import {ref,onMounted,reactive,watch,createVNode, unref } from "vue"
 import {getLeftTree,getRightTable,addLeftItem,addRightItem,delLeftItem,editRightItem,delRightItem} from '@/api/sys/categories.ts'
 import {columns,emptyRightItem,emptyLeftItem,dataProcess,searchFormSchema} from './util.ts'
 import {Modal,message} from 'ant-design-vue'
@@ -58,6 +61,7 @@ const modalData = reactive({
   data:{},
   type:'',
 })
+const treeRef = ref()
 const firstRequestCode = ref('')
 
 const [registerTable,{reload,getSelectRows}] = useTable({
@@ -103,6 +107,7 @@ const getLeftTreeData = (isMounted) => {
     if(isMounted && data.length > 0){
       firstRequestCode.value = data[0].key
       typeId.value = data[0].key
+      unref(treeRef).setSelectedKeys([data[0].key])
     }
     reload()
   }).catch(err => {
@@ -246,18 +251,15 @@ const clearModal = () => {
     flex-direction: column;
     .header{
       display: flex;
-      align-items: center;
+      flex-direction: column;
       padding:10px;
       border-bottom: 1px solid #eee;
-      .header-title{
-        width: 132px;
-        font-size: 16px;
-        font-weight: 500;
-        line-height: 24px;
-        cursor: pointer;
-        user-select: none;
+      .buttons-div{
+        display: flex;
+        justify-content: space-between;
       }
       .search-div{
+        margin-top:10px;
         display: flex;
       } 
     }