From 08413f10a9b4833d0a00a3ee2a3ce629acc7bdd8 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Thu, 11 Mar 2021 16:14:32 +0800
Subject: [PATCH] 修改巡逻样式

---
 src/views/clientManagement/clientManagement.vue |  288 ++++++++++++++++++++++++++++++++++++++++++++-------------
 1 files changed, 223 insertions(+), 65 deletions(-)

diff --git a/src/views/clientManagement/clientManagement.vue b/src/views/clientManagement/clientManagement.vue
index f5254a7..130f559 100644
--- a/src/views/clientManagement/clientManagement.vue
+++ b/src/views/clientManagement/clientManagement.vue
@@ -43,19 +43,59 @@
               }}
             </el-tag>
           </template>
+          <template slot-scope="{ type, size, row }" slot="menu">
+            <el-button
+              icon="el-icon-video-camera-solid"
+              :size="size"
+              :type="type"
+              @click.stop="handleStart(row)"
+            >视频
+            </el-button>
+            <el-button
+              icon="el-icon-location-outline"
+              :size="size"
+              :type="type"
+              @click.stop="handleMap(row)"
+            >定位
+            </el-button>
+          </template>
 
-          <template slot-scope="{ row }" slot="dtype">
+          <template slot-scope="{ row }" slot="dxzt">
             <el-tag>{{
-              row.dtype == "0" ? "掉线" : row.dtype == "1" ? "在线" : "无"
+              row.dxzt == "0" ? "掉线" : row.dxzt == "1" ? "在线" : "无"
               }}
             </el-tag>
           </template>
 
+          <template slot-scope="{ row }" slot="expireTime">
+            <span>
+              {{
+                row.expireTime == "" ? row.expireTime : row.expireTime == null ? row.expireTime : row.expireTime.split(" ")[0]
+              }}
+            </span>
+            <i class="el-icon-warning" v-if="row.type == 1"></i>
+          </template>
+
         </avue-crud>
+
+        <el-drawer
+          title="电子地图"
+          append-to-body="true"
+          :visible.sync="showMap"
+        >
+          <iframe
+            id="mapDiv"
+            ref="mapDiv"
+            src="/map/index.html?openid=ClientManagement&ISinit=1"
+            frameborder="0"
+            width="100%"
+            height="100%"
+          ></iframe>
+        </el-drawer>
 
       </basic-container>
     </el-col>
-    <el-dialog title="缴费提醒" :visible.sync="dialogTableVisible" custom-class="payWin" append-to-body="true">
+    <el-dialog title="缴费提醒" :visible.sync="dialogTableVisible" top="280px" custom-class="payWin" append-to-body="true">
       <el-table :data="gridData">
         <el-table-column property="xb" label="序号" width="50"></el-table-column>
         <el-table-column property="deviceName" label="设备名称" width="150"></el-table-column>
@@ -68,9 +108,8 @@
 </template>
 
 <script>
-  import {getList, remove, update, add, getclient, getDeptLazyTree,getAll} from "@/api/client/client";
+  import {getList, remove, update, add, getclient, getDeptLazyTree, getAll} from "@/api/client/client";
   import {mapGetters} from "vuex";
