feat:积水点部分功能提交

2022-08-25 17:07:17 +08:00 · 2022-08-25 17:07:17 +08:00 · 3609bf595e
parent a384e13eb1
commit 3609bf595e
4 changed files with 106 additions and 14 deletions
--- a/src/views/pages/waterPoints/components/ComplaintEvent.vue
+++ b/src/views/pages/waterPoints/components/ComplaintEvent.vue
@ -41,11 +41,12 @@
          <div class="top">
            <div>
              <span class='name'>{{item.waterPointName}}</span>
-              <span class='topType' v-show="item.reportOrigin !== '2'">{{reportOrigin(item.reportOrigin)}}</span>
+              <!-- <span class='topType' v-show="item.reportOrigin !== '2'">{{reportOrigin(item.reportOrigin)}}</span> -->
+              <span class='topType' v-show="item.reportOrigin !== '2' && tabsActiveName === '全部'">{{item.waterPointDepth != null ? '水务局' : '水务集团'}}</span>
            </div>
            <div>
              <span class="img" :class=" item.pointLevel=='traffic' ? 'red' : item.pointLevel=='pedestrian' ? 'yellow' : 'green' "></span>
-              <span class="type">{{item.pointLevel=='traffic' ? '影响车辆(>30cm)' : item.pointLevel=='pedestrian' ? '影响行人(<30cm)' : '无积水(<10cm)' }}</span>
+              <span class="type">{{ getDesc(item) }}</span>
            </div>
          </div>
          <div class="bottom">
