将左侧菜单改成从数据库获取

src/axios/cameraBase/cameraApi.ts

@@ -9,6 +9,7 @@ enum Api {
     Get = '/cbCamera/get',
     GetList = '/cbCamera/getList',
     GetPageList = '/cbCamera/getPageList',
+    GetTreeList = '/cbCameraNode/getTree'
 }
 
 const CisApiUrl = apiUrl.CisApiUrl;
@@ -24,3 +25,5 @@ export const Get = (params?: any) => axios.get(CisApiUrl + Api.Get, {params: par
 export const GetList = (params?: any) => axios.get(CisApiUrl + Api.GetList, { params: params })
 
 export const GetPageList = (params?: any) => axios.get(CisApiUrl + Api.GetPageList, { params: params })
+
+export const GetTreeList = (params?: any) => axios.get(CisApiUrl + Api.GetTreeList, { params: params })

src/views/page/aside/cameraLeftMenu.vue

@@ -36,21 +36,21 @@ import { useStore } from '@/store/index';
 import * as cameraApi from '@/axios/cameraBase/cameraApi';
 let piniaStore = useStore();
 const treeData = ref<any>([
-    {
-        title: '视频监控',
-        key: '视频监控',
-        children: [
-            {
-                title: '横琴',
-                key: '横琴',
-                children: [
-                    // { title: '0-0-1-0', key: '0-0-1-0' },
-                    // { title: '0-0-1-1', key: '0-0-1-1' },
-                    // { title: '0-0-1-2', key: '0-0-1-2' },
-                ],
-            },
-        ],
-    }
+    // {
+    //     title: '视频监控',
+    //     key: '视频监控',
+    //     children: [
+    //         {
+    //             title: '横琴',
+    //             key: '横琴',
+    //             children: [
+    //                 // { title: '0-0-1-0', key: '0-0-1-0' },
+    //                 // { title: '0-0-1-1', key: '0-0-1-1' },
+    //                 // { title: '0-0-1-2', key: '0-0-1-2' },
+    //             ],
+    //         },
+    //     ],
+    // }
 ]);
 const onContextMenuClick = (treeKey: string, menuKey: string) => {
     console.log(`treeKey: ${treeKey}, menuKey: ${menuKey}`);
@@ -91,9 +91,9 @@ watch(searchStr, (newVal, oldVal) => {
     expandedKeys.value = expandedKeyArr
 })
 // 选中相机
-function selectCamera(e: any) {
-    if (e.length && !isNaN(parseInt(e[0]))) {
-        piniaStore.updateCurSelectKey(e[0].toString())
+function selectCamera(e: any, e2: any) {
+    if (!e2.node.isGroup) {
+        piniaStore.updateCurSelectKey(e2.node.cbCameraId.toString())
     }
 }
 //模糊查询递归
@@ -118,16 +118,31 @@ function searchFn(newVal: string, arr: any[]): any {
 function loadTreeData() {
     cameraApi.GetList().then((res: any) => {
         let list: Array<any> = res.data.data;
-        treeData.value[0].children[0].children = list.map((item: any) => {
-            item.title = item.name
-            item.key = item.id.toString()
-            return item
-        })
         piniaStore.addCameraMap(list)
-
-        // switchCamera(list[0].id.toString())
-        // treeData.value=piniaStore.treeData
     });
+    cameraApi.GetTreeList().then((res: any) => {
+        console.log(res);
+        if (res.data.code == 200) {
+            treeData.value = againTreeData(res.data.data)
+            console.log(treeData.value[0] );
+            
+        }
+    })
+}
+//递归为树状结构赋值
+function againTreeData(arr: any) {
+    let expandedArr: any = []
+    arr.forEach((item: any, index: number) => {
+        expandedArr[index]={}
+        if (item.isGroup) {
+            expandedArr[index].children = againTreeData(item.child)
+        }
+        expandedArr[index].key = item.id
+        expandedArr[index].title = item.name
+        expandedArr[index].isGroup = item.isGroup
+        expandedArr[index].cbCameraId = item.cbCameraId.toString()
+    })
+    return expandedArr
 }
 </script>