From ffaa64e2ce742b39efa839567c23a8381cfb2f00 Mon Sep 17 00:00:00 2001 From: chendingwei <1170506816@qq.com> Date: Wed, 28 Dec 2022 16:41:25 +0800 Subject: [PATCH] =?UTF-8?q?=E5=B0=86=E5=B7=A6=E4=BE=A7=E8=8F=9C=E5=8D=95?= =?UTF-8?q?=E6=94=B9=E6=88=90=E4=BB=8E=E6=95=B0=E6=8D=AE=E5=BA=93=E8=8E=B7?= =?UTF-8?q?=E5=8F=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/axios/cameraBase/cameraApi.ts | 13 ++-- src/views/page/aside/cameraLeftMenu.vue | 97 ++++++++++++++----------- 2 files changed, 64 insertions(+), 46 deletions(-) diff --git a/src/axios/cameraBase/cameraApi.ts b/src/axios/cameraBase/cameraApi.ts index c8a24df..9db659c 100644 --- a/src/axios/cameraBase/cameraApi.ts +++ b/src/axios/cameraBase/cameraApi.ts @@ -1,5 +1,5 @@ -import {axios} from '@/utils/axios'; -import {apiUrl} from "@/axios"; +import { axios } from '@/utils/axios'; +import { apiUrl } from "@/axios"; import qs from "qs"; enum Api { @@ -9,6 +9,7 @@ enum Api { Get = '/cbCamera/get', GetList = '/cbCamera/getList', GetPageList = '/cbCamera/getPageList', + GetTreeList = '/cbCameraNode/getTree' } const CisApiUrl = apiUrl.CisApiUrl; @@ -19,8 +20,10 @@ export const Update = (params?: any) => axios.post(CisApiUrl + Api.Update, qs.st export const Delete = (params?: any) => axios.post(CisApiUrl + Api.Delete, qs.stringify(params)) -export const Get = (params?: any) => axios.get(CisApiUrl + Api.Get, {params: params}) +export const Get = (params?: any) => axios.get(CisApiUrl + Api.Get, { params: params }) -export const GetList = (params?: any) => axios.get(CisApiUrl + Api.GetList, {params: params}) +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 GetPageList = (params?: any) => axios.get(CisApiUrl + Api.GetPageList, { params: params }) + +export const GetTreeList = (params?: any) => axios.get(CisApiUrl + Api.GetTreeList, { params: params }) diff --git a/src/views/page/aside/cameraLeftMenu.vue b/src/views/page/aside/cameraLeftMenu.vue index 050307e..1cd88f3 100644 --- a/src/views/page/aside/cameraLeftMenu.vue +++ b/src/views/page/aside/cameraLeftMenu.vue @@ -19,7 +19,7 @@ @@ -36,38 +36,38 @@ import { useStore } from '@/store/index'; import * as cameraApi from '@/axios/cameraBase/cameraApi'; let piniaStore = useStore(); const treeData = ref([ - { - 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}`); //防止添加多个key值，再次点击不能关闭。数组去重 - if(menuKey=="open"){ - let arr=[...expandedKeys.value] - arr.push(treeKey) - arr=[...new Set(arr)] - expandedKeys.value=arr - }else if(menuKey=="close"){ - expandedKeys.value=expandedKeys.value.filter((item:any)=>{ - return item != treeKey - }) - }else if(menuKey=="delete"){ - - } - + if (menuKey == "open") { + let arr = [...expandedKeys.value] + arr.push(treeKey) + arr = [...new Set(arr)] + expandedKeys.value = arr + } else if (menuKey == "close") { + expandedKeys.value = expandedKeys.value.filter((item: any) => { + return item != treeKey + }) + } else if (menuKey == "delete") { + + } + }; let searchStr = ref(''); const expandedKeys = ref([]); @@ -82,7 +82,7 @@ watch(searchStr, (newVal, oldVal) => { treeData.value.forEach((element: any) => { if (element.children.length != 0) { let arr = searchFn(newVal, element.children) - if(arr.length!=0){ + if (arr.length != 0) { expandedKeyArr = expandedKeyArr.concat(arr) expandedKeyArr.push(element.key) } @@ -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 = 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 }