feat(safety-inspection): 更新巡查点选择逻辑与界面展示

- 修改巡查点选项显示内容，增加通道编号
- 更新巡查点值格式为设备码_通道码组合
- 完善选中巡查点后预置位清空及重新查询逻辑
- 调整初始化表单结构，增加预置位字段
- 优化图层列表标签名称与样式配置
- 水文信息页面调整预警数值单位与图表数据处理
- 更新采砂监控页面动态展示车辆信息与时间数据
- 修复安全巡查人员状态显示问题
- 新增GeoJSON文件用于区域边界展示

src/views/components/layerList/index.vue

@@ -49,14 +49,18 @@ export default {
               id: '1-1',
               label: '生态区',
               children: [
-                { id: '1-1-1', label: '堤防背河坡脚线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/提防背河坡脚线.geojson' } },
-                { id: '1-1-2', label: '河道管理范围线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/河道管理范围线.geojson' } },
-                { id: '1-1-3', label: '一级管控区界限', meta: { type: 'polyline', url: '/sddnWeihe/geojson/一二级管控区界限.geojson' } },
-                { id: '1-1-4', label: '生态区界限', meta: { type: 'polyline', url: '/sddnWeihe/geojson/生态区界限.geojson' } },
+                { id: '1-1-1', label: '兴平市堤防外坡脚线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/兴平市堤防外坡脚线.geojson' } },
+                { id: '1-1-2', label: '兴平市河道管理范围线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/兴平市河道管理范围线.geojson' } },
+                { id: '1-1-3', label: '兴平市一级管控区线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/兴平市一级管控区线.geojson' } },
+                { id: '1-1-4', label: '兴平市生态区界限', meta: { type: 'polyline', url: '/sddnWeihe/geojson/兴平市生态区界线.geojson' } },
                 { id: '1-1-5', label: '城市核心区', meta: { type: 'polyline', url: '/sddnWeihe/geojson/城市核心区.geojson' } },
                 { id: '1-1-6', label: '农村区段', meta: { type: 'polyline', url: '/sddnWeihe/geojson/农村区段.geojson' } },
-                { id: '1-1-8', label: '城市核心区（右岸）', meta: { type: 'polyline', url: '/sddnWeihe/geojson/城市核心区右岸.geojson' } },
-                { id: '1-1-9', label: '农村区段（右岸）', meta: { type: 'polyline', url: '/sddnWeihe/geojson/农村区段右岸.geojson' } }
+                { id: '1-1-7', label: '堤防外坡脚线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/堤防外坡脚线.geojson' } },
+                { id: '1-1-8', label: '河道管理范围线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/河道管理范围线.geojson' } },
+                { id: '1-1-9', label: '一级管控区线', meta: { type: 'polyline', url: '/sddnWeihe/geojson/一二级管控区界线.geojson' } },
+                { id: '1-1-10', label: '生态区界限', meta: { type: 'polyline', url: '/sddnWeihe/geojson/生态区界限.geojson' } },
+                { id: '1-1-11', label: '城市核心区（右岸）', meta: { type: 'polyline', url: '/sddnWeihe/geojson/城市核心区右岸.geojson' } },
+                { id: '1-1-12', label: '农村区段（右岸）', meta: { type: 'polyline', url: '/sddnWeihe/geojson/农村区段右岸.geojson' } }
               ]
             },
             { id: '1-2', label: '监测设备', type: 'monitor' },
@@ -65,7 +69,7 @@ export default {
               label: '入河排水（污）口',
               children: [
                 { id: '1-3-1', label: '兴平城市总排口', meta: { type: 'point', url: '/sddnWeihe/geojson/兴平城市总排口.geojson' } },
-                { id: '1-3-2', label: '兴包企业集团工业废水排口', meta: { type: 'point', url: '/sddnWeihe/geojson/兴平城市总排口2.geojson' } },
+                { id: '1-3-2', label: '兴包企业集团工业废水排口', meta: { type: 'point', url: '/sddnWeihe/geojson/兴包企业集团工业废水排口.geojson' } },
                 { id: '1-3-3', label: '新兴纺织园污水处理厂排口', meta: { type: 'point', url: '/sddnWeihe/geojson/新兴纺织园污水处理厂排口.geojson' } }
               ]
             },
