ADD: 树形菜单

src/api/rule.js

+import axios from '@/axios'
+
+
+export function getRuleList(page) {
+    return axios.get(`/admin/rule/${page}`)
+}
\ No newline at end of file

src/pages/access/list.vue

 <template>
-    <div>
-        菜单权限
-    </div>
-</template>
\ No newline at end of file
+    <el-card shadow="never" class="border-0">
+        <ListHeader @refresh="getData"/>
+        <el-tree :data="tableData" 
+        :props="{label: 'name', children:'child'}" 
+        @node-click="handleNodeClick" node-key="id" 
+        :default-expand-all="defaultExpandKeys"/>
+    </el-card>
+    
+</template>
+
+<script setup>
+import { ref } from "vue"
+import ListHeader from "@/components/ListHeader.vue"
+import {
+    getRuleList
+} from "@/api/rule.js"
+
+
+import {
+    useInitTable
+
+} from "@/composables/useCommon.js"
+
+const defaultExpandKeys = ref([])
+
+const {
+    loading,
+    tableData,
+    getData
+
+} = useInitTable({
+    getList: getRuleList,
+    onGetListSuccess:(res) =>{
+        tableData.value = res.list
+        defaultExpandKeys.value = res.list.map(o=>o.id)
+
+    }
+})
+
+
+
+</script>
\ No newline at end of file