fix-点击地图车辆可取消视频

src/views/cardIot/Map/index.vue

@@ -35,6 +35,7 @@ export default {
       carMarker: null,
       pos: [],
       posIndex: 0,
+      carId2: null,
     }
   },
   provide() {
@@ -46,14 +47,15 @@ export default {
   props: {
     idInfo: Object,
     showRang: String,
-    carInfos:Object
+    carInfos: Object,
   },
   watch: {
     idInfo: {
       handler(val) {
-        this.markeList && this.markeList.forEach((element) => {
-          this.map.remove(element)
-        })
+        this.markeList &&
+          this.markeList.forEach((element) => {
+            this.map.remove(element)
+          })
         if (this.timer) {
           clearTimeout(this.timer)
         }
@@ -67,20 +69,6 @@ export default {
       },
       deep: true,
     },
-    carInfos:{
-      handler(newVal){
-        this.markeList && this.markeList.forEach((element) => {
-          this.map.remove(element)
-        })
-        if (this.timer) {
-          clearTimeout(this.timer)
-        }
-        // console.log('----------id22',newVal.id);
-        this.ids = newVal.id
-        this.addCarMaker(this.AMap)
-      },
-      deep:true
-    }
   },
 
   methods: {
@@ -90,7 +78,7 @@ export default {
       }
     },
     // 添加遮罩
-    addMask () {
+    addMask() {
       const outer = [
         new this.AMap.LngLat(-360, 90, true),
         new this.AMap.LngLat(-360, -90, true),
@@ -100,10 +88,10 @@ export default {
       new this.AMap.GeoJSON({
         geoJSON: geojson,
         getPolygon: (geojson, lnglats) => {
-          console.log('面',lnglats)
+          // console.log('面', lnglats)
           const pathArray = [
             // outer, //外边界
-            lnglats[0][0] //内边界需要遮罩区域
+            lnglats[0][0], //内边界需要遮罩区域
           ]
           var polygon = new AMap.Polygon({
             pathL: pathArray,
@@ -113,15 +101,14 @@ export default {
           })
           polygon.setPath(pathArray)
           this.map.add(polygon)
-        }
+        },
       })
-
     },
     async initMap() {
       return AMapLoader.load({
         key: 'a09220a9ab56352435dd123abf0c37f6', // 申请好的Web端开发者Key，首次调用 load 时必填
         version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
-        plugins: ['AMap.MoveAnimation','AMap.RangingTool', 'AMap.MouseTool', 'AMap.DistrictSearch', 'AMap.GeoJSON'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等      AMap.RangingTool（测距）
+        plugins: ['AMap.MoveAnimation', 'AMap.RangingTool', 'AMap.MouseTool', 'AMap.DistrictSearch', 'AMap.GeoJSON'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等      AMap.RangingTool（测距）
       })
         .then((AMap) => {
           this.AMap = AMap
@@ -146,13 +133,13 @@ export default {
           })
           this.mouseTool.close(true)
           // 加载消防车辆信息
-          this.loadFireCarInfo(AMap)
+          return this.loadFireCarInfo(AMap)
         })
         .catch((e) => {
           console.log(e)
         })
     },
-    imageIcon(isPublic,status, isOnline) {
+    imageIcon(isPublic, status, isOnline) {
       if (isPublic) {
         if (status === 2) {
           return CarRepair
@@ -167,7 +154,7 @@ export default {
       }
     },
     // 加载消防车辆
-    loadFireCarInfo(AMap) {
+    async loadFireCarInfo(AMap) {
       const cache = {}
       const that = this
       // 刷新消防车辆
@@ -175,9 +162,8 @@ export default {
         const params = {
           deptId: that.depId,
         }
-        getCarList(params).then((res) => {
+        return getCarList(params).then((res) => {
           for (const car of res.data) {
-
             const imageIcon = that.imageIcon(car.categoryId === 2, car.status, car.onlineStatus === 1)
 
             const carImage = {
@@ -201,7 +187,7 @@ export default {
                   <div style='width:100%;height:40px;border-bottom: 1px solid #EFEFEF;position:relative;padding:0 12px;display:flex;align-items: center;justify-content:space-between;'>
                     <span style='font-size: 18px;font-weight: bold;margin-right:4px;'>${car.plateNumber}</span>
                     <span style='display:inline-block;font-size:12px;border: 1px solid #547CD5;border-radius: 2px;color:#547CD5;padding:1px 5px;'>${
-                      (car.onlineStatus === 1 ? '在线' : '离线')
+                      car.onlineStatus === 1 ? '在线' : '离线'
                     }</span>
                   </div>
                   <div style="width:100%;padding:4px 12px;">${car.depName}</div>
@@ -223,7 +209,7 @@ export default {
             })
             // 点击消防车车
             marker.on('click', (e) => {
-              that.$emit('clickCarItem', car)
+              that.$emit('clickCarItem', car, 1)
             })
 
             if (cache[car.id] && that.map) {
@@ -238,7 +224,7 @@ export default {
           }, 10 * 1000)
         })
       }
-      refreshFireCar()
+      return await refreshFireCar()
     },
     addCarMaker(AMap) {
       const cache = {}
@@ -248,7 +234,7 @@ export default {
         getCarInfo(that.ids).then((res) => {
           const car = res.data
           const carImage = {
-            image:  that.imageIcon(car.categoryId === 2, car.status, car.onlineStatus === 1),
+            image: that.imageIcon(car.categoryId === 2, car.status, car.onlineStatus === 1),
             size: [40, 40],
             imageSize: [40, 40],
           }
@@ -263,11 +249,11 @@ export default {
           })
           // 基础信息模块
           const content = [
-          `<div class='info_box_contant' style="background: rgba(255, 255, 255);">
+            `<div class='info_box_contant' style="background: rgba(255, 255, 255);">
                   <div style='width:100%;height:40px;border-bottom: 1px solid #EFEFEF;position:relative;padding:0 12px;display:flex;align-items: center;justify-content:space-between;'>
                     <span style='font-size: 18px;font-weight: bold;margin-right:4px;'>${car.plateNumber}</span>
                     <span style='display:inline-block;font-size:12px;border: 1px solid #547CD5;border-radius: 2px;color:#547CD5;padding:1px 5px;'>${
-                      (car.onlineStatus === 1 ? '在线' : '离线')
+                      car.onlineStatus === 1 ? '在线' : '离线'
                     }</span>
                   </div>
                   <div style="width:100%;padding:4px 12px;">${car.depName}</div>
@@ -290,8 +276,18 @@ export default {
           // 点击消防车车
           marker.on('click', (e) => {
             // basicInfo.close()
-            console.log(e);
-            // that.$emit('clickCarItem', car)
+            // console.log(e);
+            // that.$emit('clickCarBack')
+            that.markeList &&
+              that.markeList.forEach((element) => {
+                that.map.remove(element)
+              })
+            if (that.timer) {
+              clearTimeout(that.timer)
+            }
+            that.depId = 100
+            that.loadFireCarInfo(that.AMap)
+            that.$emit('clickCarBack')
           })
 
           if (cache[car.id] && that.map) {
@@ -309,9 +305,26 @@ export default {
     },
   },
   mounted() {
-    // 初始化完成进行地图初始化
-    this.initMap()
+    this.carId2 = this.$route.query.id
+    this.initMap().then(() => {
+    
+      // 初始化完成进行地图初始化
+      if (this.carId2) {
+        if (this.timer) {
+          clearTimeout(this.timer)
+        }
+        this.markeList &&
+          this.markeList.forEach((element) => {
+            this.map.remove(element)
+          })     
+        this.ids = this.carId2
+        this.addCarMaker(this.AMap)
+      }
+    })
   },
+  // created() {
+  //   this.carId2 = this.$route.query.id
+  // },
 }
 </script>
 

src/views/cardIot/components/FireStationDetails.vue

@@ -73,7 +73,6 @@ export default {
   methods: {
     FunInfo() {
       getCarInfo(this.id || this.carIds).then((res) => {
-        console.log('-------路由传参', res)
         this.carinfo = res.data
       })
     },
@@ -82,7 +81,6 @@ export default {
     if (this.carIds) {
       this.FunInfo()
     }
-    console.log('-------路由传参', this.carIds)
   },
   // created() {
   //   this.FunInfo()

src/views/cardIot/components/TreeCar.vue

@@ -79,6 +79,9 @@
       <div style="margin-top: 10px; margin-left: 10px; pointer-events: all" v-if="show != 2 && !videoid && !showFlag">
         <a-button type="primary" @click="ChangeBtn"> {{ showBtn ? '收起' : '展开' }} </a-button>
       </div>
+      <!-- <div style="margin-left: 15px;pointer-events: all;margin-top: 10px;">
+        <a-button type="primary" @click="Back"> 返回 </a-button>
+      </div> -->
     </div>
     <div>
       <!-- 机构详情 -->
@@ -101,6 +104,7 @@
         </div>
       </div>
       <!-- 在线车辆视频 -->
+      <!-- <div>carIds---{{ treeShow }}</div> -->
       <!-- <div>showFlag---{{ showFlag }}</div> 
       <div>carIds---{{ carIds }}</div> 
       <div>showBtn---{{ showBtn }}</div>
@@ -113,13 +117,15 @@
       <div>videoid---------{{ videoid }}</div>
       <div>carIds---------{{ carIds }}</div>
     v-if="videoid || showFlag != false&&carIds" -->
-      <div v-if="showFlag == true||carIds&&!showBtn">
-        <Video :carInfo="carInfo" :videoid="videoid" />
-        <!-- 机构详情 -->
-        <FireStationDetails :deptIds="deptIds" />
-        <!-- 油箱 -->
-        <!-- <QuantityOil /> -->
-        <QuantityOil />
+      <div v-if="treeShow && treeShow == 1">
+        <div v-if="showFlag == true || (carIds && !showBtn)">
+          <Video :carInfo="carInfo" :videoid="videoid" />
+          <!-- 机构详情 -->
+          <FireStationDetails :deptIds="deptIds" />
+          <!-- 油箱 -->
+          <!-- <QuantityOil /> -->
+          <QuantityOil />
+        </div>
       </div>
     </div>
     <!-- <div class="gj-img" v-if="videoid"></div> -->
@@ -127,7 +133,7 @@
 </template>
 
 <script>
-import { getCarTree, getCarList, getCarLocation,getCarInfo} from '@/api/iot'
+import { getCarTree, getCarList, getCarLocation, getCarInfo } from '@/api/iot'
 import Statistics from './Statistics.vue'
 import Video from './Video.vue'
 import QuantityOil from './QuantityOil.vue'
@@ -154,6 +160,7 @@ export default {
     carId: String,
     showVideos: Boolean,
     idVal: Object,
+    carTreeShow: Number,
   },
   watch: {
     carId: {
@@ -163,6 +170,13 @@ export default {
       immediate: true,
       deep: true,
     },
+    carTreeShow: {
+      handler(val) {
+        this.treeShow = val
+      },
+      immediate: true,
+      deep: true,
+    },
     showVideos: {
       handler(val) {
         this.showFlag = val
@@ -176,7 +190,7 @@ export default {
           this.showFlag = true
           this.deptIds = newVal
           this.values = newVal.plateNumber
-          this.carInfo=newVal
+          this.carInfo = newVal
         }
       },
       // immediate:true,
@@ -185,10 +199,14 @@ export default {
     // carIds: {
     //   handler(newVal) {
     //     if (newVal) {
-    //       this.showFlag = true
+    //       const obj = {
+    //         id: newVal,
+    //         categoryId: 2,
+    //       }
+    //       this.$emit('changCarIdMap', obj, 1)
     //     }
     //   },
-    //   immediate:true,
+    //   immediate: true,
     //   // deep: true,
     // },
   },
@@ -211,6 +229,8 @@ export default {
       objCarinfo: null,
       deptIds: {},
       showFlag: null,
+      treeShow: null,
+      carIds: '',
     }
   },
   methods: {
@@ -248,7 +268,6 @@ export default {
       this.autoExpandParent = false
     },
     onChangeSel(e) {
-    
       const value = e.target.value
       const expandedKeys = this.dataList
         .map((item) => {
@@ -290,8 +309,8 @@ export default {
       this.showBtn = !this.showBtn
     },
     OnlineCar(val) {
-      console.log('------------在线车辆',val);
-      this.$emit('changCarIdMap',val)
+      // console.log('--------',val);
+      this.$emit('changCarIdMap', val, 1)
       // this.show = 2
       this.showFlag = true
       this.deptIds = val
@@ -307,16 +326,27 @@ export default {
   created() {
     this.FunTree()
     this.funcarList()
-    this.videoid= this.$route.query.cqVehicleId
+    this.videoid = this.$route.query.cqVehicleId
+    this.carIds = this.$route.query.id
+  },
+  method() {
+    if (this.carIds) {
+      const obj = {
+        id: this.carIds,
+        categoryId: 2,
+        status:'3',
+        onlineStatus:1
+      }
+      this.$emit('changCarIdMap', obj, 1)
+    }
   },
-
   computed: {
     carTree() {
       return this.gData
     },
-    carIds() {
-      return this.$route.query.id
-    },
+    // carIds() {
+    //   return this.$route.query.id
+    // },
     // videoid(){
     //   return
     // }

src/views/cardIot/components/Video.vue

@@ -137,7 +137,7 @@ export default {
   methods: {
     FunVdieoList() {
       // g公务车情况
-      if (this.carInfo1.categoryId ===2) {
+      if (this.carInfo1&&this.carInfo1.categoryId ===2) {
         const data = {
           vehicleId: this.carInfo1.id,
         }

src/views/cardIot/index.vue

@@ -1,10 +1,10 @@
 <template>
   <page-full-content>
-    <Map @clickCarItem="clickCarItem" :idInfo="idInfo" :carInfos="carInfos" @move="(e) => (moveValue = e)" ref="refMap">
+    <Map @clickCarItem="clickCarItem" :idInfo="idInfo" :carInfos="carInfos" @move="(e) => (moveValue = e)" ref="refMap" @clickCarBack="clickCarBack">
       <CarPathHistory ref="pathHistory" :idInfo="idInfo" />
     </Map>
     <div class="tree-car">
-      <TreeCar :carId="carId" @changeCar="changeCar" :showVideos="showVideos" :idVal="idVal" @changCarIdMap="changCarIdMap" />
+      <TreeCar :carId="carId" @changeCar="changeCar" :showVideos="showVideos" :idVal="idVal" @changCarIdMap="changCarIdMap" :carTreeShow="carTreeShow" />
     </div>
     <div class="car-sta">
       <VehicleStatistics @rangEv="rangEv" :idInfo="idInfo" />
@@ -38,6 +38,7 @@ export default {
       idInfo: {},
       showRang: '',
       isStart: false,
+      carTreeShow:1,
       isPause: true,
       showVideos: null,
       idVal: {},
@@ -55,6 +56,7 @@ export default {
     },
     clickCarItem(val) {
       // console.log('---------点击地图车车',val);
+      this.carTreeShow=1
       this.showVideos = true
       this.idVal = val
       this.carId = val.cqVehicleId
@@ -92,9 +94,12 @@ export default {
         }
       })
     },
-    changCarIdMap(item){
-      console.log('-----点击了在线车车',item);
+    changCarIdMap(item,val){
+      this.carTreeShow=val
      this.carInfos=item
+    },
+    clickCarBack(){
+      this.carTreeShow=2
     }
   },
 }

src/views/clw/KeyCase/index.vue

@@ -28,8 +28,10 @@
                               font-weight: bold;
                               margin-left: -18px;
                             "
+                            v-if="cabinetInfo['key.title']"
                             >{{ cabinetInfo['key.title'] }}</span
                           >
+                          <span style="font-size: 18px;color: #8f8f8f;letter-spacing: 1px;" v-if="!cabinetInfo['key.title']">文字描述(空)</span>
                           <img
                             style="width: 10px; height: 10px; display: inline-block; cursor: pointer"
                             src="../../../assets/vehicle/xg.png"
@@ -39,23 +41,32 @@
                           <span style="margin-right: 30px">字数限制7个字</span>
                         </div>
                         <div class="text-edit">
-                          <span class="text-en">{{ cabinetInfo['key.text1'] }}</span>
+                          <span class="text-en" v-if="cabinetInfo['key.text1']">{{
+                            cabinetInfo['key.text1']
+                          }}</span>
+                          <span style="font-size: 18px;color: #8f8f8f;letter-spacing: 1px;" v-if="!cabinetInfo['key.text1']">文字描述1(空)</span>
                           <img src="../../../assets/vehicle/xg.png" alt="" @click="editInfo(2)" />
                           <span>字数限制7个字</span>
                         </div>
                         <div class="text-edit" style="margin: 10px 0">
-                          <span class="text-en">{{ cabinetInfo['key.text2'] }}</span>
+                          <span class="text-en" v-if="cabinetInfo['key.text2']">{{
+                            cabinetInfo['key.text2'] 
+                          }}</span>
+                          <span style="font-size: 18px;color: #8f8f8f;letter-spacing: 1px;" v-if="!cabinetInfo['key.text2']">文字描述2(空)</span>
                           <img src="../../../assets/vehicle/xg.png" alt="" @click="editInfo(3)" />
                           <span>字数限制7个字</span>
                         </div>
                         <div class="text-edit">
-                          <span class="text-en">{{
-                            cabinetInfo['key.text3'] ? cabinetInfo['key.text3'] : '请输入'
+                          <span class="text-en" v-if="cabinetInfo['key.text3']">{{
+                            cabinetInfo['key.text3']
                           }}</span>
+                          <span style="font-size: 18px;color: #8f8f8f;letter-spacing: 1px;" v-if="!cabinetInfo['key.text3']">文字描述3(空)</span>
                           <img src="../../../assets/vehicle/xg.png" alt="" @click="editInfo(4)" />
                           <span>字数限制7个字</span>
                         </div>
-                        <div style="text-align: left;margin: 8px 0 0 70px;"><a-button type="primary"> 二维码展示内容调整 </a-button></div>
+                        <div style="text-align: left; margin: 8px 0 0 70px">
+                          <a-button type="primary"> 二维码展示内容调整 </a-button>
+                        </div>
                       </div>
                     </div>
                     <div></div>
@@ -110,9 +121,9 @@ export default {
         }
       })
     },
-    changeTables(){
+    changeTables() {
       this.$refs.tables.funCarList()
-    }
+    },
   },
   mounted() {},
   created() {

src/views/clw/KeyCase/modules/KeyBox.vue

@@ -89,7 +89,7 @@
       </div>
     </div>
     <div class="rigth-cabinet">
-      <img src="../../../../assets/vehicle/yjgl.png" alt="" />
+      <!-- <img src="../../../../assets/vehicle/yjgl.png" alt="" /> -->
       <div class="edit-box">
         <div>
           <span class="tab"></span>
@@ -108,7 +108,7 @@
           <span>钥匙柜未绑定钥匙</span>
         </div>
       </div>
-      <div style="margin-top: 60px">
+      <div style="margin-top: 60px;width: 158px;">
         <span style="font-size: 14px"
           >钥匙柜状态：
           <!-- <span style="color: #18f035;">{{ statusInfo==true?'在线':'离线' }}</span> -->

src/views/clw/KeyCase/modules/UsageRecord.vue

@@ -85,7 +85,6 @@ export default {
       this.valueNum = val
     },
     showOpen(title, node) {
-      console.log(node)
       this.id = node.id
       this.funLogList()
       this.visible1 = true

src/views/clw/car/index.vue

@@ -4,9 +4,9 @@
       <a-row>
         <a-col :span="5">
           <!-- 树 -->
-         <div >
-          <Trees ref="deptTree" :carTypeList="carTypeList" @select="clickDeptNode" />
-         </div>
+          <div>
+            <Trees ref="deptTree" :carTypeList="carTypeList" @select="clickDeptNode" />
+          </div>
         </a-col>
         <a-col :span="1"></a-col>
         <a-col :span="18">
@@ -109,9 +109,9 @@
             :bordered="tableBordered"
             :customHeaderRow="customRow"
           >
-          <span slot="num" slot-scope="text, records, index">
-          {{ (queryParam.pageNum - 1) * queryParam.pageSize + Number(index) + 1 }}
-        </span>
+            <span slot="num" slot-scope="text, records, index">
+              {{ (queryParam.pageNum - 1) * queryParam.pageSize + Number(index) + 1 }}
+            </span>
             <span slot="operation" slot-scope="text, record">
               <a-divider type="vertical" v-hasPermi="['clw:car:edit']" />
               <a @click="$refs.createForm.handleUpdate(record, undefined)" v-hasPermi="['clw:car:edit']">
@@ -180,7 +180,7 @@ export default {
         categoryId: null,
       },
       columns: [
-      { title: '序号', scopedSlots: { customRender: 'num' },width:'50px',   align: 'center', },
+        { title: '序号', scopedSlots: { customRender: 'num' }, width: '50px', align: 'center' },
         {
           title: '机构名称',
           dataIndex: 'depName',
@@ -359,7 +359,7 @@ export default {
       })
     },
     getDeptTree() {
-      deptTreeSelect({deptType:1}).then((response) => {
+      deptTreeSelect({ deptType: 1 }).then((response) => {
         this.deptOptions = response.data
       })
     },
@@ -373,14 +373,17 @@ export default {
       })
     },
     seeCarInfo(node) {
-      console.log(node);
-      this.$router.push({
-        path: '/cardiot',
-        query: {
-          id: node.id,
-          cqVehicleId:node.cqVehicleId
-        },
-      })
+      if (node.iot == '0') {
+        return this.$message.error('车辆暂未接入物联设备')
+      } else if(node.iot == '1') {
+        this.$router.push({
+          path: '/cardiot',
+          query: {
+            id: node.id,
+            cqVehicleId: node.cqVehicleId,
+          },
+        })
+      }
     },
     customRow(column) {
       column.forEach((e, index) => {

vue.config.js

@@ -110,8 +110,8 @@ const vueConfig = {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
         // target: `https://ruoyi.setworld.net`,
-        // target: `http://113.249.153.164:7618/api`,
-        target:`http://192.168.31.129:8080/`,
+        target: `http://113.249.153.164:7618/api`,
+        // target:`http://192.168.31.129:8080/`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''