From 14cd0616718b01aabd6e48d5ba80e680fc898894 Mon Sep 17 00:00:00 2001
From: xingyu <xingyu4j@vip.qq.com>
Date: Fri, 4 Aug 2023 20:00:28 +0800
Subject: [PATCH] fix: tree style

---
 src/components/Basic/src/BasicTitle.vue           |  6 ++++++
 src/components/Tree/src/components/TreeHeader.vue |  6 +++---
 src/components/Tree/style/index.less              | 11 ++++++++++-
 src/views/system/user/DeptTree.vue                |  2 +-
 4 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/src/components/Basic/src/BasicTitle.vue b/src/components/Basic/src/BasicTitle.vue
index 42ffb69..9ecf192 100644
--- a/src/components/Basic/src/BasicTitle.vue
+++ b/src/components/Basic/src/BasicTitle.vue
@@ -73,4 +73,10 @@ const getClass = computed(() => [
     margin-left: 10px;
   }
 }
+
+html[data-theme="dark"] {
+  .@{prefix-cls} {
+    color: rgb(255 255 255 85%);
+  }
+}
 </style>
diff --git a/src/components/Tree/src/components/TreeHeader.vue b/src/components/Tree/src/components/TreeHeader.vue
index 67e1765..4e8c779 100644
--- a/src/components/Tree/src/components/TreeHeader.vue
+++ b/src/components/Tree/src/components/TreeHeader.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { computed, ref, useSlots, watch } from 'vue'
-import { Dropdown, InputSearch, Menu, MenuDivider, MenuItem } from 'ant-design-vue'
+import { Dropdown, InputSearch, Menu, MenuDivider } from 'ant-design-vue'
 import { useDebounceFn } from '@vueuse/core'
 import { ToolbarEnum } from '../types/tree'
 import { Icon } from '@/components/Icon'
@@ -169,9 +169,9 @@ watch(
         <template #overlay>
           <Menu @click="handleMenuClick">
             <template v-for="item in toolbarList" :key="item.value">
-              <MenuItem v-bind="{ key: item.value }">
+              <Menu.Item v-bind="{ key: item.value }">
                 {{ item.label }}
-              </MenuItem>
+              </Menu.Item>
               <MenuDivider v-if="item.divider" />
             </template>
           </Menu>
diff --git a/src/components/Tree/style/index.less b/src/components/Tree/style/index.less
index 6f0a36f..fb48cc2 100644
--- a/src/components/Tree/style/index.less
+++ b/src/components/Tree/style/index.less
@@ -1,7 +1,7 @@
 @tree-prefix-cls: ~"@{namespace}-tree";
 
 .@{tree-prefix-cls} {
-  background-color: @component-background;
+  // background-color: @component-background;
 
   .ant-tree-node-content-wrapper {
     position: relative;
@@ -50,3 +50,12 @@
     border-bottom: 1px solid @border-color-base;
   }
 }
+
+html[data-theme="dark"] {
+  .@{tree-prefix-cls} {
+    &-header {
+      background-color: #1f1f1f;
+    }
+  }
+}
+
diff --git a/src/views/system/user/DeptTree.vue b/src/views/system/user/DeptTree.vue
index 20cbbba..719bb9d 100644
--- a/src/views/system/user/DeptTree.vue
+++ b/src/views/system/user/DeptTree.vue
@@ -26,7 +26,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="m-4 mr-0 overflow-hidden bg-white">
+  <div class="m-4 mr-0 overflow-hidden">
     <BasicTree
       title="部门列表"
       toolbar