树形组件icon添加

src/assets/styles/index.scss

@@ -240,3 +240,22 @@ aside {
     margin-bottom: 10px;
   }
 }
+
+@font-face {
+  font-family: 'iconfont';
+  src: url('../fonts/iconfont.woff2') format('woff2'),
+       url('../fonts/iconfont.woff') format('woff'),
+       url('../fonts/iconfont.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+  font-display: block;
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  display: inline-block; /* 添加这个属性 */
+}
\ No newline at end of file

src/views/classification/Classification/index.vue

 <script setup name="Classification">
 import { ElMessageBox, ElMessage } from 'element-plus'
 import { ref, toRefs, reactive, getCurrentInstance, proxyRefs, onMounted, watch, provide, nextTick } from 'vue'
+import useAppStore from '@/store/modules/app'
 import TreeFilter from './modules/TreeFilter.vue'
 import BasicInfoTab from './modules/BasicInfoTab.vue'
 import TableInfoTab from './modules/TableInfoTab.vue'
@@ -12,6 +13,7 @@ import { query, getClassifyEnable, getGlobalOriginalConfig, changeGlobalOriginal
   save
 } from '@/api/classification/classification.js'
 const route = useRoute()
+const appStore = useAppStore()
 // 字段加密信息子组件列表
 const encryptionTabRef = ref()
 const projectId = ref('')
@@ -96,10 +98,10 @@ onMounted(async () => {
         ...item,
         label: item.sysname,
         type: 'system',
+        icon: getNodeIcon(item.dbtype),
         children: [
         ]
       }))
-
       // 赋值触发监听，默认查询第一个数据源的基本信息
       currentNodeData.value = treeData.value[0]
     }
@@ -112,6 +114,12 @@ onMounted(async () => {
   }
 })
 
+// 根据节点类型获取图标
+const getNodeIcon = (type) => {
+  return appStore.DATABASE_ICONS[type]
+}
+
+
 // 树节点点击处理
 const handleNodeClick = async (data) => {
     currentNodeData.value = data
@@ -133,6 +141,7 @@ const handleNodeClick = async (data) => {
           type: 'database',
           label: schema.text,
           parent: data,
+          icon: getNodeIcon('DATABASE'),
           children: []
         }))
         treeData.value = [...treeData.value] // 触发视图更新
@@ -150,7 +159,8 @@ const handleNodeClick = async (data) => {
         dbtype: data.dbtype,
         projectid: data.projectid,
         schema: data.schema,
-        parent: data,
+       parent: data,
+       icon: getNodeIcon('queryTables'),
         children: []
       }
    ]
@@ -174,6 +184,7 @@ const handleNodeClick = async (data) => {
         id: uuid(),
         label: table.showName,
         type: 'table',
+        icon: getNodeIcon('TABLE'),
         parent: data
       }))
       treeData.value = [...treeData.value]

src/views/classification/Classification/modules/TreeFilter.vue

@@ -25,7 +25,7 @@
     >
       <template #default="{ node, data }">
         <span class="custom-tree-node">
-          <i :class="getNodeIcon(data.type)" class="node-icon"></i>
+          <i class="iconfont node-icon" v-html="data.icon.text" :style="`color: ${data.icon.color};`"></i>
           <span>{{ node.label }}</span>
           <template v-if="data.type === 'category'">
             <i class="el-icon-collection icon-category" style="margin-left:6px;color:#F7BA2A;font-size:16px;"></i>
@@ -107,17 +107,6 @@ const defaultProps = {
   label: 'label'
 }
 
-// 根据节点类型获取图标
-const getNodeIcon = (type) => {
-  const iconMap = {
-    system: 'el-icon-s-platform',
-    database: 'el-icon-s-data',
-    category: 'el-icon-folder-opened',
-    table: 'el-icon-s-grid'
-  }
-  return iconMap[type] || 'el-icon-document'
-}
-
 // 过滤树节点
 const filterNode = (value, data) => {
   if (!value) return true