feat:积水点部分功能提交

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)

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',
+              position: 'inside',
-              distance: 5,
+              distance: 0,
-              color: 'fe982a',
+              formatter: function(param) {
-              fontSize: 18
+                if(param.value > 0)
+                  return param.value
+                else return ''
+              },
+              textStyle: {
+                color: '#fff',
+                fontSize: 12
+              }
             }
           }
         ]

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>

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 = {