侧边栏先处理一下

web/src/components/sliderNav.vue

@@ -3,18 +3,26 @@
     <b class="systemTitle mar-v16" v-text="$sys.title"/>
     <div class="fill">
       <div class="item" v-for="menu in menus" :key="menu.id">
-        <el-row class="pad-h8" align="middle" @click="menu.expand=!menu.expand">
+        <template v-if="menu.children>0">
+          <el-row class="pad-h8" align="middle" @click.stop="menu.expand=!menu.expand">
+            <el-icon :size="20">
+              <Grid/>
+            </el-icon>
+            <div class="fill" v-text="menu.label"/>
+            <el-icon :size="20">
+              <component :is="arrow(menu.expand)"/>
+            </el-icon>
+          </el-row>
+          <template v-if="menu.expand">
+            <div class="app mar-h8" v-for="app in menu.children" :key="app.id" v-text="app.label" :class="{active:app.id==12}" @click="handleGoto(app.route)"/>
+          </template>
+        </template>
+        <div v-else class="flex pad-h8 center" @click="handleGoto(menu.route)">
           <el-icon :size="20">
             <Grid/>
           </el-icon>
           <div class="fill" v-text="menu.label"/>
-          <el-icon :size="20">
-            <component :is="arrow(menu.expand)"/>
-          </el-icon>
-        </el-row>
-        <template v-if="menu.expand">
-          <div class="app mar-h8" v-for="app in menu.children" :key="app.id" v-text="app.label" :class="{active:app.id==12}"/>
-        </template>
+        </div>
       </div>
     </div>
   </section>
@@ -22,28 +30,18 @@
 
 <script>
 import {ArrowDownBold, ArrowUpBold, Grid} from "@element-plus/icons-vue";
+import {mapState} from "pinia/dist/pinia";
+import {mainStore} from "../utils/store";
 
 export default {
   name: "sliderNav",
   components: {Grid, ArrowUpBold, ArrowDownBold},
+  computed: {
+    ...mapState(mainStore, ['user'])
+  },
   data() {
     return {
-      menus: [
-        {
-          id: 1,
-          label: "基础数据库",
-          icon: "",
-          expand: false,
-          children: [{id: 11, label: "人口数据"}, {id: 12, label: "党员数据"}, {id: 13, label: "党组织数据"}]
-        },
-        {
-          id: 2,
-          label: "专题数据库",
-          icon: "",
-          expand: false,
-          children: [{id: 14, label: "办公考勤数据"}, {id: 15, label: "信访数据"}, {id: 21, label: "矛盾调解数据"}]
-        },
-      ]
+      menus: []
     }
   },
   methods: {
@@ -60,11 +58,18 @@ export default {
           const menus = res.data.records.filter(e => !!loaded.find(s => s.name == e.route))
           this.menus = this.$arr2tree(menus, {parent: "parent"})
         }
+      }).finally(() => {
+        if (this.menus.length == 0 && this.user.level == 1) {
+          this.menus = [{id: '202302071139', label: "菜单管理", route: "AppMenu"}]
+        }
       })
+    },
+    handleGoto(name) {
+      this.$router.push({name})
     }
   },
   created() {
-    // this.getMenus()
+    this.getMenus()
   }
 }
 </script>