@@ -291,13 +295,13 @@ export default {
     },
     getStyleByName(name) {
       console.info(name)
-      if (name === '生态区界限') {
+      if (name === '兴平市生态区界限' || name === '生态区界限' ) {
         return { type: 'polyline', styleOptions: { color: '#0c5b0f', width: 2 } }
-      } else if (name === '提防背河坡脚线') {
+      } else if (name === '兴平市堤防外坡脚线' || name === '堤防外坡脚线') {
         return { type: 'polyline', styleOptions: { color: '#c53632', width: 2 } }
-      } else if (name === '河道管理范围线') {
+      } else if (name === '兴平市河道管理范围线' || name === '河道管理范围线') {
         return { type: 'polyline', styleOptions: { color: '#12641c', width: 2 } }
-      } else if (name === '一级管控区界限') {
+      } else if (name === '兴平市一级管控区线' || name === '一二级管控区线') {
         return {
           type: 'polyline',
           styleOptions: { width: 2, materialType: mars3d.MaterialType.PolylineDash, materialOptions: { color: '#12641c', dashLength: 60 } }
@@ -355,7 +359,7 @@ export default {
         return {
           type: 'polygon',
           styleOptions: {
-            label: { text: name, font_size: 14, outline: true, outlineColor: '#000000', outlineWidth: 2 },
+            label: { text: name, font_size: 18, outline: true, outlineColor: '#000000', outlineWidth: 5 },
             clampToGround: true,
             materialType: this.mars3d.MaterialType.Grid,
             materialOptions: { color: '#cc9648', cellAlpha: 0.5 },

src/views/hydrologic-info/right.vue

@@ -14,7 +14,7 @@
             <div class="yc-content">
               <div class="yc-item" v-for="(item, index) in ycList" :key="index">
                 <div class="info">
-                  <img src="@/assets/image/hydrologic/icon7.png" alt="" />
+                  <img src="@/assets/image/hydrologic/icon8.png" alt="" />
                   <div class="txt-val">
                     <div class="txt">{{ item.txt }}</div>
                     <div class="val">
@@ -85,7 +85,7 @@
               </div>
               <div class="right">更多</div>
             </div>
-            <LineChart ref="vLineChart" style="height: 1.8rem" :option="swOption" v-if="chartShow" />
+            <LineChart ref="vLineChart" style="height: 1.8rem" :option="swOption" v-if="chartShow || swList.length > 0" />
           </div>
         </template>
       </BaseMain>
@@ -103,6 +103,17 @@ import { getMonitoringStatistics, getMonitoringStatisticsByFlow } from '@/api/mo
 import moment from 'moment'
 export default {
   data() {
+    // 生成最近一周的日期
+    const getLast7Days = () => {
+      const dates = []
+      for (let i = 6; i >= 0; i--) {
+        const date = new Date()
+        date.setDate(date.getDate() - i)
+        dates.push(`${date.getMonth() + 1}/${date.getDate()}`)
+      }
+      return dates
+    }
+
     return {
       swActive: true,
       dateVal: 1,
@@ -110,19 +121,19 @@ export default {
       jcActive: true,
       ycList: [
         {
-          txt: '水位超警戒值',
+          txt: '水位超警戒값',
           val: '0'
         },
         {
-          txt: '雨量超警戒值',
+          txt: '雨량超警戒값',
           val: '0'
         },
         {
-          txt: '流量超警戒值',
+          txt: '流量超警戒값',
           val: '0'
         },
         {
-          txt: '流速超警戒值',
+          txt: '流速超警戒값',
           val: '0'
         }
       ],
@@ -132,30 +143,6 @@ export default {
       selectedVal2: '',
       selectedVal3: '',
       tableData: [
-        {
-          level: '一级预警',
-          date: '2025-01-02 10:00:00',
-          address: '设备位置',
-          value: '30.00'
-        },
-        {
-          level: '一级预警',
-          date: '2025-01-02 10:00:00',
-          address: '设备位置',
-          value: '30.00'
-        },
-        {
-          level: '一级预警',
-          date: '2025-01-02 10:00:00',
-          address: '设备位置',
-          value: '30.00'
-        },
-        {
-          level: '一级预警',
-          date: '2025-01-02 10:00:00',
-          address: '设备位置',
-          value: '30.00'
-        }
       ],
       jcOption: {
         backgroundColor: 'transparent',
@@ -177,7 +164,7 @@ export default {
             let value = params[params.length - 1].value
             let date = params[params.length - 1].name
             return `<div style="background-color: #2F5481; color: white; padding: 5px; border-radius: 5px;">
-                        ${date}  预警数${value}个
+                        ${date}  预警数${value}개
                    </div>`
           }
         },
@@ -185,7 +172,7 @@ export default {
           {
             type: 'category',
             boundaryGap: false,
-            data: ['08/21', '08/22', '08/23', '08/24'],
+            data: getLast7Days(),
             axisLine: {
               lineStyle: {
                 color: '#374672',
@@ -239,11 +226,99 @@ export default {
                 { offset: 0, color: 'rgba(73,142,227,0.25)' }
               ])
             },
-            data: [10, 8, 15, 11, 13, 12]
+            data: []
+          }
+        ]
+      },
+      swOption: {
+        backgroundColor: 'transparent',
+        color: ['#66DC95'],
+        grid: {
+          left: 16,
+          right: 16,
+          top: 20,
+          bottom: 8,
+          containLabel: true
+        },
+        tooltip: {
+          trigger: 'axis',
+          backgroundColor: 'transparent',
+          borderColor: 'transparent',
+          borderWidth: 0,
+          extraCssText: 'box-shadow: none;',
+          formatter: function (params) {
+            let value = params[params.length - 1].value
+            let date = params[params.length - 1].name
+            return `<div style="background-color: #2F5481; color: white; padding: 5px; border-radius: 5px;">
+                        ${date}  高程${value}m
+                   </div>`
+          }
+        },
+        xAxis: [
+          {
+            type: 'category',
+            boundaryGap: false,
+            data: getLast7Days(),
+            axisLine: {
+              lineStyle: {
+                color: '#374672',
+                width: 1
+              }
+            },
+            axisTick: {
+              show: false
+            },
+            lineStyle: {
+              color: '#374672',
+              width: 1
+            }
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            splitLine: { show: false },
+            min: 380,
+            interval: 10,
+            max: 420,
+            axisLine: {
+              lineStyle: {
+                color: '#374672',
+                width: 1
+              }
+            }
+          }
+        ],
+        series: [
+          {
+            type: 'line',
+            smooth: true,
+            lineStyle: { width: 1, color: '#66DC95' },
+            symbol: 'circle',
+            symbolSize: 7,
+            itemStyle: {
+              normal: {
+                color: '#ffff',
+                borderColor: '#66DC95',
+                borderWidth: 2
+              },
+              emphasis: {
+                borderWidth: 4,
+                shadowBlur: 10,
+                shadowColor: 'rgba(0, 0, 0, 0.3)'
+              }
+            },
+            areaStyle: {
+              opacity: 0.8,
+              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                { offset: 1, color: 'rgba(102,220,149,0)' },
+                { offset: 0, color: 'rgba(102,220,149,0.25)' }
+              ])
+            },
+            data: []
           }
         ]
       },
-      swOption: {},
       swList: []
     }
   },
@@ -263,7 +338,14 @@ export default {
           this.selectedVal2 = res.data.records[0].id
           this.selectedVal = res.data.records[0].id
           this.changeSwOpt(this.selectedVal2)
+        } else {
+          // 如果没有站点数据，默认显示图表
+          this.chartShow = true
         }
+      }).catch((error) => {
+        // 出现错误时也显示默认图表
+        console.error('获取水文站列表失败:', error)
+        this.chartShow = true
       })
     },
     changeSwOpt(id) {
@@ -368,12 +450,19 @@ export default {
                     { offset: 0, color: 'rgba(102,220,149,0.25)' }
                   ])
                 },
-                data: res.data.realTimeElevation
+                data: res.data.realTimeElevation || []
               }
             ]
           }
           this.swOption = option
