fix:修改地图切换大类地图打点问题,地图图层选中修改,今日巡查修改,巡检车辆增加定时器修改
This commit is contained in:
		
							parent
							
								
									cf22b295bc
								
							
						
					
					
						commit
						98ff8d75ec
					
				| @ -2,7 +2,7 @@ | ||||
|  * @Author: SunTao 328867980@qq.com | ||||
|  * @Date: 2024-10-17 11:34:00 | ||||
|  * @LastEditors: SunTao 328867980@qq.com | ||||
|  * @LastEditTime: 2024-11-20 14:32:46 | ||||
|  * @LastEditTime: 2024-11-20 17:08:11 | ||||
|  * @FilePath: \znxjxt-ui\src\views\big-screen\index.vue | ||||
|  * @Description: 大屏首页 | ||||
| --> | ||||
| @ -36,7 +36,10 @@ | ||||
|                     v-for="(item, index) in messageList" | ||||
|                     :key="`message-item-${index}`" | ||||
|                   > | ||||
|                     <div class="item-top" @click="handleMessageItemClick(item.status)"> | ||||
|                     <div | ||||
|                       class="item-top" | ||||
|                       @click="handleMessageItemClick(item.status)" | ||||
|                     > | ||||
|                       <div class="index"> | ||||
|                         <i | ||||
|                           v-if="item.status === '1'" | ||||
| @ -481,6 +484,8 @@ export default { | ||||
|       clusters: null, | ||||
|       // 线段图层 | ||||
|       markLayerLines: null, | ||||
|       // 地图选中图层 | ||||
|       selectedFeatures:null, | ||||
| 
 | ||||
|       // 图片弹窗标题 | ||||
|       imgTitle: "查看", | ||||
| @ -655,6 +660,11 @@ export default { | ||||
| 
 | ||||
|     /* 关闭查看点位大图弹窗 */ | ||||
|     screenImgCancel() { | ||||
|       this.$nextTick(() => { | ||||
|         const map = this.$refs.roadMap.instance.get("map"); | ||||
|         map.removeInteraction(this.selectedFeatures); | ||||
|         this.selectedFeatures = null; | ||||
|       }); | ||||
|       this.showImageDialog = false; | ||||
|     }, | ||||
| 
 | ||||
| @ -705,8 +715,11 @@ export default { | ||||
|             } | ||||
|             return []; | ||||
|           }); | ||||
|           // 如果不是病害巡检,则绘制点位 | ||||
|           if (this.elementDiv !== "DiseaseScreen") { | ||||
|             this.drawPoint(); | ||||
|           } | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
| 
 | ||||