-
   export default {
     created() {
       this.payWin();
@@ -79,6 +118,8 @@
       return {
         form: {},
         query: {},
+        showMap: false,
+        initFlag: true,
         loading: true,
         page: {
           pageSize: 10,
@@ -86,7 +127,7 @@
           total: 0
         },
         dialogTableVisible: false,
-        gridData:null,
+        gridData: null,
         selectionList: [],
         treeDeptId: '',
         treeData: [],
@@ -120,7 +161,8 @@
           calcHeight: 80,
           labelWidth: '100',
           dialogWidth: 950,
-          menuWidth: 160,
+          menuWidth: 250,
+          size: "mini",
           tip: false,
           searchShow: true,
           searchMenuSpan: 4,
@@ -133,22 +175,114 @@
           column: [
             {
               label: "设备名称",
-              width: 130,
+              width: 200,
               prop: "deviceName",
-              searchPlaceholder: "请输入设备名称/编号",
+              searchPlaceholder: "设备名称/编号",
               search: true,
+            },
+            {
+              label: "上级菜单",
+              prop: "pid",
+              type: "tree",
+              dicUrl: "/api/blade-jfpts/catalogs/catalogs/tree",
+              hide: true,
+              props: {
+                label: "title"
+              },
+              rules: [
+                {
+                  required: false,
+                  message: "请选择上级菜单",
+                  trigger: "click"
+                }
+              ]
+            },
+            {
+              label: "到期时间",
+              prop: "releaseTimeRange",
+              type: "datetime",
+              format: "yyyy-MM-dd",
+              valueFormat: "yyyy-MM-dd",
+              searchRange: true,
+              searchSpan: 6,
+              hide: true,
+              addDisplay: false,
+              editDisplay: false,
+              viewDisplay: false,
+              search: true,
+              rules: [
+                {
+                  required: true,
+                  message: "请输入时间",
+                  trigger: "blur"
+                }
+              ]
             },
             {
               label: "设备编号",
               prop: "deviceNumber",
-              width: 130
+              width: 130,
+              editDisabled:true,
+              rules: [
+                {
+                  required: false,
+                  message: "请输入设备编号",
+                  trigger: "click"
+                }
+              ]
+            },
+            {
+              label: "序列号",
+              prop: "serialNumber",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
+            },
+            {
+              label: "通道号",
+              prop: "channelNumber",
+              hide: true,
+              addDisplay: true,
+              editDisplay: true,
+              viewDisplay: true,
+            }, {
+              label: "布撤防状态",
+              prop: "devicestate",
+              type: "select",
+              slot: true,
+              width: 100,
+              rules: [{
+                required: true,
+                message: "请选择布撤防状态",
+                trigger: "blur"
+              }],
+              dicData: [
+                {
+                  label: "撤防",
+                  value: "0"
+                },
+                {
+                  label: "布防",
+                  value: "1"
+                }
+              ]
+            }, {
+              label: "设备状态",
+              prop: "dxzt",
+              slot: true,
+              addDisplay: false,
+              editDisplay: false,
+            }, {
+              label: "缴费信息",
+              prop: "pay",
             },
             {
               label: "省份",
               prop: "province",
               search: true,
               searchSpan: 3,
-              searchLabelWidth: 60,
+              searchLabelWidth: 45,
               placeholder: "省份",
               type: "select",
               props: {
@@ -195,64 +329,51 @@
               span: 3,
               labelWidth: "0",
               className: "cityClass3"
-            }, {
-              label: "布撤防状态",
-              prop: "devicestate",
-              type: "select",
-              slot: true,
-              width: 100,
-              dicData: [
-                {
-                  label: "撤防",
-                  value: "0"
-                },
-                {
-                  label: "布防",
-                  value: "1"
-                }
-              ]
-            }, {
-              label: "设备状态",
-              prop: "dtype",
-              search: true,
-              slot: true,
-              type: "select",
-              dicData: [
-                {
-                  label: "掉线",
-                  value: "0"
-                },
-                {
-                  label: "在线",
-                  value: "1"
-                }
-              ]
-            }, {
+            },
+            {
               label: "设备类型",
               prop: "deviceType",
-              width: 150,
+              width: 160,
               search: true,
-            }, {
+              searchSpan: 3,
+              searchLabelWidth: 80,
+              searchPlaceholder: "请选择",
+              type: "select",
+              props: {
+                label: "dictValue",
+                value: "dictValue"
+              },
+              dicUrl: "/api/blade-system/dict-biz/child-list?parentId=1357568691367661569",
+            },
+            {
               label: "权属",
               prop: "ownership",
+              width: 150
             }, {
               label: "街道",
               prop: "street",
-              width: 150
-            }, {
-              label: "缴费信息",
-              prop: "pay",
+              width: 200
             }, {
               label: "安装时间",
               prop: "stime",
+              type: "datetime",
+              format: "yyyy-MM-dd",
+              valueFormat: "yyyy-MM-dd HH:mm:ss",
               width: 130
             }, {
               label: "到期时间",
               prop: "expireTime",
-              width: 130
-            }, {
+              type: "datetime",
+              slot: true,
+              format: "yyyy-MM-dd",
+              valueFormat: "yyyy-MM-dd HH:mm:ss",
+              width: 150
+            },{
               label: "最后上传时间",
               prop: "heartbeat",
+              type: "datetime",
+              format: "yyyy-MM-dd",
+              valueFormat: "yyyy-MM-dd HH:mm:ss",
               width: 130
             },
 
@@ -329,6 +450,7 @@
           });
       },
       searchReset() {
+        this.treeDeptId = null;
         this.query = {};
         this.onLoad(this.page);
       },
@@ -392,12 +514,12 @@
         if (releaseTimeRange) {
           values = {
             ...params,
-            releaseTime_datege: releaseTimeRange[0],
-            releaseTime_datelt: releaseTimeRange[1],
+            beginTime: releaseTimeRange[0],
+            endTime: releaseTimeRange[1],
             ...this.query
           };
           values.releaseTimeRange = null;
-        }else{
+        } else {
           values = {
             ...params,
             ...this.query
@@ -407,30 +529,48 @@
         getList(page.currentPage, page.pageSize, values, this.treeDeptId).then(res => {
           const data = res.data.data;
           this.page.total = data.total;
+
+          var Dqdate = new Date().getTime();
+
+          for (var i = 0; i < data.records.length; i++) {
+            var date = new Date(data.records[i].heartbeat).getTime();
+            if ((Dqdate - date) >= (60 * 60 * 24 * 1000)) {
+              data.records[i].dxzt = 0;
+            } else if (data.records[i].heartbeat == "") {
+              data.records[i].dxzt = 0;
+            } else {
+              data.records[i].dxzt = 1;
+            }
+          }
+
+          data.records.sort((a,b)=>{
+            return a.dxzt - b.dxzt;
+          });
+
           this.data = data.records;
           this.loading = false;
           this.selectionClear();
         });
       }, rowStyle({row, column, rowIndex}) {
-        if (row.heartbeat != null && row.heartbeat != "" ) {
+        if (row.heartbeat != null && row.heartbeat != "") {
           var date = new Date(row.heartbeat).getTime();
           var Dqdate = new Date().getTime();
           if ((Dqdate - date) >= (60 * 60 * 24 * 1000)) {
             return {
-              color: "#15a2fe"
+              color: "#fe1515"
             };
           }
 
-        }else if(row.heartbeat == ""){
+        } else if (row.heartbeat == "") {
           return {
-            color: "#15a2fe"
+            color: "#fe1515"
           };
         }
       },
-      payWin(){
+      payWin() {
         var that = this;
         getAll().then(res => {
-          var data =res.data.data;
+          var data = res.data.data;
           var lists = [];
           var xb = 0;
           for (var i = 0; i < data.length; i++) {
@@ -440,24 +580,42 @@
               lists.push(data[i]);
             }
           }
-          if (lists.length > 0){
+          if (lists.length > 0) {
             that.gridData = lists;
             that.dialogTableVisible = true;
           }
         });
 
-      }
+      },handleStart(row) {
+        var arr = [];
+        this.$store.state.tags.tagList.forEach(item => {
+          if (item.label != "视频") {
+            arr.push(item);
+          }
+        });
+        this.$store.state.tags.tagList = arr;
+        this.$router.push({
+          path: `/real/video/`,query:row
+        });
+      },handleMap(row) {
+        this.showMap = true;
+        this.$nextTick(() => {
+          this.$refs.mapDiv.onload = () => {
+            window.frames[0].init("equipment",{x: row.jd, y: row.wd});
+          };
+        })
+      },
     }
   };
 </script>
 
 <style>
-  .payWin{
+  .payWin {
     overflow-y: auto;
     height: 350px;
   }
 
-  .payWin .el-dialog__body{
+  .payWin .el-dialog__body {
     padding-top: 0px !important;
   }
 

--
Gitblit v1.9.3