1

src/api/powerdistribution/vehicle-monitoring.js

@@ -35,3 +35,11 @@ export function selectWorkPlanByVchicleNo(params) {
 	params,
   });
 }
+// 查询施工车辆告警历史列表
+export function listVehicleAlarmHist(query) {
+  return request({
+    url: '/powerdistribution/vehicleAlarmHist/list',
+    method: 'get',
+    params: query
+  })
+}

src/views/distributionnetwork/vehicle-monitoring/components/AlarmHist.vue

@@ -0,0 +1,187 @@
+<template>
+  <el-dialog
+    title="监控记录"
+    :visible.sync="visible"
+    width="1100px"
+    append-to-body
+    @close="handleClose"
+  >
+    <div class="record-container">
+			<el-form size="small" :inline="true">
+					<el-form-item label="车牌号" prop="vehicleNo">
+					  <el-input
+					    v-model="queryParams.vehicleNo"
+					    placeholder="车牌号"
+					  />
+					</el-form-item>
+					<el-form-item label="日期" prop="monitorDate">
+					  <el-date-picker
+					    v-model="queryParams.monitorDate"
+					    style="width: 240px; margin-right: 8px"
+					    type="daterange"
+					    range-separator="至"
+					    start-placeholder="开始日期"
+					    end-placeholder="结束日期"
+					    value-format="yyyy-MM-dd"
+					    :clearable="false"
+					  >
+					  </el-date-picker>
+					</el-form-item>
+					<el-form-item>
+					  <el-button
+					    type="primary"
+					    icon="el-icon-search"
+					    size="mini"
+					    @click="handleQuery"
+					    >搜索</el-button
+					  >
+					  <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+					    >重置</el-button
+					  >
+					</el-form-item>
+			 </el-form>
+      <el-table :data="alarmHistList" border style="width: 100%"  v-loading="loading">
+        <el-table-column
+          prop="vehicleNo"
+          label="车牌号"
+          align="center"
+          width="100"
+        ></el-table-column>
+        <el-table-column
+          prop="occurDate"
+          label="监测日期"
+          align="center"
+         width="100"
+        ></el-table-column>
+        <el-table-column
+          prop="alarmDesc"
+          label="车辆状态"
+          align="center"
+         width="250"
+        ></el-table-column>
+       
+        <el-table-column
+          prop="remark"
+          label="描述"
+          align="center"
+        ></el-table-column>
+       <el-table-column
+         prop="createTime"
+         label="统计时间"
+         align="center"
+		  width="180"
+       ></el-table-column>
+      </el-table>
+      <pagination
+        v-show="recordTotal > 0"
+        :total="recordTotal"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { listVehicleAlarmHist } from "@/api/powerdistribution/vehicle-monitoring";
+import moment from "moment";
+export default {
+  name: "AarmHist",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    vehicleInfo: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  data() {
+    return {
+	  loading: true,
+      alarmHistList: [],
+      recordTotal: 0,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        vehicleNo: "",
+        vehicleGroup: "",
+		monitorDate: [
+		  moment().endOf("day").format("YYYY-MM-DD"),
+		  moment().endOf("day").format("YYYY-MM-DD"),
+		],
+      },
+	 
+    };
+  },
+  watch: {
+    visible(val) {
+      if (val) {
+        this.queryParams = {
+          pageNum: 1,
+          pageSize: 10,
+          vehicleNo: this.vehicleInfo.vehicleNo,
+		  monitorDate: [
+		   
+		  ],
+          // vehicleGroup: this.vehicleInfo.vehicleGroup,
+        };
+        this.getList();
+      }
+    },
+  },
+  methods: {
+    getList() {
+	  this.loading = true;
+      listVehicleAlarmHist({
+        ...this.queryParams,
+		startDate: this.queryParams.monitorDate[0],
+		endDate: this.queryParams.monitorDate[1],
+      }).then((response) => {
+        this.alarmHistList = response.rows || [];
+        this.recordTotal = response.total;
+		this.loading=false;
+      });
+    },
+	/** 搜索按钮操作 */
+	handleQuery() {
+	  this.getList();
+	},
+	resetQuery() {
+	  this.queryParams = {
+	    pageNum: 1,
+	    pageSize: 10,
+		vehicleNo: this.vehicleInfo.vehicleNo,
+	    vehicleGroup: "",
+		monitorDate : [
+		 
+		],
+	  };
+	  this.resetForm("queryForm");
+	  this.handleQuery();
+	},
+    handleClose() {
+      this.$emit("update:visible", false);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.record-container {
+  min-height: 400px;
+  padding: 10px;
+
+  .mb20 {
+    margin-bottom: 20px;
+  }
+
+  ::v-deep {
+    .el-table {
+      margin-bottom: 20px;
+    }
+  }
+}
+</style>

src/views/distributionnetwork/vehicle-monitoring/components/DrivingRecord.vue

@@ -79,7 +79,7 @@
         ></el-table-column>
         <el-table-column
           prop="mileage"
-          label="里程(km)"
+          label="行驶里程(km)"
           align="center"
           width="100"
         >

src/views/distributionnetwork/vehicle-monitoring/index.vue

@@ -156,10 +156,17 @@
         <el-table-column
           label="操作"
           align="center"
-          width="200"
+          width="250"
           class-name="small-padding fixed-width"
         >
           <template slot-scope="scope">
+			<el-button
+			    size="mini"
+			    type="text"
+			    icon="el-icon-view"
+			    @click="handleAlarmHist(scope.row)"
+			    >监控历史</el-button
+			  >
             <el-button
               size="mini"
               type="text"
@@ -197,6 +204,10 @@
       :visible.sync="recordDialogVisible"
       :vehicle-info="currentVehicle"
     />
+	<alarm-hist
+	  :visible.sync="alarmHistDialogVisible"
+	  :vehicle-info="currentVehicle"
+	/>
   </div>
 </template>
 
@@ -209,11 +220,12 @@ import {
 } from "@/api/powerdistribution/vehicle-monitoring";
 import WorkTrack from "./components/WorkTrack.vue";
 import DrivingRecord from "./components/DrivingRecord.vue";
-
+import AlarmHist from "./components/AlarmHist.vue";
 export default {
   components: {
     WorkTrack,
     DrivingRecord,
+	AlarmHist
   },
   data() {
     return {
@@ -276,6 +288,8 @@ export default {
       trackDialogVisible: false,
       // 行驶记录相关
       recordDialogVisible: false,
+	  
+	  alarmHistDialogVisible :false,
       // 当前选中的车辆信息
       currentVehicle: {},
     };
@@ -318,7 +332,7 @@ export default {
         file.type === "application/vnd.ms-excel" ||
         file.type === "text/csv";
       if (!isExcel) {
-        this.$message.error("只能上传Excel或CSV文件!");
+        this.$message.error("只能上传CSV文件!");
         return false;
       }
       const isLt5M = file.size / 1024 / 1024 < 5;
@@ -352,6 +366,11 @@ export default {
       this.currentVehicle = row;
       this.recordDialogVisible = true;
     },
+	/** 查看监控记录 */
+	handleAlarmHist(row) {
+	  this.currentVehicle = row;
+	  this.alarmHistDialogVisible = true;
+	},
   },
 };
 </script>