From cc0f8bc8b6ece0754cfee0f9bba4ab81297ebf64 Mon Sep 17 00:00:00 2001 From: guanj Date: Sat, 20 Dec 2025 23:44:46 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=A9=BE=E9=A9=B6=E8=88=B1?= =?UTF-8?q?=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/tree/govern/deviceTree.vue | 73 ++- src/components/tree/govern/pointTree.vue | 63 ++- src/layouts/admin/components/navBar/tabs.vue | 488 +++++++++--------- src/stores/navTabs.ts | 277 ++++++---- src/views/govern/device/control/index.vue | 1 + .../reportCore/statisticsWx/index_ypt.vue | 167 ++++++ .../homePage/components/routingConfig.vue | 13 +- src/views/pqs/cockpit/homePage/index.vue | 15 +- src/views/pqs/cockpit/realTimeData/index.vue | 72 ++- .../pqs/cockpit/setUp/components/popup.vue | 57 +- 10 files changed, 770 insertions(+), 456 deletions(-) create mode 100644 src/views/govern/reportCore/statisticsWx/index_ypt.vue diff --git a/src/components/tree/govern/deviceTree.vue b/src/components/tree/govern/deviceTree.vue index 3e2f606..a1b0aac 100644 --- a/src/components/tree/govern/deviceTree.vue +++ b/src/components/tree/govern/deviceTree.vue @@ -32,7 +32,7 @@ const config = useConfig() const tree = ref() const treRef = ref() const changeDeviceType = (val: any, obj: any) => { - console.log("🚀 ~ changeDeviceType ~ val:", val,obj) + console.log('🚀 ~ changeDeviceType ~ val:', val, obj) emit('deviceTypeChange', val, obj) } getDeviceTree().then(res => { @@ -50,7 +50,7 @@ getDeviceTree().then(res => { item2.color = config.getColorVal('elementUiPrimary') item2.children.forEach((item3: any) => { item3.icon = 'el-icon-Platform' - item3.level = 2 + item3.level = 2 item3.color = config.getColorVal('elementUiPrimary') if (item3.comFlag === 1) { item3.color = '#e26257 !important' @@ -83,8 +83,8 @@ getDeviceTree().then(res => { // }) }) }) - }else if (item.name == '在线设备') { - item.children.forEach((item: any) => { + } else if (item.name == '在线设备') { + item.children.forEach((item: any) => { item.icon = 'el-icon-HomeFilled' item.color = config.getColorVal('elementUiPrimary') item.children.forEach((item2: any) => { @@ -102,41 +102,40 @@ getDeviceTree().then(res => { }) } }) - console.log("🚀 ~ file: deviceTree.vue ~ line 18 ~ getDeviceTree ~ tree:", arr,arr2,arr3) + console.log('🚀 ~ file: deviceTree.vue ~ line 18 ~ getDeviceTree ~ tree:', arr, arr2, arr3) tree.value = res.data - + nextTick(() => { - if (arr.length) { - treRef.value.treeRef1.setCurrentKey(arr[0].id) - // 注册父组件事件 - emit('init', { - level: 2, - ...arr[0] - }) - return - } - if (arr2.length) { - treRef.value.treeRef2.setCurrentKey(arr2[0].id) - // 注册父组件事件 - emit('init', { - level: 2, - ...arr2[0] - }) - return - } - if (arr3.length) { - treRef.value.treeRef3.setCurrentKey(arr3[0].id) - // 注册父组件事件 - emit('init', { - level: 2, - ...arr3[0] - }) - return - } - else { - emit('init') - return - } + setTimeout(() => { + if (arr.length > 0) { + treRef.value.treeRef1.setCurrentKey(arr[0].id) + // 注册父组件事件 + emit('init', { + level: 2, + ...arr[0] + }) + return + } else if (arr2.length > 0) { + treRef.value.treeRef2.setCurrentKey(arr2[0].id) + // 注册父组件事件 + emit('init', { + level: 2, + ...arr2[0] + }) + return + } else if (arr3.length > 0) { + treRef.value.treeRef3.setCurrentKey(arr3[0].id) + // 注册父组件事件 + emit('init', { + level: 2, + ...arr3[0] + }) + return + } else { + emit('init') + return + } + }, 500) }) }) const handleCheckChange = (data: any, checked: any, indeterminate: any) => { diff --git a/src/components/tree/govern/pointTree.vue b/src/components/tree/govern/pointTree.vue index 2215bbe..6ef2929 100644 --- a/src/components/tree/govern/pointTree.vue +++ b/src/components/tree/govern/pointTree.vue @@ -99,38 +99,37 @@ const info = () => { }) tree.value = res.data nextTick(() => { - if (arr1.length) { - //初始化选中 - treRef.value.treeRef1.setCurrentKey(arr1[0].id) - // 注册父组件事件 - emit('init', { - level: 2, - ...arr1[0] - }) - return - } - if (arr2.length) { - //初始化选中 - treRef.value.treeRef2.setCurrentKey(arr2[0].id) - // 注册父组件事件 - emit('init', { - level: 2, - ...arr2[0] - }) - return - } - if(arr3.length){ - treRef.value.treeRef3.setCurrentKey(arr3[0].id) - emit('init', { - level: 2, - ...arr3[0] - }) - return - } - else { - emit('init') - return - } + setTimeout(() => { + if (arr1.length > 0) { + //初始化选中 + treRef.value.treeRef1.setCurrentKey(arr1[0].id) + // 注册父组件事件 + emit('init', { + level: 2, + ...arr1[0] + }) + return + } else if (arr2.length > 0) { + //初始化选中 + treRef.value.treeRef2.setCurrentKey(arr2[0].id) + // 注册父组件事件 + emit('init', { + level: 2, + ...arr2[0] + }) + return + } else if (arr3.length > 0) { + treRef.value.treeRef3.setCurrentKey(arr3[0].id) + emit('init', { + level: 2, + ...arr3[0] + }) + return + } else { + emit('init') + return + } + }, 500) }) }) } diff --git a/src/layouts/admin/components/navBar/tabs.vue b/src/layouts/admin/components/navBar/tabs.vue index 2512f2b..25ea3e2 100644 --- a/src/layouts/admin/components/navBar/tabs.vue +++ b/src/layouts/admin/components/navBar/tabs.vue @@ -1,242 +1,246 @@ - - - - - + + + + + diff --git a/src/stores/navTabs.ts b/src/stores/navTabs.ts index 2306789..b16784a 100644 --- a/src/stores/navTabs.ts +++ b/src/stores/navTabs.ts @@ -1,108 +1,169 @@ -import { reactive } from 'vue' -import { defineStore } from 'pinia' -import { STORE_TAB_VIEW_CONFIG } from '@/stores/constant/cacheKey' -import type { NavTabs } from '@/stores/interface/index' -import type { RouteLocationNormalized, RouteRecordRaw } from 'vue-router' -import { adminBaseRoutePath } from '@/router/static' - -export const useNavTabs = defineStore( - 'navTabs', - () => { - const state: NavTabs = reactive({ - // 激活tab的index - activeIndex: 0, - // 激活的tab - activeRoute: null, - // tab列表 - tabsView: [], - // 当前tab是否全屏 - tabFullScreen: false, - // 从后台加载到的菜单路由列表 - tabsViewRoutes: [], - // 按钮权限节点 - authNode: new Map(), - }) - - function addTab(route: RouteLocationNormalized) { - if (!route.meta.addtab) return - for (const key in state.tabsView) { - if (state.tabsView[key].path === route.path) { - state.tabsView[key].params = route.params ? route.params : state.tabsView[key].params - state.tabsView[key].query = route.query ? route.query : state.tabsView[key].query - return - } - } - state.tabsView.push(route) - } - - function closeTab(route: RouteLocationNormalized) { - state.tabsView.map((v, k) => { - if (v.path == route.path) { - state.tabsView.splice(k, 1) - return - } - }) - } - - /** - * 关闭多个标签 - * @param retainMenu 需要保留的标签，否则关闭全部标签 - */ - const closeTabs = (retainMenu: RouteLocationNormalized | false = false) => { - if (retainMenu) { - state.tabsView = [retainMenu] - } else { - state.tabsView = [] - } - } - - const setActiveRoute = (route: RouteLocationNormalized): void => { - const currentRouteIndex: number = state.tabsView.findIndex((item: RouteLocationNormalized) => { - return item.path === route.path - }) - if (currentRouteIndex === -1) return - state.activeRoute = route - state.activeIndex = currentRouteIndex - } - - const setTabsViewRoutes = (data: RouteRecordRaw[]): void => { - state.tabsViewRoutes = encodeRoutesURI(data) - } - - const setAuthNode = (key: string, data: string[]) => { - state.authNode.set(key, data) - } - - const fillAuthNode = (data: Map) => { - state.authNode = data - } - - const setFullScreen = (fullScreen: boolean): void => { - state.tabFullScreen = fullScreen - } - - return { state, addTab, closeTab, closeTabs, setActiveRoute, setTabsViewRoutes, setAuthNode, fillAuthNode, setFullScreen } - }, - { - persist: { - key: STORE_TAB_VIEW_CONFIG, - paths: ['state.tabFullScreen'], - }, - } -) - -/** - * 对iframe的url进行编码 - */ -function encodeRoutesURI(data: RouteRecordRaw[]) { - data.forEach((item) => { - if (item.meta?.menu_type == 'iframe') { - item.path = adminBaseRoutePath + '/iframe/' + encodeURIComponent(item.path) - } - - if (item.children && item.children.length) { - item.children = encodeRoutesURI(item.children) - } - }) - return data -} +import { reactive } from 'vue' +import { defineStore } from 'pinia' +import { STORE_TAB_VIEW_CONFIG } from '@/stores/constant/cacheKey' +import type { NavTabs } from '@/stores/interface/index' +import type { RouteLocationNormalized, RouteRecordRaw } from 'vue-router' +import { adminBaseRoutePath } from '@/router/static' +import { set } from 'lodash' + +export const useNavTabs = defineStore( + 'navTabs', + () => { + const state: NavTabs = reactive({ + // 激活tab的index + activeIndex: 0, + // 激活的tab + activeRoute: null, + // tab列表 + tabsView: [], + // 当前tab是否全屏 + tabFullScreen: false, + // 从后台加载到的菜单路由列表 + tabsViewRoutes: [], + // 按钮权限节点 + authNode: new Map() + }) + + function addTab(route: RouteLocationNormalized) { + console.log('🚀 ~ addTab ~ route:', route) + if (!route.meta.addtab) return + for (const key in state.tabsView) { + if (state.tabsView[key].path === route.path) { + state.tabsView[key].params = route.params ? route.params : state.tabsView[key].params + state.tabsView[key].query = route.query ? route.query : state.tabsView[key].query + state.tabsView[key].meta = route.query ? route.meta : state.tabsView[key].meta + return + } + } + state.tabsView.push(route) + } + + function closeTab(route: RouteLocationNormalized) { + state.tabsView.map((v, k) => { + if (v.path == route.path) { + state.tabsView.splice(k, 1) + return + } + }) + } + + /** + * 关闭多个标签 + * @param retainMenu 需要保留的标签，否则关闭全部标签 + */ + const closeTabs = (retainMenu: RouteLocationNormalized | false = false) => { + if (retainMenu) { + state.tabsView = [retainMenu] + } else { + state.tabsView = [] + } + } + + const setActiveRoute = (route: RouteLocationNormalized): void => { + const currentRouteIndex: number = state.tabsView.findIndex((item: RouteLocationNormalized) => { + return item.path === route.path + }) + if (currentRouteIndex === -1) return + state.activeRoute = route + state.activeIndex = currentRouteIndex + } + + const setTabsViewRoutes = (data: RouteRecordRaw[]): void => { + state.tabsViewRoutes = encodeRoutesURI(data) + } + + const setAuthNode = (key: string, data: string[]) => { + state.authNode.set(key, data) + } + + const fillAuthNode = (data: Map) => { + state.authNode = data + } + + const setFullScreen = (fullScreen: boolean): void => { + state.tabFullScreen = fullScreen + } + + const refresh = () => { + // setTimeout(() => { + // console.log(123, state.tabsViewRoutes) + + let list = matchAndReturnRouteData(state.tabsViewRoutes, state.tabsView) + state.tabsView = [] + list.forEach(item => { + addTab(item) + }) + // }, 1000) + } + return { + state, + addTab, + closeTab, + closeTabs, + setActiveRoute, + setTabsViewRoutes, + setAuthNode, + fillAuthNode, + setFullScreen, + refresh + } + }, + { + persist: { + key: STORE_TAB_VIEW_CONFIG, + paths: ['state.tabFullScreen'] + } + } +) + +/** + * 核心逻辑： + * 1. 递归遍历树形菜单，筛选出与routeList中name匹配的节点 + * 2. 将匹配到的节点格式转换为routeList的结构并返回 + */ +function matchAndReturnRouteData(tree, routeList) { + // 1. 构建路由name映射（name -> 完整路由对象） + const routeMap = new Map() + routeList.forEach(route => { + if (route.name) { + routeMap.set(route.name, route) + } + }) + + // 2. 递归遍历树形菜单，收集匹配的节点 + const matchedNodes = [] + function recursion(node) { + // 匹配当前节点 + if (routeMap.has(node.name)) { + // 深度克隆路由对象，避免修改原数据 + const matchedRoute = JSON.parse(JSON.stringify(routeMap.get(node.name))) + matchedNodes.push(matchedRoute) + } + // 递归处理子节点 + if (node.children && node.children.length) { + node.children.forEach(child => recursion(child)) + } + } + + // 遍历所有顶级节点 + tree.forEach(node => recursion(node)) + + // 3. 返回匹配后的第二个数据格式（和routeList结构一致） + return matchedNodes +} + +/** + * 对iframe的url进行编码 + */ +function encodeRoutesURI(data: RouteRecordRaw[]) { + data.forEach(item => { + if (item.meta?.menu_type == 'iframe') { + item.path = adminBaseRoutePath + '/iframe/' + encodeURIComponent(item.path) + } + + if (item.children && item.children.length) { + item.children = encodeRoutesURI(item.children) + } + }) + return data +} diff --git a/src/views/govern/device/control/index.vue b/src/views/govern/device/control/index.vue index c69824f..ace73cf 100644 --- a/src/views/govern/device/control/index.vue +++ b/src/views/govern/device/control/index.vue @@ -839,6 +839,7 @@ const lineId: any = ref('') const dataLevel: any = ref('') const dataSource = ref([]) const nodeClick = async (e: anyObj) => { + console.log("🚀 ~ nodeClick ~ e:", e) if (e == undefined || e.level == 2) { return (loading.value = false) } diff --git a/src/views/govern/reportCore/statisticsWx/index_ypt.vue b/src/views/govern/reportCore/statisticsWx/index_ypt.vue new file mode 100644 index 0000000..3b134fd --- /dev/null +++ b/src/views/govern/reportCore/statisticsWx/index_ypt.vue @@ -0,0 +1,167 @@ + + + diff --git a/src/views/pqs/cockpit/homePage/components/routingConfig.vue b/src/views/pqs/cockpit/homePage/components/routingConfig.vue index 0de4b55..d5592e5 100644 --- a/src/views/pqs/cockpit/homePage/components/routingConfig.vue +++ b/src/views/pqs/cockpit/homePage/components/routingConfig.vue @@ -1,6 +1,6 @@