| @ -931,9 +944,9 @@ export default { | ||||
|     /* 地图选中feature事件 */ | ||||
|     featureSelect(e) { | ||||
|       const map = this.$refs.roadMap.instance.get("map"); | ||||
|       let selectedFeatures = e.selected; | ||||
|       if (selectedFeatures.length > 0) { | ||||
|         let feature = selectedFeatures[0]; | ||||
|        this.selectedFeatures = e.selected; | ||||
|       if (this.selectedFeatures.length > 0) { | ||||
|         let feature = this.selectedFeatures[0]; | ||||
|         let features = feature.get("features"); | ||||
|         // 点击线段事件 | ||||
|         if (feature.getProperties().type === "line") { | ||||
|  | ||||
| @ -2,8 +2,8 @@ | ||||
|  * @Author: SunTao 328867980@qq.com | ||||
|  * @Date: 2024-11-08 09:40:18 | ||||
|  * @LastEditors: SunTao 328867980@qq.com | ||||
|  * @LastEditTime: 2024-11-19 13:32:51 | ||||
|  * @FilePath: \znxjxt-ui\src\views\big-screen\disease-components\inspection-vehicles.vue | ||||
|  * @LastEditTime: 2024-11-20 16:32:29 | ||||
|  * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\inspection-vehicles.vue | ||||
|  * @Description: 总览大屏-巡检车辆 | ||||
| --> | ||||
| 
 | ||||
| @ -43,7 +43,7 @@ | ||||
|         height="85%" | ||||
|       > | ||||
|         <el-table-column prop="plateNo" label="车牌号码"> </el-table-column> | ||||
|         <el-table-column prop="status" label="状态"> </el-table-column> | ||||
|         <el-table-column prop="aiotStatus" label="状态"> </el-table-column> | ||||
|         <el-table-column prop="pci" label="操作"> | ||||
|           <template slot-scope="scope"> | ||||
|             <el-popover | ||||
| @ -63,11 +63,15 @@ | ||||
|                 </div> | ||||
|                 <div> | ||||
|                   <span class="name">车辆状态:</span> | ||||
|                   <span class="value">{{ scope.row.aiotStatus }}</span> | ||||
|                 </div> | ||||
|                 <div> | ||||
|                   <span class="name">网络状态:</span> | ||||
|                   <span class="value">{{ scope.row.status }}</span> | ||||
|                 </div> | ||||
|                 <div> | ||||
|                   <span class="name">设备状态:</span> | ||||
|                   <span class="value">{{ scope.row.status }}</span> | ||||
|                   <span class="value">{{ scope.row.serverStatus }}</span> | ||||
|                 </div> | ||||
|               </div> | ||||
|               <el-button | ||||
| @ -162,6 +166,8 @@ export default { | ||||
|       onlineNum: 0, | ||||
|       // 车牌号输入绑定 | ||||
|       tableInput: "", | ||||
|       // 定时器标识 | ||||
|       timer: null, | ||||
|       // 下方列表数据 | ||||
|       inspectionTableData: [], | ||||
|       // 分页数据绑定 | ||||
| @ -189,6 +195,16 @@ export default { | ||||
|   methods: { | ||||
|     /* 获取表格数据 */ | ||||
|     getTableData() { | ||||
|       this.timer = setInterval(() => { | ||||
|         getCarList({ no: this.tableInput }).then(({ code, data }) => { | ||||
|           if (code === 200) { | ||||
|             this.carNum = data.total; | ||||
|             this.tableTotal = data.total; | ||||
|             this.onlineNum = data.online; | ||||
|             this.inspectionTableData = data.rows; | ||||
|           } | ||||
|         }); | ||||
|       }, 5000); | ||||
|       getCarList({ no: this.tableInput }).then(({ code, data }) => { | ||||
|           if (code === 200) { | ||||
|             this.carNum = data.total; | ||||
| @ -233,15 +249,17 @@ export default { | ||||
|     viewCancel() { | ||||
|       this.viewTitle = ""; | ||||
|       this.showViewVisible = false; | ||||
|       closeVideoUrl({ id: this.dialogItem.clientId }) | ||||
|         .then(({ code, data }) => { | ||||
|       closeVideoUrl({ id: this.dialogItem.clientId }).then(({ code, data }) => { | ||||
|         if (code === 200) { | ||||
|           console.log(data); | ||||
|           this.dialogItem = {}; | ||||
|         } | ||||
|         }) | ||||
|       }); | ||||
|     }, | ||||
|   }, | ||||
|   destroyed() { | ||||
|     clearInterval(this.timer); | ||||
|   }, | ||||
| }; | ||||
| </script> | ||||
| 
 | ||||
|  | ||||
| @ -2,8 +2,8 @@ | ||||
|  * @Author: SunTao 328867980@qq.com | ||||
|  * @Date: 2024-10-18 09:42:49 | ||||
|  * @LastEditors: SunTao 328867980@qq.com | ||||
|  * @LastEditTime: 2024-11-18 13:36:55 | ||||
|  * @FilePath: \znxjxt-ui\src\views\big-screen\disease-components\today-inspection.vue | ||||
|  * @LastEditTime: 2024-11-20 16:27:24 | ||||
|  * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\today-inspection.vue | ||||
|  * @Description: 总览大屏-今日巡查 | ||||
| --> | ||||
| 
 | ||||
| @ -17,9 +17,13 @@ | ||||
|         <span>{{ all }}</span | ||||
|         >个 | ||||
|       </div> | ||||
|       <div class="right-rate"> | ||||
|       <!-- <div class="right-rate"> | ||||
|         <span> {{ scale }}</span | ||||
|         >% | ||||
|       </div> --> | ||||
|       <div class="right-rate"> | ||||
|         较昨日<span class="up">增长</span> 50.26% | ||||
|         <i class="el-icon-top"></i> | ||||
|       </div> | ||||
|     </div> | ||||
|     <!-- 病害总览弹窗 --> | ||||
| @ -669,31 +673,50 @@ export default { | ||||
|       } | ||||
|     } | ||||
| 
 | ||||
|     // .right-rate { | ||||
|     //   width: 100%; | ||||
|     //   height: 45%; | ||||
|     //   padding-left: 1rem; | ||||
|     //   display: flex; | ||||
|     //   justify-content: center; | ||||
|     //   line-height: 3rem; | ||||
|     //   background-image: url("~@/assets/screen/disease/right-rate.png"); | ||||
|     //   background-repeat: no-repeat; | ||||
|     //   background-size: 100%; | ||||
|     //   background-position: 100% 50%; | ||||
|     //   color: #aac6c7; | ||||
| 
 | ||||
|     //   span { | ||||
|     //     font-size: 1.2rem; | ||||
|     //     font-weight: 800; | ||||
|     //     font-family: "DouYu"; | ||||
|     //     margin-right: 0.5rem; | ||||
|     //     background: linear-gradient( | ||||
|     //       to bottom, | ||||
|     //       #ffffff, | ||||
|     //       #e9bc5c | ||||
|     //     ); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ | ||||
|     //     background-clip: text; /*将设置的背景颜色限制在文字中*/ | ||||
|     //     -webkit-text-fill-color: transparent; /*给文字设置成透明*/ | ||||
|     //   } | ||||
|     // } | ||||
| 
 | ||||
|     .right-rate { | ||||
|       width: 100%; | ||||
|       height: 45%; | ||||
|       padding-left: 1rem; | ||||
|       display: flex; | ||||
|       justify-content: center; | ||||
|       line-height: 3rem; | ||||
|       background-image: url("~@/assets/screen/disease/right-rate.png"); | ||||
|       background-repeat: no-repeat; | ||||
|       background-size: 100%; | ||||
|       background-position: 100% 50%; | ||||
|       color: #aac6c7; | ||||
| 
 | ||||
|       span { | ||||
|         font-size: 1.2rem; | ||||
|         font-weight: 800; | ||||
|       align-items: center; | ||||
|       font-family: "DouYu"; | ||||
|         margin-right: 0.5rem; | ||||
|         background: linear-gradient( | ||||
|           to bottom, | ||||
|           #ffffff, | ||||
|           #e9bc5c | ||||
|         ); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ | ||||
|         background-clip: text; /*将设置的背景颜色限制在文字中*/ | ||||
|         -webkit-text-fill-color: transparent; /*给文字设置成透明*/ | ||||
|       font-size: 0.9rem; | ||||
| 
 | ||||
|       .up { | ||||
|         color: #ff2e2e; | ||||
|         padding: 0 0.5rem; | ||||
|       } | ||||
| 
 | ||||
|       .el-icon-top { | ||||
|         font-size: 1.5rem; | ||||
|         color: red; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
| @ -2,7 +2,7 @@ | ||||
|  * @Author: SunTao 328867980@qq.com | ||||
|  * @Date: 2024-11-20 11:58:33 | ||||
|  * @LastEditors: SunTao 328867980@qq.com | ||||
|  * @LastEditTime: 2024-11-20 14:33:22 | ||||
|  * @LastEditTime: 2024-11-20 15:49:28 | ||||
|  * @FilePath: \znxjxt-ui\src\views\xj\inspection-warn\warning-center\index.vue | ||||
|  * @Description: 巡检预警中心 | ||||
| --> | ||||
| @ -76,6 +76,33 @@ | ||||
|           >重置</el-button | ||||
|         > | ||||
|       </el-form-item> | ||||
|     </el-form> | ||||
|     <el-row :gutter="10" class="mb8"> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button | ||||
|           type="primary" | ||||
|           plain | ||||
|           icon="el-icon-check" | ||||
|           size="mini" | ||||
|           @click="handleRead" | ||||
|           v-hasPermi="['system:defect:add']" | ||||
|           >全部已读 | ||||
|         </el-button> | ||||
|       </el-col> | ||||
|       <el-col :span="1.5"> | ||||
|         <el-button | ||||
|           type="danger" | ||||
|           plain | ||||
|           icon="el-icon-delete" | ||||
|           size="mini" | ||||
|           :disabled="multiple" | ||||
|           @click="handleDelete(null)" | ||||
|           v-hasPermi="['system:defect:remove']" | ||||
|           >批量删除 | ||||
|         </el-button> | ||||
|       </el-col> | ||||
|     </el-row> | ||||
|     <!-- 导航栏 --> | ||||
|     <el-tabs v-model="activeName" @tab-click="handleClick"> | ||||
|       <el-tab-pane | ||||
|         v-for="(item, index) in editableTabs" | ||||
| @ -107,14 +134,28 @@ | ||||
|           ></i | ||||
|           >{{ item.title }}({{ item.count }})</span | ||||
|         > | ||||
|           <!-- 标签内容 --> | ||||
|         <!-- 表格 --> | ||||
|         <el-table | ||||
|           ref="warningTable" | ||||
|           :data="warningList" | ||||
|           v-loading="loading" | ||||
|           style="width: 100%" | ||||
|           @current-change="handleTableChange" | ||||
|           @selection-change="handleSelectionChange" | ||||
|         > | ||||
|             <el-table-column label="时间" align="center" prop="segmentName" /> | ||||
|           <el-table-column type="selection" width="55" align="center" /> | ||||
| 
 | ||||
|           <el-table-column | ||||
|             width="200" | ||||
|             label="时间" | ||||
|             align="center" | ||||
|             prop="segmentName" | ||||
|           > | ||||
|             <template slot-scope="scope"> | ||||
|               <span class="table-index">asd</span> | ||||
|               {{ scope.row.segmentName }} | ||||
|             </template> | ||||
|           </el-table-column> | ||||
|           <el-table-column | ||||
|             label="消息内容" | ||||
|             align="center" | ||||
| @ -139,7 +180,6 @@ | ||||
|         </div> | ||||
|       </el-tab-pane> | ||||
|     </el-tabs> | ||||
|     </el-form> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| @ -177,6 +217,8 @@ export default { | ||||
|       ], | ||||
|       // 预警列表 | ||||
|       warningList: [], | ||||
|       // 列表勾选数据 | ||||
|       checkIds: [], | ||||
|       // 分页-页数页码 | ||||
|       pagination: { | ||||
|         page: 1, | ||||
| @ -186,6 +228,8 @@ export default { | ||||
|       tableTotal: 0, | ||||
|       // 列表加载状态 | ||||
|       loading: false, | ||||
|       // 批量删除状态 | ||||
|       multiple: true, | ||||
|     }; | ||||
|   }, | ||||
|   watch: { | ||||
| @ -252,10 +296,64 @@ export default { | ||||
|         endTime: this.dateTime ? this.dateTime[1] : "", | ||||
|       }; | ||||
|       setTimeout(() => { | ||||
|         this.warningList = [{id:"1", segmentName: "sSSSSSS" }]; | ||||
|         this.loading = false; | ||||
|       }, 100); | ||||
|     }, | ||||
| 
 | ||||
|     /** | ||||
|      * @description: 点击列表行事件 | ||||
|      * @param {*} val | ||||
|      * @return {*} | ||||
|      */ | ||||
|     handleTableChange(val) { | ||||
|       if (val) { | ||||
|         console.log(val, "ddd"); | ||||
|         this.getList(); | ||||
|       } | ||||
|     }, | ||||
| 
 | ||||
|     /** | ||||
|      * @description: 列表选择改变事件 | ||||
|      * @param {*} val | ||||
|      * @return {*} | ||||
|      */ | ||||
|     handleSelectionChange(selection) { | ||||
|       this.checkIds = selection.map((item) => item.id); | ||||
|       this.multiple = !selection.length; | ||||
|     }, | ||||
| 
 | ||||
|     /** | ||||
|      * @description: 批量删除事件 | ||||
|      * @return {*} | ||||
|      */ | ||||
|     handleDelete(row) { | ||||
|       const checkIds = row ? [row.id] : this.checkIds; | ||||
|       if (!checkIds.length) { | ||||
|         this.$modal.msgWarning("请选择要删除的记录"); | ||||
|         return; | ||||
|       } | ||||
|       this.$modal | ||||
|         .confirm(`是否确认删除选中的${checkIds.length}条记录?`) | ||||
|         .then(() => { | ||||
|           // return deleteRoad(checkIds); | ||||
|         }) | ||||
|         .then(() => { | ||||
|           this.getList(); | ||||
|           this.$refs.warningTable.clearSelection(); | ||||
|           this.$modal.msgSuccess("删除成功"); | ||||
|         }) | ||||
|         .catch(() => {}); | ||||
|     }, | ||||
| 
 | ||||
|     /** | ||||
|      * @description: 全部已读事件 | ||||
|      * @return {*} | ||||
|      */ | ||||
|     handleRead() { | ||||
|       this.getList(); | ||||
|     }, | ||||
| 
 | ||||
|     /** | ||||
|      * @description: 切换分页 | ||||
|      * @param {*} arg | ||||
| @ -286,6 +384,22 @@ export default { | ||||
|   padding: 1rem; | ||||
| } | ||||
| 
 | ||||
| .el-table { | ||||
|   .table-index { | ||||
|     &::before { | ||||
|       content: ""; | ||||
|       position: absolute; | ||||
|       left: 0; | ||||
|       top: 50%; | ||||
|       transform: translateY(-50%); | ||||
|       width: 0.8rem; | ||||
|       height: 0.8rem; | ||||
|       border-radius: 50%; | ||||
|       background-color: #f56c6c; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| /* 分页样式 */ | ||||
| .pagination-part { | ||||
|   width: 100%; | ||||
|  | ||||
| @ -2,7 +2,7 @@ | ||||
|  * @Author: SunTao 328867980@qq.com | ||||
|  * @Date: 2024-10-14 13:59:51 | ||||
|  * @LastEditors: SunTao 328867980@qq.com | ||||
|  * @LastEditTime: 2024-11-14 15:26:15 | ||||
|  * @LastEditTime: 2024-11-20 15:01:48 | ||||
|  * @FilePath: \znxjxt-ui\src\views\xj\inspection\surface-management\index.vue | ||||
|  * @Description: 巡检管理-路面病害对比 | ||||
| --> | ||||
| @ -252,7 +252,10 @@ export default { | ||||
|       this.dialogImgLeft = item.data; | ||||
|       if (Object.keys(this.surfaceListRight).length > 0) { | ||||
|         const rightImg = this.surfaceListRight.data.filter((it) => { | ||||
|           return it.snapshotId === item.data.snapshotId; | ||||
|           if (it.snapshotId === item.data.snapshotId) { | ||||
|             return it; | ||||
|           } | ||||
|           return []; | ||||
|         }); | ||||
|         this.dialogImgRight = rightImg[0]; | ||||
|       } | ||||
| @ -264,10 +267,12 @@ export default { | ||||
|       this.dialogImgRight = item.data; | ||||
|       if (Object.keys(this.surfaceListLeft).length > 0) { | ||||
|         const leftImg = this.surfaceListLeft.data.filter((it) => { | ||||
|           return it.snapshotId === item.data.snapshotId; | ||||
|           if (it.snapshotId === item.data.snapshotId) { | ||||
|             return it; | ||||
|           } | ||||
|           return []; | ||||
|         }); | ||||
|         this.dialogImgLeft = leftImg[0]; | ||||
|          | ||||
|       } | ||||
|       this.viewVisible = true; | ||||
|     }, | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user