From 15b81eef97c0e211f043b7108fa341e9ae178a74 Mon Sep 17 00:00:00 2001
From: lai <371757574@qq.com>
Date: Thu, 7 Nov 2024 14:10:00 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E8=8F=9C=E5=8D=95=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E6=A1=86=E4=B8=BA=E6=A0=91=E7=8A=B6=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../setting/components/change-home-index.vue  | 63 +++++++++++++------
 1 file changed, 45 insertions(+), 18 deletions(-)

diff --git a/src/views/system/setting/components/change-home-index.vue b/src/views/system/setting/components/change-home-index.vue
index b782276b..82255bf9 100644
--- a/src/views/system/setting/components/change-home-index.vue
+++ b/src/views/system/setting/components/change-home-index.vue
@@ -5,6 +5,7 @@ import useI18n from '@/hooks/useI18n';
 import { listMenu } from '@/api/system/menu';
 import { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 import { getConfigKey, changeValue } from '@/api/system/config';
+import { parseDataToTree } from '@/utils/parse-tree-utils';
 const { t } = useI18n();
 
 type StateType = {
@@ -59,14 +60,21 @@ onMounted(() => {
   listMenu(toRaw({ status: 1 })).then(res => {
     if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
       // 过滤旧前端菜单以及不是菜单类型以及路径为空
-      res.data = res.data
-        .filter(i => i.perms !== 'page' && i.menuType === 'M' && i.component)
-        .map((item: any) => {
-          state.options.push({
-            label: item.menuName,
-            value: item.component,
-          });
-        });
+      res.data = res.data.filter(i => i.perms !== 'page' && i.menuType !== 'B');
+      state.options = parseDataToTree(res.data, 'menuId');
+      const setDisabledAndComponent = (item:any) => {
+        if (!item.component) {
+          item.disabled = true;
+          item.component = 'Null' + item.menuId;
+        }
+      };
+
+      state.options.forEach((item:any) => {
+        setDisabledAndComponent(item); // 处理父菜单
+        if (item.children && Array.isArray(item.children)) {
+          item.children.forEach(setDisabledAndComponent); // 处理子菜单
+        }
+      });
     }
   });
 
@@ -84,13 +92,22 @@ onMounted(() => {
     <a-col :lg="12" :md="12" :xs="24" style="margin-bottom: 30px">
       <template v-if="state.edite">
         <a-form-item :label="t('views.system.setting.home')">
-          <a-select
-            ref="select"
+          <a-tree-select
             v-model:value="state.default"
+            show-search
             style="width: 240px"
-            :disabled="false"
-            :options="state.options"
-          ></a-select>
+            :tree-data="state.options"
+            :field-names="{
+              children: 'children',
+              label: 'menuName',
+              value: 'component',
+            }"
+            tree-default-expand-all
+            tree-node-label-prop="menuName"
+            tree-node-filter-prop="menuName"
+            :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+            :placeholder="t('common.selectPlease')"
+          ></a-tree-select>
         </a-form-item>
 
         <a-button type="primary" @click="fnSave">
@@ -102,13 +119,23 @@ onMounted(() => {
       </template>
       <template v-else>
         <a-form-item :label="t('views.system.setting.home')">
-          <a-select
-            ref="select"
+          <a-tree-select
             v-model:value="state.default"
-            style="width: 240px"
             :disabled="true"
-            :options="state.options"
-          ></a-select>
+            show-search
+            style="width: 240px"
+            :tree-data="state.options"
+            :field-names="{
+              children: 'children',
+              label: 'menuName',
+              value: 'component',
+            }"
+            tree-default-expand-all
+            tree-node-label-prop="menuName"
+            tree-node-filter-prop="menuName"
+            :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
+            :placeholder="t('common.selectPlease')"
+          ></a-tree-select>
         </a-form-item>
 
         <a-button type="dashed" @click="fnEdit(true)">