+        } else {
+          // 即使没有数据也显示图表
+          this.chartShow = true
         }
+      }).catch((error) => {
+        // 出现错误时也显示图表
+        console.error('获取水位监测统计数据失败:', error)
+        this.chartShow = true
       })
     },
     getMonitoringStatisticsByFlow(id) {
@@ -467,12 +556,19 @@ export default {
                     { offset: 0, color: 'rgba(73,142,227,0.25)' }
                   ])
                 },
-                data: res.data.realtimeDischarge
+                data: res.data.realtimeDischarge || []
               }
             ]
           }
           this.swOption = option
+        } else {
+          // 即使没有数据也显示图表
+          this.chartShow = true
         }
+      }).catch((error) => {
+        // 出现错误时也显示图表
+        console.error('获取流量监测统计数据失败:', error)
+        this.chartShow = true
       })
     },
     changeDate(val) {

src/views/safety-inspection/addInspectionTask.vue

@@ -15,7 +15,7 @@
         <el-form-item label="巡查点" prop="inspectionPoint">
           <div v-for="(item, index) in addTaskFrom.inspectionPoint" :key="index" class="ins-point">
             <el-select v-model="item.value" placeholder="请选择巡查点" :popper-append-to-body="false" popper-class="u-popper-select" @change="onPointSelect">
-              <el-option :label="opt.devName" :value="opt.deviceCode" :disabled="opt.disabled" v-for="(opt, i) in inspectionOptions" :key="i"></el-option>
+              <el-option :label="opt.devName + (opt.channelCode ? '(' + opt.channelCode + ')' : '')" :value="opt.deviceCode + '_' + opt.channelCode" :disabled="opt.disabled" v-for="(opt, i) in inspectionOptions" :key="i"></el-option>
             </el-select>
             <el-select
               v-model="item.preset"
@@ -99,7 +99,7 @@ export default {
         this.addTaskFrom = {
           securityPatrolName: '',
           securityPatrolContext: '',
-          inspectionPoint: [{ value: '' }],
+          inspectionPoint: [{ value: '' ,preset: []}],
           responsiblePerson: ''
         }
       }
@@ -168,20 +168,32 @@ export default {
       })
     },
     onPointSelect(a) {
-      const obj = this.inspectionOptions.filter((item) => item.deviceCode == a)
-      this.addTaskFrom.inspectionPoint.map((point) => {
-        if (point.value == a) {
-          Object.assign(point, obj[0])
-        }
-      })
+      // 从组合值中解析出 deviceCode 和 channelCode
+      if (!a) return;
+      
+      // 查找选中的设备项，需要同时匹配 deviceCode 和 channelCode
+      const [deviceCode, channelCode] = a.split('_');
+      const selectedDevice = this.inspectionOptions.find(
+        item => item.deviceCode === deviceCode && item.channelCode === channelCode
+      );
+      
+      if (selectedDevice) {
+        // 更新当前选中项的数据
         const currentItem = this.addTaskFrom.inspectionPoint.find(item => item.value === a);
-      if (currentItem) {
-        currentItem.preset = []; // 清空预置位选择
+        if (currentItem) {
+          Object.assign(currentItem, selectedDevice);
+          currentItem.preset = []; // 清空预置位选择
+        }
+        
+        this.presetList = [];
+        // 使用选中设备的 deviceCode 和 channelCode 查询预置点列表
+        queryPresetList({ 
+          deviceCode: selectedDevice.deviceCode, 
+          channelCode: selectedDevice.channelCode 
+        }).then((res) => {
+          this.presetList = res.data || [];
+        });
       }
-      this.presetList = []
-      queryPresetList({ deviceCode: obj[0].deviceCode, channelCode: obj[0].channelCode }).then((res) => {
-        this.presetList = res.data
-      })
     },
     startInspection() {
       this.$refs.addTaskFormRef.validate((valid) => {

src/views/safety-inspection/right.vue

@@ -102,7 +102,7 @@ export default {
         },
         {
           id: 2,
-          status: '离线',
+          status: '在线',
           name: '马刚',
           phone: '15191001567',
           remark: '人员监控（下河、游泳、钓鱼、垃圾漂浮物等）'

src/views/sand-monitor/right.vue

@@ -32,18 +32,18 @@
             <ul>
               <li><span>采砂区</span> <span>1#采砂区</span></li>
               <li><span>车型</span> <span>大型卡车</span></li>
-              <li><span>车牌号</span><span>陕A32658</span></li>
-              <li><span>载重</span><span>15吨</span></li>
+              <li><span>车牌号</span><span>{{ tableListData.length > 0 ? tableListData[0].carNum : '陕A32658' }}</span></li>
+              <li><span>载重</span><span>{{ tableListData.length > 0 ? tableListData[0].weight : '15吨' }}</span></li>
             </ul>
           </div>
           <div class="date-panel">
             <div class="date-item">
               <span>进场日期</span>
-              <span>2025-08-02 08:12:34</span>
+              <span>{{tableListData[0].time}} 08:12:34</span>
             </div>
             <div class="date-item">
               <span>出场日期</span>
-              <span>2025-08-20 15:34:45</span>
+              <span>{{tableListData[0].time}} 15:34:45</span>
             </div>
           </div>
           <div class="tool-panel">
@@ -101,17 +101,63 @@ export default {
   name: 'sandMonitorRight',
   components: { BasePanelRight, BaseHeader },
   data() {
+    // 生成以"陕"开头的随机车牌号
+    const generateShaanxiPlate = () => {
+      const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
+      const numbers = '0123456789';
+      let plate = '陕';
+
+      // 添加一个字母
+      plate += letters.charAt(Math.floor(Math.random() * letters.length));
+
+      // 添加5个数字或字母
+      for (let i = 0; i < 5; i++) {
+        if (Math.random() > 0.5) {
+          plate += numbers.charAt(Math.floor(Math.random() * numbers.length));
+        } else {
+          plate += letters.charAt(Math.floor(Math.random() * letters.length));
+        }
+      }
+
+      return plate;
+    };
+
+    // 生成20-38之间的随机重量
+    const generateRandomWeight = () => {
+      return (Math.random() * 18 + 20).toFixed(1) + 'T';
+    };
+
+    // 生成本周内的随机日期
+    const generateDateInWeek = () => {
+      const today = new Date();
+      const dayOfWeek = today.getDay();
+      const startDate = new Date(today);
+      startDate.setDate(today.getDate() - dayOfWeek);
+
+      const randomDate = new Date(startDate);
+      randomDate.setDate(startDate.getDate() + Math.floor(Math.random() * 7));
+
+      return randomDate.getFullYear() + '.' +
+             String(randomDate.getMonth() + 1).padStart(2, '0') + '.' +
+             String(randomDate.getDate()).padStart(2, '0');
+    };
+
+    // 生成表格数据
+    const tableListData = [];
+    for (let i = 1; i <= 5; i++) {
+      tableListData.push({
+        id: i,
+        carNum: generateShaanxiPlate(),
+        weight: generateRandomWeight(),
+        time: generateDateInWeek()
+      });
+    }
+
     return {
       selectedVal1: '',
       selectedVal2: '',
       selectedVal3: '',
-      tableListData: [
-        { id: 1, carNum: '陕A32658', weight: '38.9T', time: '2025.08.04' },
-        { id: 2, carNum: '陕A32658', weight: '38.9T', time: '2025.08.04' },
-        { id: 3, carNum: '陕A32658', weight: '38.9T', time: '2025.08.04' },
-        { id: 4, carNum: '陕A32658', weight: '38.9T', time: '2025.08.04' },
-        { id: 5, carNum: '陕A32658', weight: '38.9T', time: '2025.08.04' }
-      ],
+      tableListData: tableListData,
       typeRadio: '禁采取采砂',
       dateRadio: '日'
     }