@ -78,7 +79,7 @@ export default {
        },
        {
          title:'水务局',
-          id:'null'
+          id:'auditorReport'
        },
        {
          title:'城管局',
@ -90,7 +91,7 @@ export default {
        },
        {
          title:'水务集团',
-          id:'auditorReport'
+          id:'null'
        },
        {
          title:'群众上报',
@ -160,6 +161,20 @@ export default {
    // })
  },
  methods: {
+    getDesc(item) {
+      let deepth = item.waterPointDepth ? parseFloat(item.waterPointDepth) * 100 : 0
+      switch(item.pointLevel) {
+        case 'traffic':
+          return `影响车辆(${deepth}cm)`
+          break
+        case 'pedestrian':
+          return `影响行人(${deepth}cm)`
+          break
+        default:
+          return `无积水(${deepth}cm)`
+          break
+      }
+    },
    selectType (item) {
      if (this.filterButton.typeActive.indexOf(item) > -1) {
        this.filterButton.typeActive.splice(this.filterButton.typeActive.indexOf(item), 1)
--- a/src/views/pages/waterPoints/components/SiteList.vue
+++ b/src/views/pages/waterPoints/components/SiteList.vue
@ -188,7 +188,7 @@ export default {
          }
        },
        grid: {
-          bottom: 40,
+          bottom: 30,
          top:10,
        },
        xAxis: {
@ -238,10 +238,17 @@ export default {
            barWidth: 23,
            label: {
              show: true,
-              position: 'top',
-              distance: 5,
-              color: 'fe982a',
-              fontSize: 18
+              position: 'inside',
+              distance: 0,
+              formatter: function(param) {
+                if(param.value > 0)
+                  return param.value
+                else return ''
+              },
+              textStyle: {
+                color: '#fff',
+                fontSize: 12
+              }
            }
          }
        ]
--- a/src/views/pages/waterPoints/components/WaterPointPop.vue
+++ b/src/views/pages/waterPoints/components/WaterPointPop.vue
@ -23,9 +23,14 @@
            width: 280px;
            height: 158px;
            cursor: pointer;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border: #f2f2f2 1px solid;
          "
        >
-          <img @click="show" style="width:100%;height:100%;" :src="feature.data.videoCapture||''" alt="">
+          <img v-if="feature.data.videoCapture" @click="show" style="width:100%;height:100%;" :src="feature.data.videoCapture||''" alt="">
+          <span v-else>暂无视频内容</span>
        </div>
        <div class="video-table">
          <h4>周边监控</h4>
@ -47,7 +52,12 @@
          >
            <el-table-column align="center" width="64" label="序号" type="index" style="text-align: center">
            </el-table-column>
-            <el-table-column prop="cameraName" label="设备名称" show-overflow-tooltip></el-table-column>
+            <el-table-column prop="cameraName" label="设备名称" show-overflow-tooltip>
+              <template slot-scope="scope">
+                <span v-if="scope.row.cameraName">{{ scope.row.cameraName }}</span>
+                <span v-else>暂无设备</span>
+              </template>
+            </el-table-column>
          </el-table>
        </div>
      </div>
@ -58,6 +68,9 @@
    <div>
      更新时间: {{ feature.data.updatedDate || "" }}
    </div>
+    <div class="btn-area">
+      <button class="button" @click="analyse(feature)">线索分析</button>
+    </div>
  </div>
 </template>
 <script>
@ -123,7 +136,10 @@ export default {
      const viewer = this.$el.querySelector('.images').$viewer
      viewer.show()
    },
-
+    // 线索分析
+    analyse(data) {
+      bus.$emit('waterPointAnalysis',data)
+    },
    openVideo(row){
      console.log(row)
      bus.$emit('openCurrentVideoWaterPoint',row.channelCode)
@ -148,7 +164,7 @@ export default {
    }
    .leaflet-popup-content {
      width: 634px !important;
-      height: 400px;
+      height: 420px;
      padding: 12px 16px;
      .pop-box {
        width: 100%;
@ -275,4 +291,18 @@ export default {
    color: #fff;
  }
 }
+.btn-area {
+  margin: 10px 0;
+  text-align: right;
+  .button {
+    width: 144px;
+    height: 50px;
+    background: url("~@/assets/img/roadGovernancePop.png") no-repeat;
+    color: #082d36;
+    line-height: 10px;
+    text-align: center;
+    border: none;
+    cursor: pointer;
+  }
+}
 </style>
--- a/src/views/pages/waterPoints/index.vue
+++ b/src/views/pages/waterPoints/index.vue
@ -93,6 +93,7 @@
 import { HieimpMap } from '@/supermap/map-init'
 import TiledMap from './components/tiledMap'
 import { searchCamera } from '@/api/videoSurveillance/index'
+import { selectAllByGps } from '@/api/road'
 import bus from '@/views/layout/bus'
 import complaintEvent from './components/ComplaintEvent'
 import VideoList from './components/VideoList'
@ -132,7 +133,11 @@ export default {
      this.hiMap.mapObj,
      this.hiMapFun
    )
-
+    bus.$off('openCurrentVideoSurveillance')
+    bus.$on('openCurrentVideoSurveillance', (channelCode) => {
+      this.openVideo = true
+      this.channelCode.unshift(channelCode)
+    })
    bus.$off('openCauseAnalysis')
    bus.$on('openCauseAnalysis', (row) => {
      this.hiMap.mapObj.map.flyTo({ lat: row.wd, lng: row.jd })
@ -150,6 +155,14 @@ export default {
      )
    })

+    bus.$off('waterPointAnalysis')
+    bus.$on('waterPointAnalysis', (row) => {
+      this.hiMapFun.removerPolygon()
+      this.hiMapFun.removeLayerByLayerName('videoSurveillance')
+      this.circle(row.latLng)
+      this.selectAllByGps(row.latLng)
+    })
+
    bus.$off('waterPoint')
    bus.$on('waterPoint', (waterPointData) => {
      this.waterPointOnMap(waterPointData)
@ -221,6 +234,33 @@ export default {
    circle (latlng) {
      this.hiMapFun.addCircleToMap(latlng, 3500)
    },
+    // 根据经纬度和半径查询摄像头
+    async selectAllByGps (data) {
+      const param = {
+        gpsX: data.lng,
+        gpsY: data.lat,
+        radius: 3000
+      }
+
+      const res = await selectAllByGps(param)
+      const dataEvent = []
+      res.data.data.forEach((item) => {
+        const arr = [0, 0.0, '', '0', '0.0']
+        if (arr.indexOf(item.gpsX) == -1) {
+          dataEvent.push({
+            latLng: { lat: Number(item.gpsY), lng: Number(item.gpsX) },
+            data: item,
+            type: 'videoSurveillance'
+          })
+        }
+      })
+      this.hiMapFun.addResourceOnMapWithoutSuperMapCluster(
+        dataEvent,
+        'videoSurveillance.png',
+        'videoSurveillance',
+        createCameraDetailsPop
+      )
+    },
    // 根据经纬度查半径内的工地
    async WithinRadiusSite (data) {
      const param = {