根据excel表格整理出干线测试数据

src/api/index.js

@@ -44,6 +44,9 @@ export const apiGetMenuTree = (tabId) =>
 export const apiGetTongzhouMenuTree = () =>
   http.get('/regions/tree/tongzhou')
 
+export const apiGetTrunkLineMenuTree = () =>
+  http.get('/regions/tree/trunkline')
+
 // ── 设备状态 & 首页 ──
 export const apiGetDeviceStatus = (type) =>
   http.get('/devices/status/summary', { params: { type } })

src/mock/api.js

@@ -53,6 +53,7 @@ const DB = {
   points:              mockData.points,
   menuTree:            mockData.menuTree,
   tongzhouMenuTree:    mockData.tongzhouMenuTree,
+  trunkLineMenuTree:   mockData.trunkLineMenuTree,
   homeData:            mockData.homeData,
   deviceStatus:        mockData.deviceStatus,
   timeSpaceData:       mockData.timeSpaceData,
@@ -398,6 +399,11 @@ export async function apiGetTongzhouMenuTree() {
   return ok(DB.tongzhouMenuTree)
 }
 
+export async function apiGetTrunkLineMenuTree() {
+  await delay(200)
+  return ok(DB.trunkLineMenuTree)
+}
+
 // ═══════════════════════════════════════════════════════════════════════
 //  B: 设备状态 & 首页（动态波动）
 // ═══════════════════════════════════════════════════════════════════════
@@ -548,7 +554,8 @@ export async function apiGetKeyIntersections() {
 export async function apiGetTrafficTimeSpace(opts = {}) {
   await delay(300)
   const { speed = 15, cycle = 120, band = 40, totalTime = 1800 } = opts
-  const { intersections, distances } = DB.timeSpaceData
+  const intersections = opts.intersections || DB.timeSpaceData.intersections
+  const distances = opts.distances || DB.timeSpaceData.distances
   const maxDist = distances[distances.length - 1]
   const waveData = [], greenData = []
 

src/mock/mockAdapter.js

@@ -81,6 +81,11 @@ mock.onGet('/regions/tree/tongzhou').reply(async () => {
   return [200, res]
 })
 
+mock.onGet('/regions/tree/trunkline').reply(async () => {
+  const res = await mockApi.apiGetTrunkLineMenuTree()
+  return [200, res]
+})
+
 mock.onGet('/regions/tree').reply(async (config) => {
   const res = await mockApi.apiGetMenuTree(getParams(config).tabId)
   return [200, res]

src/views/DataAnalysis.vue

@@ -32,8 +32,13 @@
                             @node-click="handleMenuClick" />
                     </TechTabPane>
                     <TechTabPane label="干线" name="trunkLine" class="menu-scroll-view">
-                        <MenuItem v-for="item in menuData" :key="item.id" :node="item" :level="0"
-                            @node-click="handleMenuClick" />
+                        <MenuItem v-for="item in trunkLineMenuData" :key="item.id" :node="item" :level="0"
+                            @node-click="handleMenuClick">
+                        <template #label="{ node }">
+                            <span v-if="node.children && node.children.length > 0">{{ node.label }}</span>
+                            <span v-else>{{ node.label }} 绿波带</span>
+                        </template>
+                        </MenuItem>
                     </TechTabPane>
                     <TechTabPane label="特勤" name="specialDuty" class="menu-scroll-view">
                         <MenuItem v-for="item in menuData" :key="item.id" :node="item" :level="0"
@@ -63,7 +68,7 @@ import TechTabPane from '@/components/ui/TechTabPane.vue';
 import TongzhouTrafficMap from '@/components/TongzhouTrafficMap.vue';
 import MenuItem from '@/components/ui/MenuItem.vue';
 
-import { apiGetTongzhouMenuTree, apiGetTrafficTimeSpace } from '@/api';
+import { apiGetTongzhouMenuTree, apiGetTrunkLineMenuTree, apiGetTrafficTimeSpace } from '@/api';
 
 
 export default {
@@ -81,6 +86,7 @@ export default {
         return {
             // 左侧边栏数据
             activeLeftTab: 'overview',
+            trunkLineMenuData: [],
             menuData: [
                 {
                     id: 'root-1',
@@ -209,7 +215,12 @@ export default {
 
     },
     async mounted() {
-        this.menuData = await apiGetTongzhouMenuTree() || [];
+        const [menuData, trunkData] = await Promise.all([
+            apiGetTongzhouMenuTree(),
+            apiGetTrunkLineMenuTree(),
+        ]);
+        this.menuData = menuData || [];
+        this.trunkLineMenuData = trunkData || [];
     },
     methods: {
         handleMenuClick(nodeData) {

src/views/StatusMonitoring.vue

@@ -39,8 +39,8 @@
                             @node-click="handleMenuClick" />
                     </TechTabPane>
                     <TechTabPane label="干线" name="trunkLine" class="menu-scroll-view">
-                        <MenuItem v-for="item in menuData" :key="item.id" :node="item" :level="0"
-                            @node-click="handleMenuClick">
+                        <MenuItem v-for="item in trunkLineMenuData" :key="item.id" :node="item" :level="0"
+                            @node-click="handleTrunkLineClick">
                         <template #label="{ node }">
                             <span v-if="node.children && node.children.length > 0">{{ node.label }}</span>
                             <span v-else>{{ node.label }} 绿波带</span>
@@ -115,7 +115,7 @@ import CrossingListPanel from '@/components/ui/CrossingListPanel.vue';
 import OnlineStatusTabs from '@/components/ui/OnlineStatusTabs.vue';
 import DeviceStatusTabs from '@/components/ui/DeviceStatusTabs.vue';
 import RingDonutChart from '@/components/ui/RingDonutChart.vue';
-import { apiGetTongzhouMenuTree, apiGetTasks, apiGetTrafficTimeSpace, apiGetCrossingTopCharts, apiGetSpecialTaskMonitorData, apiGetOverviewTopCharts, apiGetCrossingDetailData } from '@/api';
+import { apiGetTongzhouMenuTree, apiGetTrunkLineMenuTree, apiGetTasks, apiGetTrafficTimeSpace, apiGetCrossingTopCharts, apiGetSpecialTaskMonitorData, apiGetOverviewTopCharts, apiGetCrossingDetailData } from '@/api';
 
 
 export default {
@@ -140,6 +140,7 @@ export default {
             // 左侧边栏数据
             activeLeftTab: '',
             menuData: [],
+            trunkLineMenuData: [],
             // 地图模式切换数据
             currentView: 'map-mode',
             viewOptions: [
@@ -178,11 +179,13 @@ export default {
     },
     async mounted() {
         // 加载菜单和任务数据
-        const [menuData, taskData] = await Promise.all([
+        const [menuData, trunkData, taskData] = await Promise.all([
             apiGetTongzhouMenuTree(),
+            apiGetTrunkLineMenuTree(),
             apiGetTasks({ pageSize: 5 }),
         ]);
         this.menuData = menuData || [];
+        this.trunkLineMenuData = trunkData || [];
         this.tableData = taskData?.list || taskData || [];
 
         // 组件挂载时检查路由
@@ -462,12 +465,26 @@ export default {
             this.showCrossingDetailDialogs(rowData);
         },
         // 显示干线弹窗组
+        // 干线菜单叶子节点点击
+        handleTrunkLineClick(nodeData) {
+            console.log('干线菜单点击:', nodeData);
+            this.showTrunkLineDalogs(nodeData);
+        },
         async showTrunkLineDalogs(nodeData) {
             console.log('显示干线弹窗组', nodeData.id, nodeData.label);
-            const tsData = await apiGetTrafficTimeSpace();
+            // 优先使用菜单节点自带的路口和距离数据
+            let tsData;
+            if (nodeData.intersections && nodeData.distances) {
+                tsData = await apiGetTrafficTimeSpace({
+                    intersections: nodeData.intersections,
+                    distances: nodeData.distances,
+                });
+            } else {
+                tsData = await apiGetTrafficTimeSpace();
+            }
             this.$refs.layout.openDialog({
                 id: nodeData.id,
-                title: nodeData.label,
+                title: nodeData.label + ' 绿波带',
                 component: 'TrafficTimeSpace',
                 width: 1000,
                 height: 500,