设备管理,告警管理,数据大屏

src/api/community/residential.js

@@ -48,3 +48,13 @@ export const update = (row) => {
   })
 }
 
+export const getAllList = (size) => {
+  return request({
+    url: '/api/cyzh-community/residential/list',
+    method: 'get',
+    params: {
+      size
+    }
+  })
+}
+

src/api/dataview/dataviewoption.js

@@ -8,64 +8,64 @@ export const iconsOption = (obj) =>{
         click: function (item) {obj.select(100004)},
         title: '智能烟感',
         count: 0,
-        // icon: 'el-icon-smoking',
-        icon: 'yc-grid-zhinengyangan',
+        icon: 'el-icon-smoking',
+        // icon: 'yc-grid-zhinengyangan',
       },
       {
         click: function (item) {obj.select(100020)},
         title: '燃气监控',
         count: 0,
-        // icon: 'el-icon-help',
-        icon: 'yc-grid-ranqijianceqi',
+        icon: 'el-icon-help',
+        // icon: 'yc-grid-ranqijianceqi',
       },
       {
         click: function (item) {obj.select(3)},
         title: '井盖监控',
         count: 0,
-        // icon: 'el-icon-circle-plus-outline',
-        icon: 'yc-grid-manhole-cover',
+        icon: 'el-icon-circle-plus-outline',
+        // icon: 'yc-grid-manhole-cover',
       },
       {
         click: function (item) {obj.select(4)},
         title: '一键告警',
         count: 0,
-        // icon: 'el-icon-thumb',
-        icon: 'yc-grid-peizhitubiaosvg-1',
+        icon: 'el-icon-thumb',
+        // icon: 'yc-grid-peizhitubiaosvg-1',
       },
       {
         click: function (item) {obj.select(5)},
         title: '智慧路灯',
         count: 0,
-        // icon: 'el-icon-wind-power',
-        icon: 'yc-grid-ludeng',
+        icon: 'el-icon-wind-power',
+        // icon: 'yc-grid-ludeng',
       },
       {
         click: function (item) {obj.select(960417)},
         title: '智慧消防',
         count: 0,
-        // icon: 'el-icon-loading',
-        icon: 'yc-grid-xiaofanghuopao',
+        icon: 'el-icon-loading',
+        // icon: 'yc-grid-xiaofanghuopao',
       },
       {
         click: function (item) {obj.select(7)},
         title: '智能垃圾桶',
         count: 0,
-        // icon: 'el-icon-delete',
-        icon: 'iconfont iconicon_delete',
+        icon: 'el-icon-delete',
+        // icon: 'iconfont iconicon_delete',
       },
       {
         click: function (item) {obj.select(8)},
         title: '智能地磁',
         count: 0,
-        // icon: 'el-icon-s-help',
-        icon: 'yc-grid-dici',
+        icon: 'el-icon-s-help',
+        // icon: 'yc-grid-dici',
       },
       {
         click: function (item) {obj.select(9)},
         title: '智能门磁',
         count: 0,
-        // icon: 'el-icon-attract',
-        icon: 'yc-grid-menci',
+        icon: 'el-icon-attract',
+        // icon: 'yc-grid-menci',
       }]
   }
 }

src/api/device/iotdevice.js

@@ -59,3 +59,23 @@ export const deviceListCount = (params) => {
   })
 }
 
+export const getEnterpriseList = (size) => {
+  return request({
+    url: '/api/cyzh-enterprise/enterprise/list',
+    method: 'get',
+    params: {
+      size,
+    }
+  })
+}
+
+export const getDetailByDeviceId = (imei) => {
+  return request({
+    url: '/api/cyzh-smart-device/iotdevice/detail',
+    method: 'get',
+    params: {
+      imei
+    }
+  })
+}
+

src/api/order/deviceorder.js

@@ -48,3 +48,10 @@ export const update = (row) => {
   })
 }
 
+export const getDeviceJobStaticVo = () => {
+  return request({
+    url: '/api/work-order/feign/deviceorder/getDeviceJobStaticVo',
+    method: 'get',
+  })
+}
+

src/components/3DMap/Loading.vue

@@ -0,0 +1,54 @@
+<template>
+  <div v-if="loading" class="full center container">
+      <div class="loading-bar"></div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "Loading",
+  data(){
+    return{
+      loading: true,
+    }
+  },
+  methods: {
+    hide(){
+      this.loading = false;
+    },
+    show(){
+      this.loading = true;
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .container{
+    position: absolute;
+    top: 0;
+    background: rgba(23,65,72,0.5)
+  }
+  .loading-bar{
+    width: 300px;height: 300px;background: url("/data/loading.gif") no-repeat center/contain;
+    border-radius: 10px;
+    /*animation: loading 10ms linear infinite;*/
+  }
+  @keyframes loading {
+    from{
+        width: 0;
+    }
+    to{
+      width: 100%;
+    }
+  }
+</style>

src/components/3DMap/Map3D.vue

@@ -0,0 +1,151 @@
+<template>
+  <div class="full">
+    <div class="full" id="viewer-container"></div>
+    <info-layer></info-layer>
+  </div>
+</template>
+
+<script>
+ import InfoLayer from "./map-components/InfoLayer";
+ let viewer = undefined;
+export default {
+  name: "Map3D",
+  components: {InfoLayer},
+  data(){
+    return{
+      //默认场景参数
+      mapOption: {
+        animation: false, // 动画小组件
+        baseLayerPicker: false, // 底图组件，选择三维数字地球的底图（imagery and terrain）。
+        fullscreenButton: false, // 全屏组件
+        vrButton: false, // VR模式
+        geocoder: false, // 地理编码（搜索）组件
+        homeButton: false, // 首页，点击之后将视图跳转到默认视角
+        infoBox: false, // 信息框
+        sceneModePicker: false, // 场景模式，切换2D、3D 和 Columbus View (CV) 模式。
+        selectionIndicator: false, //是否显示选取指示器组件
+        timeline: false, // 时间轴
+        navigationHelpButton: false, // 帮助提示，如何操作数字地球。
+        // 如果最初应该看到导航说明，则为true；如果直到用户明确单击该按钮，则该提示不显示，否则为false。
+        navigationInstructionsInitiallyVisible: false,
+        imageryLayers: [],
+      },
+    }
+  },
+  mounted() {
+    this.onload();
+  },
+  methods: {
+    //初始化地图
+    initMap(option=this.mapOption){
+      viewer = new Cesium.Viewer("viewer-container",option);
+      this.$viewer = viewer;
+      // 隐藏logo
+      viewer._cesiumWidget._creditContainer.style.display = "none";
+      viewer.scene.globe.baseColor = Cesium.Color.fromCssColorString("rgba(20,56,76,0.5)");
+      viewer.imageryLayers.removeAll();
+      viewer.imageryLayers.addImageryProvider(
+        new Cesium.BaiduImageryProvider({
+          style: 'midnight',
+          crs: 'WGS84'
+        })
+      )
+    },
+
+    //添加建筑矢量数据，url为建模json数据
+    addBuildingData(url){
+      this.$viewer.scene.primitives.add(
+        new Cesium.Cesium3DTileset({url})
+      );
+    },
+
+    //指定相机位置
+    flyToPosition(longitude,latitude,height,heading,pitch,roll){
+      this.$viewer.camera.flyTo({
+        destination : Cesium.Cartesian3.fromDegrees(longitude,latitude,height),
+        orientation : {
+          heading : Cesium.Math.toRadians(heading),
+          pitch : Cesium.Math.toRadians(pitch),
+          roll : roll
+        }
+      });
+    },
+
+    //添加图标覆盖物(单个)
+    addBillBoard(longitude,latitude,height,image,option= {},id){
+      this.$viewer.entities.add(
+        {
+          position : Cesium.Cartesian3.fromDegrees(longitude, latitude,height),
+          billboard : {
+            id,
+          image ,
+          ...option
+          }
+        }
+      );
+    },
+
+    //添加图标覆盖物(多个)------------未完善（开发中）
+    addBillBoards(positions,image,option= {},layerId){
+     let layer =  new Cesium.BillboardCollection(option);
+     positions.forEach(item => {
+
+     })
+      this.$viewer.entities.add(
+        layer
+      );
+    },
+
+
+    //去除覆盖物
+    removeEntity(id){
+      this.$viewer.entities.removeById(id);
+    },
+
+    //去除所有覆盖物
+    removeAllEntity(){
+      this.$viewer.entities.removeAll();
+    },
+
+    test(){},
+
+    onload(){
+      //创建场景实例
+      this.initMap();
+      //添加建筑矢量数据
+      this.addBuildingData('http://139.9.103.171/mapData/zhengzhou/tileset.json')
+      //定位建筑群位置
+      this.flyToPosition(113.682062,34.662187, 2000.0,0,-20.0,0.0);
+
+      this.addBillBoard(113.682062,34.662187,0,'/data/device.png',{
+        scale: 0.05
+      },"device");
+      //疫苗接种点
+      this.addBillBoard(113.670852,34.781468,0,'/data/epidemic.png',{
+        scale: 0.35
+      },"epidemic");
+      this.addBillBoard(113.74715,34.719967,0,'/data/epidemic.png',{
+        scale: 0.35
+      },"epidemic");
+      this.addBillBoard(113.646203,34.727969,0,'/data/epidemic.png',{
+        scale: 0.35
+      },"epidemic");
+      //政府部门
+      this.addBillBoard(113.631557,34.75261,0,'/data/government.png',{
+        scale: 0.35
+      },"government");
+      //垃圾场
+      this.addBillBoard(113.829591,34.713823,0,'/data/environment.png',{
+        scale: 0.35
+      },"environment");
+    },
+  }
+}
+</script>
+
+<style scoped>
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+</style>

src/components/3DMap/POIService.vue

@@ -0,0 +1,198 @@
+<template>
+  <dv-border-box-7 ref="container" :color="borderColor"  id="container" backgroundColor="rgba(23,65,72,0.5)" class="full">
+    <div class="full center">
+      <avue-input style="border-color: transparent;width: 75%" v-model="searchText" placeholder="请输入关键字"></avue-input>
+      <div style="width: 25%;height: 100%;" class="center">
+        <el-button @click="handleSearch" size="mini" style="font-size: 10px;background: rgba(255,255,255,0.7);color: #565656" class="click" icon="el-icon-search" ></el-button>
+      </div>
+    </div>
+   <dv-border-box-10 ref="resultBorder" :color="borderColor" backgroundColor="rgba(23,65,72,0.7)" id="resultPanel" v-show="resultPanel" >
+     <div v-if="resultType==1||resultType==2" style="width: 100%;height: 70px;color: #dddddd;font-size: 14px;font-style: italic;" class="center">
+       <div class="result full center">
+         {{resultType==1? '请输入关键字进行搜索 🔍' : '没有搜索到相关内容'}}
+         <div class="center" style="cursor: pointer;text-decoration-line: underline;width: 70px" @click="resultPanel=false">关闭</div>
+       </div>
+     </div>
+     <div v-if="resultType==3" style="width: 100%;height: 500px;color: white">
+        <loading v-if="loading"></loading>
+       <div class="center" style="width: 100%;height: 50px;justify-content: left;text-indent: 20px;">搜索结果 :  <div class="center" style="cursor: pointer;text-decoration-line: underline;width: 80%;display: inline-block">{{searchText}}</div></div>
+       <div class="center" style="width: 100%;height: 400px;">
+         <table style="width: 95%;height: 100%;border: #dddddd" border="1">
+           <tr style="height: 50px;color: #dddddd;font-size: 14px">
+             <th style="width: 25%">名称</th>
+             <th style="width: 25%">类型</th>
+             <th style="width: 25%">地址</th>
+             <th style="width: 25%">联系方式</th>
+           </tr>
+           <tr @click="toTarget(item)" class="item-pointer" style="font-size: 14px;cursor: pointer" v-for="(item,index) of data['pois']">
+             <td>{{item.name}}</td>
+             <td>{{item.type}}</td>
+             <td>{{item.address}}</td>
+             <td>{{item.tel}}</td>
+           </tr>
+         </table>
+       </div>
+       <div class="center" style="width: 100%;height: 50px">
+         <div class="center" style="width: 100px">总数：<span style="color: #00f9cf">{{data.count}}</span></div>
+         <div class="center" style="width: 100px;cursor: pointer;text-decoration-line: underline;" v-if="currentPage!=1" @click="preSearch">上一页</div>
+         <div class="center" style="width: 50px;color: #00f9cf">{{currentPage}}</div>
+         <div class="center" style="width: 100px;cursor: pointer;text-decoration-line: underline;" @click="nextSearch" v-if="data.pois.length>=5">下一页</div>
+         <div class="center" style="cursor: pointer;text-decoration-line: underline;width: 70px" @click="resultPanel=false">关闭</div>
+       </div>
+     </div>
+   </dv-border-box-10>
+
+  </dv-border-box-7>
+</template>
+
+<script>
+import {Message} from "element-ui";
+import Loading from "./Loading";
+
+export default {
+  name: "POIService",
+  components: {Loading},
+  props: {
+    city: {
+      type: 'String',
+      default: '全国'
+    },
+    borderColor: {
+        type: 'Array',
+        default: ['rgba(16,206,250,0.5)','rgba(255,255,255,1)']
+      }
+  },
+  mounted() {
+    this.placeSearch = new this.$AMap.PlaceSearch(this.option);
+  },
+  watch: {
+    city(){
+      this.placeSearch.setCity(this.city);
+    },
+    resultType(){
+      this.$refs['resultBorder'].initWH();
+    },
+    resultPanel(){
+      this.$refs['resultBorder'].initWH();
+    }
+  },
+  data(){
+    return{
+      loading: {},
+      data: {},
+      resultPanel: false,
+      searchText: '',
+      resultType: 1,
+      placeSearch: {},
+      currentPage: 1,
+      option: {
+        pageSize: 5,
+        pageIndex: 1,
+      }
+    }
+  },
+  inject: ['screen'],
+  methods: {
+
+    toTarget(item){
+      this.screen.$refs['map'].removeEntity("placeSearchLabel");
+      this.screen.$refs['map'].addBillBoard(item.location.lng,item.location.lat,0,'/data/device.png',{
+        scale: 0.05
+      },"placeSearchLabel");
+      this.screen.$refs["map"].flyToPosition(item.location.lng,item.location.lat-0.06, 2000.0,0,-20.0,0.0);
+      this.resultPanel =false;
+    },
+   async preSearch(){
+     this.currentPage--;
+     this.placeSearch.setPageIndex(this.currentPage);
+      this.data =await this.search();
+     this.loading = false;
+
+   },
+   resize(){
+     this.$refs['container'].initWH();
+   },
+   async nextSearch(){
+     this.currentPage++;
+     this.placeSearch.setPageIndex(this.currentPage);
+     this.data =await this.search();
+     this.loading = false;
+   },
+   async search(){
+     this.loading = true;
+     return new Promise((resolve, reject)=> {
+        this.placeSearch.search(this.searchText, (status, result) => {
+          if(status=='error'){
+            reject(result);
+          }
+          resolve(result.poiList);
+        })
+      })
+    },
+   async handleSearch(){
+     this.currentPage = 1;
+     this.placeSearch.setPageIndex(1);
+      if(this.searchText==""){
+        this.resultType=1;
+        this.resultPanel = true;
+        return
+      }
+     this.resultPanel = true;
+     let data = await this.search();
+     this.loading = false;
+     if(typeof data == 'undefined' || data['pois'].length==0){
+        this.resultType=2;
+        return
+      }
+      this.resultType=3;
+      this.data = data;
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  /deep/ .el-input__inner{
+    border: none;
+    color: white;
+    font-size: 16px;
+  }
+  #container{
+    /*background: linear-gradient(to right,rgba(0,0,0,0.5),rgba(0,0,0,0.5));*/
+  }
+  .click:hover{
+    cursor: pointer;
+    transform: translate(2px,2px);
+  }
+  #resultPanel{
+    position: relative;width: 100%;height: auto;
+    /*background: rgba(23,65,72,0.8);*/
+    /*background: linear-gradient(to bottom,rgba(23,65,72,0.5),rgba(23,65,72,0.9));*/
+    top: 10px;
+    /*border: 1px solid white;*/
+    animation: initPanel 0.5s ;
+  }
+  .result{
+    animation: result 0.2s ;
+  }
+  @keyframes result {
+    from{ width: 0 ;height: 0}
+    to{ width: 100%}
+  }
+  @keyframes initPanel {
+    from{ opacity: 0}
+    to{ opacity: 1}
+  }
+  .item-pointer:hover{
+    background: rgba(0,0,0,0.5);
+  }
+</style>

src/components/3DMap/TimeBar.vue

@@ -0,0 +1,73 @@
+<template>
+  <div style="width: 100%;height: 100%;">
+    <dv-border-box-5  :color="['#49baa5', '#dddddd']" backgroundColor="rgba(0, 0, 0, 0.5)">
+      <div  style="font-size: 18px;width: 100%;height: 100%;display: flex;justify-content: left;align-items: center">
+        <div class=" center" style="width: 20%;">{{dateTime.date}}</div>
+        <div class=" center" style="width: 20%;background: rgba(76,217,166,0.5);font-size: 26px;font-style: italic;border-radius: 5px;border: solid 1px #dddddd">{{dateTime.time}}</div>
+        <div class=" center" style="width: 15%;">{{weekStr[dateTime.week]}}</div>
+        <div class=" center" style="width: 10%;font-size: 26px;font-style: italic;">{{temperature}}℃</div>
+        <div class=" center" style="width: 15%;">
+          <div class="weather" style="width: 30px;height: 30px;"></div>
+          <div style="text-indent: 8px">{{weather}} </div>
+        </div>
+      </div>
+    </dv-border-box-5>
+  </div>
+</template>
+
+<script>
+import {dateFormat} from "../../util/date";
+
+export default {
+  name: "TimeBar",
+  async mounted() {
+    this.getTime();
+    await this.getWeather();
+    },
+  data(){
+    return{
+      dateTime: {},
+      weekStr: ['星期天','星期一','星期二','星期三','星期四','星期五','星期六',],
+      temperature: '',
+      weather: '',
+    }
+  },
+  methods: {
+    currentTime() {
+      setInterval(this.getTime, 500);
+    },
+    getTime() {
+      let date = new Date();
+      let str = dateFormat(date);
+      let week = date.getDay();
+      str = str.split(" ");
+      this.dateTime = {
+        week: week,
+        date: str[0],
+        time: str[1]
+      }
+    },
+    async getWeather(){
+      console.log(this.$map)
+      let  weather = new this.$AMap.Weather();
+      //执行实时天气信息查询
+      weather.getForecast('郑州市', (err, data) => {
+        console.log(data)
+        this.temperature = data.forecasts[0].dayTemp;
+        this.weather  = data.forecasts[0].dayWeather;
+      });
+    },
+  }
+}
+</script>
+
+<style scoped>
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .weather{
+    background: url("/data/duoyun.png") no-repeat center/contain;
+  }
+</style>

src/components/3DMap/map-components/InfoLayer.vue

@@ -0,0 +1,29 @@
+<template>
+  <div class="info-layer">
+      <box1 v-for="item of box1" :title="item.title" :position="item.position" :data="item.data"></box1>
+  </div>
+</template>
+
+<script>
+import Box1 from "./infobox/box1";
+export default {
+  name: "InfoLayer",
+  components: {Box1},
+  data(){
+    return{
+      box1: []
+    }
+  }
+}
+</script>
+
+<style scoped>
+.info-layer{
+  position: absolute;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: transparent;
+  pointer-events: none;
+}
+</style>

src/components/3DMap/map-components/infobox/box1.vue

@@ -0,0 +1,105 @@
+<template>
+    <div id="box1" :style="{
+      top: position[0]+'px',
+      left: position[1]+ 'px'
+    }">
+      <div class="wrap">
+        <!--  边框  -->
+        <div class="border" style="top: 0px;width: 208px;height: 1px;margin-left: 42px"></div>
+        <div class="border" style="bottom: 50px;width: 208px;height: 1px;"></div>
+        <div class="border" style="bottom: 50px;width: 1px;height: 208px;"></div>
+        <div class="border" style="top: 0px;width: 1px;height: 208px;right: 0px"></div>
+        <div class="border" style="top: 0px;left: 50px;transform: rotate(45deg) translate(8px, -20px);height: 58px;width: 1px"></div>
+        <div class="border" style="bottom: 50px;right: 0px;transform: rotate(45deg) translate(-8px, 20px);height: 58px;width: 1px;"></div>
+        <!--  标题      -->
+        <div style="height: 10px"></div>
+        <div class="title center">
+          {{title}}
+        </div>
+        <div style="width: 220px;margin-left: 30px;height: 1px;background: #29baf1;margin-top: 5px;box-shadow: 0 0 10px 2px #29baf1;"></div>
+
+      <!--  内容   -->
+        <div v-if="data.length>0" style="width: 230px;height: 190px;margin: auto;color: #ffffff;overflow: hidden">
+            <div v-for="(item,index) of data" :key="item" style="width: 100%;height: 40px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis" class="center">
+              <div class="lable center" style="width: 35%;height: 100%;">{{item.label}}</div>
+              <div class="content center" style="width: 65%;height: 100%;justify-content: left">{{item.value}}</div>
+            </div>
+        </div>
+
+        <div v-else style="width: 230px;height: 190px;margin: auto;color: #ffffff;overflow: hidden">
+          <div  style="width: 100%;height: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis" class="center">
+             暂无数据
+          </div>
+        </div>
+      </div>
+      <div class="line"></div>
+    </div>
+</template>
+
+<script>
+export default {
+  name: "box1",
+  props: {
+    title: {
+      type: "String",
+      default: '建筑'
+    },
+    data: {
+      type: "Array",
+      default: []  //[ {label: '姓名' , value: '梁汉强'}]
+    },
+    position: {
+      type: "Array",
+      default: [0,0]
+    }
+  }
+}
+</script>
+
+<style scoped>
+.full{
+  width: 100%;
+  height: 100%;
+}
+#box1{
+  width: 300px;
+  height: 300px;
+  position: absolute;
+  /*background: #ffffff;*/
+  top: 30%;
+  left: 30%;
+}
+.wrap{
+  width: 250px;
+  height: 250px;
+  margin-left: 50px;
+  background-image:
+    linear-gradient(135deg, transparent 30px, #28abf06c 30px, #28abf06c 50%, transparent 50%),
+    linear-gradient(-45deg, transparent 30px, #28abf06c 30px, #28abf06c 50.1%, transparent 50%);
+}
+.line{
+  height: 70px;
+  width: 1px;
+  background: linear-gradient(to top, #00bdff, #11bcf8);
+  transform: rotate(45deg) translate(10px, -25px);
+}
+.center{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.border{
+  position: absolute;
+  background-color: #29baf1;
+  box-shadow: 0 0 10px 2px #29baf1;
+}
+.title{
+  letter-spacing: 5px;
+  color: white;
+  font-weight: bold;
+  width: 220px;
+  height: 40px;
+  margin-left: 30px;
+  background-image: linear-gradient(135deg, transparent 25px, #2299c4 25px);
+}
+</style>

src/components/count-in/count-in.vue

@@ -0,0 +1,94 @@
+<template>
+  <span>{{printVal}}</span>
+</template>
+
+<script>
+  export default {
+    name:"count-in",
+    props: {
+      startVal: {
+        type: [String, Number],
+        default: ''
+      },
+      endVal: {
+        type: [String, Number],
+        default: ''
+      },
+      speed: {
+        type: [String, Number],
+        default: 5
+      },
+      decimals: {
+        type: [String, Number],
+        default: 0
+      },
+      isReverse: {
+        type: Boolean,
+        default: false
+      }
+    },
+    data() {
+      return {
+        start: +this.startVal,
+        end: +this.endVal,
+        formatSpeed: +this.speed || 5
+      };
+    },
+    computed: {
+      formatDecimals() {
+        // 是否整数
+        let formatDecimals = this.decimals > 0 ? this.decimals : 0;
+        return formatDecimals
+      },
+      decimalsLen() {
+        // 1 = 0.001 * decimalsLen(x);
+        let decimalsLen = Math.pow(10, this.formatDecimals);
+        return decimalsLen;
+      },
+      printVal() {
+        // 保留几位小数
+        let start = (
+          parseInt(this.start * this.decimalsLen) / this.decimalsLen
+        ).toFixed(this.formatDecimals);
+        return start;
+      }
+    },
+    watch: {},
+    methods: {
+      accumulativeMachine() {
+        setTimeout(() => {
+          if (this.isReverse) {
+            let decimals = this.formatDecimals === 0 ? 0 : 1 / this.decimalsLen;
+            let formatSpeed = this.formatSpeed / this.decimalsLen + decimals;
+            this.start -= formatSpeed;
+            if (this.printVal <= this.end) {
+              this.start = this.end;
+              return
+            }
+          } else {
+            let decimals = this.formatDecimals === 0 ? 0 : 1 / this.decimalsLen;
+            let formatSpeed = this.formatSpeed / this.decimalsLen + decimals;
+            this.start += formatSpeed;
+            if (this.printVal >= this.end) {
+              this.start = this.end;
+              return
+            }
+          }
+          this.accumulativeMachine();
+        }, 8);
+      }
+    },
+    created() {},
+    mounted() {
+      this.$nextTick(() => {
+        this.accumulativeMachine();
+        setInterval(()=>{
+          this.start = 0;
+          this.accumulativeMachine();
+        },6000)
+      })
+    }
+  };
+</script>
+
+<style scoped></style>

src/components/device/alarmhistory.vue

@@ -10,349 +10,349 @@
 </template>
 
 <script>
-  // import{
-  //   getDetailByDeviceId
-  // } from "../../api/smartapplication/smartdevice.js";
-  // import {
-  //   getList,
-  //   getDetail,
-  //   add,
-  //   update,
-  //   remove
-  // } from "../../api/homecare/alarmlist.js";
-  import {
-    mapGetters
-  } from "vuex";
+import{
+  getDetailByDeviceId
+} from "../../api/device/iotdevice.js";
+import {
+  getList,
+  getDetail,
+  add,
+  update,
+  remove
+} from "../../api/device/iotalarm.js";
+import {
+  mapGetters
+} from "vuex";
 
 
-  export default {
-    props:{
-      imei: "",
-    },
-    data() {
+export default {
+  props:{
+    imei: "",
+  },
+  data() {
 
-      return {
-        deviceDetail:{},
-        alarmDetail: {},
-        alarmDetailVisible: false,
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          menuWidth: 200,
-          height: 'auto',
-          calcHeight: 30,
-          tip: false,
-          menu: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          addBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            {
-              label: "设备sn号",
-              prop: "deviceId",
-              // search: true,
-              width: 130,
-              rules: [{
-                required: false,
-                message: "请输入告警设备sn号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备名称",
-              prop: "deviceName",
-              // search: true,
-              width: 200,
-              overHidden: true,
-              rules: [{
-                required: false,
-                message: "请输入设备名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备类型",
-              prop: "deviceType",
-              type: "select",
-              // search: true,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: false,
-                message: "请输入设备类型",
-                trigger: "blur"
-              }]
+    return {
+      deviceDetail:{},
+      alarmDetail: {},
+      alarmDetailVisible: false,
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        menuWidth: 200,
+        height: 'auto',
+        calcHeight: 30,
+        tip: false,
+        menu: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        addBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        column: [
+          {
+            label: "设备sn号",
+            prop: "deviceId",
+            // search: true,
+            width: 130,
+            rules: [{
+              required: false,
+              message: "请输入告警设备sn号",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备名称",
+            prop: "deviceName",
+            // search: true,
+            width: 200,
+            overHidden: true,
+            rules: [{
+              required: false,
+              message: "请输入设备名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备类型",
+            prop: "deviceType",
+            type: "select",
+            // search: true,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
+            dataType: "number",
+            rules: [{
+              required: false,
+              message: "请输入设备类型",
+              trigger: "blur"
+            }]
+          },
 
-            // {
-            //   label: "告警次数",
-            //   prop: "alarmTimes",
-            //   rules: [{
-            //     required: false,
-            //     message: "请输入告警次数",
-            //     trigger: "blur"
-            //   }]
-            // },
-            // {
-            //   label: "告警等级",
-            //   prop: "level",
-            //   type: "select",
-            //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_level",
-            //   props: {
-            //     label: "dictValue",
-            //     value: "dictKey"
-            //   },
-            //   dataType: "nubmer",
-            //   rules: [{
-            //     required: false,
-            //     message: "请输入告警等级 1:严重告警,2:警告告警,3:提示告警",
-            //     trigger: "blur"
-            //   }]
-            // },
-            // {
-            //   label: "数据",
-            //   prop: "name",
-            //   width: 100,
-            //   rules: [{
-            //     required: false,
-            //     message: "请输入告警原因",
-            //     trigger: "blur"
-            //   }]
-            // },
-            {
-              label: "监测值",
-              prop: "monitorValue",
-              width: 100,
-              rules: [{
-                required: false,
-                message: "请输入监测值",
-                trigger: "blur"
-              }]
-            },
+          // {
+          //   label: "告警次数",
+          //   prop: "alarmTimes",
+          //   rules: [{
+          //     required: false,
+          //     message: "请输入告警次数",
+          //     trigger: "blur"
+          //   }]
+          // },
+          // {
+          //   label: "告警等级",
+          //   prop: "level",
+          //   type: "select",
+          //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_level",
+          //   props: {
+          //     label: "dictValue",
+          //     value: "dictKey"
+          //   },
+          //   dataType: "nubmer",
+          //   rules: [{
+          //     required: false,
+          //     message: "请输入告警等级 1:严重告警,2:警告告警,3:提示告警",
+          //     trigger: "blur"
+          //   }]
+          // },
+          // {
+          //   label: "数据",
+          //   prop: "name",
+          //   width: 100,
+          //   rules: [{
+          //     required: false,
+          //     message: "请输入告警原因",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "监测值",
+            prop: "monitorValue",
+            width: 100,
+            rules: [{
+              required: false,
+              message: "请输入监测值",
+              trigger: "blur"
+            }]
+          },
 
-            {
-              label: "告警时间",
-              prop: "recordTime",
-              rules: [{
-                required: false,
-                message: "请输入告警时间",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "最新告警时间",
-              prop: "updateTime",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入最新告警时间",
-                trigger: "blur"
-              }]
-            },
+          {
+            label: "告警时间",
+            prop: "recordTime",
+            rules: [{
+              required: false,
+              message: "请输入告警时间",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "最新告警时间",
+            prop: "updateTime",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入最新告警时间",
+              trigger: "blur"
+            }]
+          },
 
 
-            // {
-            //   label: "告警状态",
-            //   prop: "status",
-            //   type: "select",
-            //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_status",
-            //   props: {
-            //     label: "dictValue",
-            //     value: "dictKey"
-            //   },
-            //   dataType: "number",
-            //   rules: [{
-            //     required: false,
-            //     message: "请输入告警状态，0 实时告警，1-历史告警",
-            //     trigger: "blur"
-            //   }]
-            // },
-            {
-              label: "告警类型",
-              prop: "alarmType",
-              type: "select",
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: false,
-                message: "请输入告警类型, 0-业务告警；1-设备告警",
-                trigger: "blur"
-              }]
+          // {
+          //   label: "告警状态",
+          //   prop: "status",
+          //   type: "select",
+          //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_status",
+          //   props: {
+          //     label: "dictValue",
+          //     value: "dictKey"
+          //   },
+          //   dataType: "number",
+          //   rules: [{
+          //     required: false,
+          //     message: "请输入告警状态，0 实时告警，1-历史告警",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "告警类型",
+            prop: "alarmType",
+            type: "select",
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
+            dataType: "number",
+            rules: [{
+              required: false,
+              message: "请输入告警类型, 0-业务告警；1-设备告警",
+              trigger: "blur"
+            }]
+          },
 
-          ]
-        },
-        data: []
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.alarmlist_add, false),
+        viewBtn: this.vaildData(this.permission.alarmlist_view, false),
+        delBtn: this.vaildData(this.permission.alarmlist_delete, false),
+        editBtn: this.vaildData(this.permission.alarmlist_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.alarmlist_add, false),
-          viewBtn: this.vaildData(this.permission.alarmlist_view, false),
-          delBtn: this.vaildData(this.permission.alarmlist_delete, false),
-          editBtn: this.vaildData(this.permission.alarmlist_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
-        });
-        return ids.join(",");
-      }
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+
+  methods: {
+    init(){
+      // this.query.deviceId = this.imei;
+      this.page.currentPage =1;
+      this.page.pageSize =10;
+      this.onLoad(this.page)
+    },
+    ViewAlarmDetail(row) {
+      getDetailByDeviceId(row.deviceId).then(res=>{
+        this.deviceDetail = res.data.data;
+        console.log(res)
+      });
+      this.alarmDetail = row;
+      this.alarmDetailVisible = true;
     },
 
-    methods: {
-      init(){
-        // this.query.deviceId = this.imei;
-        this.page.currentPage =1;
-        this.page.pageSize =10;
-        this.onLoad(this.page)
-      },
-      ViewAlarmDetail(row) {
-        getDetailByDeviceId(row.deviceId).then(res=>{
-          this.deviceDetail = res.data.data;
-          console.log(res)
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        this.alarmDetail = row;
-        this.alarmDetailVisible = true;
-      },
-
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage) {
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize) {
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        this.query.deviceId = this.imei;
-        console.log("imei:"+this.imei)
-        // this.query.deviceName = "阅海万家"
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      this.query.deviceId = this.imei;
+      console.log("imei:"+this.imei)
+      // this.query.deviceName = "阅海万家"
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/components/excel/cy-excel-import.vue

@@ -65,6 +65,7 @@
         importExcel(this.file, this.flag).then(res => {
           this.onSuccess(res);
         });
+        this.file = '';
       },
       selectFile(file, fileList) {
         this.file = file;
@@ -80,18 +81,22 @@
         // 调用刷新数据的方法
         // this.initEmps();
         // message 弹出消息
-        if (res.status == 200){
+        if (res.status == 200 && !res.data.data){
           // 成功后文本修改为原来的导入数据
-          this.importDataText = '导入数据';
-          // 图标修改
-          this.importDataIcon = 'el-icon-upload2';
-          // 将上传组件改为允许使用
-          this.importDisabled = false;
           this.$message.success('导入成功！');
-          this.dialogVisible = false;
         }else{
-          this.$message.error("导入失败！");
+          let str = res.data.data.replace(/\r/g,"\u000a");
+          // this.$alert(str, {
+          //   confirmButtonText: '确定'
+          // });
+          alert(str);
         }
+        this.importDataText = '导入数据';
+        // 图标修改
+        this.importDataIcon = 'el-icon-upload2';
+        // 将上传组件改为允许使用
+        this.importDisabled = false;
+        this.dialogVisible = false;
         this.$emit("success")
       },
 // 上传文件调用

src/components/home-page/topMenu.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
-    <div class="wel__title" v-if="permission.screen_service">
-        <i class="iconfont iconshujudaping" style="margin-right: 10px;color: #25f3e6;"></i>
+    <div class="wel__title">
+        <i class="el-icon-discover" style="color: #25f3e6;"></i>
         大屏服务
     </div>
    <!-- <el-row :gutter="20">
@@ -12,31 +12,31 @@
       </el-col>
     </el-row> -->
     <el-row :gutter="20">
-      <el-col :span="4" v-if="permission.data_service" @click.native="jumpToBigData('smartCommunity')">
+      <el-col :span="4" @click.native="jumpToBigData('/bigScreen')">
         <div class="wel__topMenu" style="background:linear-gradient(to right,#4b94b4,#335791)">
           数据服务
         </div>
       </el-col>
-      <el-col :span="4" v-if="permission.fight_service" @click.native="jumpToBigData('fireControl')">
-        <div class="wel__topMenu" style="background:linear-gradient(to right,#fdb783,#f86c89)">
-          消防服务
-        </div>
-      </el-col>
-      <el-col :span="4" v-if="permission.elderly_care_service"  @click.native="jumpToBigData('smartPension')">
-        <div class="wel__topMenu" style="background:linear-gradient(to right,#f38bd6,#f36a97)">
-          养老服务
-        </div>
-      </el-col>
-      <el-col :span="4" v-if="permission.police_service" @click.native="jumpToBigData('smartPolice')">
-        <div class="wel__topMenu" style="background:linear-gradient(to right,#25e7ab,#0db5e2)">
-          公安服务
-        </div>
-      </el-col>
-      <el-col :span="4" v-if="permission.police_service" @click.native="jumpToBigData('operatePlatform')">
-        <div class="wel__topMenu" style="background:linear-gradient(to right,#25e7ab,#0db5e2)">
-          运营服务
-        </div>
-      </el-col>
+<!--      <el-col :span="4" v-if="permission.fight_service" @click.native="jumpToBigData('fireControl')">-->
+<!--        <div class="wel__topMenu" style="background:linear-gradient(to right,#fdb783,#f86c89)">-->
+<!--          消防服务-->
+<!--        </div>-->
+<!--      </el-col>-->
+<!--      <el-col :span="4" v-if="permission.elderly_care_service"  @click.native="jumpToBigData('smartPension')">-->
+<!--        <div class="wel__topMenu" style="background:linear-gradient(to right,#f38bd6,#f36a97)">-->
+<!--          养老服务-->
+<!--        </div>-->
+<!--      </el-col>-->
+<!--      <el-col :span="4" v-if="permission.police_service" @click.native="jumpToBigData('smartPolice')">-->
+<!--        <div class="wel__topMenu" style="background:linear-gradient(to right,#25e7ab,#0db5e2)">-->
+<!--          公安服务-->
+<!--        </div>-->
+<!--      </el-col>-->
+<!--      <el-col :span="4" v-if="permission.police_service" @click.native="jumpToBigData('operatePlatform')">-->
+<!--        <div class="wel__topMenu" style="background:linear-gradient(to right,#25e7ab,#0db5e2)">-->
+<!--          运营服务-->
+<!--        </div>-->
+<!--      </el-col>-->
     </el-row>
   </div>
 </template>
@@ -133,25 +133,23 @@
         })
       },
       jumpToBigData(path) {
-        if(path=="smartCommunity"){
-          debugger
-          if(getUserInfo()){
-            localStorage.setItem("agencies1",JSON.stringify(this.GardenDataList))
-            path = 'index2'
-          }else{
-            let orgInfo = this.$store.getters.orgInfo
-            if(orgInfo.deptType=="5"){
-              //社区
-              localStorage.setItem("agencies1",JSON.stringify(this.GardenDataList))
-              path = 'index2'
-            }else if(orgInfo.deptType=="6"||orgInfo.deptType=="1"||orgInfo.deptType=="4"){
-              //小区
-              localStorage.setItem("agencies2",JSON.stringify(this.ResDataList))
-              path = 'index3'
-            }
-          }
-        }
-
+        // if(path=="smartCommunity"){
+        //   if(getUserInfo()){
+        //     localStorage.setItem("agencies1",JSON.stringify(this.GardenDataList))
+        //     path = 'index2'
+        //   }else{
+        //     let orgInfo = this.$store.getters.orgInfo
+        //     if(orgInfo.deptType=="5"){
+        //       //社区
+        //       localStorage.setItem("agencies1",JSON.stringify(this.GardenDataList))
+        //       path = 'index2'
+        //     }else if(orgInfo.deptType=="6"||orgInfo.deptType=="1"||orgInfo.deptType=="4"){
+        //       //小区
+        //       localStorage.setItem("agencies2",JSON.stringify(this.ResDataList))
+        //       path = 'index3'
+        //     }
+        //   }
+        // }
         this.$router.push({
           path: path
         })
@@ -161,7 +159,16 @@
 </script>
 
 <style lang="scss" scoped >
-
+.my-top-menu{
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: row;
+  padding: 2px 20px;
+  overflow-x: scroll;
+}
   .wel{
       &__title {
         font-size: 16px;

src/components/job/job_solve.vue

@@ -0,0 +1,127 @@
+<template>
+  <el-container style="border: #000000;height: 100%;" v-if="visible">
+    <avue-form ref="form" v-model="jobSolve" :option="option" @submit="submit">
+    </avue-form>
+  </el-container>
+</template>
+
+<script>
+import {
+  update
+} from "@/api/order/deviceorder";
+export default {
+  props: {
+    visible: "",
+    jobSolve: {},
+  },
+  data() {
+    return {
+      option: {
+        emptyBtn: true,
+        submitBtn: true,
+        group: [{
+          icon: 'el-icon-discover',
+          label: '告警设备',
+          prop: 'group1',
+          column: [{
+            label: '设备类型',
+            prop: 'deviceType',
+            span: 10,
+            type: "select",
+            dataType: "number",
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
+            },
+            disabled: true
+          }, {
+            label: '设备名称',
+            prop: 'deviceName',
+            span: 14,
+            disabled: true
+          }, {
+            label: '安装位置',
+            prop: 'alarmPosition',
+            row: true,
+            span: 20,
+            disabled: true
+          }]
+        }, {
+          icon: 'el-icon-edit-outline',
+          label: '工单处理',
+          prop: 'group2',
+          column: [{
+            label: '告警时间',
+            prop: 'alarmTime',
+            row: true,
+            span: 12,
+            disabled: true
+          }, {
+            label: '处理人',
+            prop: 'handler',
+            span: 12,
+
+          }, {
+            label: '联系方式',
+            prop: 'phone',
+            row: true,
+            span: 12
+          }, {
+            label: '处理状态',
+            prop: 'jobStatus',
+            type: "select",
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=job_status",
+            dataType: "number",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
+            },
+            span: 12
+          },
+            {
+              label: '处理备注',
+              prop: 'remark',
+              type: "textarea",
+              span: 20
+            }
+          ]
+        }]
+      },
+
+
+    }
+  },
+  mounted() {
+    console.log(this.jobSolve.jobStatus)
+    if (this.jobSolve.jobStatus == 2) {
+      this.option.submitBtn = false;
+      this.option.emptyBtn = false;
+    } else {
+      this.option.submitBtn = true;
+      this.option.emptyBtn = true;
+    }
+  },
+  methods: {
+    init() {
+      this.option.submitBtn = true;
+      this.option.emptyBtn = true;
+    },
+    submit() {
+      update(this.jobSolve).then(() => {
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        this.$emit("close-dialog", "取消");
+      })
+    },
+    handleCancel() {
+      this.$emit("close-dialog", "取消");
+    }
+  }
+}
+</script>
+
+<style>
+</style>

src/components/job/open_door_record.vue

@@ -0,0 +1,78 @@
+<template>
+  <basic-container>
+    <avue-crud :option="option"  :data="data" :page="page"
+
+               @size-change="sizeChange" >
+
+    </avue-crud>
+  </basic-container>
+</template>
+
+<script>
+export default {
+  props:{
+    openDoorRecordList:[],
+  },
+  data() {
+    return {
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+
+      option: {
+        height:'auto',
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        menu: false,
+        addBtn: false,
+        editBtn: false,
+        delBtn: false,
+        selection: true,
+        dialogClickModal: false,
+        column: [
+          {
+            label: "开门时间",
+            prop: "openTime",
+
+          },
+          {
+            label: "门状态",
+            prop: "openStatus",
+          }
+        ]
+      },
+      data: []
+    };
+  },
+  created(){
+    console.log("create")
+    this.data = this.openDoorRecordList;
+    this.page.total = this.openDoorRecordList.length;
+    console.log("data"+JSON.stringify(this.data))
+    console.log("size"+this.page.total)
+  },
+  methods: {
+
+
+
+
+    sizeChange(pageSize){
+      this.page.pageSize = pageSize;
+    },
+
+  }
+};
+</script>
+
+<style>
+</style>

src/components/scene/CarScreen.vue

@@ -0,0 +1,237 @@
+<template>
+  <div class="full">
+    <!-- 数据面板 事件总数   -->
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 10%;top: 10%;left: 10px">
+      <div  class="center full" style="flex-direction: column">
+        <div  style="width: 90%;height: 30%;color: white;line-height: 40px">车位总数</div>
+        <div class="center" style="width: 70%;height: 60%;color: #47fcd2;font-size: 30px;font-style: italic;">500</div>
+      </div>
+    </dv-border-box-8>
+
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 30%;top: 22%;left: 10px">
+      <div class="full" style="flex-direction: column;padding-top: 7%">
+        <div style="width: 90%;height: 7%;font-size: 20px;color: white;justify-content: left;padding: 3%" class="center"></div>
+        <div style="width: 100%;height: 57%;" class="center">
+          <div style="width: 50%;height: 100%;flex-direction: column;" class="center">
+            <div class="center" style="font-size: 30px;">{{95/100 * 100}} %</div>
+            <div style="margin-top: 20px;font-size: 30px;"  class="center">车位占用</div>
+          </div>
+          <div  style="width: 60%;height: 100%;flex-direction: column;color: white" class="center" >
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">已占用车位
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic;">
+                <CountIn :startVal='0' :endVal='115' :speed='1' :decimals="0" :isReverse=false></CountIn></div>
+            </div>
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">空闲车位
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic">5</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </dv-border-box-8>
+
+    <div class="center" style="position:absolute;top: 60%;width: 25%;height: 30%;left: 10px;flex-direction: column">
+      <dv-border-box-4 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" class="full">
+        <div class="full center" style="flex-direction: column">
+          <div style="width: 90%;height: 20%;justify-content: left;" class="title center">机动车通行情况</div>
+          <div style="width: 100%;height: 80%" id="business"></div>
+        </div>
+      </dv-border-box-4>
+    </div>
+
+    <div style="position:absolute;width: 25%;height: 5%;top: 7%;right: 1%;background: linear-gradient(to right, rgba(0,0,0,0.7),rgba(0,0,0,0.2));">
+      <div class=" full center" style="justify-content: left;font-size: 22px;color: #00f9cf;text-indent: 20px;font-style: italic">
+        车辆抓拍
+      </div>
+    </div>
+
+    <dv-border-box-1 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 25%;height: 55%;top: 12%;right: 1%;">
+      <div class="center full">
+        <div  style="width: 91%;height: 92%;">
+          <div @click="videoShow" v-for="(item,index) of carImg" :key="item" class="click" style="width: 50%;height: 33.3%;float: left;"
+            :style="{
+            background: 'url(/car/'+index+'.jpg) no-repeat center/cover'
+            }"
+          >
+            <div style="width: 100%;height: 80%;"></div>
+            <div style="width: 100%;height: 20%;background: rgba(0,0,0,0.5);color: #b5b5b5;font-style: italic" class="center">
+              {{item}}
+            </div>
+          </div>
+        </div>
+      </div>
+    </dv-border-box-1>
+
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 25%;height: 25%;top: 70%;right: 1%">
+      <div class="full" style="flex-direction: column;padding-top: 2%">
+        <div style="width: 90%;height: 7%;font-size: 20px;color: white;justify-content: left;padding: 3%" class="center"> 车辆占比(进出)</div>
+        <div style="width: 100%;height: 57%;" class="center">
+          <div style="width: 50%;height: 100%;" class="center">
+            <dv-active-ring-chart :config="eventOption" style="width:100%;height:90%" />
+          </div>
+          <div  style="width: 60%;height: 100%;flex-direction: column;color: white" class="center" >
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">总车辆
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic">
+                <CountIn :startVal='0' :endVal='120' :speed='1' :decimals="0" :isReverse=false></CountIn></div>
+            </div>
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">外来车辆
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic;">
+                <CountIn :startVal='0' :endVal='115' :speed='1' :decimals="0" :isReverse=false></CountIn></div>
+            </div>
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">内部车辆
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic">5</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </dv-border-box-8>
+  </div>
+</template>
+
+<script>
+import Charts, {changeDefaultConfig} from "@jiaminghi/charts";
+import CountIn from "../count-in/count-in";
+export default {
+  components: {CountIn},
+  mounted() {
+    this.initCharts();
+    this.onload();
+    },
+
+  data(){
+    return{
+      business: {},
+      eventOption: {
+        digitalFlopStyle: {
+          fontSize: 20,
+          fill: '#fff'
+        },
+        data: [
+          {
+            name: '外来',
+            value: 10
+          },
+          {
+            name: '内部',
+            value: 1
+          }
+        ]
+      },
+      sourceList: [
+        {label: '应急物资',value: '2400'},
+        {label: '应急队伍',value: '230'},
+        {label: '城市部件',value: '8605'},
+        {label: '现场还原',value: '5260'},
+      ],
+      carImg: [
+        "粤K1234",
+        "宁A096L0",
+        "宁A096L0",
+        "宁A096L0",
+        "宁A096L0",
+        "宁A096L0",
+      ]
+    }
+  },
+  methods: {
+    initCharts(){
+      this.newCharts("business","business");
+    },
+    newCharts(id,propertyName){
+      const container = document.getElementById(id)
+      let myChart = new Charts(container);
+      this[propertyName] = myChart;
+    },
+    videoShow(){
+      this.$emit("videoShow",{});
+    },
+    setOption() {
+      this.business.setOption({
+        legend: {
+          data: ['内部车辆进出','外部车辆进出'],
+          textStyle: {
+            fontWeight: 'bold',
+            textColor:'#ffffff'
+          }
+        },
+        title: {
+          text: '外来车辆与内部车辆通行情况',
+          style: {
+            fill: '#5fe9c8',
+            fontSize: 17,
+            fontWeight: 'bold',
+            textAlign: 'center',
+            textBaseline: 'bottom'
+          }
+        },
+        yAxis: {
+          data: 'value',
+          nameTextStyle: {
+            fill: '#5fe9c8',
+            fontSize: 10
+          },
+          axisLabel:{
+            style:  {
+              fill: '#5fe9c8',
+              fontSize: 12
+            }}
+        },
+        xAxis: {
+          data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
+          nameTextStyle: {
+            fill: '#5fe9c8',
+            fontSize: 10
+          },
+          axisLabel:{
+            style:  {
+              fill: '#5fe9c8',
+              fontSize: 12
+            }}
+        },
+        series:[
+          {
+            name: '内部车辆进出',
+            data: [310, 323, 390, 410, 350, 420, 398],
+            type: 'bar',
+            animationCurve: 'easeOutBack'
+          },
+          {
+            name: '外部车辆进出',
+            data: [200, 223, 190, 210, 250, 200, 298],
+            type: 'bar',
+            animationCurve: 'easeOutBack'
+          }
+        ]
+      });
+    },
+    onload(){
+      changeDefaultConfig('color',['rgb(208,200,21)','#747373','#6e6138','rgba(70,103,83,0.59)','#674a2c','#621752']);
+      this.setOption();
+    },
+  }
+}
+</script>
+
+<style scoped>
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .closeButton{
+    background:rgba(84,36,17,0.5) ;
+  }
+  .closeButton:hover{
+    background:rgba(84,36,17,0.8) ;
+  }
+  .click{
+    cursor: pointer;
+  }
+  .click:hover{
+    transform: translate(2px,2px);
+  }
+
+</style>

src/components/scene/CityScreen.vue

@@ -0,0 +1,528 @@
+<template>
+  <div class="full" >
+
+    <!-- 数据面板1   -->
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 25%;top: 10%;left: 10px">
+      <div  id="community-tendency" style="height: 100%;width: 100%;"  ></div>
+    </dv-border-box-8>
+    <!-- 数据面板2   -->
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 50%;top: 37%;left: 10px">
+      <div class="full center" style="flex-direction: column">
+        <div style="width: 90%;height: 7%;font-size: 20px;color: white;justify-content: left" class="center">告警事件</div>
+        <div style="width: 100%;height: 40%;" class="center">
+          <div style="width: 50%;height: 100%;" class="center">
+            <dv-active-ring-chart :config="eventOption" style="width:100%;height:90%" />
+          </div>
+          <div  style="width: 60%;height: 100%;flex-direction: column;color: white" class="center" >
+            <div v-for="(item,index) of eventList" style="width: 95%;height: 35px;" class="center">
+              <div style="width: 30%;height: 80%;background: rgba(39,128,128,0.8);border-radius: 5px" class="center">{{item.label}}</div>
+              <div style="width: 70%;height: 100%;font-size: 13px;font-style: italic;justify-content: left;text-indent: 5px" class="center">{{item.value}}</div>
+            </div>
+          </div>
+        </div>
+        <dv-scroll-board :config="dataConfigA" style="width: 98%;height: 50%" />
+      </div>
+    </dv-border-box-8>
+
+    <!-- 数据面板3   -->
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 25%;top: 10%;right: 10px">
+      <div class="full center" style="height: 100%">
+        <div style="position: absolute;width: 90%;height: 20%;color: white;top:0;font-size: 18px;justify-content: left" class="center">人员进出记录</div>
+        <div style="width: 40%;height: 100%;" class="center">
+          <dv-decoration-9 :color="['#90d24b', '#319898']" style="width:130px;height:130px;color: #4fe766;font-size: 30px">87</dv-decoration-9>
+        </div>
+        <div  style="width: 60%;height: 100%;flex-direction: column;color: white" class="center" >
+            <div v-for="(item,index) of deviceList" style="width: 95%;height: 35px;" class="center">
+              <div style="width: 30%;height: 80%;background: rgba(39,128,128,0.8);border-radius: 5px" class="center">{{item.label}}</div>
+              <div style="width: 70%;height: 100%;font-size: 13px;font-style: italic;justify-content: left;text-indent: 5px" class="center">{{item.value}}</div>
+            </div>
+        </div>
+      </div>
+    </dv-border-box-8>
+
+    <!-- 数据面板4   -->
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 25%;top: 37%;right: 10px">
+      <div class="full center" style="flex-direction: column">
+        <div style="width: 90%;height: 15%;color: white;font-size: 18px">公共卫生事件影响人数</div>
+        <dv-capsule-chart :config="trafic" style="width: 90%;height: 85%" />
+      </div>
+    </dv-border-box-8>
+
+    <!-- 数据面板5   -->
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 28%;top: 64%;right: 10px">
+      <div class="full center" style="flex-direction: column">
+        <div style="width: 90%;height: 10%;justify-content: left;color: white;font-size: 20px" class="center">
+          公共卫生
+        </div>
+        <div class="center" style="width: 100%;height: 90%">
+          <div  style="height: 100%;width: 50%;flex-direction: column" class="center">
+            <div v-for="(item,index) of medicalList" style="width: 95%;height: 35px;" class="center">
+              <div style="width: 70%;height: 100%;font-size: 13px;font-style: italic;justify-content: left;text-indent: 5px;color: #dddddd" class="center">{{item.value}}</div>
+              <div style="width: 30%;height: 80%;background: rgb(125,128,39);border-radius: 5px" class="center">{{item.label}}</div>
+            </div>
+          </div>
+          <div style="width:50%;height:100%" id="ziyuan"></div>
+        </div>
+      </div>
+    </dv-border-box-8>
+
+    <!-- 数据面板7  路况   -->
+<!--    <div style="background: linear-gradient(to bottom,rgba(0,0,0,0.5),rgba(0,0,0,0));position:absolute;width: 10%;height: 20%;top: 75%;right: 22%;color: white">-->
+<!--      <div class="full center">-->
+<!--        <div id="round1" class="full"></div>-->
+<!--      </div>-->
+<!--    </div>-->
+<!--    <div style="background: linear-gradient(to bottom,rgba(0,0,0,0.5),rgba(0,0,0,0));position:absolute;width: 10%;height: 20%;top: 75%;left: 22%;color: white">-->
+<!--      <div class="full center">-->
+<!--        <div id="round2" class="full"></div>-->
+<!--      </div>-->
+<!--    </div>-->
+
+    <!-- 数据面板8  趋势   -->
+<!--    <div style="position:absolute;width: 36%;height: 20%;top: 70%;right: 32%;color: white;background: linear-gradient(to bottom,rgba(0,0,0,0.5),rgba(0,0,0,0))">-->
+<!--      <div class="full center">-->
+<!--        <div  id="accident" style="height: 100%;width: 100%"></div>-->
+<!--      </div>-->
+<!--    </div>-->
+
+    <!-- 数据面板  地图建筑数据   -->
+    <div style="position:absolute;width: 7%;height: 40%;top: 10%;left: 22%;color: white;">
+      <div class="full center" style="flex-direction: column">
+        <div class="center click" v-for="(item,index) of buildingList" :key="item" style="width: 150px;height: 50px;background: rgba(105,117,77,0.8);border-radius: 5px;margin-top: 5px">
+          {{item.name}}
+        </div>
+      </div>
+    </div>
+
+    <!-- POI服务  -->
+<!--    <p-o-i-service style="position:absolute;width: 30%;height: 5%;top: 10%;left: 23%;"></p-o-i-service>-->
+
+  </div>
+</template>
+
+<script>
+import Charts, {changeDefaultConfig} from "@jiaminghi/charts";
+import POIService from "../../components/3DMap/POIService";
+export default {
+  name: "CityScreen",
+  mounted() {
+    this.initCharts();
+    this.onload();
+    },
+  components: {POIService},
+  data(){
+    return{
+      // buildingList: [
+      //   {icon: '',name: '教育机构'},
+      //   {icon: '',name: '事件多发地'},
+      //   {icon: '',name: '医疗机构'},
+      //   {icon: '',name: '政府机构'},
+      //   {icon: '',name: '娱乐设施'},
+      // ],
+      eventList:[
+        {label: '16',value: '烟感报警事件'},
+        {label: '18',value: '燃气报警事件'},
+        {label: '19',value: '井盖丢失'},
+        {label: '10',value: '消防栓'},
+        {label: '12',value: '电表异常'},
+      ],
+      eventOption: {
+        data: [
+          {
+            name: '设备',
+            value: 22
+          },
+          {
+            name: '人员',
+            value: 44
+          },
+          {
+            name: '报事',
+            value: 24
+          }
+        ]
+      },
+      deviceList: [
+        {label: '23%',value:'社会环境犯罪率'},
+        {label: '82分',value:'治安安全'},
+        {label: '78分',value:'社会保释'},
+        {label: '86分',value:'行政与法律'},
+        {label: '223亿',value:'财政支出'},
+        {label: '426亿',value:'风险保障能力保险违赔'},
+      ],
+      medicalList: [
+        {label: "8",value: '公共安全'},
+        {label: "18",value: '人类流行性疾病'},
+        {label: "16",value: '食品安全'},
+        {label: "18",value: '药品安全'},
+        {label: "98%",value: '污垃处理率'},
+      ],
+      communityTendency: {},
+      accident: {},
+      videoShow: false,
+      dataConfigA: {
+        rowNum: 10,
+        waitTime:1000,
+        header: ['设备名称','设备编号','设备厂商','告警'],
+        headerBGC: '#ab9d3a',
+        data: [
+          ['烟感', 'YG1237821', '未知','处理中'],
+          ['气感', 'QG8123812', '未知','处理中'],
+          ['燃气报警器', 'RQ4538164', '未知','处理中'],
+          ['智能垃圾桶', 'LJT1658121', '未知','处理中'],
+          ['智能电表', 'DB48132151', '未知','处理中'],
+          ['地磁', 'DC13541871', '未知','处理中'],
+          ['消防栓', 'XFS1231816', '未知','处理中'],
+          ['智能井盖', 'JG9842124', '未知','处理中'],
+          ['燃气报警器', 'RQ4538164', '未知','处理中'],
+          ['智能垃圾桶', 'LJT1658121', '未知','处理中'],
+          ['智能电表', 'DB48132151', '未知','处理中'],
+          ['地磁', 'DC13541871', '未知','处理中'],
+        ],
+        oddRowBGC: 'rgba(103,97,41,0.7)',
+        evenRowBGC: 'rgba(110,86,4,0.7)',
+      },
+      dataConfigB: {
+        rowNum: 7,
+        data: [
+          {
+            name: '阅海万家',
+            value: 550
+          },
+          {
+            name: '幸福里',
+            value: 480
+          },
+          {
+            name: '安康区',
+            value: 477
+          },
+          {
+            name: '跑马地花园',
+            value: 460
+          },
+          {
+            name: '鑫海家园',
+            value: 440
+          },
+          {
+            name: '浦新城',
+            value: 436
+          },
+          {
+            name: '乐昌新区',
+            value: 360
+          }
+        ]
+      },
+      personData: [
+        {agencyName: '重点人员',personNum: 443},
+        {agencyName: '流动人员',personNum: 563},
+        {agencyName: '高龄人员',personNum: 356},
+        {agencyName: '吸毒人员',personNum: 443},
+        {agencyName: '前科人员',personNum: 563},
+        // {agencyName: '留守人员',personNum: 356},
+      ],
+      trafic: {
+        rowNum: 6,
+        unit: '万人',
+        data: [
+          {
+            name: '便民设施',
+            value: 50.6
+          },
+          {
+            name: '医疗基础设施',
+            value: 49.6
+          },
+          {
+            name: '安全消防设施',
+            value: 49.6
+          },
+          {
+            name: '道路交通设施',
+            value: 41.2
+          },
+          {
+            name: '生活能源设施',
+            value: 34.7
+          },
+          {
+            name: '体育设施',
+            value: 26.8
+          }
+        ]
+      },
+      round1: {},
+      round2: {},
+      ziyuan: {},
+    }
+  },
+  methods: {
+    initCharts(){
+      this.newCharts("community-tendency","communityTendency");
+      this.newCharts("accident","accident");
+      this.newCharts("round1","round1");
+      this.newCharts("round2","round2");
+      this.newCharts("ziyuan","ziyuan");
+    },
+    newCharts(id,propertyName){
+      const container = document.getElementById(id)
+      let myChart = new Charts(container);
+      this[propertyName] = myChart;
+    },
+    setPersonOption(list){
+      const _this =this;
+      let nameList = [];
+      let valueList = [];
+      list.forEach(item => {
+        nameList.push(item.agencyName);
+        valueList.push(item.personNum);
+      })
+      this.communityTendency.setOption({
+        title: {
+          text: '人口分布',
+          style: {
+            fill: '#dddddd',
+            fontSize: 17,
+            fontWeight: 'bold',
+            textAlign: 'center',
+            textBaseline: 'bottom'
+          }
+        },
+        xAxis: {
+          name: '分类',
+          data: nameList ,
+          nameTextStyle: {
+            fill: '#dddddd',
+            fontSize: 10
+          },
+          axisLabel:{
+            style:  {
+              fill: '#4be0e0',
+              fontSize: 15
+            }
+          }
+        },
+        yAxis: {
+          name: '人口数',
+          data: 'value',
+          nameTextStyle: {
+            fill: '#dddddd',
+            fontSize: 10
+          },
+          axisLabel:{
+            style:  {
+              fill: '#dddddd',
+              fontSize: 12
+            }}
+        },
+        legend: {
+          show:true
+        },
+        series: [
+          {
+            data: valueList,
+            type: 'bar'
+          }
+        ]
+      });
+    },
+    setAccidentOption(list){
+      this.accident.setOption({
+        title: {
+          text: '社会安全事件趋势图',
+          style: {
+            fill: '#5fe9c8',
+            fontSize: 17,
+            fontWeight: 'bold',
+            textAlign: 'center',
+            textBaseline: 'bottom'
+          }
+        },
+        xAxis: {
+          name: '第二周',
+          data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
+          nameTextStyle: {
+            fill: '#5fe9c8',
+            fontSize: 10
+          },
+          axisLabel:{
+            style:  {
+              fill: '#5fe9c8',
+              fontSize: 12
+            }}
+        },
+        yAxis: {
+          name: '数量',
+          data: 'value',
+          nameTextStyle: {
+            fill: '#5fe9c8',
+            fontSize: 10
+          },
+          axisLabel:{
+            style:  {
+              fill: '#5fe9c8',
+              fontSize: 12
+            }}
+        },
+        series: [
+          {
+            data: [1200, 2230, 1900, 2100, 3500, 4200, 3985],
+            type: 'line',
+            lineArea: {
+              show: true,
+              gradient: ['rgba(55, 162, 218, 0.6)', 'rgba(55, 162, 218, 0)']
+            }
+          }
+        ]
+      });
+    },
+    setRound(){
+      this.round1.setOption(
+        {
+          title: {
+            text: '自然灾害安全指数',
+            style: {
+              fill: '#cbb477',
+              fontSize: 17,
+              fontWeight: 'bold',
+              textAlign: 'center',
+              textBaseline: 'bottom'
+            }
+          },
+          series: [
+            {
+              type: 'gauge',
+              data: [ { name: 'itemA', value: 5.4 } ],
+              axisLabel: {
+                formatter: '{value}',
+                style: {
+                  fill: '#dddddd'
+                }
+              },
+              animationCurve: 'easeInOutBack'
+            }
+          ]
+        }
+      )
+      this.round2.setOption(
+        {
+          title: {
+            text: '公共卫生事件安全指数',
+            style: {
+              fill: '#cbb477',
+              fontSize: 17,
+              fontWeight: 'bold',
+              textAlign: 'center',
+              textBaseline: 'bottom'
+            }
+          },
+          series: [
+            {
+              type: 'gauge',
+              data: [ { name: 'itemA', value: 70 } ],
+              axisLabel: {
+                formatter: '{value}',
+                style: {
+                  fill: '#dddddd'
+                }
+              },
+              animationCurve: 'easeInOutBack'
+            }
+          ]
+        }
+      )
+    },
+    setZiyuanOption(){
+      this.ziyuan.setOption({
+        legend: {
+          data: ['同比', '环比'],
+          textStyle: {
+            fontFamily: 'Arial',
+            fontSize: 13,
+            fill: '#60a08c'
+          }
+        },
+        title: {
+          text: '每万人医疗资源',
+          offset :[0, -55],
+          style: {
+            fill: '#5fe9c8',
+            fontSize: 14,
+            textAlign: 'center',
+            textBaseline: 'top'
+          }
+        },
+        radar: {
+          polygon: true,
+          axisLabel: {
+            style: {
+              fill: "#1d817e"
+            }
+          },
+          indicator: [
+            { name: '医生人数', max: 300 },
+            { name: '病床位', max: 300 },
+            { name: '医院，卫生院', max: 300 },
+          ]
+        },
+        series: [
+          {
+            name: '同比',
+            type: 'radar',
+            data: [111, 256, 178],
+            label: {
+              show: true,
+              style: {
+                fill: '#dddddd'
+              }
+            },
+            animationCurve: 'easeOutBounce'
+          },
+          {
+            name: '环比',
+            type: 'radar',
+            data: [222, 245, 220],
+            label: {
+              show: true
+            },
+            animationCurve: 'easeOutBounce'
+          }
+        ]
+      })
+    },
+    onload(){
+      changeDefaultConfig('color',['rgb(208,200,21)','#348d07','#6e6138','rgba(70,103,83,0.59)','#674a2c','#621752']);
+      this.setPersonOption(this.personData);
+      this.setAccidentOption(this.personData);
+      this.setRound();
+      this.setZiyuanOption()
+    },
+  }
+}
+</script>
+
+<style scoped>
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .closeButton{
+    background:rgba(84,36,17,0.5) ;
+  }
+  .closeButton:hover{
+    background:rgba(84,36,17,0.8) ;
+  }
+  .click{
+    cursor: pointer;
+  }
+  .click:hover{
+    transform: translate(2px,2px);
+  }
+</style>

src/components/scene/EnvironmentProtection.vue

@@ -0,0 +1,290 @@
+<template>
+  <div  class="full">
+    <!--  污水处理清情况   -->
+    <div style="flex-direction: column;width: 22%;height: 30%;background: linear-gradient(to right,rgba(0,0,0,0.8),rgba(0,0,0,0.2));top: 10%;left: 1%" class="position-absolute center">
+      <div style="width: 90%;height: 15%;justify-content: left;" class="center title">
+        生活及工业污水处理量
+      </div>
+      <div style="width: 100%;height: 75%;" class="center">
+        <div style="width: 50%;height: 100%">
+          <div class="center" style="width: 100%;height: 25%;color: #e8ff2c">工业污水</div>
+          <div class="center" style="width: 100%;height: 75%">
+            <dv-water-level-pond :config="config" style="width:120px;height:160px" />
+          </div>
+        </div>
+        <div style="width: 50%;height: 100%">
+          <div class="center" style="width: 100%;height: 25%;color: #e8ff2c">生活污水</div>
+          <div class="center" style="width: 100%;height: 75%">
+            <dv-water-level-pond :config="config2" style="width:120px;height:160px" />
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 年度总处理污水量对比-->
+    <div class="position-absolute center"
+    style="width: 25%;height: 30%;background: linear-gradient(to right,rgba(0,0,0,0.8),rgba(0,0,0,0.5));top: 42%;left: 1%">
+      <div id="chartsTotal" class="full"></div>
+    </div>
+    <!-- 市区可回收不可回收投放点-->
+    <div class="position-absolute center"
+         style="width: 30%;height: 15%;background: linear-gradient(to right,rgba(26,106,86,0.8),rgba(0,0,0,0.5));top: 73%;left: 1%">
+      <div  class="full center" style="flex-direction: column">
+        <div style="width: 100%;height: 50%;color: #3cc68a;font-size: 25px;font-weight: bold" class="center click">可回收垃圾投放点</div>
+        <div style="width: 100%;height: 50%;color: #009bc1;font-size: 25px;font-weight: bold" class="center click">不可回收垃圾投放点</div>
+      </div>
+    </div>
+    <!-- 卫生设施情况 -->
+    <div class="center position-absolute"
+    style="width: 50%;height: 10%;top: 20%;left: 25%;background: linear-gradient(to bottom,rgba(26,106,86,0.8),rgba(0,0,0,0.5))">
+      <div v-for="(item,index) of iconList" :key="item" style="width: 16%;height: 100%;">
+        <div style="width: 100%;height: 60%" class="center"
+        :style="{
+          background: 'url(/icon/weisheng/'+index+'.png) no-repeat center/40%'
+        }"></div>
+        <div style="width: 100%;height: 15%;color: #dddddd;font-weight: bold" class="center">{{item.name}}</div>
+        <div style="width: 100%;height: 25%;color: #950706;font-weight: bold;font-size: 25px" class="center">{{item.text}}</div>
+      </div>
+    </div>
+    <!-- 垃圾处理方式占比 -->
+    <div class="center position-absolute"
+    style="top: 10%;width: 23%;height: 40%;right: 1%;flex-direction: column"
+    >
+      <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" class="full">
+        <div class="full center" style="flex-direction: column">
+          <div style="width: 90%;height: 20%;justify-content: left" class="title center">垃圾处理方式占比</div>
+          <div style="width: 100%;height: 80%" id="type"></div>
+        </div>
+      </dv-border-box-8>
+    </div>
+    <!-- 往年垃圾处理总量 -->
+    <div class="center position-absolute"
+         style="top: 51%;width: 25%;height: 35%;right: 1%;flex-direction: column"
+    >
+      <dv-border-box-4 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" class="full">
+        <div class="full center" style="flex-direction: column">
+          <div style="width: 90%;height: 20%;justify-content: left" class="title center">往年垃圾处理总量</div>
+          <div style="width: 100%;height: 80%" id="years"></div>
+        </div>
+      </dv-border-box-4>
+    </div>
+
+  </div>
+</template>
+
+<script>
+  import Charts, {changeDefaultConfig} from "@jiaminghi/charts";
+  import CountIn from "../../components/count-in/count-in";
+  export default {
+        name: "EnvironmentProtection",
+        components: {CountIn},
+        data(){
+          return{
+            config: {
+              data: [20],
+              shape: 'round',
+              colors: ['#dd2e21','#dddddd','#dddddd']
+            },
+            config2: {
+              data: [78],
+              shape: 'round',
+              colors: ['#29dd4d','#dddddd','#dddddd']
+            },
+            chartsTotal: {},
+            type: {},
+            years: {},
+            iconList: [
+              {name: '填埋场',text: '5个'},
+              {name: '垃圾中转站',text: '95座'},
+              {name: '垃圾堆存点',text: '283个'},
+              {name: '垃圾车',text: '363辆'},
+              {name: '环卫工人',text: '675人'},
+              {name: '垃圾桶',text: '4034个'},
+            ],
+          }
+        },
+        mounted() {
+        this.initCharts();
+        this.onload();
+      },
+        methods: {
+      initCharts(){
+        this.newCharts("chartsTotal","chartsTotal");
+        this.newCharts("type","type");
+        this.newCharts("years","years");
+      },
+      newCharts(id,propertyName){
+        const container = document.getElementById(id)
+        let myChart = new Charts(container);
+        this[propertyName] = myChart;
+      },
+      setOption(){
+        this.chartsTotal.setOption({
+          title: {
+            text: '年度总处理水量对比',
+            style: {
+              fill: '#5fe9c8',
+              fontSize: 17,
+              fontWeight: 'bold',
+              textAlign: 'center',
+              textBaseline: 'bottom'
+            }
+          },
+          xAxis: {
+            name: '月份',
+            data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月','8月','9月','10月','11月','12月'],
+            nameTextStyle: {
+              fill: '#5fe9c8',
+              fontSize: 10
+            },
+            axisLabel:{
+              style:  {
+                fill: '#5fe9c8',
+                fontSize: 12
+              }}
+          },
+          yAxis: {
+            name: '处理水量',
+            data: 'value',
+            nameTextStyle: {
+              fill: '#5fe9c8',
+              fontSize: 10
+            },
+            axisLabel:{
+              style:  {
+                fill: '#5fe9c8',
+                fontSize: 12
+              }}
+          },
+          series: [
+            {
+              data: [1200, 2230, 1900, 2100, 3500, 4200, 3985,1200, 2230, 1900, 2100, 3500, 4200, 3985],
+              type: 'bar',
+              gradient: {
+                color: ['#37a2da', '#67e0e3']
+              },
+              lineArea: {
+                show: true,
+                gradient: ['rgba(55, 162, 218, 0.6)', 'rgba(55, 162, 218, 0)']
+              }
+            }
+          ]
+        });
+        this.type.setOption({
+          title: {
+            text: '垃圾处理方式分布',
+            style: {
+              fill: '#5fe9c8',
+              fontSize: 17,
+              fontWeight: 'bold',
+              textAlign: 'center',
+              textBaseline: 'bottom'
+            }
+          },
+          series: [
+            {
+              type: 'pie',
+              data: [
+                { name: '卫生填埋', value: 0.15 },
+                { name: '分类回收', value: 0.45 },
+                { name: '高温堆肥', value: 0.15 },
+                { name: '焚烧', value: 0.15 },
+              ],
+              insideLabel: {
+                show: true
+              },
+              outsideLabel: {
+                style: {
+                  fill: '#5081e9',
+                  fontSize: 17,
+                  fontWeight: 'bold',
+                  textAlign: 'center',
+                  textBaseline: 'bottom'
+                }
+              }
+            }
+          ]
+        });
+        this.years.setOption({
+          title: {
+            text: '往年垃圾处理总量',
+            style: {
+              fill: '#5fe9c8',
+              fontSize: 17,
+              fontWeight: 'bold',
+              textAlign: 'center',
+              textBaseline: 'bottom'
+            }
+          },
+          xAxis: {
+            data: 'value',
+            nameTextStyle: {
+              fill: '#5fe9c8',
+              fontSize: 10
+            },
+            axisLabel:{
+              style:  {
+                fill: '#5fe9c8',
+                fontSize: 12
+              }}
+          },
+          yAxis: {
+            data: ['2020', '2019', '2018', '2017', '2016'],
+            nameTextStyle: {
+              fill: '#5fe9c8',
+              fontSize: 10
+            },
+            axisLabel:{
+              style:  {
+                fill: '#5fe9c8',
+                fontSize: 12
+              }}
+          },
+          series:[
+            {
+              name: '可回收垃圾',
+              data: [4100, 220, 1900, 2100, 3500, 4200, 3985],
+              type: 'bar',
+              animationCurve: 'easeOutBack'
+            },
+            {
+              name: '不可回收垃圾',
+              data: [4300, 2230, 1900, 2100, 3500, 4200, 3985],
+              type: 'bar',
+              animationCurve: 'easeOutBack'
+            }
+          ]
+        })
+      },
+      onload(){
+        changeDefaultConfig('color',['rgb(208,200,21)','#747373','#6e6138','rgba(70,103,83,0.59)','#674a2c','#621752']);
+        this.setOption();
+      },
+    }
+    }
+</script>
+
+<style scoped>
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .position-absolute{
+    position: absolute;
+  }
+  .title{
+    color: white;
+    font-size: 16px;
+    font-weight: bold;
+  }
+  .click{
+    cursor: pointer;
+  }
+  .click:hover{
+    transform: translate(2px,2px);
+  }
+</style>

src/components/scene/EpidemicScreen.vue

@@ -0,0 +1,251 @@
+<template>
+  <div class="full">
+    <!-- 疫情数据统计   -->
+    <dv-border-box-7 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 30%;top: 11%;left: 10px">
+      <div class="full" style="flex-direction: column;padding-top: 7%">
+        <div style="width: 90%;height: 7%;font-size: 20px;color: white;justify-content: left;padding: 3%" class="center"> 疫情数据统计</div>
+        <div style="width: 100%;height: 57%;" class="center">
+          <div style="width: 50%;height: 100%;" class="center">
+            <dv-active-ring-chart :config="eventOption" style="width:100%;height:90%" />
+          </div>
+          <div  style="width: 60%;height: 100%;flex-direction: column;color: white" class="center" >
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">累计确诊总数
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic">
+                <CountIn :startVal='0' :endVal='120' :speed='1' :decimals="0" :isReverse=false></CountIn></div>
+            </div>
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">累计治愈人数
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic;">
+                <CountIn :startVal='0' :endVal='115' :speed='1' :decimals="0" :isReverse=false></CountIn></div>
+            </div>
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">累计死亡人数
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic">5</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </dv-border-box-7>
+    <!-- 汤阴市各镇疫情情况   -->
+    <dv-border-box-7 :color="['#278080', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 40%;height: 24%;top: 64%;left: 30%">
+      <div class="full center" style="flex-direction: column">
+        <div style="width: 90%;height: 15%;color: white;font-size: 18px" class="center">汤阴县各镇疫情情况</div>
+        <dv-scroll-board :config="dataConfigA" style="width: 100%;height: 100%;font-weight: bold;font-size: larger" />
+      </div>
+    </dv-border-box-7>
+
+    <!-- 疫情防控   -->
+    <dv-border-box-7 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 25%;top: 50%;left: 10px">
+      <div class="full center" style="height: 100%">
+        <div style="position: absolute;width: 90%;height: 20%;color: white;top:0;font-size: 18px;justify-content: left" class="center">疫情防控</div>
+        <div style="width: 40%;height: 100%;" class="center">
+          <dv-decoration-9 style="width:130px;height:130px;color: #4fe766;font-size: 30px">95</dv-decoration-9>
+        </div>
+        <div  style="width: 60%;height: 100%;flex-direction: column;color: white" class="center" >
+          <div v-for="(item,index) of defenceList" style="width: 95%;height: 35px;" class="center">
+            <div style="width: 30%;height: 80%;background: #90a24b;border-radius: 5px" class="center">{{item.label}}</div>
+            <div style="width: 70%;height: 100%;font-size: 13px;font-style: italic;justify-content: left;text-indent: 5px" class="center">{{item.value}}</div>
+          </div>
+        </div>
+      </div>
+    </dv-border-box-7>
+    <!-- 疫苗接种情况   -->
+    <dv-border-box-7 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 50%;top: 7%;right: 10px">
+      <div class="full center" style="flex-direction: column">
+        <div style="width: 90%;height: 7%;font-size: 20px;color: white;justify-content: left" class="center"> 疫苗接种情况</div>
+        <div style="width: 100%;height: 40%;" class="center">
+          <div style="width: 50%;height: 100%;" class="center">
+            <dv-active-ring-chart :config="eventOption1" style="width:100%;height:90%" />
+          </div>
+          <div  style="width: 60%;height: 100%;flex-direction: column;color: white" class="center" >
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">已接种人数
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic">209067</div>
+            </div>
+            <div class="center"  style="width: 90%;height: 50%;color: white;justify-content: left">未接种人数
+              <div style="display: inline-block;text-indent: 50px;font-size: 30px;color: #e5c555;font-style: italic;">221736</div>
+            </div>
+          </div>
+        </div>
+        <dv-scroll-board :config="dataConfigB" style="width: 98%;height: 50%;font-weight: bold" />
+      </div>
+    </dv-border-box-7>
+    <!-- 数据面板5   -->
+    <div class="center" style="position:absolute;width: 30%;height: 23%;top: 64%;right: 10px;background: linear-gradient(to left, rgba(0,78,50,0.5),rgba(0,91,58,0));">
+      <div style="width: 90%;height: 100%">
+        <div id="tendency" class="full"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+    import Charts, {changeDefaultConfig} from "@jiaminghi/charts";
+    import CountIn from "../../components/count-in/count-in";
+    export default {
+      components: {CountIn},
+      mounted() {
+        this.initCharts();
+        this.onload();
+      },
+      data(){
+          return{
+            tendency: {},
+            eventOption: {
+              digitalFlopStyle: {
+                fontSize: 20,
+                fill: '#fff'
+              },
+              data: [
+                {
+                  name: '治愈',
+                  value: 10
+                },
+                {
+                  name: '死亡',
+                  value: 1
+                }
+              ]
+            },
+            eventOption1: {
+              digitalFlopStyle: {
+                fontSize: 20,
+                fill: '#fff'
+              },
+              data: [
+                {
+                  name: '已接种',
+                  value: 209067
+                },
+                {
+                  name: '未接种',
+                  value: 221736
+                }
+              ]
+            },
+            defenceList: [
+              {label: '高',value:'群众对疫情关注度'},
+              {label: '高',value:'防控政策执行程度'},
+              {label: '90%',value:'戴口罩人群占比'},
+              {label: '95%',value:'防控宣传覆盖率'},
+              {label: '95分',value:'商家防疫措施'},
+            ],
+            dataConfigA: {
+              rowNum: 6,
+              waitTime:1500,
+              header: ['行政区域','确诊人数','<span style=\"color:#3dff11;\">治愈人数</span>','<span style=\"color:#dd0f36;\">死亡人数</span>','风险等级','防控等级'],
+              headerBGC: '#005b3a',
+              align: ['center','center','center','center','center','center'],
+              data: [
+                ['城关镇', '8', '<span style=\"color:#3dff11;\">7</span>','<span style=\"color:#dd0f36;\">0</span>','低风险','Ⅳ级'],
+                ['韩庄镇', '11', '<span style=\"color:#3dff11;\">8</span>','<span style=\"color:#dd0f36;\">1</span>','低风险','Ⅳ级'],
+                ['白营镇', '7', '<span style=\"color:#3dff11;\">5</span>','<span style=\"color:#dd0f36;\">1</span>','低风险','Ⅳ级'],
+                ['古贤镇', '5', '<span style=\"color:#3dff11;\">5</span>','<span style=\"color:#dd0f36;\">0</span>','低风险','Ⅳ级'],
+                ['菜园镇', '2', '<span style=\"color:#3dff11;\">1</span>','<span style=\"color:#dd0f36;\">0</span>','低风险','Ⅳ级'],
+                ['任固镇', '4', '<span style=\"color:#3dff11;\">1</span>','<span style=\"color:#dd0f36;\">1</span>','低风险','Ⅳ级'],
+                ['五陵镇', '4', '<span style=\"color:#3dff11;\">3</span>','<span style=\"color:#dd0f36;\">1</span>','低风险','Ⅳ级'],
+                ['瓦岗乡', '6', '<span style=\"color:#3dff11;\">4</span>','<span style=\"color:#dd0f36;\">0</span>','低风险','Ⅳ级'],
+                ['伏道镇', '1', '<span style=\"color:#3dff11;\">1</span>','<span style=\"color:#dd0f36;\">0</span>','低风险','Ⅳ级'],
+                ['宜沟镇', '3', '<span style=\"color:#3dff11;\">3</span>','<span style=\"color:#dd0f36;\">0</span>','低风险','Ⅳ级'],
+              ],
+              oddRowBGC: 'rgba(0,78,50,0.2)',
+              evenRowBGC: 'rgba(127,127,127,0.2)',
+            },
+            dataConfigB: {
+              rowNum: 6,
+              waitTime:1500,
+              header: ['行政区域','<span style=\"color:#3dff11;\">已接种人数</span>','<span style=\"color:#ddcc39;\">未接种人数</span>','接种率'],
+              headerBGC: '#005b3a',
+              align:['center','center','center','center'],
+              data: [
+                ['城关镇', '<span style=\"color:#3dff11;\">36099</span>', '<span style=\"color:#ddcc39;\">35947</span>',"50.1%"],
+                ['韩庄镇', '<span style=\"color:#3dff11;\">21834</span>', '<span style=\"color:#ddcc39;\">21486</span>',"50.4%"],
+                ['白营镇', '<span style=\"color:#3dff11;\">16314</span>', '<span style=\"color:#ddcc39;\">16528</span>',"49.69%"],
+                ['古贤镇', '<span style=\"color:#3dff11;\">13065</span>', '<span style=\"color:#ddcc39;\">14723</span>',"47.02%"],
+                ['菜园镇', '<span style=\"color:#3dff11;\">21280</span>', '<span style=\"color:#ddcc39;\">24559</span>',"46.42%"],
+                ['任固镇', '<span style=\"color:#3dff11;\">22211</span>', '<span style=\"color:#ddcc39;\">24490</span>',"47.56%"],
+                ['五陵镇', '<span style=\"color:#3dff11;\">17826</span>', '<span style=\"color:#ddcc39;\">20133</span>',"46.96%"],
+                ['瓦岗乡', '<span style=\"color:#3dff11;\">12619</span>', '<span style=\"color:#ddcc39;\">16148</span>',"43.86%"],
+                ['伏道镇', '<span style=\"color:#3dff11;\">20179</span>', '<span style=\"color:#ddcc39;\">20463</span>',"49.65%"],
+                ['宜沟镇', '<span style=\"color:#3dff11;\">27640</span>', '<span style=\"color:#ddcc39;\">27259</span>',"50.34%"],
+              ],
+              oddRowBGC: 'rgba(0,78,50,0.2)',
+              evenRowBGC: 'rgba(127,127,127,0.2)',
+            },
+          }
+      },
+      methods:{
+        initCharts(){
+          this.newCharts('tendency','tendency');
+        },
+        newCharts(id,propertyName){
+          const container = document.getElementById(id)
+          let myChart = new Charts(container);
+          this[propertyName] = myChart;
+        },
+        setTendencyOption(){
+          this.tendency.setOption({
+            title: {
+              text: '疫情趋势',
+              style: {
+                fill: '#ffffff',
+                fontSize: 17,
+                fontWeight: 'bold',
+                textAlign: 'center',
+                textBaseline: 'bottom'
+              }
+            },
+            xAxis: {
+              name: '月份',
+              data: ['1', '2', '3', '4', '5', '6','7','8', '9', '10', '11', '12'],
+              nameTextStyle: {
+                fill: '#ffffff',
+                fontSize: 10
+              },
+              axisLabel:{
+                style:  {
+                  fill: '#ffffff',
+                  fontSize: 12
+                }}
+            },
+            yAxis: {
+              name: '(人数)',
+              data: 'value',
+              nameTextStyle: {
+                fill: '#ffffff',
+                fontSize: 10
+              },
+              axisLabel:{
+                style:  {
+                  fill: '#ffffff',
+                  fontSize: 12
+                }}
+            },
+            series: [
+              {
+                data: [10, 5, 2, 1, 0, 4, 3,1, 2, 6, 8, 9],
+                type: 'line',
+                lineArea: {
+                  show: true,
+                  gradient: ['rgba(10,74,112,0.6)', 'rgba(55, 162, 218, 0.8)']
+                }
+              }
+            ]
+          });
+        },
+        onload(){
+          changeDefaultConfig('color',['rgb(208,200,21)','#747373','#6e6138','rgba(70,103,83,0.59)','#674a2c','#621752']);
+          this.setTendencyOption();
+        },
+      }
+    }
+</script>
+
+<style scoped>
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+</style>

src/components/scene/GovernmentAffairs.vue

@@ -0,0 +1,359 @@
+<template>
+  <div class="full">
+
+    <dv-border-box-7 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 25%;height: 60%;top: 7%;left: 10px">
+      <div class="full center" style="flex-direction: column">
+        <div style="width: 90%;height: 15%;justify-content: left;" class="center title">设备</div>
+        <div style="width: 100%;height: 60%;" class="center">
+          <div style="width: 50%;height: 100%">
+            <div class="center" style="width: 100%;height: 15%;color: #3ce6c9">在线</div>
+            <div class="center" style="width: 100%;height: 65%">
+              <dv-water-level-pond :config="config0" style="width:120px;height:160px" />
+            </div>
+          </div>
+          <div style="width: 50%;height: 100%">
+            <div class="center" style="width: 100%;height: 15%;color: #06aae7">离线</div>
+            <div class="center" style="width: 100%;height: 65%">
+              <dv-water-level-pond :config="config1" style="width:120px;height:160px" />
+            </div>
+          </div>
+          <div style="width: 50%;height: 100%">
+            <div class="center" style="width: 100%;height: 15%;color: #ff103e">告警</div>
+            <div class="center" style="width: 100%;height: 65%">
+              <dv-water-level-pond :config="config2" style="width:120px;height:160px" />
+            </div>
+          </div>
+        </div>
+        <dv-scroll-board :config="dataConfigB" style="width: 98%;height: 50%;font-weight: bold" />
+      </div>
+    </dv-border-box-7>
+
+    <!-- 数据统计  -->
+<!--    <dv-border-box-2 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 23%;height: 20%;top: 7%;left: 1%">-->
+<!--      <div  class="center full" style="flex-direction: column">-->
+<!--        <div  style="width: 90%;height: 30%;color: white;line-height: 40px;" class="center">数据汇总</div>-->
+<!--        <div class="center" style="width: 90%;height: 60%;color: #47fcd2;font-size: 20px;font-style: italic;">业务情况：-->
+<!--          <CountIn :startVal='0' :endVal='172' :speed='1' :decimals="0" :isReverse=false></CountIn>-->
+<!--          &nbsp;&nbsp;&nbsp;月增长指数：<CountIn :startVal='0' :endVal='12.9' :speed='2' :decimals="1" :isReverse=false></CountIn>-->
+<!--          %</div>-->
+<!--        <div class="center" style="width: 90%;height: 60%;color: #47fcd2;font-size: 20px;font-style: italic;">当日办理次数：-->
+<!--          <CountIn :startVal='0' :endVal='168' :speed='1' :decimals="0" :isReverse=false></CountIn>-->
+<!--          &nbsp;&nbsp;&nbsp;人员分布：-->
+<!--          <CountIn :startVal='0' :endVal='189' :speed='1' :decimals="0" :isReverse=false></CountIn>-->
+<!--        </div>-->
+<!--      </div>-->
+<!--    </dv-border-box-2>-->
+<!--    人员结构-->
+<!--    <div class="center position-absolute" style="top: 28%;width: 23%;height: 30%;left: 1%;flex-direction: column">-->
+<!--      <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" class="full">-->
+<!--        <div class="full center" style="flex-direction: column">-->
+<!--          <div style="width: 90%;height: 20%;justify-content: left" class="title center">人员结构</div>-->
+<!--          <div style="width: 100%;height: 80%" id="type"></div>-->
+<!--        </div>-->
+<!--      </dv-border-box-8>-->
+<!--    </div>-->
+<!--    业务办理进度-->
+<!--项目数据-->
+<!--    <div style="flex-direction: column;position:absolute;width: 22%;height: 30%;top: 10%;right: 1%;background: linear-gradient(to left, rgba(0,0,0,0.7),rgba(0,0,0,0.2));">-->
+<!--      <div style="width: 90%;height: 10%;justify-content: left;" class="center title">项目分析数据</div>-->
+<!--      <div id="accept" style="width: 100%;height: 80%"></div>-->
+<!--    </div>-->
+<!--业务数据-->
+<!--    <div class="center position-absolute" style="top: 60%;width: 25%;height: 30%;left: 5px;flex-direction: column">-->
+<!--      <dv-border-box-4 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" class="full">-->
+<!--        <div class="full center" style="flex-direction: column">-->
+<!--          <div style="width: 90%;height: 20%;justify-content: left;" class="title center">往年业务数据分析</div>-->
+<!--          <div style="width: 100%;height: 80%" id="business"></div>-->
+<!--        </div>-->
+<!--      </dv-border-box-4>-->
+<!--    </div>-->
+<!--    满意度统计-->
+<!--    <dv-border-box1 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 33%;height: 25%;top: 65%;right: 33%">-->
+<!--      <div style="width: 100%;height: 10%;justify-content: center" class="title center">满意度统计</div>-->
+<!--      <dv-conical-column-chart :config="config" style="width:90%;height:90%;" />-->
+<!--    </dv-border-box1>-->
+  </div>
+</template>
+
+<script>
+  import Charts, {changeDefaultConfig} from "@jiaminghi/charts";
+  import CountIn from "../../components/count-in/count-in";
+
+    export default {
+      name: "GovernmentAffairs",
+      components: {CountIn},
+      data(){
+        return{
+          accept: {},
+          business: {},
+          type: {},
+          amount: 0,
+          config:{
+            columnColor:'rgba(0,78,50,0.9)',
+            data:[
+              {
+                name: '非常满意',
+                value: 120
+              },
+              {
+                name: '满意',
+                value: 100
+              },
+              {
+                name: '较满意',
+                value: 71
+              },
+              {
+                name: '一般',
+                value: 66
+              },
+              {
+                name: '不太满意',
+                value: 30
+              },
+              {
+                name: '不满意',
+                value: 20
+              },
+              {
+                name: '很不满意',
+                value: 9
+              }
+            ],
+            showValue: true
+          },
+          config0: {
+            data: [83],
+            shape: 'roundRect',
+            waveHeight:25
+          },
+          config1: {
+            data: [34],
+            shape: 'roundRect',
+            waveHeight:25,
+            colors: ['#05afee','#dddddd','#064d73']
+          },
+          config2: {
+            data: [17],
+            shape: 'roundRect',
+            waveHeight:25,
+            colors: ['#dd0f36','#dddddd','#dddddd']
+          },
+          dataConfigB: {
+            rowNum: 6,
+            waitTime:1500,
+            header: ['设备名称','<span style=\"color:#3dff11;\">设备编号</span>','<span style=\"color:#ddcc39;\">设备厂商</span>','告警事件'],
+            headerBGC: '#005b3a',
+            align:['center','center','center','center'],
+            data: [
+              ['烟感', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">腾讯</span>',"2021年5月18日15:38:31"],
+              ['气感', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">阿里</span>',"2021年5月18日15:38:31"],
+              ['消防栓', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">华为</span>',"2021年5月18日15:38:31"],
+              ['井盖', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">百度</span>',"2021年5月18日15:38:31"],
+              ['烟感', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">滴滴</span>',"2021年5月18日15:38:31"],
+              ['气感', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">美团</span>',"2021年5月18日15:38:31"],
+              ['消防栓', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">字节跳动</span>',"2021年5月18日15:38:31"],
+              ['井盖', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">知乎</span>',"2021年5月18日15:38:31"],
+              ['烟感', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">微软</span>',"2021年5月18日15:38:31"],
+              ['气感', '<span style=\"color:#3dff11;\">YG123168</span>', '<span style=\"color:#ddcc39;\">谷歌</span>',"2021年5月18日15:38:31"],
+            ],
+            oddRowBGC: 'rgba(0,78,50,0.2)',
+            evenRowBGC: 'rgba(127,127,127,0.2)',
+          },
+        }
+      },
+      mounted() {
+        this.initCharts();
+        this.onload();
+      },
+      methods: {
+        initCharts(){
+          this.newCharts("accept","accept");
+          this.newCharts("business","business");
+          this.newCharts("type","type");
+        },
+        newCharts(id,propertyName){
+          const container = document.getElementById(id)
+          let myChart = new Charts(container);
+          this[propertyName] = myChart;
+        },
+        setOption(){
+          //项目数据分析
+          this.accept.setOption({
+            // title: {
+            //   // text: '项目分析数据',
+            //   offset :[-130, -55],
+            //   style: {
+            //     fill: '#49baa5',
+            //     fontSize: 16  ,
+            //     textAlign: 'center',
+            //     textBaseline: 'top',
+            //   }
+            // },
+            radar: {
+              axisLabel: {
+                style: {
+                  fontSize: 12,
+                  fill: "#ffffff"
+                }
+              },
+              indicator: [
+                { name: '电子公文系统', max: 300 },
+                { name: '绩效考核系统', max: 300 },
+                { name: '人事管理系统', max: 300 },
+                { name: 'OA系统', max: 300 },
+                { name: '其他', max: 300 },
+              ]
+            },
+            series: [
+              {
+                name: '同比',
+                type: 'radar',
+                data: [111, 256, 178,150,120,10],
+                label: {
+                  show: true,
+                  style: {
+                    fill: '#dddddd'
+                  }
+                },
+                animationCurve: 'easeOutBounce'
+              },
+              {
+                name: '环比',
+                type: 'radar',
+                data: [222, 245, 220],
+                label: {
+                  show: true
+                },
+                animationCurve: 'easeOutBounce'
+              }
+            ]
+          });
+          //业务数据分析
+          this.business.setOption({
+            legend: {
+              data: ['服务类政务','管理类政务'],
+              textStyle: {
+                fontWeight: 'bold',
+                textColor:'#ffffff'
+              }
+            },
+            title: {
+              text: '政务数据分析',
+              style: {
+                fill: '#5fe9c8',
+                fontSize: 17,
+                fontWeight: 'bold',
+                textAlign: 'center',
+                textBaseline: 'bottom'
+              }
+            },
+            yAxis: {
+              data: 'value',
+              nameTextStyle: {
+                fill: '#5fe9c8',
+                fontSize: 10
+              },
+              axisLabel:{
+                style:  {
+                  fill: '#5fe9c8',
+                  fontSize: 12
+                }}
+            },
+            xAxis: {
+              data: ['2020', '2019', '2018', '2017', '2016'],
+              nameTextStyle: {
+                fill: '#5fe9c8',
+                fontSize: 10
+              },
+              axisLabel:{
+                style:  {
+                  fill: '#5fe9c8',
+                  fontSize: 12
+                }}
+            },
+            series:[
+              {
+                name: '服务类政务',
+                data: [3100, 3230, 3900, 4100, 3500, 4200, 3985],
+                type: 'bar',
+                animationCurve: 'easeOutBack'
+              },
+              {
+                name: '管理类政务',
+                data: [2000, 2230, 1900, 2100, 2500, 2000, 2985],
+                type: 'bar',
+                animationCurve: 'easeOutBack'
+              }
+            ]
+          });
+          //人员组成
+          this.type.setOption({
+            // title: {
+            //   // text: '人员组成',
+            //   style: {
+            //     fill: '#5fe9c8',
+            //     fontSize: 17,
+            //     fontWeight: 'bold',
+            //     textAlign: 'center',
+            //     textBaseline: 'bottom'
+            //   }
+            // },
+            series: [
+              {
+                type: 'pie',
+                data: [
+                  { name: '硕士', value: 0.5 },
+                  { name: '博士', value: 0.3 },
+                  { name: '本科', value: 0.17 },
+                  { name: '专科', value: 0.03 },
+                ],
+                insideLabel: {
+                  show: true
+                },
+                outsideLabel: {
+                  style: {
+                    fontSize: 17,
+                    fontWeight: 'bold',
+                    textAlign: 'center',
+                    textBaseline: 'bottom'
+                  }
+                }
+              }
+            ]
+          });
+        },
+        onload(){
+          changeDefaultConfig('color',['rgb(87,208,109)','#1691f3','#6e6138','rgba(70,103,83,0.59)','#674a2c','#621752']);
+          this.setOption();
+        },
+      }
+  }
+
+</script>
+
+<style scoped>
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .position-absolute{
+    position: absolute;
+  }
+  .title{
+    color: white;
+    font-size: 16px;
+    font-weight: bold;
+  }
+  .click{
+    cursor: pointer;
+  }
+  .click:hover{
+    transform: translate(2px,2px);
+  }
+</style>

src/components/scene/PersonScreen.vue

@@ -0,0 +1,377 @@
+<template>
+  <div class="full">
+
+    <!--  交通元素数据  -->
+<!--    <div style="position:absolute;width: 40%;height: 10%;top: 10%;right: 30%;color: white;">-->
+<!--      <div class="full center">-->
+<!--        <dv-border-box-7-->
+<!--          class="click"-->
+<!--          :color="['#42c3b6', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)"-->
+<!--          v-for="(item,index) of carList" :key="item"-->
+<!--                         style="width: 100px;height: 100px;margin: 10px;"-->
+<!--        >-->
+<!--          <div class="full center" style="flex-direction: column">-->
+<!--            <div style="width: 50px;height: 50px;" :style="{-->
+<!--              background: 'url(/icon/car'+index+'.png) no-repeat center/contain'-->
+<!--            }"></div>-->
+<!--            <div style="width: 100%;height: 50px;" class="center">{{item.name}}</div>-->
+<!--          </div>-->
+<!--        </dv-border-box-7>-->
+<!--      </div>-->
+<!--    </div>-->
+
+    <!-- 数据面板 交通流量   -->
+    <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 10%;top: 10%;left: 10px">
+      <div  class="center full" style="flex-direction: column">
+        <div  style="width: 90%;height: 30%;color: white;line-height: 40px">今日人员通行统计</div>
+        <div class="center" style="width: 70%;height: 60%;color: #47fcd2;font-size: 30px;font-style: italic;">
+          <CountIn :startVal='0' :endVal=1200 :speed=6 :decimals="0" :isReverse=false></CountIn>
+        </div>
+      </div>
+    </dv-border-box-8>
+
+    <div class="center" style="position:absolute;top: 25%;width: 23%;height: 30%;left: 10px;flex-direction: column">
+      <dv-border-box-8 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" class="full">
+        <div class="full center" style="flex-direction: column">
+          <div style="width: 90%;height: 20%;justify-content: left" class="title center">人员结构</div>
+          <div style="width: 100%;height: 80%" id="type"></div>
+        </div>
+      </dv-border-box-8>
+    </div>
+
+    <div style="position:absolute;width: 20%;height: 25%;top: 60%;left: 10px;background: linear-gradient(to right, rgba(0,0,0,0.7),rgba(0,0,0,0.2));">
+      <div class="full center" style="flex-direction: column">
+        <dv-scroll-board :config="dataConfigA" style="width: 98%;height: 95%" />
+      </div>
+    </div>
+
+    <div style="position:absolute;width: 20%;height: 40%;top: 10%;right: 10px;background: linear-gradient(to right, rgba(0,0,0,0.7),rgba(0,0,0,0.2));">
+      <div id="accept" style="width: 100%;height: 50%"></div>
+      <div id="source" style="width: 100%;height: 50%"></div>
+    </div>
+
+
+    <dv-border-box-12 :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 20%;height: 40%;top: 55%;right: 10px;color: white;">
+      <div style="width: 90%;color: white;margin: 20px;" class="left">人脸抓拍</div>
+      <div class="center" >
+        <div style="width: 95%;height: 450px">
+          <div @click="videoShow" class="center click" v-for="(item,index) of pictures" :key="item" style="width: 50%;height: 50%;float: left">
+            <div style="width: 100%;height: 100%;" :style="{
+              background: 'url(/trafic/'+item.img+') no-repeat center/cover'
+            }">
+            </div>
+          </div>
+        </div>
+      </div>
+    </dv-border-box-12>
+  </div>
+</template>
+
+<script>
+import Charts, {changeDefaultConfig} from "@jiaminghi/charts";
+import CountIn from "../count-in/count-in";
+
+function formatter (number) {
+  const numbers = number.toString().split('').reverse()
+  const segs = []
+
+  while (numbers.length) segs.push(numbers.splice(0, 3).join(''))
+
+  return segs.join(',').split('').reverse().join('')
+}
+export default {
+  components: {CountIn},
+  mounted() {
+     this.initCharts();
+     this.onload();
+    },
+  data(){
+    return{
+      tendency: {},
+      accept: {},
+      source: {},
+      type: {},
+      pictures: [
+        {img: '0.jpg'},
+        {img: '1.jpg'},
+        {img: '2.jpg'},
+        {img: '3.jpg'},
+      ],
+      dataConfigA: {
+        rowNum: 10,
+        header: ['姓名','身份证','电话','时间'],
+        headerBGC: '#ab9d3a',
+        waitTime:1000,
+        data: [
+          ['张**', '4409142138138431', '135****1745','2021-5-14'],
+          ['李**', '4409142138138431', '135****2245','2021-5-14'],
+          ['王**', '4409142138138431', '135****9128','2021-5-14'],
+          ['卢**', '4409142138138431', '135****3248','2021-5-14'],
+          ['赵**', '4409142138138431', '135****7848','2021-5-14'],
+          ['崔**', '4409142138138431', '215****4518','2021-5-14'],
+          ['窦**', '4409142138138431', '135****9548','2021-5-14'],
+          ['李**', '4409142138138431', '135****9468','2021-5-14'],
+          ['黄**', '4409142138138312', '135****9321','2021-5-14'],
+          ['严**', '4409123181387431', '135****5254','2021-5-14'],
+          ['林**', '4413212578138431', '135****7248','2021-5-14'],
+          ['张**', '4409132188138413', '134****6848','2021-5-14'],
+        ],
+        oddRowBGC: 'rgba(103,97,41,0.7)',
+        evenRowBGC: 'rgba(110,86,4,0.7)',
+      },
+      config: {
+        data: [
+          {
+            name: '内部人员',
+            value: 55
+          },
+          {
+            name: '外部人员',
+            value: 120
+          },
+          {
+            name: '测温异常',
+            value: 78
+          }
+        ]
+      },
+    }
+  },
+  methods: {
+    setOption(){
+      this.accept.setOption({
+        legend: {
+          data: ['同比', '环比'],
+          bottom: 0,
+          textStyle: {
+            fontFamily: 'Arial',
+            fontSize: 13,
+            fill: '#62efc4'
+          }
+        },
+        title: {
+          text: '购物分析',
+          offset :[-120, -55],
+          style: {
+            fill: '#5fe9c8',
+            fontSize: 14,
+            textAlign: 'center',
+            textBaseline: 'top'
+          }
+        },
+        radar: {
+          polygon: true,
+          axisLabel: {
+            style: {
+              fill: "#70eeec"
+            }
+          },
+          indicator: [
+            { name: '家具', max: 300 },
+            { name: '生活用品', max: 300 },
+            { name: '水果', max: 300 },
+            { name: '蔬菜', max: 300 },
+            { name: '其他', max: 300 },
+          ]
+        },
+        series: [
+          {
+            name: '同比',
+            type: 'radar',
+            data: [111, 256, 178,150,120,10],
+            label: {
+              show: true,
+              style: {
+                fill: '#dddddd'
+              }
+            },
+            animationCurve: 'easeOutBounce'
+          },
+          {
+            name: '环比',
+            type: 'radar',
+            data: [222, 245, 220],
+            label: {
+              show: true
+            },
+            animationCurve: 'easeOutBounce'
+          }
+        ]
+      });
+      this.type.setOption({
+        // title: {
+        //   // text: '人员组成',
+        //   style: {
+        //     fill: '#5fe9c8',
+        //     fontSize: 17,
+        //     fontWeight: 'bold',
+        //     textAlign: 'center',
+        //     textBaseline: 'bottom'
+        //   }
+        // },
+        series: [
+          {
+            type: 'pie',
+            data: [
+              { name: '硕士', value: 0.5 },
+              { name: '博士', value: 0.3 },
+              { name: '本科', value: 0.17 },
+              { name: '专科', value: 0.03 },
+            ],
+            insideLabel: {
+              show: true
+            },
+            outsideLabel: {
+              style: {
+                fontSize: 17,
+                fontWeight: 'bold',
+                textAlign: 'center',
+                textBaseline: 'bottom'
+              }
+            }
+          }
+        ]
+      });
+      this.source.setOption({
+        title: {
+          text: '人员进出记录',
+          style: {
+            fill: '#5fe9c8',
+          }
+        },
+        legend: {
+          data: [
+            {
+              name: '受理量',
+              color: '#aeeff0'
+            },
+            {
+              name: '办理量',
+              color: '#f1829f'
+            }
+          ]
+        },
+        xAxis: {
+          data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
+          axisLabel: {
+            style: {
+              fill: '#ffffff',
+              fontSize: 10,
+              rotate: 0
+            }
+          }
+        },
+        yAxis: [
+          {
+            name: '人员进出',
+            data: 'value',
+            nameTextStyle: {
+              fill: '#ffffff',
+              fontSize: 10
+            },
+            axisLabel: {
+              style: {
+                fill: '#ffffff',
+                fontSize: 10,
+                rotate: 0
+              }
+            }
+          },
+          {
+            name: '社区团购销售额',
+            data: 'value',
+            position: 'right',
+            max: 2000,
+            nameTextStyle: {
+              fill: '#ffffff',
+              fontSize: 10
+            },
+            axisLabel: {
+              style: {
+                fill: '#ffffff',
+                fontSize: 10,
+                rotate: 0
+              }
+            },
+            splitLine: {
+              show: false
+            }
+          }
+        ],
+        series: [
+          {
+            name: '人流量',
+            data: [1000, 1200, 900, 1500, 900, 1200, 1000],
+            type: 'line',
+            smooth: true,
+            lineArea: {
+              show: true,
+              gradient: ['rgba(251, 114, 147, 1)', 'rgba(251, 114, 147, 0)']
+            },
+            lineStyle: {
+              stroke: 'rgba(251, 114, 147, 1)',
+              lineDash: [3, 3]
+            },
+            linePoint: {
+              style: {
+                stroke: 'rgba(251, 114, 147, 1)'
+              }
+            },
+            yAxisIndex: 1
+          },
+          {
+            name: '销售额',
+            data: [1500, 1700, 1400, 2000, 1400, 1700, 1500],
+            type: 'bar',
+            gradient: {
+              color: ['rgba(103, 224, 227, .6)', 'rgba(103, 224, 227, .1)']
+            },
+            barStyle: {
+              stroke: 'rgba(103, 224, 227, 1)'
+            }
+          }
+        ]
+      });
+    },
+    initCharts(){
+      this.newCharts("source","source");
+      this.newCharts("accept","accept");
+      this.newCharts("type","type");
+    },
+    videoShow(){
+      this.$emit("videoShow",{});
+    },
+    newCharts(id,propertyName){
+      const container = document.getElementById(id)
+      let myChart = new Charts(container);
+      this[propertyName] = myChart;
+    },
+    onload(){
+      changeDefaultConfig('color',['rgb(208,200,21)','#747373','#6e6138','rgba(70,103,83,0.59)','#674a2c','#621752']);
+      this.setOption();
+    },
+  }
+}
+</script>
+
+<style scoped>
+  .center{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .full{
+    width: 100%;
+    height: 100%;
+  }
+  .closeButton{
+    background:rgba(84,36,17,0.5) ;
+  }
+  .closeButton:hover{
+    background:rgba(84,36,17,0.8) ;
+  }
+  .click:hover{
+    cursor: pointer;
+    transform: translate(2px,2px);
+  }
+</style>

src/main.js

@@ -26,6 +26,7 @@ import website from '@/config/website';
 import crudCommon from '@/mixins/crud';
 import {select} from "./api/base/region";
 import dataV from '@jiaminghi/data-view'
+import deviceJob from "./components/job/job_solve.vue";
 // import $ from 'jquery'
 // import layer from "layui-layer";
 
@@ -59,6 +60,7 @@ Vue.component('basicBlock', basicBlock);
 Vue.component('thirdRegister', thirdRegister);
 Vue.component('avueUeditor', AvueUeditor);
 Vue.component('lazySelect', lazySelect);
+Vue.component("device-job",deviceJob);
 // 加载相关url地址
 Object.keys(urls).forEach(key => {
   Vue.prototype[key] = urls[key];

src/router/views/index.js

@@ -1,6 +1,45 @@
 import Layout from '@/page/index/'
 
-export default [{
+export default [
+  {
+    path: '/bigScreen',
+    name: '网格看板',
+    component: () =>
+      import( /* webpackChunkName: "views" */ '@/views/bigScreen/bigScreen'),
+    meta: {
+      keepAlive: false,
+      isAuth: true,
+    }
+  },{
+    path: '/work/process/publicEvent',
+    component: Layout,
+    redirect: '/work/process/publicEvent/form',
+    children: [{
+      path: 'form/:processDefinitionId',
+      name: '报事工单',
+      meta: {
+        i18n: 'work'
+      },
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/work/process/publicEvent/form')
+    }, {
+      path: 'handle/:taskId/:processInstanceId/:businessId',
+      name: '处理报事工单',
+      meta: {
+        i18n: 'work'
+      },
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/work/process/publicEvent/handle')
+    }, {
+      path: 'detail/:processInstanceId/:businessId',
+      name: '报事工单详情',
+      meta: {
+        i18n: 'work'
+      },
+      component: () =>
+        import( /* webpackChunkName: "views" */ '@/views/work/process/publicEvent/detail')
+    }]
+  },{
   path: '/wel',
   component: Layout,
   redirect: '/wel/index',
@@ -27,6 +66,7 @@ export default [{
     component: () =>
       import( /* webpackChunkName: "views" */ '@/views/grid/smartCommunity')
   },
+
     // {
   //   path: 'index1',
   //   name:'社区全景',
@@ -196,3 +236,4 @@ export default [{
       import( /* webpackChunkName: "views" */ '@/views/work/process/leave/detail')
   }]
 }]
+

src/views/bigScreen/bigScreen.vue

@@ -0,0 +1,170 @@
+<template>
+  <div class="full" style="background: #235e70">
+    <!--    <info-box1></info-box1>-->
+    <dv-loading v-if="false" style="color: #dddddd"> 数据加载中 </dv-loading>
+
+    <!--  自定义地图  -->
+<!--    <map3-d ref="map" @MonitorClick="handleMonitorClick" ></map3-d>-->
+
+    <!--  顶部导航栏  -->
+    <div class="center title" style="width: 100%;height: 7%;position: absolute;top: 0">
+      <div style="width: 30%;height: 100%" >
+        <time-bar></time-bar>
+      </div>
+      <div style="width: 40%;height: 100%" class="center">琶洲测试社区</div>
+      <dv-border-box-5 :reverse="true" style="width: 30%;font-size: 20px" :color="['#49baa5', '#dddddd']" backgroundColor="rgba(0, 0, 0, 0.5)">
+        <div  class="full center">
+          <my-top-menu></my-top-menu>
+        </div>
+      </dv-border-box-5>
+    </div>
+
+    <!--頂部数据栏-->
+    <div style="position:absolute;width: 40%;height: 10%;top: 10%;right: 30%;color: white;cursor: pointer">
+      <div class="full center">
+        <dv-border-box-9
+          class="click"
+          :color="['#42c3b6', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)"
+          v-for="(item,index) in totalList" :key="index"
+          style="width: 250px;height: 80px;margin: 5px;"
+        >
+          <div class="full center" style="flex-direction: column">
+            <div style="width: 100%;height: 50px;font-weight: bold" class="center">{{item.name}}</div>
+            <div style="width: 100%;height: 50px;font-size: 20px" class="center">
+              <CountIn :startVal='0' :endVal=item.count :speed=item.count/200 :decimals="0" :isReverse=false></CountIn>
+            </div>
+          </div>
+        </dv-border-box-9>
+      </div>
+    </div>
+
+    <!-- 场景数据面板    -->
+    <city-screen v-if="scene==0"></city-screen>
+    <person-screen @videoShow="handleMonitorClick" v-if="scene==1"></person-screen>
+    <car-screen @videoShow="handleMonitorClick" v-if="scene==2"></car-screen>
+    <government-affairs @videoShow="handleMonitorClick" v-if="scene==3"></government-affairs>
+    <epidemic-screen v-if="scene==4"></epidemic-screen>
+    <environment-protection v-if="scene==5"></environment-protection>
+
+    <!--  场景菜单   -->
+    <div style="position:absolute;width: 60%;height: 15%;top: 85%;right: 20%;color: #ffffff">
+      <div class="full center">
+        <!--        <dv-border-box-7-->
+        <div
+          v-for="(item,index) of sceneMenu" :key="item"
+          style="cursor: pointer;width: 180px;height: 65px;background: url('/data/button-bg.png') no-repeat center/contain" class="center click" :color="['#58d9c5']" backgroundColor="rgba(36, 107, 107)">
+          <div class="full center " @click="handleDevice(index)" style="color: #3dffe1;font-weight: bold">{{item}}</div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 视屏面板    -->
+    <dv-border-box-10 class="videoPan" v-if="videoShow" :color="['#49baa5', 'white']" backgroundColor="rgba(0, 0, 0, 0.5)" style="position:absolute;width: 50%;height: 50%;top: 20%;right: 25%">
+      <div style="width: 100%;flex-direction: column;" class="full center">
+        <div class="center closeButton" style="cursor: pointer;width: 98%;height: 10%;color: white;font-size: 24px;border-radius: 10px;margin-top: 5px"
+             @click="videoShow=!videoShow"
+        >关闭</div>
+        <div style="width: 98%;height: 85%;">
+<!--          <cstor-live-player :audio="true" style="height: 100%;width: 100%" src="http://36.103.228.148:8888/live/64010500011327385808.flv"/>-->
+          <!--           <iframe src="https://www.zhihu.com/video/1333044671954403328" allowfullscreen> </iframe>-->
+        </div>
+
+      </div>
+    </dv-border-box-10>
+  </div>
+</template>
+
+<script>
+import Map3D from "../../components/3DMap/Map3D";
+// import CstorLivePlayer from 'cstor-live-player'
+// import 'cstor-live-player/dist/cstor-live-player.css';
+import TimeBar from "../../components/3DMap/TimeBar";
+import MyTopMenu from "@/views/bigScreen/components/my-top-menu";
+import CityScreen from "../../components/scene/CityScreen";
+import POIService from "../../components/3DMap/POIService";
+import EnvironmentProtection from "../../components/scene/EnvironmentProtection";
+import EpidemicScreen from "../../components/scene/EpidemicScreen";
+import GovernmentAffairs from "../../components/scene/GovernmentAffairs";
+import CountIn from "../../components/count-in/count-in";
+import PersonScreen from "@/components/scene/PersonScreen";
+import CarScreen from "@/components/scene/CarScreen";
+export default {
+  name: "mainScreen",
+  components: {
+    PersonScreen,CarScreen,
+    EpidemicScreen,EnvironmentProtection,GovernmentAffairs, CityScreen, MyTopMenu, TimeBar, Map3D, CountIn},
+  mounted() {
+    this.scene = 0;
+  },
+  data(){
+    return{
+      scene: 0,
+      videoShow: false,
+      sceneMenu: ["首页","人员管理","车辆管理","智能设备","视频监控","环境卫生"],
+      totalList: [
+        {count: '350',name: '总社区数'},
+        {count: '601',name: '总小区数'},
+        {count: '7260',name: '总楼栋数'},
+        {count: '16471',name: '总单元数'},
+        {count: '276616',name: '总房间数'},
+        {count: '3412',name: '总设备数'},
+        {count: '40635',name: '总人口数'},
+      ],
+    }
+  },
+  provide(){
+    return{
+      screen: this
+    }
+  },
+  methods: {
+    handleMonitorClick(){
+      this.videoShow = true;
+    },
+    handleDevice(index){
+      this.scene = index;
+      switch (index){
+        case 0:
+          this.$refs['map'].toLayer('ss');
+          break;
+        case 1:
+          this.$refs['map'].toLayer('monitoring');
+          break;
+        case 2:
+          this.$refs['map'].toLayer('event');
+          break;
+        default: ;
+      }
+    }
+  },
+}
+</script>
+
+<style scoped>
+.full{
+  width: 100%;
+  height: 100%;
+  user-select:none;
+}
+.center{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.title{
+  color: white;
+  font-size: 40px;
+}
+.demo{
+  color: rgba(0, 100, 100, 0.5);
+}
+.closeButton{
+  background:rgba(84,36,17,0.5) ;
+}
+.closeButton:hover{
+  background:rgba(84,36,17,0.8) ;
+}
+.click:hover{
+  transform: translate(2px,2px);
+}
+</style>

src/views/bigScreen/components/my-top-menu.vue

@@ -0,0 +1,136 @@
+<template>
+  <div class="my-top-menu">
+    <el-button v-for="(item,index) of tagListLeft" :key="item" @click="handleMenu(item,index)" class="menu-button" :class="{'button-active': tagIndex == index}">
+      {{item.name}}</el-button>
+    <!--    <el-button  v-for="(item,index) in items" :index="item.id+''" @click.native="openMenu(item,index)" :key="index" class="menu-button"-->
+    <!--                :class="{'button-active': tagIndex == index+tagListLeft.length}"-->
+    <!--      >{{item.name}}</el-button>-->
+    <el-button v-for="(item,index) of tagListRight"
+               :class="{'button-active': tagIndex == index+tagListLeft.length}+items.length"
+               :key="item" @click="handleMenu(item,index)" class="menu-button">
+      {{item.name}}</el-button>
+  </div>
+</template>
+
+<script>
+import {mapGetters} from "vuex";
+import {fullscreenToggel} from "@/util/util";
+import {resetRouter} from "@/router/router";
+import {getRoutes} from "../../../api/system/menu";
+
+export default {
+  name: "my-top-menu",
+  data() {
+    return {
+      tagListLeft: [
+        // {name: '指挥中心',path: '/mainScreen'},
+        // {name: '基层治理',path: '/grid/divide'},
+      ],
+      tagListRight: [
+        {name: '全屏',path: ''},
+        {name: '返回',path: ''},
+      ],
+      activeIndex: "0",
+      items: [],
+    };
+  },
+  inject: ["index"],
+  created() {
+    this.getMenu();
+  },
+  computed: {
+    ...mapGetters(["tagIndex","menu"])
+  },
+  methods: {
+    openHome(itemHome) {
+      this.index.openMenu(itemHome);
+      this.$router.push({
+        path: this.$router.$avueRouter.getPath({name: itemHome.name, src: ''}, {})
+      });
+    },
+    handleMenu(menu,index){
+      switch (menu.name) {
+        case '返回':
+          this.$router.back(-1);
+          this.$store.commit("SET_TAG_INDEX",index+this.items.length+this.tagListLeft.length)
+          break;
+        case '全屏': this.handleScreen();
+          this.$store.commit("SET_TAG_INDEX",index+this.items.length+this.tagListLeft.length)
+          break;
+        case '指挥中心': this.$router.push({path: this.tagListLeft[index].path});
+          this.$store.commit("SET_TAG_INDEX",index)
+          break;
+        case '基层治理': this.$router.push({path: this.tagListLeft[index].path});
+          this.$store.commit("SET_TAG_INDEX",index)
+          break;
+        default: ;
+      }
+    },
+    handleScreen() {
+      fullscreenToggel();
+    },
+    logout() {
+      this.$confirm('退出系统, 是否继续?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(() => {
+        this.$store.dispatch("LogOut").then(() => {
+          resetRouter();
+          this.$router.push({path: "/login"});
+        });
+      });
+    },
+    async openMenu(item,index) {
+      this.$store.commit("SET_TAG_INDEX",this.tagListLeft.length+index)
+      let menu = await this.$store.dispatch("GetMenu",item.id)
+      if(menu.length>0){
+        await this.$router.push({
+          path: menu[0].children[0].path
+        })
+      }
+    },
+    getMenu() {
+      this.$store.dispatch("GetTopMenu").then(res => {
+        this.items = res;
+      });
+    },
+    generateTitle(item) {
+      return this.$router.$avueRouter.generateTitle(
+        item.name,
+        (item.meta || {}).i18n
+      );
+    },
+  }
+};
+</script>
+<style scoped>
+.my-top-menu{
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: row;
+  padding: 2px 20px;
+  overflow-x: scroll;
+}
+
+.menu-button{
+  width: 150px;
+  height: 40px;
+  text-align: center ;
+  background: transparent;
+  border: solid 1px #0f3021;
+  background: url("/data/bg-grid.png") center/cover;
+  color: rgba(0, 186, 189, 1);
+  font-size: 18px;
+  margin: 10px;
+}
+.menu-button:hover,.menu-button:focus{
+  background: url("/data/bg-grid.png") center/cover;
+}
+.button-active{
+  border: solid 1px #8e8e8e;
+  color: #dddddd;
+}
+</style>

src/views/community/agency.vue

@@ -8,11 +8,12 @@
         <el-button type="danger" size="small" icon="el-icon-delete" plain v-if="permission.agency_delete" @click="handleDelete">删
           除
         </el-button>
-        <cy-excel-import :flag="4" file-name="社区信息导入模板" @success="onLoad(page)"></cy-excel-import>
+        <cy-excel-import :flag="1" file-name="社区信息导入模板" @success="onLoad(page)"></cy-excel-import>
       </template>
       <template slot="mapSelectForm" slot-scope="scope">
         <div>
-          <input class="el-input--small el-input__inner" placeholder="选择地址" @click="mapVisible = true">
+          <!--          <input class="el-input&#45;&#45;small el-input__inner" placeholder="选择地址" @click="mapVisible = true">-->
+          <el-button @click="mapVisible = true"> 选择地址</el-button>
           <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="mapVisible"
                      title="编辑地址" width="80%">
             <editPolygonMap v-if="mapVisible" :editForm.sync="scope.row" :visible.sync="mapVisible"></editPolygonMap>
@@ -25,410 +26,411 @@
 </template>
 
 <script>
-  import {
-    getList,
-    getDetail,
-    add,
-    update,
-    remove
-  } from "@/api/community/agency.js";
-  import {
-    mapGetters
-  } from "vuex";
-  import {
-    validatePhone
-  } from "@/util/validator"
-  import CyExcelImport from "../../components/excel/cy-excel-import"
-  import editPolygonMap from "../../components/residential/editPolygonMap.vue"
-  export default {
-    components: {CyExcelImport,editPolygonMap},
-    data() {
-      return {
-        mapVisible:false,
-        areaData: [],
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
+import {
+  getList,
+  getDetail,
+  add,
+  update,
+  remove
+} from "@/api/community/agency.js";
+import {
+  mapGetters
+} from "vuex";
+import {
+  validatePhone
+} from "@/util/validator"
+import CyExcelImport from "../../components/excel/cy-excel-import"
+import editPolygonMap from "../../components/residential/editPolygonMap.vue"
+export default {
+  components: {CyExcelImport,editPolygonMap},
+  data() {
+    return {
+      mapVisible:false,
+      areaData: [],
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height: 'auto',
+        calcHeight: 60,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        menuWidth:350,
+        column: [{
+          label: "名称",
+          prop: "name",
+          search: true,
+          width: 160,
+          overHidden: true,
+          rules: [{
+            required: true,
+            message: "请输入名称",
+            trigger: "blur"
+          }]
         },
-        selectionList: [],
-        option: {
-          height: 'auto',
-          calcHeight: 60,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [{
-            label: "名称",
-            prop: "name",
-            search: true,
-            width: 160,
-            placeholder: "",
-            overHidden: true,
+          {
+            label:'',
+            prop:'mapSelect',
+
+            formslot: true,
+            hide: true,
+          },
+          {
+            label: "经度",
+            prop: "longitude",
+            width: 120,
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入经度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "纬度",
+            prop: "latitude",
+            width: 120,
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入纬度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属省",
+            prop: "regionProvince",
+            type: "select",
+            width: 150,
+            dicUrl: "/api/blade-system/region/lazy-tree?parentCode=000000",
+            cascaderItem:["regionCity"],
+            props:{
+              label:"title",
+              value: "id"
+            },
             rules: [{
               required: true,
-              message: "请输入名称",
+              message: "请输入省行政编码",
               trigger: "blur"
             }]
           },
-            {
-              label:'',
-              prop:'mapSelect',
+          {
+            label: "所属市",
+            prop: "regionCity",
+            type: "select",
+            cascaderItem: ["regionArea"],
+            dicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
 
-              formslot: true,
-              hide: true,
+            props:{
+              label: "title",
+              value: "id"
             },
-            {
-              label: "经度",
-              prop: "longitude",
-              width: 120,
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入经度",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "纬度",
-              prop: "latitude",
-              width: 120,
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入纬度",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属省",
-              prop: "regionProvince",
-              type: "select",
-              width: 150,
-              dicUrl: "/api/blade-system/region/lazy-tree?parentCode=000000",
-              cascaderItem:["regionCity"],
-              props:{
-                label:"title",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入省行政编码",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属市",
-              prop: "regionCity",
-              type: "select",
-              cascaderItem: ["regionArea"],
-              dicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
+            rules: [{
+              required: false,
+              message: "请输入市行政编码",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属区",
+            prop: "regionArea",
+            type: "select",
 
-              props:{
-                label: "title",
-                value: "id"
-              },
-              rules: [{
-                required: false,
-                message: "请输入市行政编码",
-                trigger: "blur"
-              }]
+            cascaderItem: ["regionStreet"],
+            dicUrl:  `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
+            props: {
+              label: "title",
+              value: "id"
             },
-            {
-              label: "所属区",
-              prop: "regionArea",
-              type: "select",
+            rules: [{
+              required: false,
+              message: "请输入区行政编码",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属街道",
+            prop: "regionStreet",
+            type:"select",
 
-              cascaderItem: ["regionStreet"],
-              dicUrl:  `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
-              props: {
-                label: "title",
-                value: "id"
-              },
-              rules: [{
-                required: false,
-                message: "请输入区行政编码",
-                trigger: "blur"
-              }]
+            width: 150,
+            dicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
+            props: {
+              label: "title",
+              value: "id"
             },
-            {
-              label: "所属街道",
-              prop: "regionStreet",
-              type:"select",
-
-              width: 150,
-              dicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
-              props: {
-                label: "title",
-                value: "id"
-              },
 
-              rules: [{
-                required: true,
-                message: "请输入街道id",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "详细地址",
-              search: true,
-              prop: "address",
-              // width: 300,
-              overHidden: true,
-              rules: [{
-                required: false,
-                message: "请输入详细地址",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "负责人名称",
-              prop: "personName",
-              width: 150,
-              labelWidth: 100,
-              rules: [{
-                required: false,
-                message: "请输入负责人名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "联系方式",
-              prop: "personPhone",
-              width: 120,
-              rules: [{
-                required: false,
-                message: "请输入负责人联系方式",
-                trigger: "blur"
-              }, {
-                validator: validatePhone,
-                trigger: "blur"
-              }],
-            },
-            {
-              label: "背景图",
-              prop: "pic",
-              type: 'upload',
-              hide: true,
-              propsHttp: {
-                res: "data",
-                url: 'link'
-              },
-              listType: 'picture-img',
-              span: 24,
-              row: true,
-              action: "/api/blade-resource/oss/endpoint/put-file",
-              display: true,
-              rules: [{
-                required: false,
-                message: "请输入封面图片",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "小区数量",
-              prop: "residentialCount",
-              display: false,
-              hide: true,
-            },
-            {
-              label: "楼栋数量",
-              prop: "buildingCount",
-              hide: true,
-              display: false,
-            },
-            {
-              label: "单元数量",
-              prop: "unitCount",
-              hide: true,
-              display: false,
-            },
-            {
-              label: "楼层数量",
-              prop: "floorCount",
-              hide: true,
-              display: false,
-            },
-            {
-              label: "房间数量",
-              prop: "roomCount",
-              hide: true,
-              display: false,
-            },
-            {
-              label: "人员数量",
-              prop: "personCount",
-              hide: true,
-              display: false,
+            rules: [{
+              required: true,
+              message: "请输入街道id",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "详细地址",
+            search: true,
+            prop: "address",
+            // width: 300,
+            overHidden: true,
+            rules: [{
+              required: false,
+              message: "请输入详细地址",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人名称",
+            prop: "personName",
+            width: 150,
+            labelWidth: 100,
+            rules: [{
+              required: false,
+              message: "请输入负责人名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "联系方式",
+            prop: "personPhone",
+            width: 120,
+            rules: [{
+              required: false,
+              message: "请输入负责人联系方式",
+              trigger: "blur"
+            }, {
+              validator: validatePhone,
+              trigger: "blur"
+            }],
+          },
+          {
+            label: "背景图",
+            prop: "pic",
+            type: 'upload',
+            hide: true,
+            propsHttp: {
+              res: "data",
+              url: 'link'
             },
+            listType: 'picture-img',
+            span: 24,
+            row: true,
+            action: "/api/blade-resource/oss/endpoint/put-file",
+            display: true,
+            tip:"上传图片不能超过500K",
+            rules: [{
+              required: false,
+              message: "请输入封面图片",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "小区数量",
+            prop: "residentialCount",
+            display: false,
+            hide: true,
+          },
+          {
+            label: "楼栋数量",
+            prop: "buildingCount",
+            hide: true,
+            display: false,
+          },
+          {
+            label: "单元数量",
+            prop: "unitCount",
+            hide: true,
+            display: false,
+          },
+          {
+            label: "楼层数量",
+            prop: "floorCount",
+            hide: true,
+            display: false,
+          },
+          {
+            label: "房间数量",
+            prop: "roomCount",
+            hide: true,
+            display: false,
+          },
+          {
+            label: "人员数量",
+            prop: "personCount",
+            hide: true,
+            display: false,
+          },
 
-            {
-              label: "备注",
-              prop: "remark",
-              hide: true,
-            },
-          ]
-        },
-        data: []
+          {
+            label: "备注",
+            prop: "remark",
+            hide: true,
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.agency_add, false),
+        viewBtn: this.vaildData(this.permission.agency_view, false),
+        delBtn: this.vaildData(this.permission.agency_delete, false),
+        editBtn: this.vaildData(this.permission.agency_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.agency_add, false),
-          viewBtn: this.vaildData(this.permission.agency_view, false),
-          delBtn: this.vaildData(this.permission.agency_delete, false),
-          editBtn: this.vaildData(this.permission.agency_edit, false)
-        };
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    },
+  },
+  watch: {
+    'form.mapSelect': {
+      handler: function(value) {
+        if (!value){
+          return
+        }else{
+          this.form.longitude = this.form.mapSelect.longitude;
+          this.form.latitude = this.form.mapSelect.latitude;
+          this.form.address = this.form.mapSelect.formattedAddress;
+        }
       },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    }
+  },
+  methods: {
+    rowSave(row, done, loading) {
+      row.residentialCount = 0;
+      row.unitCount = 0;
+      row.roomCount = 0;
+      row.personCount = 0;
+      row.carCount = 0;
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      },
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
     },
-    watch: {
-      'form.mapSelect': {
-        handler: function(value) {
-          if (!value){
-            return
-          }else{
-            this.form.longitude = this.form.mapSelect.longitude;
-            this.form.latitude = this.form.mapSelect.latitude;
-            this.form.address = this.form.mapSelect.formattedAddress;
-          }
-        },
-      }
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
     },
-    methods: {
-      rowSave(row, done, loading) {
-        row.residentialCount = 0;
-        row.unitCount = 0;
-        row.roomCount = 0;
-        row.personCount = 0;
-        row.carCount = 0;
-        add(row).then(() => {
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
+    },
+    beforeOpen(done, type) {
 
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage) {
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize) {
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/community/building.vue

@@ -65,324 +65,348 @@
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove} from "../../api/community/building.js";
-  import devicebuilding from "@/views/smartapplication/devicebuilding";
-  import buildingvideo from "@/views/smartapplication/buildingvideo";
-  import {communityManage} from "@/views/community/util/communityManage";
-  import {mapGetters} from "vuex";
+import {getList, getDetail, add, update, remove} from "../../api/community/building.js";
+import devicebuilding from "@/views/smartapplication/devicebuilding";
+import buildingvideo from "@/views/smartapplication/buildingvideo";
+import {communityManage} from "@/views/community/util/communityManage";
+import {mapGetters} from "vuex";
 
-  export default {
-    components: {
-      devicebuilding,
-      buildingvideo
-    },
-    data() {
-      return {
-        buildingId : '',
-        deviceDialog: false,
-        videoDialog: false,
-        editForm: {},
-        editVisible: false,
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 60,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: false,
-          // addBtn: false,
-          editBtn: false,
-          delBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            {
-              label: "楼栋名称",
-              prop: "name",
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属小区",
-              prop: "residentialId",
-              type:"select",
-              // remote: true,
-              //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
-              dicUrl: "/api/cyzh-community/residential/list?name={{key}}&&size=9999",
-              props:{
-                label: "name",
-                value: "id"
-              },
-              dicFormatter:(res)=>{
-                return res.data.records;//返回字典的层级结构
-              },
-              filterable: true,
-              searchFilterable: true,
-              search: true,
-              slot: true,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "图片",
-              prop: "pic",
-              type: 'upload',
-              dataType: 'string',
-              hide: true,
-              propsHttp: {
-                url: 'data'
-              },
-              listType: 'picture-card',
-              span: 24,
-              row: true,
-              value: "/img/default/building.png",
-              action: "/api/upload/putfile",
-              rules: [{
-                required: false,
-                message: "请输入封面图片",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "单元数",
-              prop: "unitCount",
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "楼层数",
-              prop: "floorCount",
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
+export default {
+  components: {
+    devicebuilding,
+    buildingvideo
+  },
+  data() {
+    return {
+      buildingId : '',
+      deviceDialog: false,
+      videoDialog: false,
+      editForm: {},
+      editVisible: false,
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height:'auto',
+        calcHeight: 60,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        // addBtn: false,
+        editBtn: false,
+        delBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        column: [
+          {
+            label: "楼栋名称",
+            prop: "name",
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          // {
+          //   label: "所属小区",
+          //   prop: "residentialId",
+          //   type:"select",
+          //   remote: true,
+          //   //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
+          //   dicUrl: "/api/cyzh-community/residential/list?size=200&name={{key}}",
+          //   dicFormatter:(res)=>{
+          //     return res.data.records;//返回字典的层级结构
+          //   },
+          //   props:{
+          //     label: "name",
+          //     value: "id"
+          //   },
+          //   searchFilterable: true,
+          //   search: true,
+          //   slot: true,
+          //   rules: [{
+          //     required: true,
+          //     message: "请输入",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "所属小区",
+            prop: "residentialId",
+            // slot: true,
+            type: "select",
+            search: true,
+            searchFilterable: true,
+            // cascaderItem: ['buildingId'],
+            dicUrl: "/api/cyzh-community/residential/list?size=900",
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "房间数",
-              prop: "roomCount",
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
+            // dicFlag: false,
+            filterable: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "总人口数",
-              prop: "personCount",
-              display: false,
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请选择所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "图片",
+            prop: "pic",
+            type: 'upload',
+            dataType: 'string',
+            hide: true,
+            propsHttp: {
+              res: "data",
+              url: 'link'
             },
-          ]
-        },
-        data: []
+            listType: 'picture-card',
+            span: 24,
+            row: true,
+            // value: "/img/default/building.png",
+            action: "/api/blade-resource/oss/endpoint/put-file",
+            rules: [{
+              required: false,
+              message: "请输入封面图片",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "单元数",
+            prop: "unitCount",
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "楼层数",
+            prop: "floorCount",
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "房间数",
+            prop: "roomCount",
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "总人口数",
+            prop: "userCount",
+            display: false,
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.building_add, false),
+        viewBtn: this.vaildData(this.permission.building_view, false),
+        delBtn: this.vaildData(this.permission.building_delete, false),
+        editBtn: this.vaildData(this.permission.building_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.building_add, false),
-          viewBtn: this.vaildData(this.permission.building_view, false),
-          delBtn: this.vaildData(this.permission.building_delete, false),
-          editBtn: this.vaildData(this.permission.building_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  mounted() {
+    let tenantType = localStorage.getItem("tenantType");
+    const residentialColumn = this.findObject(this.option.column, "residentialId");
+    if (tenantType == 1) { //园区
+      residentialColumn.label = "所属区域"
+    } else { //社区
+      residentialColumn.label = "所属小区"
+    }
+  },
+  methods: {
+    submitBuilding(row,done,loading){
+      update(this.editForm).then(() => {
+        this.onLoad(this.page);
+        this.editVisible = false;
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
     },
-    mounted() {
-      let tenantType = localStorage.getItem("tenantType");
-      const residentialColumn = this.findObject(this.option.column, "residentialId");
-      if (tenantType == 1) { //园区
-        residentialColumn.label = "所属区域"
-      } else { //社区
-        residentialColumn.label = "所属小区"
-      }
+    edit(row){
+      this.editForm = row;
+      this.editVisible = true;
     },
-    methods: {
-      submitBuilding(row,done,loading){
-        update(this.editForm).then(() => {
-          this.onLoad(this.page);
-          this.editVisible = false;
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+    buildingManage(id,type){
+      let query = {buildingId: id};
+      communityManage(this,type,query)
+    },
+    manageDevice(row){
+      this.buildingId = row.id;
+      this.deviceDialog = true
+    },
+    manageVideo(row){
+      this.buildingId = row.id;
+      this.videoDialog = true
+    },
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      edit(row){
-        this.editForm = row;
-        this.editVisible = true;
-      },
-      buildingManage(id,type){
-        let query = {buildingId: id};
-        communityManage(this,type,query)
-      },
-      manageDevice(row){
-        this.buildingId = row.id;
-        this.deviceDialog = true
-      },
-      manageVideo(row){
-        this.buildingId = row.id;
-        this.videoDialog = true
-      },
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
+        });
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage){
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize){
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
 
 
-        console.log("dfdf:"+ this.$route.query.residentialOldId);
-        if(this.$route.query.residentialOldId != undefined){
+      console.log("dfdf:"+ this.$route.query.residentialOldId);
+      if(this.$route.query.residentialOldId != undefined){
 
-          params.residentialId = this.$route.query.oldId;
+        params.residentialId = this.$route.query.oldId;
 
-        }
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
-        });
       }
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/community/floor.vue

@@ -35,7 +35,7 @@
             </span>
             <el-dropdown-menu slot="dropdown">
               <el-dropdown-item divided @click.native="floorManage(scope.row.id,3)" icon="el-icon-s-home">房间管理</el-dropdown-item>
-<!--              <el-dropdown-item divided @click.native="floorManage(scope.row.id,4)" icon="el-icon-user-solid">住户管理</el-dropdown-item>-->
+              <!--              <el-dropdown-item divided @click.native="floorManage(scope.row.id,4)" icon="el-icon-user-solid">住户管理</el-dropdown-item>-->
               <!-- <el-dropdown-item divided @click.native="tip(2,scope.row)">审核通过</el-dropdown-item> -->
             </el-dropdown-menu>
           </el-dropdown>
@@ -50,422 +50,462 @@
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove} from "../../api/community/floor.js";
-  import {mapGetters} from "vuex";
-  import {communityManage} from "@/views/community/util/communityManage";
+import {getList, getDetail, add, update, remove} from "../../api/community/floor.js";
+import {mapGetters} from "vuex";
+import {communityManage} from "@/views/community/util/communityManage";
 
-  export default {
-    data() {
-      return {
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 60,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: false,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            {
-              label: "楼层名称",
-              prop: "name",
-              rules: [{
-                required: true,
-                message: "请输入楼层名称",
-                trigger: "blur"
-              }]
-            },
-            // {
-            //   label: "所属社区",
-            //   prop: "agencyId",
-            //   hide: true,
-            //   display: false,
-            //   slot: true,
-
-            //   rules: [{
-            //     required: true,
-            //     message: "请选择所属社区",
-            //     trigger: "blur"
-            //   }]
-            // },
-            {
-              label: "所属小区",
-              prop: "residentialId",
-              search: true,
-              slot: true,
-              cascaderItem: ['buildingId'],
-              type: "select",
-              // remote: true,
-              filterable:true,
-              searchFilterable:true,
-              //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
-              dicUrl: "/api/cyzh-community/residential/list?name={{key}}&&size=9999",
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属小区",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属楼栋",
-              prop: "buildingId",
-              cascaderItem: ['unitId'],
-              slot: true,
-              search: true,
-              type: "select",
-              dicUrl: "/api/cyzh-community/building/list?residentialId={{key}}",
-              filterable: true,
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属楼栋",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属单元",
-              prop: "unitId",
-              search: true,
-              slot: true,
-              type: "select",
-              cascaderIndex: 1,
-              dicUrl: "/api/cyzh-community/unit/list?buildingId={{key}}",
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              filterable: true,
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属单元id",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "负责人姓名",
-              prop: "personName",
-              hide: true,
-              labelWidth: 100,
-              rules: [{
-                required: false,
-                message: "请输入负责人姓名",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "负责人电话",
-              prop: "personTel",
-              labelWidth: 100,
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入负责人电话",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "建筑年代",
-              prop: "builtYear",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入建筑年代",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "产权性质",
-              prop: "propertyNature",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入产权性质",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "有无电梯",
-              prop: "includingElevator",
-              type: "select",
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=including_elevator",
-              props:{
-                label: "dictValue",
-                value: "dictKey",
-              },
-              dataType: "string",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入有无电梯",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "房间数量",
-              prop: "roomCount",
-              display: false,
-              rules: [{
-                required: false,
-                message: "请输入房间数量",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "住户数量",
-              prop: "userCount",
-              hide: true,
-              display: false,
-              rules: [{
-                required: false,
-                message: "请输入住户数量",
-                trigger: "blur"
-              }]
+export default {
+  data() {
+    return {
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height:'auto',
+        calcHeight: 60,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        selection: true,
+        menuWidth: 350,
+        dialogClickModal: false,
+        column: [
+          {
+            label: "楼层名称",
+            width: 100,
+            prop: "name",
+            rules: [{
+              required: true,
+              message: "请输入楼层名称",
+              trigger: "blur"
+            }]
+          },
+          // {
+          //   label: "所属社区",
+          //   prop: "agencyId",
+          //   hide: true,
+          //   display: false,
+          //   slot: true,
+          //   cascaderItem: ['residentialId'],
+          //   type: "select",
+          //   // remote: true,
+          //   dicUrl: "/api/cyzh-community/agency/list?size=9999",
+          //   dicFormatter:(res)=>{
+          //     return res.data.records;//返回字典的层级结构
+          //   },
+          //   props: {
+          //     label: "name",
+          //     value: "id"
+          //   },
+          //   rules: [{
+          //     required: true,
+          //     message: "请选择所属社区",
+          //     trigger: "blur"
+          //   }]
+          // },
+          // {
+          //   label: "所属小区",
+          //   prop: "residentialId",
+          //   search: true,
+          //   slot: true,
+          //   cascaderItem: ['buildingId','unitId'],
+          //   type: "select",
+          //   remote: true,
+          //   //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
+          //   dicUrl: "/api/cyzh-community/residential/list?name={{key}}",
+          //   dicFormatter:(res)=>{
+          //     return res.data.records;//返回字典的层级结构
+          //   },
+          //   props: {
+          //     label: "name",
+          //     value: "id"
+          //   },
+          //   rules: [{
+          //     required: true,
+          //     message: "请选择所属小区",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "所属小区",
+            prop: "residentialId",
+            type:"select",
+            cascaderItem: ['buildingId'],
+            remote: true,
+            //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
+            dicUrl: "/api/cyzh-community/residential/list?size=900",
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "序号",
-              prop: "serial",
-              hide: true,
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入序号",
-                trigger: "blur"
-              }]
+            props:{
+              label: "name",
+              value: "id"
             },
-            {
-              label: "备注",
-              prop: "remark",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入备注",
-                trigger: "blur"
-              }]
+            searchFilterable: true,
+            search: true,
+            slot: true,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼栋",
+            prop: "buildingId",
+            // width: 100,
+            slot: true,
+            search: true,
+            type: "select",
+            // cascaderIndex:0,
+            cascaderItem: ['unitId'],
+            dicUrl: "/api/cyzh-community/building/list?size=100&residentialId={{key}}",
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "所属机构id（属于社区机构，则存社区机构ID;无社区机构，则存小区ID）",
-              prop: "orgPid",
-              hide: true,
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入所属机构id（属于社区机构，则存社区机构ID;无社区机构，则存小区ID）",
-                trigger: "blur"
-              }]
+            filterable: true,
+            dicFlag: false,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "所属机构名称（属于社区机构，则存社区机构名称;无社区机构，则存小区名称）",
-              prop: "orgPidName",
-              hide: true,
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入所属机构名称（属于社区机构，则存社区机构名称;无社区机构，则存小区名称）",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请选择所属楼栋",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属单元",
+            prop: "unitId",
+            // width: 100,
+            search: true,
+            slot: true,
+            type: "select",
+            dicFlag: false,
+            // cascaderIndex: 1,
+            dicUrl: "/api/cyzh-community/unit/list?buildingId={{key}}",
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "根机构Id",
-              prop: "rootOrgId",
-              hide: true,
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入根机构Id",
-                trigger: "blur"
-              }]
+            filterable: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "原数据的Id",
-              prop: "oldId",
-              hide: true,
-              display: false,
-              rules: [{
-                required: true,
-                message: "请输入原数据的Id",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入所属单元id",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人姓名",
+            prop: "personName",
+            hide: true,
+            labelWidth: 100,
+            rules: [{
+              required: false,
+              message: "请输入负责人姓名",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人电话",
+            prop: "personTel",
+            labelWidth: 100,
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入负责人电话",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "建筑年代",
+            prop: "builtYear",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入建筑年代",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "产权性质",
+            prop: "propertyNature",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入产权性质",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "有无电梯",
+            prop: "includingElevator",
+            type: "select",
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=including_elevator",
+            props:{
+              label: "dictValue",
+              value: "dictKey",
             },
+            dataType: "number",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入有无电梯",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "房间数量",
+            prop: "roomCount",
+            // width: 100,
+            display: false,
+            rules: [{
+              required: false,
+              message: "请输入房间数量",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "住户数量",
+            prop: "userNumber",
+            hide: true,
+            display: false,
+            rules: [{
+              required: false,
+              message: "请输入住户数量",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "序号",
+            prop: "serial",
+            hide: true,
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入序号",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "备注",
+            prop: "remark",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入备注",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属机构id（属于社区机构，则存社区机构ID;无社区机构，则存小区ID）",
+            prop: "orgPid",
+            hide: true,
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入所属机构id（属于社区机构，则存社区机构ID;无社区机构，则存小区ID）",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属机构名称（属于社区机构，则存社区机构名称;无社区机构，则存小区名称）",
+            prop: "orgPidName",
+            hide: true,
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入所属机构名称（属于社区机构，则存社区机构名称;无社区机构，则存小区名称）",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "根机构Id",
+            prop: "rootOrgId",
+            hide: true,
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入根机构Id",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "原数据的Id",
+            prop: "oldId",
+            hide: true,
+            display: false,
+            rules: [{
+              required: true,
+              message: "请输入原数据的Id",
+              trigger: "blur"
+            }]
+          },
 
-          ]
-        },
-        data: []
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.floor_add, false),
+        viewBtn: this.vaildData(this.permission.floor_view, false),
+        delBtn: this.vaildData(this.permission.floor_delete, false),
+        editBtn: this.vaildData(this.permission.floor_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.floor_add, false),
-          viewBtn: this.vaildData(this.permission.floor_view, false),
-          delBtn: this.vaildData(this.permission.floor_delete, false),
-          editBtn: this.vaildData(this.permission.floor_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  mounted() {
+    let tenantType = localStorage.getItem("tenantType");
+    const residentialColumn = this.findObject(this.option.column, "residentialId");
+    if (tenantType == 1) { //园区
+      residentialColumn.label = "所属区域";
+    } else { //社区
+      residentialColumn.label = "所属小区";
+    }
+  },
+  methods: {
+    floorManage(id,type){
+      let query = {floorId: id};
+      communityManage(this,type,query)
+    },
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
     },
-    mounted() {
-      let tenantType = localStorage.getItem("tenantType");
-      const residentialColumn = this.findObject(this.option.column, "residentialId");
-      if (tenantType == 1) { //园区
-        residentialColumn.label = "所属区域";
-      } else { //社区
-        residentialColumn.label = "所属小区";
-      }
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
     },
-    methods: {
-      floorManage(id,type){
-        let query = {floorId: id};
-        communityManage(this,type,query)
-      },
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        if (this.$route.query){
-          Object.assign(this.query,this.$route.query)
-        }
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage){
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize){
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      if (this.$route.query){
+        Object.assign(this.query,this.$route.query)
+      }
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/community/residential.vue

@@ -2,45 +2,45 @@
 <template>
   <basic-container>
     <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="manageVisible"
-      title="管理" fullscreen="true" @close="closeManage">
+               title="管理" fullscreen="true" @close="closeManage">
 
       <residentialManage ref="resMang" :residentialId="selectedResidentialId" :residentialName="selectedResidentialName"
-        :visible="manageVisible">
+                         :visible="manageVisible">
 
       </residentialManage>
 
     </el-dialog>
     <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="detailVisible"
-      title="详情" width="80%">
+               title="详情" width="80%">
       <residential-detail :form="detailForm" ref="residentialDetail"></residential-detail>
     </el-dialog>
     <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="editVisible"
-      title="编辑" width="80%">
-     <avue-form v-model="editForm" :option="option" @submit="submitResidential">
+               title="编辑" width="80%">
+      <avue-form v-model="editForm" :option="option" @submit="submitResidential">
         <template slot="mapSelect">
-          <input class="el-input--small el-input__inner" placeholder="选择地址" @click="mapVisible = true">
-
+          <!--          <input class="el-input&#45;&#45;small el-input__inner" placeholder="选择地址" @click="mapVisible = true">-->
+          <el-button @click="mapVisible = true">选择地址</el-button>
         </template>
       </avue-form>
     </el-dialog>
     <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="mapVisible"
-    title="编辑地址" width="80%">
-       <editPolygonMap v-if="mapVisible" :editForm.sync="editForm" :visible.sync="mapVisible"></editPolygonMap>
+               title="编辑地址" width="80%">
+      <editPolygonMap v-if="mapVisible" :editForm.sync="editForm" :visible.sync="mapVisible"></editPolygonMap>
     </el-dialog>
     <avue-crud :option="option" :table-loading="loading" :data="data" :page="page" :permission="permissionList"
-      :before-open="beforeOpen" v-model="form" ref="crud" @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel"
-      @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
-      @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
+               :before-open="beforeOpen" v-model="form" ref="crud" @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel"
+               @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
+               @size-change="sizeChange" @refresh-change="refreshChange" @submit="handleSubmit" @on-load="onLoad">
       <template slot="menuLeft">
         <el-button type="danger" size="small" icon="el-icon-delete" plain v-if="permission.residential_delete" @click="handleDelete">删除
         </el-button>
-        <cy-excel-import :flag="5" file-name="小区信息导入模板" v-if="permission.residential_add" @success="onLoad(page)"></cy-excel-import>
-        <el-button type="success" size="small" icon="el-icon-refresh" v-if="permission.residential_add" plain @click="refreshNumber">计算统计</el-button>
-        <el-button type="success" size="small" icon="el-icon-refresh" v-if="permission.residential_add" plain @click="syncHouseInfoAndUser(oldIds)">同步楼栋&住户</el-button>
+        <cy-excel-import :flag="2" file-name="小区信息导入模板" v-if="permission.residential_add" @success="onLoad(page)"></cy-excel-import>
+        <!--        <el-button type="success" size="small" icon="el-icon-refresh" v-if="permission.residential_add" plain @click="refreshNumber">计算统计</el-button>-->
+        <!--        <el-button type="success" size="small" icon="el-icon-refresh" v-if="permission.residential_add" plain @click="syncHouseInfoAndUser(oldIds)">同步楼栋&住户</el-button>-->
       </template>
-       <template slot-scope="scope" slot="regionForm">
+      <template slot-scope="scope" slot="regionForm">
         <avue-cascader v-model="scope.row.region" :dic="regionDic" key-value="value"></avue-cascader>
-               <cy-area-select></cy-area-select>
+        <cy-area-select></cy-area-select>
       </template>
       <template slot="agencyId" slot-scope="scope">{{scope.row.agencyName}}</template>
       <template slot="menu" slot-scope="scope">
@@ -53,12 +53,12 @@
               <el-dropdown-item divided @click.native="detail(scope.row)" icon="el-icon-office-building">详情</el-dropdown-item>
               <el-dropdown-item divided @click.native="edit(scope.row)" icon="el-icon-school">编辑</el-dropdown-item>
               <el-dropdown-item divided @click.native="manage(scope.row)" icon="el-icon-s-order">管理</el-dropdown-item>
-              <el-dropdown-item divided @click.native="syncBuilding(scope.row)" v-if="permission.residential_syncBuilding">同步楼栋</el-dropdown-item>
-              <el-dropdown-item divided @click.native="syncUnit(scope.row)" v-if="permission.residential_syncUnit">同步单元</el-dropdown-item>
-              <el-dropdown-item divided @click.native="syncFloor(scope.row)" v-if="permission.residential_syncFloor">同步楼层</el-dropdown-item>
-              <el-dropdown-item divided @click.native="syncRoom(scope.row)" v-if="permission.residential_syncRoom">同步房间</el-dropdown-item>
-              <el-dropdown-item divided @click.native="syncUser(scope.row)" v-if="permission.residential_syncUser">同步住户</el-dropdown-item>
-              <el-dropdown-item divided @click.native="syncDoorDevice(scope.row)" v-if="permission.residential_syncDoorDevice">同步门禁设备</el-dropdown-item>
+              <!--              <el-dropdown-item divided @click.native="syncBuilding(scope.row)" v-if="permission.residential_syncBuilding">同步楼栋</el-dropdown-item>-->
+              <!--              <el-dropdown-item divided @click.native="syncUnit(scope.row)" v-if="permission.residential_syncUnit">同步单元</el-dropdown-item>-->
+              <!--              <el-dropdown-item divided @click.native="syncFloor(scope.row)" v-if="permission.residential_syncFloor">同步楼层</el-dropdown-item>-->
+              <!--              <el-dropdown-item divided @click.native="syncRoom(scope.row)" v-if="permission.residential_syncRoom">同步房间</el-dropdown-item>-->
+              <!--              <el-dropdown-item divided @click.native="syncUser(scope.row)" v-if="permission.residential_syncUser">同步住户</el-dropdown-item>-->
+              <!--              <el-dropdown-item divided @click.native="syncDoorDevice(scope.row)" v-if="permission.residential_syncDoorDevice">同步门禁设备</el-dropdown-item>-->
             </el-dropdown-menu>
           </el-dropdown>
         </el-button>
@@ -66,11 +66,11 @@
 
       <template slot="mapSelectForm" slot-scope="scope">
         <div>
-          <input class="el-input--small el-input__inner" placeholder="选择地址" @click="mapVisible2 = true">
-
+          <!--          <input class="el-input&#45;&#45;small el-input__inner" placeholder="选择地址" @click="mapVisible2 = true">-->
+          <el-button @click="mapVisible2 = true">选择地址</el-button>
           <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="mapVisible2"
-          title="编辑地址" width="80%">
-             <editPolygonMap v-if="mapVisible2" :editForm.sync="scope.row" :visible.sync="mapVisible2"></editPolygonMap>
+                     title="编辑地址" width="80%">
+            <editPolygonMap v-if="mapVisible2" :editForm.sync="scope.row" :visible.sync="mapVisible2"></editPolygonMap>
           </el-dialog>
         </div>
       </template>
@@ -80,385 +80,320 @@
 </template>
 
 <script>
-  import {
-    getList,
-    updateNumber,
-    add,
-    update,
-    remove,
-    updateResidential,
-    syncHouseInfoAndUser,
-    syncBuilding,
-    syncUnit,
-    syncFloor,
-    syncRoom,
-    syncUser,
-    syncDoorDevice
-  } from "@/api/community/residential";
-  import {
-    mapGetters
-  } from "vuex";
+import {
+  getList,
+  updateNumber,
+  add,
+  update,
+  remove,
+  updateResidential,
+  syncHouseInfoAndUser,
+  syncBuilding,
+  syncUnit,
+  syncFloor,
+  syncRoom,
+  syncUser,
+  syncDoorDevice
+} from "@/api/community/residential";
+import {
+  mapGetters
+} from "vuex";
 
-  import CyAreaSelect from "../../components/cy-area-select/cy-area-select";
+import CyAreaSelect from "../../components/cy-area-select/cy-area-select";
 
 
-  import residentialManage from "./residentialManage.vue";
-  import residentialDetail from "../../components/residential/residentialDetail.vue";
-  import CyExcelImport from "../../components/excel/cy-excel-import.vue"
-  import editPolygonMap from "../../components/residential/editPolygonMap.vue";
-  export default {
-    components: {
-      CyAreaSelect,
-      residentialManage,
-      residentialDetail,
-      CyExcelImport,
-      editPolygonMap
-    },
-    data() {
-      return {
-        mapVisible2:false,
-        mapVisible:false,
-        selectedResidentialId: "",
-        selectedResidentialName: "",
-        manageVisible: false,
-        form: {},
-        detailForm: {},
-        detailVisible: false,
-        editForm: {},
-        editVisible: false,
-        regionDic: [],
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
+import residentialManage from "./residentialManage.vue";
+import residentialDetail from "../../components/residential/residentialDetail.vue";
+import CyExcelImport from "../../components/excel/cy-excel-import.vue"
+import editPolygonMap from "../../components/residential/editPolygonMap.vue";
+export default {
+  components: {
+    CyAreaSelect,
+    residentialManage,
+    residentialDetail,
+    CyExcelImport,
+    editPolygonMap
+  },
+  data() {
+    return {
+      mapVisible2:false,
+      mapVisible:false,
+      selectedResidentialId: "",
+      selectedResidentialName: "",
+      manageVisible: false,
+      form: {},
+      detailForm: {},
+      detailVisible: false,
+      editForm: {},
+      editVisible: false,
+      regionDic: [],
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height: 'auto',
+        calcHeight: 60,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        addBtn: true,
+        editBtn: false,
+        delBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        menuWidth: 250,
+        column: [{
+          label: "名称",
+          overHidden: true,
+          width: 150,
+          prop: "name",
+          // row: true,
+          search: true,
+          rules: [{
+            required: true,
+            message: "请输入名称",
+            trigger: "blur"
+          }]
         },
-        selectionList: [],
-        option: {
-          height: 'auto',
-          calcHeight: 60,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: false,
-          addBtn: true,
-          editBtn: false,
-          delBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          menuWidth: 200,
-          column: [{
-              label: "名称",
-              overHidden: true,
-              width: 150,
-              prop: "name",
-              // row: true,
-              search: true,
-              rules: [{
-                required: true,
-                message: "请输入名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label:'',
-              prop:'mapSelect',
-              // row: true,
-              // span: 20,
-              formslot: true,
-              hide: true,
-            },
-            {
-              label: "经度",
-              prop: "longitude",
-              width: 120,
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入经度",
-                trigger: "blur"
-              }]
+          {
+            label:'',
+            prop:'mapSelect',
+            // row: true,
+            // span: 20,
+            formslot: true,
+            hide: true,
+          },
+          {
+            label: "经度",
+            prop: "longitude",
+            width: 120,
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入经度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "纬度",
+            prop: "latitude",
+            width: 120,
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入纬度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属社区",
+            prop: "agencyId",
+            // slot: true,
+            search: true,
+            width: 150,
+            overHidden: true,
+            type: "select",
+            remote: true,
+            refresh:true,
+            searchFilterable:true,
+            filterable:true,
+            dicUrl: "/api/cyzh-community/agency/list?size=500&name={{key}}",
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "纬度",
-              prop: "latitude",
-              width: 120,
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入纬度",
-                trigger: "blur"
-              }]
+            dicFormatter:(res)=>{
+              return res.data.records;
             },
-            {
-              label: "所属社区",
-              prop: "agencyId",
-              // slot: true,
-              search: true,
-              width: 150,
-              overHidden: true,
-              type: "select",
-              // remote: true,
-              searchFilterable:true,
-              filterable:true,
-              dicUrl: "/api/cyzh-community/agency/list?size=9999&name={{key}}",
-              props: {
-                label: "name",
-                value: "id"
-              },
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属机构名称",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入所属社区名称",
+              trigger: "blur"
+            }]
 
-            },
+          },
 
-            {
-              label: "详细地址",
-              prop: "address",
-              overHidden: true,
-            },
-            {
-              label: "楼栋数量",
-              prop: "buildingCount",
-              width: 100,
-              display: false,
-            },
-            {
-              label: "单元数量",
-              prop: "unitCount",
-              width: 100,
-              display: false,
-            },
-            {
-              label: "楼层数量",
-              prop: "floorCount",
-              width: 100,
-              display: false,
-            },
-            {
-              label: "房间数量",
-              prop: "roomCount",
-              width: 100,
-              display: false,
-            },
-            {
-              label: "住户数量",
-              prop: "userCount",
-              width: 100,
-              display: false,
-              hide: true,
-            },
-            {
-              label: "已录入人脸住户数",
-              prop: "userFaceCount",
-              hide: true,
-              width: 120,
-              display: false,
-            },
-            {
-              label: "所属物业",
-              labelWidth: 110,
-              type:"select",
-              prop: "estateId",
-              dicUrl: "/api/cyzh-estate/company/list?current=1&size=500",
-              props: {
-                label: "name",
-                value: "id"
-              },
-              hide: true,
-              dicFormatter:(res)=>{
-                return res.data.records
-              },
-              rules: [{
-                required: false,
-                message: "请选择所属物业",
-                trigger: "blur"
-              }, {
-                // validator: validatePhone,
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "物业名称",
-              prop: "estateName",
-              labelWidth: 110,
-              display: false,
-              hide:true,
-              rules: [{
-                required: true,
-                message: "请输入物业名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "物业电话",
-              display: false,
-              hide:true,
-              prop: "estatePhone",
-              labelWidth: 110,
-              rules: [{
-                required: true,
-                message: "请输入物业电话",
-                trigger: "blur"
-              }, {
-                // validator: validatePhone,
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "负责人姓名",
-              prop: "personName",
-              labelWidth: 110,
-              rules: [{
-                required: true,
-                message: "请输入负责人姓名",
-                trigger: "blur"
-              }, {
-                // validator: validatePhone,
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "负责人电话",
-              prop: "personPhone",
-              labelWidth: 110,
-              rules: [{
-                required: true,
-                message: "请输入负责人电话",
-                trigger: "blur"
-              }, {
-                // validator: validatePhone,
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "图片",
-              prop: "pic",
-              type: 'upload',
-              hide: true,
-              propsHttp: {
-                res: "data",
-                url: 'link'
-              },
-              listType: 'picture-img',
-              span: 24,
-              row: true,
-              action: "/api/blade-resource/oss/endpoint/putfile",
-              display: true,
-              rules: [{
-                required: false,
-                message: "请输入封面图片",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "备注",
-              hide: true,
-              prop: "remark",
-              type: "textarea"
+          {
+            label: "详细地址",
+            prop: "address",
+            overHidden: true,
+          },
+          {
+            label: "楼栋数量",
+            prop: "buildingCount",
+            width: 100,
+            display: false,
+          },
+          {
+            label: "单元数量",
+            prop: "unitCount",
+            width: 100,
+            display: false,
+          },
+          {
+            label: "楼层数量",
+            prop: "floorCount",
+            width: 100,
+            display: false,
+          },
+          {
+            label: "房间数量",
+            prop: "roomCount",
+            width: 100,
+            display: false,
+          },
+          {
+            label: "住户数量",
+            prop: "userCount",
+            width: 100,
+            display: false,
+            hide: true,
+          },
+          {
+            label: "已录入人脸住户数",
+            prop: "userFaceCount",
+            hide: true,
+            width: 120,
+            display: false,
+          },
+          {
+            label: "所属物业",
+            labelWidth: 110,
+            hide:true,
+            display:false,
+            type:"select",
+            prop: "estateId",
+            dicUrl: "/api/cyzh-estate/company/list?current=1&size=50",
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "创建时间",
-              hide: true,
-              width: 85,
-              prop: "createTime",
-              type: "datetime",
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
-              display: false,
+            dicFormatter:(res)=>{
+              return res.data.records
             },
-            {
-              label: "旧平台id",
-              prop: "oldId",
-              hide: true,
-              display: false
-            }
-          ]
-        },
-        menuData: {
-          list: [],
-          form: {
-            parentId: 0
-          },
-          option: {
-            column: [{
-              label: "父级编码",
-              prop: "parentId",
-              value: 0,
-              disabled: true,
-              span: 24
-            }, {
-              label: "权限名称",
-              prop: "name",
-              span: 24,
-              rules: [{
-                required: true,
-                message: "请输入权限名称",
-                trigger: "blur"
-              }]
-            }, {
-              label: "权限标识",
-              prop: "code",
-              span: 24,
-              rules: [{
-                required: true,
-                message: "请输入权限标识",
-                trigger: "blur"
-              }]
-            }, {
-              label: "类型",
-              prop: "state",
-              span: 24,
-              type: "radio",
-              dicData: [{
-                label: '系统',
-                value: 0
-              }, {
-                label: '菜单',
-                value: 1
-              }, {
-                label: '按钮',
-                value: 2
-              }],
-              rules: [{
-                required: true,
-                message: "请输入类型",
-                trigger: "blur"
-              }]
-            }, {
-              label: "组件地址",
-              prop: "component",
-              span: 24
+            rules: [{
+              required: false,
+              message: "请选择所属物业",
+              trigger: "blur"
             }, {
-              label: "图标",
-              prop: "icon",
-              span: 24
+              // validator: validatePhone,
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "物业名称",
+            prop: "estateName",
+            labelWidth: 110,
+            display: false,
+            hide:true,
+            rules: [{
+              required: true,
+              message: "请输入物业名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "物业电话",
+            display: false,
+            hide:true,
+            prop: "estatePhone",
+            labelWidth: 110,
+            rules: [{
+              required: true,
+              message: "请输入物业电话",
+              trigger: "blur"
             }, {
-              label: "请求地址",
-              prop: "path",
-              span: 24
+              // validator: validatePhone,
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人姓名",
+            prop: "personName",
+            labelWidth: 110,
+            rules: [{
+              required: true,
+              message: "请输入负责人姓名",
+              trigger: "blur"
             }, {
-              label: "权限描述",
-              prop: "des",
-              span: 24
+              // validator: validatePhone,
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人电话",
+            prop: "personPhone",
+            labelWidth: 110,
+            rules: [{
+              required: true,
+              message: "请输入负责人电话",
+              trigger: "blur"
             }, {
-              label: "排序",
-              prop: "order",
-              span: 24
+              // validator: validatePhone,
+              trigger: "blur"
             }]
+          },
+          {
+            label: "图片",
+            prop: "pic",
+            type: 'upload',
+            hide: true,
+            propsHttp: {
+              res: "data",
+              url: 'link'
+            },
+            listType: 'picture-img',
+            span: 24,
+            row: true,
+            action: "/api/blade-resource/oss/endpoint/put-file",
+            display: true,
+            rules: [{
+              required: false,
+              message: "请输入封面图片",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "备注",
+            hide: true,
+            prop: "remark",
+            type: "textarea"
+          },
+          {
+            label: "创建时间",
+            hide: true,
+            width: 85,
+            prop: "createTime",
+            type: "datetime",
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            display: false,
+          },
+          {
+            label: "旧平台id",
+            prop: "oldId",
+            hide: true,
+            display: false
           }
+        ]
+      },
+      menuData: {
+        list: [],
+        form: {
+          parentId: 0
         },
-        menuOption: {
+        option: {
           column: [{
             label: "父级编码",
             prop: "parentId",
+            value: 0,
             disabled: true,
             span: 24
           }, {
@@ -507,8 +442,6 @@
             label: "图标",
             prop: "icon",
             span: 24
-
-
           }, {
             label: "请求地址",
             prop: "path",
@@ -522,327 +455,397 @@
             prop: "order",
             span: 24
           }]
-        },
-        data: [],
-      };
-    },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.residential_add, false),
-          viewBtn: this.vaildData(this.permission.residential_view, false),
-          delBtn: this.vaildData(this.permission.residential_delete, false),
-          editBtn: this.vaildData(this.permission.residential_edit, false)
-        };
+        }
       },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
-        });
-        return ids.join(",");
+      menuOption: {
+        column: [{
+          label: "父级编码",
+          prop: "parentId",
+          disabled: true,
+          span: 24
+        }, {
+          label: "权限名称",
+          prop: "name",
+          span: 24,
+          rules: [{
+            required: true,
+            message: "请输入权限名称",
+            trigger: "blur"
+          }]
+        }, {
+          label: "权限标识",
+          prop: "code",
+          span: 24,
+          rules: [{
+            required: true,
+            message: "请输入权限标识",
+            trigger: "blur"
+          }]
+        }, {
+          label: "类型",
+          prop: "state",
+          span: 24,
+          type: "radio",
+          dicData: [{
+            label: '系统',
+            value: 0
+          }, {
+            label: '菜单',
+            value: 1
+          }, {
+            label: '按钮',
+            value: 2
+          }],
+          rules: [{
+            required: true,
+            message: "请输入类型",
+            trigger: "blur"
+          }]
+        }, {
+          label: "组件地址",
+          prop: "component",
+          span: 24
+        }, {
+          label: "图标",
+          prop: "icon",
+          span: 24
+
+
+        }, {
+          label: "请求地址",
+          prop: "path",
+          span: 24
+        }, {
+          label: "权限描述",
+          prop: "des",
+          span: 24
+        }, {
+          label: "排序",
+          prop: "order",
+          span: 24
+        }]
       },
-      oldIds() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.oldId);
-        });
-        return ids.join(",");
-      }
+      data: [],
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.residential_add, false),
+        viewBtn: this.vaildData(this.permission.residential_view, false),
+        delBtn: this.vaildData(this.permission.residential_delete, false),
+        editBtn: this.vaildData(this.permission.residential_edit, false)
+      };
     },
-    mounted() {
-
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
     },
-    watch: {
-      'form.mapSelect': {
-        handler: function(value) {
-          if (!value){
-            return
-          }else{
-            this.form.longitude = this.form.mapSelect.longitude;
-            this.form.latitude = this.form.mapSelect.latitude;
-            this.form.address = this.form.mapSelect.formattedAddress;
-          }
-        },
-        immediate: false
-      },
-      'editForm.mapSelect': {
-        handler: function(value) {
-          if (!value){
-            return
-          }else{
-            this.editForm.longitude = this.editForm.mapSelect.longitude;
-            this.editForm.latitude = this.editForm.mapSelect.latitude;
-            // this.editForm.address = this.editForm.mapSelect.formattedAddress;
-          }
-        },
-        immediate: false
+    oldIds() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.oldId);
+      });
+      return ids.join(",");
+    }
+  },
+  mounted() {
+
+  },
+  watch: {
+    'form.mapSelect': {
+      handler: function(value) {
+        if (!value){
+          return
+        }else{
+          this.form.longitude = this.form.mapSelect.longitude;
+          this.form.latitude = this.form.mapSelect.latitude;
+          this.form.address = this.form.mapSelect.formattedAddress;
+        }
       },
+      immediate: false
     },
-    methods: {
-      syncHouseInfoAndUser(){
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
+    'editForm.mapSelect': {
+      handler: function(value) {
+        if (!value){
+          return
+        }else{
+          this.editForm.longitude = this.editForm.mapSelect.longitude;
+          this.editForm.latitude = this.editForm.mapSelect.latitude;
+          // this.editForm.address = this.editForm.mapSelect.formattedAddress;
         }
-        syncHouseInfoAndUser(this.oldIds).then(() => {
-          this.onLoad(this.page)
-        });
       },
-       refreshNumber(){
-        updateNumber(this.ids).then(() => {
-          this.onLoad(this.page)
-        });
-      },
-      syncUser(row){
-        syncUser(row.oldId).then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-        }, error => {
-          window.console.log(error);
+      immediate: false
+    },
+  },
+  methods: {
+    handleSubmit(){
+      this.$message.success(JSON.stringify(this.form));
+      console.log(this.form,"rrr");
+    },
+    syncHouseInfoAndUser(){
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      syncHouseInfoAndUser(this.oldIds).then(() => {
+        this.onLoad(this.page)
+      });
+    },
+    refreshNumber(){
+      updateNumber(this.ids).then(() => {
+        this.onLoad(this.page)
+      });
+    },
+    syncUser(row){
+      syncUser(row.oldId).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      syncBuilding(row){
-        syncBuilding(row.oldId).then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-        }, error => {
-          window.console.log(error);
+      }, error => {
+        window.console.log(error);
+      });
+    },
+    syncBuilding(row){
+      syncBuilding(row.oldId).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      syncUnit(row){
-        syncUnit(row.oldId).then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-        }, error => {
-          window.console.log(error);
+      }, error => {
+        window.console.log(error);
+      });
+    },
+    syncUnit(row){
+      syncUnit(row.oldId).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      syncFloor(row){
-        syncFloor(row.oldId).then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-        }, error => {
-          window.console.log(error);
+      }, error => {
+        window.console.log(error);
+      });
+    },
+    syncFloor(row){
+      syncFloor(row.oldId).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      syncRoom(row){
+      }, error => {
+        window.console.log(error);
+      });
+    },
+    syncRoom(row){
 
-        syncRoom(row.oldId).then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
+      syncRoom(row.oldId).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
 
-      syncDoorDevice(row){
-syncDoorDevice(row.oldId).then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
+    syncDoorDevice(row){
+      syncDoorDevice(row.oldId).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      closeManage() {
-        this.manageVisible = false;
-      },
-      manage(row) {
-        this.selectedResidentialId = row.id;
-        this.selectedResidentialName = row.name;
-        console.log("id:" + this.selectedResidentialId + "  name" + this.selectedResidentialName)
-        this.manageVisible = true;
-        this.$nextTick(() => {
-          this.$refs.resMang.init();
-        })
-      },
-      edit(row) {
-        this.editForm = row;
-        this.editVisible = true;
-      },
-      detail(row) {
-        this.detailForm = row;
-        this.detailVisible = true;
-        this.$nextTick(()=>{
-          this.$refs.residentialDetail.init()
-        })
-      },
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    closeManage() {
+      this.manageVisible = false;
+    },
+    manage(row) {
+      this.selectedResidentialId = row.id;
+      this.selectedResidentialName = row.name;
+      console.log("id:" + this.selectedResidentialId + "  name" + this.selectedResidentialName)
+      this.manageVisible = true;
+      this.$nextTick(() => {
+        this.$refs.resMang.init();
+      })
+    },
+    edit(row) {
+      this.editForm = row;
+      this.editVisible = true;
+    },
+    detail(row) {
+      this.detailForm = row;
+      this.detailVisible = true;
+      this.$nextTick(()=>{
+        this.$refs.residentialDetail.init()
+      })
+    },
 
-      rowSave(row, done, loading) {
-        add(row).then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      submitResidential(row,done, loading) {
-        update(this.editForm).then(() => {
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    submitResidential(row,done, loading) {
+      update(this.editForm).then(() => {
+        this.onLoad(this.page);
+        this.editVisible = false;
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      row.isUpdateOrg = false;
+      updateResidential(row).then(() => {
+        // update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      if (row.unitNumber > 0) {
+        this.$message.error("请先删除其下单元和其他数据")
+        return
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
-          this.editVisible = false;
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        row.isUpdateOrg = false;
-        updateResidential(row).then(() => {
-          // update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        if (row.unitNumber > 0) {
-          this.$message.error("请先删除其下单元和其他数据")
-          return
-        }
-        this.$confirm("确定将选择数据删除?", {
-            confirmButtonText: "确定",
-            cancelButtonText: "取消",
-            type: "warning"
-          })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-            confirmButtonText: "确定",
-            cancelButtonText: "取消",
-            type: "warning"
-          })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        let _this = this;
-        if (["edit", "view"].includes(type)) {
-          // getResidentialDetail(this.form.id).then(res => {
-          //   _this.form = res.data.data;
-          //   let region = [];
-          //   region.push(_this.form.regionProvince);
-          //   region.push(_this.form.regionCity);
-          //   region.push(_this.form.regionArea);
-          //
-          //   _this.form.region = region;
-          // });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage) {
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize) {
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
-        });
-        // getResidentialList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-        //   const data = res.data.data;
-        //   this.page.total = Number.parseInt(data.total);
-        //   this.data = data.records;
-        //   this.loading = false;
-        //   this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      let _this = this;
+      if (["edit", "view"].includes(type)) {
+        // getResidentialDetail(this.form.id).then(res => {
+        //   _this.form = res.data.data;
+        //   let region = [];
+        //   region.push(_this.form.regionProvince);
+        //   region.push(_this.form.regionCity);
+        //   region.push(_this.form.regionArea);
+        //
+        //   _this.form.region = region;
         // });
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
+      // getResidentialList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+      //   const data = res.data.data;
+      //   this.page.total = Number.parseInt(data.total);
+      //   this.data = data.records;
+      //   this.loading = false;
+      //   this.selectionClear();
+      // });
 
 
-      },
+    },
 
-    }
-  };
+  }
+};
 </script>
 
 <style scoped>
-  >>>.el-cascader-menu__wrap {
-    height: 300px !important;
-  }
 </style>

src/views/community/residentialManage.vue

@@ -8,20 +8,20 @@
         <el-tree :props="treeOption" :data="treeData" :expand-on-click-node="false" @node-click="nodeClick" default-expand-all>
            <span class="custom-tree-node" slot-scope="{ node, data }">
             <span>{{ node.label }}</span>
-            <!--<el-popover
-              placement="right"
-              width="200"
-              trigger="hover"
-            >
-              <span slot="reference">
-                <i class="el-icon-arrow-down"></i>
-              </span>
-              <div style="display: grid">
-                <el-link :underline="false" type="primary">添加下一级</el-link>
-                <el-link :underline="false" type="primary">修改</el-link>
-                <el-link :underline="false" type="danger">删除</el-link>
-              </div>
-            </el-popover>-->
+             <!--<el-popover
+               placement="right"
+               width="200"
+               trigger="hover"
+             >
+               <span slot="reference">
+                 <i class="el-icon-arrow-down"></i>
+               </span>
+               <div style="display: grid">
+                 <el-link :underline="false" type="primary">添加下一级</el-link>
+                 <el-link :underline="false" type="primary">修改</el-link>
+                 <el-link :underline="false" type="danger">删除</el-link>
+               </div>
+             </el-popover>-->
           </span>
         </el-tree>
       </el-aside>
@@ -192,1238 +192,1241 @@
 </template>
 
 <script>
-  import { getList as getBuildingListByResidentialOldId,add as buildingAdd,getDetail as buildingGetDetail,update as buildingUpdate,remove as buildingRemove } from '../../api/community/building.js';
-  import { getList as getUnitListByBuildingOldId } from "../../api/community/unit.js";
-  import { getList as getFloorListByUnitOldId } from "../../api/community/floor.js";
-  import { getList as getRoomListByFloorOldId } from "../../api/community/room.js";
-  import { mapGetters } from 'vuex';
-  import Log from '../../api/tool/MyLog.js';
-  import ArrUtil from '../../api/tool/ArrUtil.js';
+import { getList as getBuildingListByResidentialOldId,add as buildingAdd,getDetail as buildingGetDetail,update as buildingUpdate,remove as buildingRemove } from '../../api/community/building.js';
+import { getList as getUnitListByBuildingOldId } from "../../api/community/unit.js";
+import { getList as getFloorListByUnitOldId } from "../../api/community/floor.js";
+import { getList as getRoomListByFloorOldId } from "../../api/community/room.js";
+import { mapGetters } from 'vuex';
+import Log from '../../api/tool/MyLog.js';
+import ArrUtil from '../../api/tool/ArrUtil.js';
 
-  import {batchAddSubmit} from "@/api/community/building";
+import {batchAddSubmit} from "@/api/community/building";
 
-  export default {
-    props:{
-      residentialId: "",
-      residentialName: "",
-      visible: false
-    },
-    data() {
-      return {
-        permissionDataList: [],
-        loading: false,
-        batchVisible: false,
-        batchIcon: 'el-icon-circle-plus-outline',
-        batchDisabled: false,
-        batchText: '提交',
-        typeParent: 'parent',
-        typeBuilding: 'building',
-        typeUnit: 'unit',
-        typeFloor: 'floor',
-        typeRoom: 'room',
-        form: {},
-        batchForm: {},
-        batchRules: {
-          buildingBegin: [
-            { required: true, message: '请输入楼栋区间', trigger: 'blur' },
-          ],
-          buildingEnd: [
-            { required: true, message: '请输入楼栋区间', trigger: 'blur' },
-          ],
-          unitBegin: [
-            { required: true, message: '请输入单元区间', trigger: 'blur' },
-          ],
-          unitEnd: [
-            { required: true, message: '请输入单元区间', trigger: 'blur' },
-          ],
-          floorBegin: [
-            { required: true, message: '请输入楼层区间', trigger: 'blur' },
-          ],
-          floorEnd: [
-            { required: true, message: '请输入楼层区间', trigger: 'blur' },
-          ],
-          roomBegin: [
-            { required: true, message: '请输入房屋区间', trigger: 'blur' },
-          ],
-          roomEnd: [
-            { required: true, message: '请输入房屋区间', trigger: 'blur' },
-          ],
-        },
-        treeData: [],
-        treeOption:{
-          label:"name",
-          value: "id",
-          children: "children"
-        },
+export default {
+  props:{
+    residentialId: "",
+    residentialName: "",
+    visible: false
+  },
+  data() {
+    return {
+      permissionDataList: [],
+      loading: false,
+      batchVisible: false,
+      batchIcon: 'el-icon-circle-plus-outline',
+      batchDisabled: false,
+      batchText: '提交',
+      typeParent: 'parent',
+      typeBuilding: 'building',
+      typeUnit: 'unit',
+      typeFloor: 'floor',
+      typeRoom: 'room',
+      form: {},
+      batchForm: {},
+      batchRules: {
+        buildingBegin: [
+          { required: true, message: '请输入楼栋区间', trigger: 'blur' },
+        ],
+        buildingEnd: [
+          { required: true, message: '请输入楼栋区间', trigger: 'blur' },
+        ],
+        unitBegin: [
+          { required: true, message: '请输入单元区间', trigger: 'blur' },
+        ],
+        unitEnd: [
+          { required: true, message: '请输入单元区间', trigger: 'blur' },
+        ],
+        floorBegin: [
+          { required: true, message: '请输入楼层区间', trigger: 'blur' },
+        ],
+        floorEnd: [
+          { required: true, message: '请输入楼层区间', trigger: 'blur' },
+        ],
+        roomBegin: [
+          { required: true, message: '请输入房屋区间', trigger: 'blur' },
+        ],
+        roomEnd: [
+          { required: true, message: '请输入房屋区间', trigger: 'blur' },
+        ],
+      },
+      treeData: [],
+      treeOption:{
+        label:"name",
+        value: "id",
+        children: "children"
+      },
 
 
-        // treeOption: {
-        //   nodeKey: 'id',
-        //   addBtn: false,
-        //   menu: false,
-        //   props: {
-        //     label: 'name',
-        //     value: 'id',
-        //     children: 'children'
-        //   }
-        // },
-        optionBuilding: {
-          labelWidth: 100,
-          tip: false,
-          viewBtn: true,
-          selection: false,
-          border: true,
-          addBtn: false,
-          column: [
-            {
-              label: '楼栋名称',
-              prop: 'name',
-              rules: [
-                {
-                  required: true,
-                  message: '请输入楼房名称',
-                  trigger: 'blur'
-                }
-              ]
-            },
-            {
+      // treeOption: {
+      //   nodeKey: 'id',
+      //   addBtn: false,
+      //   menu: false,
+      //   props: {
+      //     label: 'name',
+      //     value: 'id',
+      //     children: 'children'
+      //   }
+      // },
+      optionBuilding: {
+        labelWidth: 100,
+        tip: false,
+        viewBtn: true,
+        selection: false,
+        border: true,
+        addBtn: false,
+        menuWidth:350,
+        column: [
+          {
+            label: '楼栋名称',
+            prop: 'name',
+            rules: [
+              {
+                required: true,
+                message: '请输入楼房名称',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
 
-              prop: 'residentialId',
-              display: false,
-              hide: true,
-              rules: [
-                {
-                  required: true,
-                  message: '请输入楼房名称',
-                  trigger: 'blur'
-                }
-              ]
-            },
-            {
-              label: "图片",
-              prop: "pic",
-              type: 'upload',
-              hide: true,
-              propsHttp: {
-                url: 'data'
-              },
-              listType: 'picture-img',
-              span: 24,
-              row: true,
-              action: "/api/upload/putfile",
-              display: true,
-              rules: [{
-                required: false,
-                message: "请输入封面图片",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: '单元总数',
-              prop: 'unitCount',
-              display: false,
-              rules: [
-                {
-                  required: false,
-                  message: '请输入楼房编号',
-                  trigger: 'blur'
-                }
-              ]
-            },
-            {
-              label: '楼层总数',
-              prop: 'floorCount',
-              display: false,
-              rules: [
-                {
-                  required: true,
-                  message: '请输入楼房层数',
-                  trigger: 'blur'
-                }
-              ]
-            },
-            {
-              label: '房间总数',
-              prop: 'roomCount',
-              display: false,
-              rules: [
-                {
-                  required: true,
-                  message: '请输入房间数量',
-                  trigger: 'blur'
-                }
-              ]
-            },
-            {
-              label: '住户总数',
-              prop: 'userCount',
-              hide: true,
-              display: false,
-              rules: [
-                {
-                  required: false,
-                  message: '请输入楼房地址',
-                  trigger: 'blur'
-                }
-              ]
-            },
-            {
-              prop: 'type',
-              value: 'building',
-              disabled: true,
-              hide: true,
-              display: false
-            }
-          ]
-        },
-        optionUnit: {
-          labelWidth: 100,
-          tip: false,
-          // addBtn: true,
-          viewBtn: true,
-          selection: false,
-          border: true,
-          column: [
-            {
-              label: "所属社区",
-              prop: "agencyId",
-              hide: true,
-              display: false,
-              rules: [{
+            prop: 'residentialId',
+            display: false,
+            hide: true,
+            rules: [
+              {
                 required: true,
-                message: "请选择所属社区",
-                trigger: "blur"
-              }]
+                message: '请输入楼房名称',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: "图片",
+            prop: "pic",
+            type: 'upload',
+            hide: true,
+            propsHttp: {
+              url: 'data'
             },
-            {
-              label: "所属小区",
-              prop: "residentialId",
-              hide: true,
-              display: false,
-              rules: [{
+            listType: 'picture-img',
+            span: 24,
+            row: true,
+            action: "/api/blade-resource/oss/endpoint/put-file",
+            display: true,
+            rules: [{
+              required: false,
+              message: "请输入封面图片",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: '单元总数',
+            prop: 'unitCount',
+            display: false,
+            rules: [
+              {
+                required: false,
+                message: '请输入楼房编号',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '楼层总数',
+            prop: 'floorCount',
+            display: false,
+            rules: [
+              {
                 required: true,
-                message: "请选择所属小区",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属楼栋",
-              prop: "buildingId",
-              hide: true,
-              display: false,
-              rules: [{
+                message: '请输入楼房层数',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '房间总数',
+            prop: 'roomCount',
+            display: false,
+            rules: [
+              {
                 required: true,
-                message: "请选择所属小区",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: '单元名称',
-              prop: 'name',
-              maxlength: 10,
-              showWordLimit: true,
-              rules: [
-                {
-                  required: true,
-                  message: '请输入楼层名称',
-                  trigger: 'blur'
-                }
-              ]
-            },
-            {
-              label: "图片",
-              prop: "pic",
-              type: 'upload',
-              hide: true,
-              propsHttp: {
-                url: 'data'
-              },
-              listType: 'picture-img',
-              span: 24,
-              row: true,
-
-              action: "/api/upload/putfile",
-              display: true,
-              rules: [{
+                message: '请输入房间数量',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '住户总数',
+            prop: 'userCount',
+            hide: true,
+            display: false,
+            rules: [
+              {
                 required: false,
-                message: "请输入封面图片",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "负责人姓名",
-              prop: "personName",
-              labelWidth: 110,
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入负责人姓名",
-                trigger: "blur"
-              }]
-            }, {
-              label: "负责人电话",
-              prop: "personTel",
-              labelWidth: 110,
-              hide: true,
-              rules: [{
+                message: '请输入楼房地址',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            prop: 'type',
+            value: 'building',
+            disabled: true,
+            hide: true,
+            display: false
+          }
+        ]
+      },
+      optionUnit: {
+        labelWidth: 100,
+        tip: false,
+        // addBtn: true,
+        viewBtn: true,
+        selection: false,
+        border: true,
+        menuWidth:350,
+        column: [
+          {
+            label: "所属社区",
+            prop: "agencyId",
+            hide: true,
+            display: false,
+            // type:"select",
+            // dicUrl:'',
+            rules: [{
+              required: true,
+              message: "请选择所属社区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属小区",
+            prop: "residentialId",
+            hide: true,
+            display: false,
+            rules: [{
+              required: true,
+              message: "请选择所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼栋",
+            prop: "buildingId",
+            hide: true,
+            display: false,
+            rules: [{
+              required: true,
+              message: "请选择所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: '单元名称',
+            prop: 'name',
+            maxlength: 10,
+            showWordLimit: true,
+            rules: [
+              {
                 required: true,
-                message: "请输入负责人电话",
-                trigger: "blur"
-              }]
-            }, {
-              label: "建筑年代",
-              prop: "builtYear",
-              hide: true,
-            }, {
-              label: "产权性质",
-              prop: "propertyNature",
-              hide: true,
-            },
-            // {
-            //   label: "有无电梯",
-            //   prop: "includingElevator",
-            //   hide: true,
-            //   type: "select",
-            //   search: true,
-            //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=including_elevator",
-            //   props: {
-            //     label: "dictValue",
-            //     value: "dictKey"
-            //   },
-            // },
-            {
-              label: "楼层数量",
-              prop: "floorCount",
-              display: false
-            },
-            {
-              label: "房间数量",
-              prop: "roomCount",
-              display: false
-            },
-            {
-              label: "住户数量",
-              prop: "userNumber",
-              display: false,
-              hide: true,
-            },
-            {
-              prop: 'type',
-              value: 'unit',
-              disabled: true,
-              hide: true,
-              display: false,
-            }
-          ]
-        },
-        optionFloor: {
-          labelWidth: 100,
-          tip: false,
-          viewBtn: true,
-          selection: false,
-          border: true,
-          column: [
-            {
-              label: '所属单元',
-              prop: 'unitId',
-              type: 'select',
-              dicData: [],
-              disabled: true,
-              hide: true,
-              props: {
-                label: 'name',
-                value: 'id'
-              },
-              rules: [
-                {
-                  required: true,
-                  message: '请选择所属楼房',
-                  trigger: 'blur'
-                }
-              ]
+                message: '请输入楼层名称',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: "图片",
+            prop: "pic",
+            type: 'upload',
+            hide: true,
+            propsHttp: {
+              url: 'data'
             },
-            {
-              label: "所属小区",
-              prop: "residentialId",
-              hide: true,
-              // slot: true,
-              cascaderItem: ['buildingId'],
-              type: "select",
-              dicUrl: "/api/cyzh-community/residential/list?size=900000",
-              filterable: true,
-              props: {
-                label: "name",
-                value: "id"
-              },
-              dicFormatter: (res) => {
-                return res.data.records;
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属小区",
-                trigger: "blur"
-              }]
+            listType: 'picture-img',
+            span: 24,
+            row: true,
+
+            action: "/api/blade-resource/oss/endpoint/put-file",
+            display: true,
+            rules: [{
+              required: false,
+              message: "请输入封面图片",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人姓名",
+            prop: "personName",
+            labelWidth: 110,
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入负责人姓名",
+              trigger: "blur"
+            }]
+          }, {
+            label: "负责人电话",
+            prop: "personTel",
+            labelWidth: 110,
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入负责人电话",
+              trigger: "blur"
+            }]
+          }, {
+            label: "建筑年代",
+            prop: "builtYear",
+            hide: true,
+          }, {
+            label: "产权性质",
+            prop: "propertyNature",
+            hide: true,
+          },
+          // {
+          //   label: "有无电梯",
+          //   prop: "includingElevator",
+          //   hide: true,
+          //   type: "select",
+          //   search: true,
+          //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=including_elevator",
+          //   props: {
+          //     label: "dictValue",
+          //     value: "dictKey"
+          //   },
+          // },
+          {
+            label: "楼层数量",
+            prop: "floorCount",
+            display: false
+          },
+          {
+            label: "房间数量",
+            prop: "roomCount",
+            display: false
+          },
+          {
+            label: "住户数量",
+            prop: "userCount",
+            display: false,
+            hide: true,
+          },
+          {
+            prop: 'type',
+            value: 'unit',
+            disabled: true,
+            hide: true,
+            display: false,
+          }
+        ]
+      },
+      optionFloor: {
+        labelWidth: 100,
+        tip: false,
+        viewBtn: true,
+        selection: false,
+        border: true,
+        menuWidth:350,
+        column: [
+          {
+            label: '所属单元',
+            prop: 'unitId',
+            type: 'select',
+            dicData: [],
+            disabled: true,
+            hide: true,
+            props: {
+              label: 'name',
+              value: 'id'
             },
-            {
-              label: "所属楼栋",
-              prop: "buildingId",
-              // slot: true,
-              type: "select",
-              dicUrl: `/api/cyzh-community/building/list?size=500&residentialId={{key}}`,
-              filterable: true,
-              props: {
-                label: "name",
-                value: "id"
-              },
-              dicFormatter: (res) => {
-                return res.data.records;
-              },
-              rules: [{
+            rules: [
+              {
                 required: true,
-                message: "请选择所属小区",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: '楼层名称',
-              prop: 'name',
-              rules: [
-                {
-                  required: true,
-                  message: '请输入房间名称',
-                  trigger: 'blur'
-                }
-              ]
+                message: '请选择所属楼房',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: "所属小区",
+            prop: "residentialId",
+            hide: true,
+            // slot: true,
+            cascaderItem: ['buildingId'],
+            type: "select",
+            dicUrl: "/api/cyzh-community/residential/list?size=9000000",
+            filterable: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: '房间类型',
-              prop: 'roomTypeId',
-              type: 'select',
-              hide: true,
-              dicData: [],
-              props: {
-                label: 'name',
-                value: 'id'
-              },
-              rules: [
-                {
-                  required: true,
-                  message: '请输入房间类型',
-                  trigger: 'blur'
-                }
-              ]
+            dicFormatter: (res) => {
+              return res.data.records;
             },
-            {
-              label: "负责人姓名",
-              prop: "personName",
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入负责人姓名",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请选择所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼栋",
+            prop: "buildingId",
+            // slot: true,
+            type: "select",
+            dicUrl: `/api/cyzh-community/building/list?size=500&residentialId={{key}}`,
+            filterable: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "负责人电话",
-              prop: "personTel",
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入负责人电话",
-                trigger: "blur"
-              }]
+            dicFormatter: (res) => {
+              return res.data.records;
             },
-            {
-              label: "建筑年代",
-              prop: "builtYear",
-              hide: true,
-              rules: [{
+            rules: [{
+              required: true,
+              message: "请选择所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: '楼层名称',
+            prop: 'name',
+            rules: [
+              {
                 required: true,
-                message: "请输入建筑年代",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "产权性质",
-              prop: "propertyNature",
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入产权性质",
-                trigger: "blur"
-              }]
+                message: '请输入房间名称',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: '房间类型',
+            prop: 'roomTypeId',
+            type: 'select',
+            hide: true,
+            dicData: [],
+            props: {
+              label: 'name',
+              value: 'id'
             },
-            {
-              label: "有无电梯",
-              prop: "includingElevator",
-              hide: true,
-              rules: [{
+            rules: [
+              {
                 required: true,
-                message: "请输入有无电梯",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "房间数量",
-              prop: "roomCount",
+                message: '请输入房间类型',
+                trigger: 'blur'
+              }
+            ]
+          },
+          {
+            label: "负责人姓名",
+            prop: "personName",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入负责人姓名",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人电话",
+            prop: "personTel",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入负责人电话",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "建筑年代",
+            prop: "builtYear",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入建筑年代",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "产权性质",
+            prop: "propertyNature",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入产权性质",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "有无电梯",
+            prop: "includingElevator",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入有无电梯",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "房间数量",
+            prop: "roomCount",
 
-              rules: [{
-                required: true,
-                message: "请输入房间数量",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "住户数量",
-              prop: "userCount",
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入住户数量",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入房间数量",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "住户数量",
+            prop: "userCount",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入住户数量",
+              trigger: "blur"
+            }]
+          },
+          {
+            prop: 'type',
+            value: 'buildingRoom',
+            disabled: true,
+            hide: true,
+            display: false,
+          }
+        ]
+      },
+      optionRoom: {
+        labelWidth: 100,
+        tip: false,
+        viewBtn: true,
+        selection: false,
+        border: true,
+        menuWidth:350,
+        column: [
+          {
+            label: "门牌号 ",
+            prop: "name",
+            // search: true,
+            rules: [{
+              required: true,
+              message: "请输入门牌号-限制数字，单元楼下唯一  ",
+              trigger: "blur"
+            }]
+          },{
+            label: "所属社区",
+            prop: "agencyId",
+            slot: true,
+            hide: true,
+            type: "select",
+            searchFilterable: true,
+            dicUrl: "/api/cyzh-community/agency/list",
+            cascaderItem: ['residentialId','unitId'],
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              prop: 'type',
-              value: 'buildingRoom',
-              disabled: true,
-              hide: true,
-              display: false,
-            }
-          ]
-        },
-        optionRoom: {
-          labelWidth: 100,
-          tip: false,
-          viewBtn: true,
-          selection: false,
-          border: true,
-          column: [
-            {
-              label: "门牌号 ",
-              prop: "name",
-              // search: true,
-              rules: [{
-                required: true,
-                message: "请输入门牌号-限制数字，单元楼下唯一  ",
-                trigger: "blur"
-              }]
-            },{
-              label: "所属社区",
-              prop: "agencyId",
-              slot: true,
-              hide: true,
-              type: "select",
-              // search: true,
-              dicUrl: "/api/cyzh-community/agency/list",
-              cascaderItem: ['residentialId','unitId'],
-              props: {
-                label: "name",
-                value: "id"
-              },
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属社区",
-                trigger: "blur"
-              }]
-            },{
-              label: "所属小区",
-              prop: "residentialId",
-              // slot: true,
-              type: "select",
-              hide: true,
-              // search: true,
-              cascaderIndex:0,
-              // dicUrl: "/grid/estate/getResidentialList",
-              dicUrl: "/api/cyzh-community/residential/list?agencyId={{key}}",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              dicFlag: false,
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属小区名称",
-                trigger: "blur"
-              }]
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "所属楼栋",
-              prop: "buildingId",
-              // slot: true,
-              hide: true,
-              type: "select",
-              // search: true,
-              dicFlag: false,
-              cascaderIndex:1,
-              // dicUrl: "/grid/estate/getUnitList",
-              dicUrl: "/api/cyzh-community/unit/list?residentialId={{key}}",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属单元名称",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请选择所属社区",
+              trigger: "blur"
+            }]
+          },{
+            label: "所属小区",
+            prop: "residentialId",
+            // slot: true,
+            type: "select",
+            hide: true,
+            cascaderIndex:0,
+            searchFilterable:true,
+            // dicUrl: "/grid/estate/getResidentialList",
+            dicUrl: "/api/cyzh-community/residential/list?agencyId={{key}}",
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "所属单元",
-              prop: "unitId",
-              // slot: true,
-              type: "select",
-              // search: true,
-              dicFlag: false,
-              cascaderIndex:1,
-              // dicUrl: "/grid/estate/getUnitList",
-              dicUrl: "/api/cyzh-community/unit/list?residentialId={{key}}",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属单元名称",
-                trigger: "blur"
-              }]
+            dicFlag: false,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "所属楼层",
-              prop: "floorId",
-              // slot: true,
-              hide: true,
-              type: "select",
-              // search: true,
-              dicFlag: false,
-              cascaderIndex:1,
-              // dicUrl: "/grid/estate/getUnitList",
-              dicUrl: "/api/cyzh-community/unit/list?residentialId={{key}}",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属单元名称",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入所属小区名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼栋",
+            prop: "buildingId",
+            // slot: true,
+            hide: true,
+            type: "select",
+            dicFlag: false,
+            searchFilterable:true,
+            cascaderIndex:1,
+            dicUrl: "/api/cyzh-community/building/list?residentialId={{key}}",
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "房屋面积",
-              prop: "area",
-              hide: true,
-            },{
-              label: "入住用户数量",
-              prop: "userCount",
-              display: false,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "户型",
-              prop: "houseType",
-              hide: true,
-              type: "select",
-              // search: true,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=house_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
+            rules: [{
+              required: true,
+              message: "请输入所属单元名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属单元",
+            prop: "unitId",
+            // slot: true,
+            type: "select",
+            dicFlag: false,
+            cascaderIndex:1,
+            searchFilterable:true,
+            // dicUrl: "/api/cyzh-community/residential/list?residentialId={{key}}",
+            dicUrl: "/api/cyzh-community/residential/list?id={{key}}",
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "楼层",
-              prop: "floor",
-              hide: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "装饰",
-              prop: "ornament",
-              hide: true,
+            rules: [{
+              required: true,
+              message: "请输入所属单元名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼层",
+            prop: "floorId",
+            // slot: true,
+            hide: true,
+            type: "select",
+            dicFlag: false,
+            cascaderIndex:1,
+            dicUrl: "/api/cyzh-community/unit/list?residentialId={{key}}",
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "房屋朝向",
-              prop: "orientation",
-              hide: true,
-            },{
-              label: "序号",
-              prop: "serial",
-              value: 1,
-              hide: true,
-              display: false,
-            }, {
-              label: "备注",
-              prop: "remark",
-              hide: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "创建时间",
-              prop: "createTime",
-              hide: true,
-              type: "datetime",
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
-              display: false,
+            rules: [{
+              required: true,
+              message: "请输入所属单元名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "房屋面积",
+            prop: "area",
+            hide: true,
+          },{
+            label: "入住用户数量",
+            prop: "userCount",
+            display: false,
+          },
+          {
+            label: "户型",
+            prop: "houseType",
+            hide: true,
+            type: "select",
+            // search: true,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=house_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              prop: 'type',
-              valueDefault: 'bed',
-              disabled: true,
-              hide: true,
-              display: false,
-            }
-          ]
-        },
-        data: [],
-        option: {
-          tip: false,
-          viewBtn: true,
-          selection: false,
-          addBtn: false,
-          column: []
-        }
-      };
-    },
+          },
+          {
+            label: "楼层",
+            prop: "floor",
+            hide: true,
+          },
+          {
+            label: "装饰",
+            prop: "ornament",
+            hide: true,
+          },
+          {
+            label: "房屋朝向",
+            prop: "orientation",
+            hide: true,
+          },{
+            label: "序号",
+            prop: "serial",
+            value: 1,
+            hide: true,
+            display: false,
+          }, {
+            label: "备注",
+            prop: "remark",
+            hide: true,
+          },
+          {
+            label: "创建时间",
+            prop: "createTime",
+            hide: true,
+            type: "datetime",
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            display: false,
+          },
+          {
+            prop: 'type',
+            valueDefault: 'bed',
+            disabled: true,
+            hide: true,
+            display: false,
+          }
+        ]
+      },
+      data: [],
+      option: {
+        tip: false,
+        viewBtn: true,
+        selection: false,
+        addBtn: false,
+        column: []
+      }
+    };
+  },
 
-    mounted() {
+  mounted() {
 
+  },
+  computed: {
+    ...mapGetters(['permission']),
+    permissionBuildingList() {
+      return {
+        addBtn: this.vaildData(this.permission.building_add, false),
+        viewBtn: this.vaildData(this.permission.building_view, false),
+        delBtn: this.vaildData(this.permission.building_delete, false),
+        editBtn: this.vaildData(this.permission.building_edit, false)
+      };
     },
-    computed: {
-      ...mapGetters(['permission']),
-      permissionBuildingList() {
-        return {
-          addBtn: this.vaildData(this.permission.building_add, false),
-          viewBtn: this.vaildData(this.permission.building_view, false),
-          delBtn: this.vaildData(this.permission.building_delete, false),
-          editBtn: this.vaildData(this.permission.building_edit, false)
-        };
-      },
-      permissionBuildinglayerList() {
-        return {
-          addBtn: this.vaildData(this.permission.buildinglayer_add, false),
-          viewBtn: this.vaildData(this.permission.buildinglayer_view, false),
-          delBtn: this.vaildData(this.permission.buildinglayer_delete, false),
-          editBtn: this.vaildData(this.permission.buildinglayer_edit, false)
-        };
-      },
-      permissionBuildingroomList() {
-        return {
-          addBtn: this.vaildData(this.permission.buildingroom_add, false),
-          viewBtn: this.vaildData(this.permission.buildingroom_view, false),
-          delBtn: this.vaildData(this.permission.buildingroom_delete, false),
-          editBtn: this.vaildData(this.permission.buildingroom_edit, false)
-        };
-      },
-      permissionBedList() {
-        return {
-          addBtn: this.vaildData(this.permission.bed_add, false),
-          viewBtn: this.vaildData(this.permission.bed_view, false),
-          delBtn: this.vaildData(this.permission.bed_delete, false),
-          editBtn: this.vaildData(this.permission.bed_edit, false)
-        };
-      },
-      permissionTreeList() {
-        return {
-          addBtn: this.vaildData(this.permission.building_add, false),
-          viewBtn: this.vaildData(this.permission.building_view, false),
-          delBtn: this.vaildData(this.permission.building_delete, false),
-          editBtn: this.vaildData(this.permission.building_edit, false)
-        };
-      },
-      permissionDataList() {
-        return {
-          addBtn: this.vaildData(this.permission.building_add, false),
-          viewBtn: this.vaildData(this.permission.building_view, false),
-          delBtn: this.vaildData(this.permission.building_delete, false),
-          editBtn: this.vaildData(this.permission.building_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
-        });
-        return ids.join(',');
+    permissionBuildinglayerList() {
+      return {
+        addBtn: this.vaildData(this.permission.buildinglayer_add, false),
+        viewBtn: this.vaildData(this.permission.buildinglayer_view, false),
+        delBtn: this.vaildData(this.permission.buildinglayer_delete, false),
+        editBtn: this.vaildData(this.permission.buildinglayer_edit, false)
+      };
+    },
+    permissionBuildingroomList() {
+      return {
+        addBtn: this.vaildData(this.permission.buildingroom_add, false),
+        viewBtn: this.vaildData(this.permission.buildingroom_view, false),
+        delBtn: this.vaildData(this.permission.buildingroom_delete, false),
+        editBtn: this.vaildData(this.permission.buildingroom_edit, false)
+      };
+    },
+    permissionBedList() {
+      return {
+        addBtn: this.vaildData(this.permission.bed_add, false),
+        viewBtn: this.vaildData(this.permission.bed_view, false),
+        delBtn: this.vaildData(this.permission.bed_delete, false),
+        editBtn: this.vaildData(this.permission.bed_edit, false)
+      };
+    },
+    permissionTreeList() {
+      return {
+        addBtn: this.vaildData(this.permission.building_add, false),
+        viewBtn: this.vaildData(this.permission.building_view, false),
+        delBtn: this.vaildData(this.permission.building_delete, false),
+        editBtn: this.vaildData(this.permission.building_edit, false)
+      };
+    },
+    permissionDataList() {
+      return {
+        addBtn: this.vaildData(this.permission.building_add, false),
+        viewBtn: this.vaildData(this.permission.building_view, false),
+        delBtn: this.vaildData(this.permission.building_delete, false),
+        editBtn: this.vaildData(this.permission.building_edit, false)
+      };
+    },
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(',');
+    }
+  },
+  methods: {
+    init(){
+      this.option = this.optionBuilding;
+      this.treeData = [{ id: this.residentialId, type: this.typeParent, name: this.residentialName, children: [] }];
+      this.onLoadBuilding(this.residentialId);
+    },
+    rowDataSave(row, loading, done) {
+      row.residentialId = this.residentialId;
+      row.residentialName = this.residentialName;
+      if (row.type == this.typeBuilding) {
+        buildingAdd(row).then(
+          () => {
+            loading();
+            this.onLoadBuilding(this.residentialId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
+      } else if (row.type == this.typeBuildingLayer) {
+        buildingLayerAdd(row).then(
+          () => {
+            loading();
+            this.onLoadUnit(row.buildingId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
+      } else if (row.type == this.typeBuildingRoom) {
+        buildingRoomAdd(row).then(
+          () => {
+            loading();
+            this.onLoadFloor(row.buildingId, row.buildingLayerId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
+      } else if (row.type == this.typeBed) {
+        bedAdd(row).then(
+          () => {
+            loading();
+            this.onLoadRoom(row.buildingId, row.buildingLayerId, row.buildingRoomId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
       }
     },
-    methods: {
-      init(){
-        this.option = this.optionBuilding;
-        this.treeData = [{ id: this.residentialId, type: this.typeParent, name: this.residentialName, children: [] }];
-        this.onLoadBuilding(this.residentialId);
-      },
-      rowDataSave(row, loading, done) {
-        row.residentialId = this.residentialId;
-        row.residentialName = this.residentialName;
-        if (row.type == this.typeBuilding) {
-          buildingAdd(row).then(
-            () => {
-              loading();
-              this.onLoadBuilding(this.residentialId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        } else if (row.type == this.typeBuildingLayer) {
-          buildingLayerAdd(row).then(
-            () => {
-              loading();
-              this.onLoadUnit(row.buildingId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        } else if (row.type == this.typeBuildingRoom) {
-          buildingRoomAdd(row).then(
-            () => {
-              loading();
-              this.onLoadFloor(row.buildingId, row.buildingLayerId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        } else if (row.type == this.typeBed) {
-          bedAdd(row).then(
-            () => {
-              loading();
-              this.onLoadRoom(row.buildingId, row.buildingLayerId, row.buildingRoomId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        }
-      },
-      rowDataUpdate(row, index, loading, done) {
-        if (row.type == this.typeBuilding) {
-          buildingUpdate(row).then(
-            () => {
-              loading();
-              this.onLoadBuilding(this.residentialId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        } else if (row.type == this.typeBuildingLayer) {
-          buildingLayerUpdate(row).then(
-            () => {
-              loading();
-              this.onLoadUnit(row.buildingId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        } else if (row.type == this.typeBuildingRoom) {
-          buildingRoomUpdate(row).then(
-            () => {
-              loading();
-              this.onLoadFloor(row.buildingId, row.buildingLayerId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        } else if (row.type == this.typeBed) {
-          bedUpdate(row).then(
-            () => {
-              loading();
-              this.onLoadRoom(row.buildingId, row.buildingLayerId, row.buildingRoomId);
-              this.$message({ type: 'success', message: '操作成功!' });
-            },
-            error => {
-              done();
-              Log.d(error);
-            }
-          );
-        }
-      },
-      rowDataDel(row) {
-        this.$confirm('确定将选择数据删除?', {
-          confirmButtonText: '确定',
-          cancelButtonText: '取消',
-          type: 'warning'
+    rowDataUpdate(row, index, loading, done) {
+      if (row.type == this.typeBuilding) {
+        buildingUpdate(row).then(
+          () => {
+            loading();
+            this.onLoadBuilding(this.residentialId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
+      } else if (row.type == this.typeBuildingLayer) {
+        buildingLayerUpdate(row).then(
+          () => {
+            loading();
+            this.onLoadUnit(row.buildingId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
+      } else if (row.type == this.typeBuildingRoom) {
+        buildingRoomUpdate(row).then(
+          () => {
+            loading();
+            this.onLoadFloor(row.buildingId, row.buildingLayerId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
+      } else if (row.type == this.typeBed) {
+        bedUpdate(row).then(
+          () => {
+            loading();
+            this.onLoadRoom(row.buildingId, row.buildingLayerId, row.buildingRoomId);
+            this.$message({ type: 'success', message: '操作成功!' });
+          },
+          error => {
+            done();
+            Log.d(error);
+          }
+        );
+      }
+    },
+    rowDataDel(row) {
+      this.$confirm('确定将选择数据删除?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          Log.e(row);
+          if (row.type == this.typeBuilding) {
+            return buildingRemove(row.id);
+          } else if (row.type == this.typeBuildingLayer) {
+            return buildingLayerRemove(row.id);
+          } else if (row.type == this.typeBuildingRoom) {
+            return buildingRoomRemove(row.id);
+          } else if (row.type == this.typeBed) {
+            return bedRemove(row.id);
+          }
         })
-          .then(() => {
-            Log.e(row);
-            if (row.type == this.typeBuilding) {
-              return buildingRemove(row.id);
-            } else if (row.type == this.typeBuildingLayer) {
-              return buildingLayerRemove(row.id);
-            } else if (row.type == this.typeBuildingRoom) {
-              return buildingRoomRemove(row.id);
-            } else if (row.type == this.typeBed) {
-              return bedRemove(row.id);
-            }
-          })
-          .then(() => {
-            if (row.type == this.typeBuilding) {
-              this.onLoadBuilding(this.residentialId);
-            } else if (row.type == this.typeBuildingLayer) {
-              this.onLoadUnit(row.buildingId);
-            } else if (row.type == this.typeBuildingRoom) {
-              this.onLoadFloor(row.buildingId, row.buildingLayerId);
-            } else if (row.type == this.typeBed) {
-              this.onLoadRoom(row.buildingId, row.buildingLayerId, row.buildingRoomId);
-            }
-            this.$message({
-              type: 'success',
-              message: '操作成功!'
-            });
+        .then(() => {
+          if (row.type == this.typeBuilding) {
+            this.onLoadBuilding(this.residentialId);
+          } else if (row.type == this.typeBuildingLayer) {
+            this.onLoadUnit(row.buildingId);
+          } else if (row.type == this.typeBuildingRoom) {
+            this.onLoadFloor(row.buildingId, row.buildingLayerId);
+          } else if (row.type == this.typeBed) {
+            this.onLoadRoom(row.buildingId, row.buildingLayerId, row.buildingRoomId);
+          }
+          this.$message({
+            type: 'success',
+            message: '操作成功!'
           });
-      },
-      nodeClick(data) {
-        // Log.e('======data>>' + JSON.stringify(data));
-        if (data.type == this.typeParent) {
-          this.initBuildingDatas();
-        } else if (data.type == this.typeBuilding) {
-          console.log("获取单元树")
-          this.initUnitDatas(data);
-        } else if (data.type == this.typeUnit) {
-          console.log("获取楼层树")
-          console.log("所属单元名称:"+data.name)
-          // debugger
-          this.initFloorDatas(data);
-        } else if (data.type == this.typeFloor) {
-          console.log("获取房间树")
-          console.log("所属楼层："+data.name)
+        });
+    },
+    nodeClick(data) {
+      // Log.e('======data>>' + JSON.stringify(data));
+      if (data.type == this.typeParent) {
+        this.initBuildingDatas();
+      } else if (data.type == this.typeBuilding) {
+        console.log("获取单元树")
+        this.initUnitDatas(data);
+      } else if (data.type == this.typeUnit) {
+        console.log("获取楼层树")
+        console.log("所属单元名称:"+data.name)
+        // debugger
+        this.initFloorDatas(data);
+      } else if (data.type == this.typeFloor) {
+        console.log("获取房间树")
+        console.log("所属楼层："+data.name)
 
-          this.initRoomDatas(data);
-        }
-      },
-      beforeOpen(done, type) {
+        this.initRoomDatas(data);
+      }
+    },
+    beforeOpen(done, type) {
 
-        console.log('------------->>>' + type);
-        console.log('------------->>>' + JSON.stringify(this.form));
+      console.log('------------->>>' + type);
+      console.log('------------->>>' + JSON.stringify(this.form));
 
-        if (['edit', 'view'].includes(type)) {
-          if (this.form.type == this.typeBuilding) {
-            buildingGetDetail(this.form.id).then(res => {
-              this.form = res.data.data;
-              this.form.type = this.typeBuilding;
-              this.$set(this, 'form', this.form);
-            });
-          } else if (this.form.type == this.typeBuildingLayer) {
-            buildingLayerGetDetail(this.form.id).then(res => {
-              this.form = res.data.data;
-              this.form.type = this.typeBuildingLayer;
-              this.$set(this, 'form', this.form);
-            });
-          } else if (this.form.type == this.typeBuildingRoom) {
-            buildingRoomGetDetail(this.form.id).then(res => {
-              this.form = res.data.data;
-              this.form.type = this.typeBuildingRoom;
-              this.$set(this, 'form', this.form);
-            });
-          } else if (this.form.type == this.typeBed) {
-            bedGetDetail(this.form.id).then(res => {
-              this.form = res.data.data;
-              this.form.type = this.typeBed;
-              this.$set(this, 'form', this.form);
-            });
-          }
-        }else{
-          this.form.pic = "/img/default/building.png"
+      if (['edit', 'view'].includes(type)) {
+        if (this.form.type == this.typeBuilding) {
+          buildingGetDetail(this.form.id).then(res => {
+            this.form = res.data.data;
+            this.form.type = this.typeBuilding;
+            this.$set(this, 'form', this.form);
+          });
+        } else if (this.form.type == this.typeBuildingLayer) {
+          buildingLayerGetDetail(this.form.id).then(res => {
+            this.form = res.data.data;
+            this.form.type = this.typeBuildingLayer;
+            this.$set(this, 'form', this.form);
+          });
+        } else if (this.form.type == this.typeBuildingRoom) {
+          buildingRoomGetDetail(this.form.id).then(res => {
+            this.form = res.data.data;
+            this.form.type = this.typeBuildingRoom;
+            this.$set(this, 'form', this.form);
+          });
+        } else if (this.form.type == this.typeBed) {
+          bedGetDetail(this.form.id).then(res => {
+            this.form = res.data.data;
+            this.form.type = this.typeBed;
+            this.$set(this, 'form', this.form);
+          });
         }
-        done();
-      },
+      }else{
+        this.form.pic = "/img/default/building.png"
+      }
+      done();
+    },
 
-      //加载右侧数据
-      onLoadBuilding(id,params={}) {
-        this.loading = true;
+    //加载右侧数据
+    onLoadBuilding(id,params={}) {
+      this.loading = true;
 
-        params.residentialId = id;
-        console.log("residential")
-        getBuildingListByResidentialOldId(1,99999999,params).then(res => {
-          this.data = res.data.data.records;
-          this.initTreeDatasByBuilding(this.data);
-          this.loading = false;
-        });
-      },
-      onLoadUnit(buildingId,params={}) {
-        this.loading = true;
-        params.buildingId = buildingId;
-        getUnitListByBuildingOldId(1,999999999,params).then(res => {
-          this.data = res.data.data.records;
-          this.initTreeDatasByUnit(this.data, buildingId);
-          this.loading = false;
-        });
-      },
-      onLoadFloor(buildingId, unitId,params={}) {
-        this.loading = true;
-        params.unitId = unitId;
-        getFloorListByUnitOldId(1,999999999,params).then(res => {
-          this.data = res.data.data.records;
-          this.initTreeDatasByFloor(this.data, buildingId, unitId);
-          this.loading = false;
-        });
-      },
-      onLoadRoom(buildingId, unitId, floorId,params={}) {
-        this.loading = true;
-        params.floorId = floorId;
-        console.log("楼层id:"+floorId)
-        getRoomListByFloorOldId(1, 99999999, params).then(res => {
-          this.data = res.data.data.records;
-          // debugger
-          for (let data of this.data) data.type = this.typeRoom;
-          this.initTreeDatasByRoom(this.data, buildingId, unitId, floorId);
-          this.loading = false;
-        });
-      },
+      params.residentialId = id;
+      console.log("residential")
+      getBuildingListByResidentialOldId(1,99999999,params).then(res => {
+        this.data = res.data.data.records;
+        this.initTreeDatasByBuilding(this.data);
+        this.loading = false;
+      });
+    },
+    onLoadUnit(buildingId,params={}) {
+      this.loading = true;
+      params.buildingId = buildingId;
+      getUnitListByBuildingOldId(1,999999999,params).then(res => {
+        this.data = res.data.data.records;
+        this.initTreeDatasByUnit(this.data, buildingId);
+        this.loading = false;
+      });
+    },
+    onLoadFloor(buildingId, unitId,params={}) {
+      this.loading = true;
+      params.unitId = unitId;
+      getFloorListByUnitOldId(1,999999999,params).then(res => {
+        this.data = res.data.data.records;
+        this.initTreeDatasByFloor(this.data, buildingId, unitId);
+        this.loading = false;
+      });
+    },
+    onLoadRoom(buildingId, unitId, floorId,params={}) {
+      this.loading = true;
+      params.floorId = floorId;
+      console.log("楼层id:"+floorId)
+      getRoomListByFloorOldId(1, 99999999, params).then(res => {
+        this.data = res.data.data.records;
+        // debugger
+        for (let data of this.data) data.type = this.typeRoom;
+        this.initTreeDatasByRoom(this.data, buildingId, unitId, floorId);
+        this.loading = false;
+      });
+    },
 
-      // 点击左侧树形Item后初始化右侧数据
-      initBuildingDatas() {
-        //初始化楼栋
-        this.form = { type: this.typeBuilding };
-        this.$set(this, 'form', this.form);
-        this.$set(this, 'option', this.optionBuilding);
-        this.onLoadBuilding(this.residentialId);
-      },
-      initUnitDatas(data) {
-        //初始化单元
-        this.form = {
-          type: this.typeUnit,
-          buildingOldId: data.id
-        };
-        this.initUnitDicData(data.id, this.optionUnit);
-        this.$set(this, 'form', this.form);
-        this.$set(this, 'option', this.optionUnit);
-        this.onLoadUnit(data.id);
-      },
-      initFloorDatas(data) {
-        //初始化楼层
-        this.form = {
-          type: this.typeFloor,
-          buildingId: data.buildingId,
-          unitId: data.id
-        };
-        this.initFloorDicDatas(data.buildingId, data.id, this.optionFloor);
-        this.$set(this, 'form', this.form);
-        this.$set(this, 'option', this.optionFloor);
-        this.onLoadFloor(data.buildingId, data.id);
-      },
-      initRoomDatas(data) {
-        //初始化房间
-        this.form = {
-          type: this.typeRoom,
-          buildingId: data.buildingId,
-          unitId: data.unitId,
-          floorId: data.id
-        };
-        this.initRoomDicData(data.buildingId, data.unitId, data.id);
-        this.$set(this, 'form', this.form);
-        this.$set(this, 'option', this.optionRoom);
+    // 点击左侧树形Item后初始化右侧数据
+    initBuildingDatas() {
+      //初始化楼栋
+      this.form = { type: this.typeBuilding };
+      this.$set(this, 'form', this.form);
+      this.$set(this, 'option', this.optionBuilding);
+      this.onLoadBuilding(this.residentialId);
+    },
+    initUnitDatas(data) {
+      //初始化单元
+      this.form = {
+        type: this.typeUnit,
+        buildingOldId: data.id
+      };
+      this.initUnitDicData(data.id, this.optionUnit);
+      this.$set(this, 'form', this.form);
+      this.$set(this, 'option', this.optionUnit);
+      this.onLoadUnit(data.id);
+    },
+    initFloorDatas(data) {
+      //初始化楼层
+      this.form = {
+        type: this.typeFloor,
+        buildingId: data.buildingId,
+        unitId: data.id
+      };
+      this.initFloorDicDatas(data.buildingId, data.id, this.optionFloor);
+      this.$set(this, 'form', this.form);
+      this.$set(this, 'option', this.optionFloor);
+      this.onLoadFloor(data.buildingId, data.id);
+    },
+    initRoomDatas(data) {
+      //初始化房间
+      this.form = {
+        type: this.typeRoom,
+        buildingId: data.buildingId,
+        unitId: data.unitId,
+        floorId: data.id
+      };
+      this.initRoomDicData(data.buildingId, data.unitId, data.id);
+      this.$set(this, 'form', this.form);
+      this.$set(this, 'option', this.optionRoom);
 
-        this.onLoadRoom(data.buildingId, data.unitId, data.id);
-      },
+      this.onLoadRoom(data.buildingId, data.unitId, data.id);
+    },
 
-      // 点击左侧树形Item后初始化右侧选择项目数据
-      initUnitDicData(buildingOldId, option) {
-        if (option == null) option = this.optionUnit;
-        //初始化上一级下拉数据
-        for (let column of option.column) {
-          if (column.prop == 'buildingId') {
-            column.valueDefault = buildingOldId;
-            column.dicData = this.treeData[0].children;
-            break;
-          }
+    // 点击左侧树形Item后初始化右侧选择项目数据
+    initUnitDicData(buildingOldId, option) {
+      if (option == null) option = this.optionUnit;
+      //初始化上一级下拉数据
+      for (let column of option.column) {
+        if (column.prop == 'buildingId') {
+          column.valueDefault = buildingOldId;
+          column.dicData = this.treeData[0].children;
+          break;
         }
-      },
-      initFloorDicDatas(buildingId, unitId, option) {
-        if (option == null) option = this.optionFloor;
-        // this.initFloorDicData(buildingId, option);
-        //初始化上一级下拉数据
-        for (let column of option.column) {
-          if (column.prop == 'unitId') {
-            column.valueDefault = unitId;
-            for (let building of this.treeData[0].children) {
-              if (building.id == buildingId) {
-                column.dicData = building.children;
-                break;
-              }
+      }
+    },
+    initFloorDicDatas(buildingId, unitId, option) {
+      if (option == null) option = this.optionFloor;
+      // this.initFloorDicData(buildingId, option);
+      //初始化上一级下拉数据
+      for (let column of option.column) {
+        if (column.prop == 'unitId') {
+          column.valueDefault = unitId;
+          for (let building of this.treeData[0].children) {
+            if (building.id == buildingId) {
+              column.dicData = building.children;
+              break;
             }
-            break;
           }
+          break;
         }
-      },
-      initRoomDicData(buildingId, unitId, floorId) {
-        // this.initFloorDicData(buildingId, this.optionRoom);
-        this.initFloorDicDatas(buildingId, unitId, this.optionRoom);
-        //初始化上一级下拉数据
-        // for (let column of this.optionRoom.column) {
-        //   if (column.prop == 'buildingRoomId') {
-        //     column.valueDefault = roomId;
-        //     for (let building of this.treeData[0].children) {
-        //       if (building.id == buildingId) {
-        //         for (let layer of building.children) {
-        //           if (layer.id == layerId) {
-        //             column.dicData = layer.children;
-        //             break;
-        //           }
-        //         }
-        //         break;
-        //       }
-        //     }
-        //     break;
-        //   }
-        // }
-      },
+      }
+    },
+    initRoomDicData(buildingId, unitId, floorId) {
+      // this.initFloorDicData(buildingId, this.optionRoom);
+      this.initFloorDicDatas(buildingId, unitId, this.optionRoom);
+      //初始化上一级下拉数据
+      // for (let column of this.optionRoom.column) {
+      //   if (column.prop == 'buildingRoomId') {
+      //     column.valueDefault = roomId;
+      //     for (let building of this.treeData[0].children) {
+      //       if (building.id == buildingId) {
+      //         for (let layer of building.children) {
+      //           if (layer.id == layerId) {
+      //             column.dicData = layer.children;
+      //             break;
+      //           }
+      //         }
+      //         break;
+      //       }
+      //     }
+      //     break;
+      //   }
+      // }
+    },
 
-      // 初始化右侧数据后更新左侧树形数据
-      initTreeDatasByBuilding(datas) {
-        let treeData = [];
-        if (!ArrUtil.isNullOrLength(datas)) {
+    // 初始化右侧数据后更新左侧树形数据
+    initTreeDatasByBuilding(datas) {
+      let treeData = [];
+      if (!ArrUtil.isNullOrLength(datas)) {
+        for (let data of datas) {
+          data.type = this.typeBuilding;
+          //初始化楼栋数据
+          treeData = ArrUtil.add(treeData, {
+            id: data.id,
+            type: "building",
+            leaf: false,
+            name: data.name,
+            children: [],
+            tag: data
+          });
+        }
+      }
+      this.treeData[0].children = treeData;
+    },
+    initTreeDatasByUnit(datas, buildingId) {
+      // debugger
+      for (let children of this.treeData[0].children) {
+        if (children.id == buildingId) {
+          this.optionUnit.addBtn = children.tag.floorNum > datas.length;
+          let treeData = [];
           for (let data of datas) {
-            data.type = this.typeBuilding;
-            //初始化楼栋数据
+            data.type = this.typeUnit;
             treeData = ArrUtil.add(treeData, {
               id: data.id,
-              type: "building",
-              leaf: false,
+              buildingId: buildingId,
+              type: data.type,
               name: data.name,
               children: [],
               tag: data
             });
           }
+          children.children = treeData;
+          break;
         }
-        this.treeData[0].children = treeData;
-      },
-      initTreeDatasByUnit(datas, buildingId) {
-        // debugger
-        for (let children of this.treeData[0].children) {
-          if (children.id == buildingId) {
-            this.optionUnit.addBtn = children.tag.floorNum > datas.length;
-            let treeData = [];
-            for (let data of datas) {
-              data.type = this.typeUnit;
-              treeData = ArrUtil.add(treeData, {
-                id: data.id,
-                buildingId: buildingId,
-                type: data.type,
-                name: data.name,
-                children: [],
-                tag: data
-              });
-            }
-            children.children = treeData;
-            break;
-          }
-        }
-      },
-      initTreeDatasByFloor(datas, buildingId, unitId) {
-        for (let building of this.treeData[0].children) {
-          if (building.id == buildingId) {
-            for (let layer of building.children) {
-              if (layer.id == unitId) {
-                this.optionFloor.addBtn = building.tag.roomNum > datas.length;
-                let treeData = [];
-                for (let data of datas) {
-                  data.type = this.typeFloor;
-                  treeData = ArrUtil.add(treeData, {
-                    id: data.id,
-                    buildingId: buildingId,
-                    unitId: unitId,
-                    type: data.type,
-                    name: data.name,
-                    children: [],
-                    tag: data
-                  });
-                }
-                layer.children = treeData;
-                break;
+      }
+    },
+    initTreeDatasByFloor(datas, buildingId, unitId) {
+      for (let building of this.treeData[0].children) {
+        if (building.id == buildingId) {
+          for (let layer of building.children) {
+            if (layer.id == unitId) {
+              this.optionFloor.addBtn = building.tag.roomNum > datas.length;
+              let treeData = [];
+              for (let data of datas) {
+                data.type = this.typeFloor;
+                treeData = ArrUtil.add(treeData, {
+                  id: data.id,
+                  buildingId: buildingId,
+                  unitId: unitId,
+                  type: data.type,
+                  name: data.name,
+                  children: [],
+                  tag: data
+                });
               }
+              layer.children = treeData;
+              break;
             }
-            break;
           }
+          break;
         }
-      },
-      initTreeDatasByRoom(datas, buildingId, unitId, floorId) {
-        for (let building of this.treeData[0].children) {
-          if (building.id == buildingId) {
-            for (let unit of building.children) {
-              if (unit.id == unitId) {
-                for (let floor of unit.children) {
-                  if (floor.id == floorId) {
-                    this.optionRoom.addBtn = floor.tag.bedNum > datas.length;
+      }
+    },
+    initTreeDatasByRoom(datas, buildingId, unitId, floorId) {
+      for (let building of this.treeData[0].children) {
+        if (building.id == buildingId) {
+          for (let unit of building.children) {
+            if (unit.id == unitId) {
+              for (let floor of unit.children) {
+                if (floor.id == floorId) {
+                  this.optionRoom.addBtn = floor.tag.bedNum > datas.length;
 
-                    let treeData = [];
-                    for (let data of datas) {
-                      data.type = this.typeRoom;
-                      treeData = ArrUtil.add(treeData, {
-                        id: data.id,
-                        buildingId: buildingId,
-                        unitId: unitId,
-                        floorId: floorId,
-                        type: data.type,
-                        name: data.name,
-                        children: [],
-                        tag: data
-                      });
-                    }
-                    floor.children = treeData;
-                    break;
+                  let treeData = [];
+                  for (let data of datas) {
+                    data.type = this.typeRoom;
+                    treeData = ArrUtil.add(treeData, {
+                      id: data.id,
+                      buildingId: buildingId,
+                      unitId: unitId,
+                      floorId: floorId,
+                      type: data.type,
+                      name: data.name,
+                      children: [],
+                      tag: data
+                    });
                   }
+                  floor.children = treeData;
+                  break;
                 }
-                break;
               }
+              break;
             }
-            break;
           }
+          break;
         }
-      },
-      batchAdd(){
+      }
+    },
+    batchAdd(){
 
-        this.$refs['batchForm'].validate((valid) => {
-          if (valid) {
-            this.batchForm.residentialId = this.residentialId;
-            this.batchDisabled = true;
-            this.batchText = '正在创建中···';
-            this.batchIcon = 'el-icon-loading';
+      this.$refs['batchForm'].validate((valid) => {
+        if (valid) {
+          this.batchForm.residentialId = this.residentialId;
+          this.batchDisabled = true;
+          this.batchText = '正在创建中···';
+          this.batchIcon = 'el-icon-loading';
 
-            batchAddSubmit(this.batchForm).then(res => {
-              if (res.data.code == 200){
-                this.batchVisible = false;
-                this.init();
-              }else{
-                this.batchIcon = 'el-icon-circle-plus-outline';
-                this.batchText = '提交';
-                this.batchDisabled = false;
-              }
-            });
-          }
-        });
-      },
-    }
-  };
+          batchAddSubmit(this.batchForm).then(res => {
+            if (res.data.code == 200){
+              this.batchVisible = false;
+              this.init();
+            }else{
+              this.batchIcon = 'el-icon-circle-plus-outline';
+              this.batchText = '提交';
+              this.batchDisabled = false;
+            }
+          });
+        }
+      });
+    },
+  }
+};
 </script>

src/views/community/room.vue

@@ -44,384 +44,389 @@
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove, getRoomList, getRoomDetail} from "@/api/community/room";
-  import {mapGetters} from "vuex";
+import {getList, getDetail, add, update, remove, getRoomList, getRoomDetail} from "@/api/community/room";
+import {mapGetters} from "vuex";
 
 
-  export default {
-    data() {
-      return {
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 60,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: true,
-          // delBtn: false,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            // {
-            //   label: "房间名称",
-            //   prop: "name",
-            //   search: true,
-            //   rules: [{
-            //     required: true,
-            //     message: "请输入房间名称",
-            //     trigger: "blur"
-            //   }]
-            // },
-            {
-              label: "门牌号 ",
-              prop: "name",
-              search: true,
-              rules: [{
-                required: true,
-                message: "请输入门牌号-限制数字，单元楼下唯一  ",
-                trigger: "blur"
-              }]
-            },{
-              label: "所属社区",
-              prop: "agencyId",
-              slot: true,
-              hide: true,
-              display:false,
-              type: "select",
-              // search: true,
-              dicUrl: "/api/cyzh-community/agency/list",
-              // cascaderItem: ['residentialId','unitId'],
-              props: {
-                label: "name",
-                value: "id"
-              },
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属社区",
-                trigger: "blur"
-              }]
-            },{
-              label: "所属小区",
-              prop: "residentialId",
-              slot: true,
-              type: "select",
-              search: true,
-              cascaderItem: ["buildingId"],
-              // dicUrl: "/grid/estate/getResidentialList",
-              // remote: true,
-              //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
-              dicUrl: "/api/cyzh-community/residential/list?name={{key}}&&size=9999",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              filterable: true,
-              searchFilterable: true,
-              // dicFlag: false,
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属小区",
-                trigger: "blur"
-              }]
+export default {
+  data() {
+    return {
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height:'auto',
+        calcHeight: 60,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: true,
+        menuWidth: 350,
+        // delBtn: false,
+        selection: true,
+        dialogClickModal: false,
+        column: [
+          // {
+          //   label: "房间名称",
+          //   prop: "name",
+          //   search: true,
+          //   rules: [{
+          //     required: true,
+          //     message: "请输入房间名称",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "门牌号 ",
+            width: 100,
+            prop: "name",
+            search: true,
+            rules: [{
+              required: true,
+              message: "请输入门牌号-限制数字，单元楼下唯一  ",
+              trigger: "blur"
+            }]
+          },{
+            label: "所属社区",
+            prop: "agencyId",
+            slot: true,
+            hide: true,
+            display:false,
+            type: "select",
+            // search: true,
+            dicUrl: "/api/cyzh-community/agency/list",
+            // cascaderItem: ['residentialId','unitId'],
+            props: {
+              label: "agencyName",
+              value: "id"
             },
-            {
-              label: "所属楼栋",
-              prop: "buildingId",
-              cascaderItem: ["unitId"],
-              slot: true,
-              type: "select",
-              search: true,
-              dicFlag: false,
-              filterable: true,
-              dicUrl: "/api/cyzh-community/building/list?residentialId={{key}}",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属单元名称",
-                trigger: "blur"
-              }]
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "所属单元",
-              prop: "unitId",
-              slot: true,
-              type: "select",
-              search: true,
-              dicFlag: false,
-              cascaderItem: ["floorId"],
-              filterable: true,
-              dicUrl: "/api/cyzh-community/unit/list?buildingId={{key}}",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属单元名称",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请选择所属社区",
+              trigger: "blur"
+            }]
+          },{
+            label: "所属小区",
+            prop: "residentialId",
+            slot: true,
+            type: "select",
+            search: true,
+            cascaderItem: ["buildingId"],
+            // dicUrl: "/grid/estate/getResidentialList",
+            remote: true,
+            //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
+            dicUrl: "/api/cyzh-community/residential/list?size=900&name={{key}}",
+            searchFilterable:true,
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "所属楼层",
-              prop: "floorId",
-              slot: true,
-              type: "select",
-              search: true,
-              dicFlag: false,
-              // cascaderIndex:1,
-              // dicUrl: "/grid/estate/getUnitList",
-              dicUrl: "/api/cyzh-community/floor/list?unitId={{key}}&size=900000",
-              dicFormatter: (res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属单元名称",
-                trigger: "blur"
-              }]
+            // dicFlag: false,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "房屋面积",
-              prop: "area",
-              hide: true,
-            },{
-              label: "入住用户数量",
-              prop: "userCount",
-              hide: true,
-              display: false,
+            rules: [{
+              required: true,
+              message: "请输入所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼栋",
+            prop: "buildingId",
+            // width: 150,
+            cascaderItem: ["unitId"],
+            slot: true,
+            type: "select",
+            search: true,
+            dicFlag: false,
+            filterable: true,
+            dicUrl: "/api/cyzh-community/building/list?size=100&residentialId={{key}}",
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "户型",
-              prop: "houseType",
-              hide: true,
-              type: "select",
-              // search: true,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=house_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "楼层",
-              prop: "floor",
-              hide: true,
+            rules: [{
+              required: true,
+              message: "请输入所属单元名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属单元",
+            prop: "unitId",
+            // width: 150,
+            slot: true,
+            type: "select",
+            search: true,
+            dicFlag: false,
+            cascaderItem: ["floorId"],
+            filterable: true,
+            dicUrl: "/api/cyzh-community/unit/list?buildingId={{key}}",
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "装饰",
-              prop: "ornament",
-              hide: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "房屋朝向",
-              prop: "orientation",
-              hide: true,
-            },{
-              label: "序号",
-              prop: "serial",
-              value: 1,
-              hide: true,
-              display: false,
-            }, {
-              label: "备注",
-              prop: "remark",
-              hide: true,
+            rules: [{
+              required: true,
+              message: "请输入所属单元名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼层",
+            // width: 150,
+            prop: "floorId",
+            slot: true,
+            type: "select",
+            search: true,
+            dicFlag: false,
+            // cascaderIndex:1,
+            // dicUrl: "/grid/estate/getUnitList",
+            dicUrl: "/api/cyzh-community/floor/list?unitId={{key}}&size=900000",
+            dicFormatter: (res)=>{
+              return res.data.records;
             },
-            {
-              label: "创建时间",
-              prop: "createTime",
-              hide: true,
-              type: "datetime",
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
-              display: false,
+            props: {
+              label: "name",
+              value: "id"
             },
-          ]
-        },
-        data: []
+            rules: [{
+              required: true,
+              message: "请输入所属单元名称",
+              trigger: "blur"
+            }]
+          },
+          // {
+          //   label: "房屋面积",
+          //   prop: "area",
+          //   hide: true,
+          // },
+          {
+            label: "入住用户数量",
+            prop: "userNumber",
+            hide: true,
+            display: false,
+          },
+          {
+            label: "户型",
+            prop: "houseType",
+            hide: true,
+            type: "select",
+            // search: true,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=house_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
+            },
+          },
+          // {
+          //   label: "楼层",
+          //   prop: "floor",
+          //   hide: true,
+          // },
+          {
+            label: "装饰",
+            prop: "ornament",
+            hide: true,
+          },
+          {
+            label: "房屋朝向",
+            prop: "orientation",
+            hide: true,
+          },{
+            label: "序号",
+            prop: "serial",
+            value: 1,
+            hide: true,
+            display: false,
+          }, {
+            label: "备注",
+            prop: "remark",
+            hide: true,
+          },
+          {
+            label: "创建时间",
+            prop: "createTime",
+            hide: true,
+            type: "datetime",
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            display: false,
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.room_add, false),
+        viewBtn: this.vaildData(this.permission.room_view, false),
+        delBtn: this.vaildData(this.permission.room_delete, false),
+        editBtn: this.vaildData(this.permission.room_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.room_add, false),
-          viewBtn: this.vaildData(this.permission.room_view, false),
-          delBtn: this.vaildData(this.permission.room_delete, false),
-          editBtn: this.vaildData(this.permission.room_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  mounted() {
+    let tenantType = localStorage.getItem("tenantType");
+    const agencyColumn = this.findObject(this.option.column, "agencyId");
+    const residentialColumn = this.findObject(this.option.column, "residentialId");
+    if (tenantType == 1) { //园区
+      agencyColumn.label = "所属园区";
+      residentialColumn.label = "所属区域";
+    } else { //社区
+      agencyColumn.label = "所属社区";
+      residentialColumn.label = "所属小区";
+    }
+  },
+  methods: {
+    rowSave(row, done, loading) {
+      row.userNumber = 0;
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
     },
-    mounted() {
-      let tenantType = localStorage.getItem("tenantType");
-      const agencyColumn = this.findObject(this.option.column, "agencyId");
-      const residentialColumn = this.findObject(this.option.column, "residentialId");
-      if (tenantType == 1) { //园区
-        agencyColumn.label = "所属园区";
-        residentialColumn.label = "所属区域";
-      } else { //社区
-        agencyColumn.label = "所属社区";
-        residentialColumn.label = "所属小区";
-      }
+    rowUpdate(row, index, done, loading) {
+      // done()
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
     },
-    methods: {
-      rowSave(row, done, loading) {
-        row.userNumber = 0;
-        add(row).then(() => {
+    rowDel(row) {
+      if (row.userNumber > 0){
+        this.$message.error("请先删除该房间的住户和其他数据")
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        // done()
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        if (row.userNumber > 0){
-          this.$message.error("请先删除该房间的住户和其他数据")
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        if (this.$route.query){
-          Object.assign(this.query,this.$route.query)
-        }
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage){
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize){
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      if (this.$route.query){
+        Object.assign(this.query,this.$route.query)
+      }
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
 
 
-      }
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/community/unit.vue

@@ -35,7 +35,7 @@
         <!-- <el-button type="text" icon="el-icon-setting" size="mini" @click="manageResidential(scope.row.oldId)">管理</el-button> -->
       </template>
       <template slot="agencyId" slot-scope="scope">
-        <div>{{scope.row.agencyName}}</div>
+        {{scope.row.agencyName}}
       </template>
       <template slot="residentialId" slot-scope="scope">
         <div>{{scope.row.residentialName}}</div>
@@ -48,435 +48,438 @@
 </template>
 
 <script>
-  import {
-    getList,
-    getDetail,
-    add,
-    update,
-    remove
-  } from "@/api/community/unit";
-  import {
-    mapGetters
-  } from "vuex";
+import {
+  getList,
+  getDetail,
+  add,
+  update,
+  remove
+} from "@/api/community/unit";
+import {
+  mapGetters
+} from "vuex";
 
-  import {communityManage} from "@/views/community/util/communityManage";
+import {communityManage} from "@/views/community/util/communityManage";
 
 
-  export default {
-    data() {
-      return {
-        editForm: {},
-        editVisible: false,
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
+export default {
+  data() {
+    return {
+      editForm: {},
+      editVisible: false,
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height: 'auto',
+        calcHeight: 60,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        delBtn: true,
+        editBtn: false,
+        selection: true,
+        dialogClickModal: false,
+        column: [{
+          label: "单元名称",
+          prop: "name",
+          search: true,
+          width: 100,
+          // hide: true,
+          rules: [{
+            required: true,
+            message: "请输入单元名称",
+            trigger: "blur"
+          }]
         },
-        selectionList: [],
-        option: {
-          height: 'auto',
-          calcHeight: 60,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: false,
-          delBtn: true,
-          editBtn: false,
-          selection: true,
-          dialogClickModal: false,
-          menuWidth: 200,
-          column: [{
-            label: "单元名称",
-            prop: "name",
-            search: true,
-            // hide: true,
+          {
+            label: "单元编号",
+            prop: "unitNumber",
+            display: false,
+            hide: true,
+            // search: true,
+          },
+          {
+            label: "单元楼类型",
+            prop: "type",
+            hide: true,
+            type: "select",
+            // search: true,
+            dataType: "number",
+            searchLabelWidth: 110,
+            labelWidth: 110,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=unit_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
+            },
             rules: [{
-              required: true,
-              message: "请输入单元名称",
+              required: false,
+              message: "请选择单元楼类型",
               trigger: "blur"
             }]
           },
-            {
-              label: "单元编号",
-              prop: "unitNumber",
-              display: false,
-              hide: true,
-              // search: true,
-            },
-            {
-              label: "单元楼类型",
-              prop: "type",
-              hide: true,
-              type: "select",
-              // search: true,
-              dataType: "number",
-              searchLabelWidth: 110,
-              labelWidth: 110,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=unit_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              rules: [{
-                required: false,
-                message: "请选择单元楼类型",
-                trigger: "blur"
-              }]
+          // {
+          //   label: "所属社区",
+          //   prop: "agencyId",
+          //   slot: true,
+          //   search: true,
+          //   cascaderItem: ['residentialId'],
+          //   type: "select",
+          //   // remote: true,
+          //   searchFilterable:true,
+          //   dicUrl: "/api/cyzh-community/agency/list?size=9999&name={{key}}",
+          //   dicFormatter:(res)=>{
+          //     return res.data.records;//返回字典的层级结构
+          //   },
+          //   props: {
+          //     label: "name",
+          //     value: "id"
+          //   },
+          //   rules: [{
+          //     required: true,
+          //     message: "请选择所属社区",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "所属小区",
+            prop: "residentialId",
+            slot: true,
+            type: "select",
+            search: true,
+            cascaderItem: ['buildingId'],
+            // remote: true,
+            //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
+            dicUrl: "/api/cyzh-community/residential/list?size=999",
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "所属社区",
-              prop: "agencyId",
-              slot: true,
-              search: true,
-              cascaderItem: ['residentialId'],
-              type: "select",
-              // remote: true,
-              searchFilterable:true,
-              filterable:true,
-              dicUrl: "/api/cyzh-community/agency/list?name={{key}}&&size=9999",
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属社区",
-                trigger: "blur"
-              }]
+            // dicFlag: false,
+            searchFilterable: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "所属小区",
-              prop: "residentialId",
-              slot: true,
-              type: "select",
-              search: true,
-              cascaderItem: ['buildingId'],
-              // remote: true,
-              //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
-              dicUrl: "/api/cyzh-community/residential/list?agencyId={{key}}",
-              dicFlag: false,
-              filterable: true,
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属小区",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请选择所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属楼栋",
+            prop: "buildingId",
+            // width: 100,
+            slot: true,
+            type: "select",
+            search: true,
+            dicUrl: `/api/cyzh-community/building/list?residentialId={{key}}`,
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "所属楼栋",
-              prop: "buildingId",
-              slot: true,
-              type: "select",
-              search: true,
-              dicUrl: `/api/cyzh-community/building/list?residentialId={{key}}`,
-              dicFlag: false,
-              filterable: true,
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              props: {
-                label: "name",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请选择所属小区",
-                trigger: "blur"
-              }]
+            dicFlag: false,
+            searchFilterable: true,
+            props: {
+              label: "name",
+              value: "id"
             },
-            {
-              label: "负责人姓名",
-              prop: "personName",
-              labelWidth: 110,
-              hide: true,
+            rules: [{
+              required: true,
+              message: "请选择所属楼栋",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "负责人姓名",
+            prop: "personName",
+            // labelWidth: 110,
+            hide: true,
 
-              rules: [{
-                required: false,
-                message: "请输入负责人姓名",
-                trigger: "blur"
-              }]
-            }, {
-              label: "负责人电话",
-              prop: "personTel",
-              labelWidth: 110,
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入负责人电话",
-                trigger: "blur"
-              }]
-            }, {
-              label: "建筑年代",
-              prop: "builtYear",
-              hide: true,
-            }, {
-              label: "产权性质",
-              prop: "propertyNature",
-              hide: true,
-            }, {
-              label: "有无电梯",
-              prop: "includingElevator",
-              hide: true,
-              // type: "select",
-              // search: true,
-              // dicUrl: "/api/blade-system/dict-biz/dictionary?code=including_elevator",
-              // props: {
-              //   label: "dictValue",
-              //   value: "dictKey"
-              // },
-            },
-            {
-              label: "图片",
-              prop: "pic",
-              type: 'upload',
-              hide: true,
-              propsHttp: {
-                url: 'data'
-              },
-              listType: 'picture-img',
-              span: 24,
-              row: true,
-              action: "/api/blade-resource/oss/endpoint/putfile",
-              display: true,
-              rules: [{
-                required: false,
-                message: "请输入封面图片",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "楼层数量",
-              prop: "floorCount",
-              display: false
-            },
-            {
-              label: "房间数量",
-              prop: "roomCount",
-              display: false
-            },
-            {
-              label: "住户数量",
-              prop: "userCount",
-              display: false,
-              hide: true,
-            },
-            {
-              label: "序号",
-              prop: "serial",
-              hide: true,
-              display: false,
-              value: 1
-            },
-            {
-              label: "创建时间",
-              prop: "createTime",
-              type: "datetime",
-              hide: true,
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
-              display: false
-            },
-            {
-              label: "备注",
-              prop: "remark",
-              hide: true,
-              type: "textarea"
+            rules: [{
+              required: false,
+              message: "请输入负责人姓名",
+              trigger: "blur"
+            }]
+          }, {
+            label: "负责人电话",
+            prop: "personTel",
+            labelWidth: 110,
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入负责人电话",
+              trigger: "blur"
+            }]
+          }, {
+            label: "建筑年代",
+            prop: "builtYear",
+            hide: true,
+          }, {
+            label: "产权性质",
+            prop: "propertyNature",
+            hide: true,
+          }, {
+            label: "有无电梯",
+            prop: "includingElevator",
+            hide: true,
+            // type: "select",
+            // search: true,
+            // dicUrl: "/api/blade-system/dict-biz/dictionary?code=including_elevator",
+            // props: {
+            //   label: "dictValue",
+            //   value: "dictKey"
+            // },
+          },
+          {
+            label: "图片",
+            prop: "pic",
+            type: 'upload',
+            hide: true,
+            propsHttp: {
+              res: "data",
+              url: 'link'
             },
-          ]
-        },
-        data: []
+            listType: 'picture-img',
+            span: 24,
+            row: true,
+            action: "/api/blade-resource/oss/endpoint/put-file",
+            display: true,
+            rules: [{
+              required: false,
+              message: "请输入封面图片",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "楼层数量",
+            prop: "floorCount",
+            // width: 100,
+            display: false
+          },
+          {
+            label: "房间数量",
+            prop: "roomCount",
+            // width: 100,
+            display: false
+          },
+          {
+            label: "住户数量",
+            prop: "userNumber",
+            display: false,
+            hide: true,
+          },
+          {
+            label: "序号",
+            prop: "serial",
+            hide: true,
+            display: false,
+            value: 1
+          },
+          {
+            label: "创建时间",
+            prop: "createTime",
+            type: "datetime",
+            hide: true,
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            display: false
+          },
+          {
+            label: "备注",
+            prop: "remark",
+            hide: true,
+            type: "textarea"
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.unit_add, false),
+        viewBtn: this.vaildData(this.permission.unit_view, false),
+        delBtn: this.vaildData(this.permission.unit_delete, false),
+        editBtn: this.vaildData(this.permission.unit_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.unit_add, false),
-          viewBtn: this.vaildData(this.permission.unit_view, false),
-          delBtn: this.vaildData(this.permission.unit_delete, false),
-          editBtn: this.vaildData(this.permission.unit_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  mounted() {
+    let tenantType = localStorage.getItem("tenantType");
+    const agencyColumn = this.findObject(this.option.column, "agencyId");
+    const residentialColumn = this.findObject(this.option.column, "residentialId");
+    if (tenantType == 1) { //园区
+      agencyColumn.label = "所属园区";
+      residentialColumn.label = "所属区域";
+    } else { //社区
+      agencyColumn.label = "所属社区";
+      residentialColumn.label = "所属小区";
+    }
+  },
+  methods: {
+    submitUnit(row,done,loading) {
+      update(this.editForm).then(() => {
+        this.onLoad(this.page);
+        this.editVisible = false;
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
     },
-    mounted() {
-      let tenantType = localStorage.getItem("tenantType");
-      const agencyColumn = this.findObject(this.option.column, "agencyId");
-      const residentialColumn = this.findObject(this.option.column, "residentialId");
-      if (tenantType == 1) { //园区
-        agencyColumn.label = "所属园区";
-        residentialColumn.label = "所属区域";
-      } else { //社区
-        agencyColumn.label = "所属社区";
-        residentialColumn.label = "所属小区";
-      }
+    edit(row) {
+      this.editForm = row;
+      this.editVisible = true;
     },
-    methods: {
-      submitUnit(row,done,loading) {
-        update(this.editForm).then(() => {
-          this.onLoad(this.page);
-          this.editVisible = false;
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+    unitManage(id,type){
+      let query = {unitId: id};
+      communityManage(this,type,query)
+    },
+    rowSave(row, done, loading) {
+      row.roomNumber = 0;
+      row.floorNumber = 0;
+      row.userNumber = 0;
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      edit(row) {
-        this.editForm = row;
-        this.editVisible = true;
-      },
-      unitManage(id,type){
-        let query = {unitId: id};
-        communityManage(this,type,query)
-      },
-      rowSave(row, done, loading) {
-        row.roomNumber = 0;
-        row.floorNumber = 0;
-        row.userNumber = 0;
-        add(row).then(() => {
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      // done()
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      if (row.roomNumber > 0) {
+        this.$message.error("请先删除该单元的房间和其他数据")
+        return
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        // done()
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        if (row.roomNumber > 0) {
-          this.$message.error("请先删除该单元的房间和其他数据")
-          return
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage) {
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize) {
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        if (this.$route.query){
-          Object.assign(this.query,this.$route.query)
-        }
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
-
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      if (this.$route.query){
+        Object.assign(this.query,this.$route.query)
+      }
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
+
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/device/doordevice.vue

@@ -30,11 +30,12 @@
       <template slot="mapSelectForm" slot-scope="scope">
         <!-- <avue-map v-model="scope.row.mapSelect"></avue-map> -->
         <div>
-          <input class="el-input--small el-input__inner" placeholder="选择地址" @click="mapVisible = true">
+          <el-button @click="mapVisible = true">选择地址</el-button>
 
           <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="mapVisible"
                      title="编辑地址" width="80%">
-            <customAvueMap v-if="mapVisible" v-model="scope.row.mapSelect"></customAvueMap>
+            <!--            <customAvueMap v-if="mapVisible" v-model="scope.row.mapSelect"></customAvueMap>-->
+            <editPolygonMap v-if="mapVisible" :editForm.sync="scope.row" :visible.sync="mapVisible"></editPolygonMap>
           </el-dialog>
         </div>
       </template>
@@ -43,390 +44,392 @@
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove} from "../../api/device/doordevice.js";
-  import {mapGetters} from "vuex";
-  import customAvueMap from "../../components/residential/customAvueMap.vue"
-  export default {
-    components:{
-      customAvueMap
-    },
-    data() {
-      return {
-        mapVisible:false,
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 60,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            {
-              label: "门禁设备",
-              prop: "id",
-              hide: true,
-              display:false,
-              rules: [{
-                required: true,
-                message: "请输入门禁设备",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备编号",
-              prop: "cameraCode",
-              width: 135,
-              rules: [{
-                required: true,
-                message: "请输入设备编号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "名称",
-              prop: "cameraName",
-              search: true,
-              width: 130,
-              overHidden: true,
-              rules: [{
-                required: true,
-                message: "请输入名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "所属省",
-              prop: "provinceCode",
-              hide: true,
-              width: 150,
-              type: "select",
-              dicUrl: "/api/blade-system/region/lazy-tree?parentCode=000000",
-              cascaderItem:["cityCode"],
-              props:{
-                label:"title",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入省行政编码",
-                trigger: "blur"
-              }]
+import {getList, getDetail, add, update, remove} from "../../api/device/doordevice.js";
+import {mapGetters} from "vuex";
+import customAvueMap from "../../components/residential/customAvueMap.vue"
+import editPolygonMap from "../../components/residential/editPolygonMap.vue";
+export default {
+  components:{
+    customAvueMap,editPolygonMap
+  },
+  data() {
+    return {
+      mapVisible:false,
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height:'auto',
+        calcHeight: 60,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        menuWidth:350,
+        column: [
+          {
+            label: "门禁设备",
+            prop: "id",
+            hide: true,
+            display:false,
+            rules: [{
+              required: true,
+              message: "请输入门禁设备",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备编号",
+            prop: "cameraCode",
+            width: 135,
+            rules: [{
+              required: true,
+              message: "请输入设备编号",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "名称",
+            prop: "cameraName",
+            search: true,
+            overHidden: true,
+            rules: [{
+              required: true,
+              message: "请输入名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属省",
+            prop: "provinceCode",
+            // hide: true,
+            width: 150,
+            type: "select",
+            dicUrl: "/api/blade-system/region/lazy-tree?parentCode=000000",
+            cascaderItem:["cityCode"],
+            props:{
+              label:"title",
+              value: "id"
             },
-            {
-              label: "所属市",
-              prop: "cityCode",
-              hide: true,
-              type: "select",
-              width: 100,
-              cascaderItem: ["areaCode"],
-              ddicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
-
-              props:{
-                label: "title",
-                value: "id"
-              },
-              dicFlag: false,
-
-              rules: [{
-                required: true,
-                message: "请输入市行政编码",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入省行政编码",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属市",
+            prop: "cityCode",
+            hide: true,
+            type: "select",
+            width: 100,
+            cascaderItem: ["areaCode"],
+            dicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
+            props:{
+              label: "title",
+              value: "id"
             },
-            {
-              label: "所属区",
-              prop: "areaCode",
-              type: "select",
-              width: 100,
-              dicFlag: false,
-              cascaderItem: ["residentialId"],
-              dicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
-
-              props:{
-                label: "title",
-                value: "id"
-              },
-              rules: [{
-                required: true,
-                message: "请输入区行政编码",
-                trigger: "blur"
-              }]
+            // dicFlag: false,
+            rules: [{
+              required: true,
+              message: "请输入市行政编码",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属区",
+            prop: "areaCode",
+            type: "select",
+            // width: 100,
+            // dicFlag: false,
+            cascaderItem: ["residentialId"],
+            dicUrl: `/api/blade-system/region/lazy-tree?parentCode={{key}}`,
+            props:{
+              label: "title",
+              value: "id"
             },
-            {
-              label: "所属小区",
-              prop: "residentialId",
-              type: "select",
-              width: 100,
-              dicUrl: "/api/cyzh-community/residential/list?size=90000&regionArea={{key}}",
-              filterable: true,
-              dicFlag: false,
-              // cascaderItem: ["residentialId"],
-              props: {
-                label: "name",
-                value: "id"
-              },
-              dicFormatter: (res) => {
-                return res.data.records;
-              },
-              rules: [{
-                required: true,
-                message: "请输入所属小区",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入区行政编码",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "所属小区",
+            prop: "residentialId",
+            // slot: true,
+            type: "select",
+            search: true,
+            searchFilterable: true,
+            // dicUrl: "/api/cyzh-community/residential/list?size=900&regionArea={{key}}",
+            dicUrl: "/api/cyzh-community/residential/list?size=900",
+            dicFormatter:(res)=>{
+              return res.data.records;//返回字典的层级结构
             },
-            {
-              label: "具体地址",
-              prop: "address",
-              width: 180,
-              search: true,
-              overHidden: true,
-              rules: [{
-                required: true,
-                message: "请输入具体地址",
-                trigger: "blur"
-              }]
+            // dicFlag: false,
+            filterable: true,
+            props: {
+              label: "name",
+              value: "id"
             },
+            rules: [{
+              required: true,
+              message: "请选择所属小区",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "具体地址",
+            prop: "address",
+            width: 180,
+            search: true,
+            overHidden: true,
+            rules: [{
+              required: true,
+              message: "请输入具体地址",
+              trigger: "blur"
+            }]
+          },
 
-            {
-              label: "Mac编码",
-              prop: "macAddress",
-              width: 110,
-              rules: [{
-                required: true,
-                message: "请输入Mac编码",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "创建时间",
-              prop: "createTime",
-              display: false,
-              width: 150,
-              rules: [{
-                required: true,
-                message: "请输入创建时间",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备状态",
-              prop: "deviceStatus",
-              type: "select",
-              width: 80,
-              dicUrl:"/api/blade-system/dict-biz/dictionary?code=face_device_status",
-              props: {
-                label: 'dictValue',
-                value: 'dictKey'
-              },
-              dataType: "number",
-              rules: [{
-                required: true,
-                message: "请输入设备状态：0-离线 2-mac异常",
-                trigger: "blur"
-              }]
-            },
-            {
-              label:'',
-              prop:'mapSelect',
-              // row: true,
-              // span: 20,
-              formslot: true,
-              hide: true,
-            },
-            {
-              label: "经度",
-              prop: "longitude",
-              width: 100,
-              overHidden: true,
-              rules: [{
-                required: true,
-                message: "请输入经度",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "纬度",
-              prop: "latitude",
-              width: 100,
-              overHidden: true,
-              rules: [{
-                required: true,
-                message: "请输入纬度",
-                trigger: "blur"
-              }]
+          // {
+          //   label: "Mac编码",
+          //   prop: "macAddress",
+          //   width: 110,
+          //   rules: [{
+          //     required: true,
+          //     message: "请输入Mac编码",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "创建时间",
+            prop: "createTime",
+            display: false,
+            width: 150,
+            rules: [{
+              required: true,
+              message: "请输入创建时间",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备状态",
+            prop: "deviceStatus",
+            type: "select",
+            width: 80,
+            dicUrl:"/api/blade-system/dict-biz/dictionary?code=face_device_status",
+            props: {
+              label: 'dictValue',
+              value: 'dictKey'
             },
+            dataType: "number",
+            rules: [{
+              required: true,
+              message: "请输入设备状态：0-离线 2-mac异常",
+              trigger: "blur"
+            }]
+          },
+          {
+            label:'',
+            prop:'mapSelect',
+            // row: true,
+            // span: 20,
+            formslot: true,
+            hide: true,
+          },
+          {
+            label: "经度",
+            prop: "longitude",
+            width: 100,
+            overHidden: true,
+            hide:true,
+            rules: [{
+              required: true,
+              message: "请输入经度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "纬度",
+            prop: "latitude",
+            width: 100,
+            overHidden: true,
+            hide:true,
+            rules: [{
+              required: true,
+              message: "请输入纬度",
+              trigger: "blur"
+            }]
+          },
 
 
 
-          ]
-        },
-        data: []
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.doordevice_add, false),
+        viewBtn: this.vaildData(this.permission.doordevice_view, false),
+        delBtn: this.vaildData(this.permission.doordevice_delete, false),
+        editBtn: this.vaildData(this.permission.doordevice_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.doordevice_add, false),
-          viewBtn: this.vaildData(this.permission.doordevice_view, false),
-          delBtn: this.vaildData(this.permission.doordevice_delete, false),
-          editBtn: this.vaildData(this.permission.doordevice_edit, false)
-        };
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  watch: {
+    'form.mapSelect': {
+      handler: function(value) {
+        if (!value){
+          return
+        }else{
+          this.form.longitude = this.form.mapSelect.longitude;
+          this.form.latitude = this.form.mapSelect.latitude;
+        }
       },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    }
+  },
+  mounted() {
+    let tenantType = localStorage.getItem("tenantType");
+    const residentialColumn = this.findObject(this.option.column, "residentialId");
+    if (tenantType == 1) { //园区
+      residentialColumn.label = "所属区域";
+    } else { //社区
+      residentialColumn.label = "所属小区";
+    }
+  },
+  methods: {
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
-    },
-    watch: {
-      'form.mapSelect': {
-        handler: function(value) {
-          if (!value){
-            return
-          }else{
-            this.form.longitude = this.form.mapSelect.longitude;
-            this.form.latitude = this.form.mapSelect.latitude;
-          }
-        },
-      }
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
     },
-    mounted() {
-      let tenantType = localStorage.getItem("tenantType");
-      const residentialColumn = this.findObject(this.option.column, "residentialId");
-      if (tenantType == 1) { //园区
-        residentialColumn.label = "所属区域";
-      } else { //社区
-        residentialColumn.label = "所属小区";
-      }
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
     },
-    methods: {
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage){
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize){
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/device/elevatoralarm.vue

@@ -42,329 +42,330 @@
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove} from "@/api/device/elevatoralarm";
-  import {getAlarmVideo} from "@/api/device/elevatoralarm";
-  import {mapGetters} from "vuex";
-  import {startPlay, stopPlay} from "@/api/device/elevatorUtil";
+import {getList, getDetail, add, update, remove} from "@/api/device/elevatoralarm";
+import {getAlarmVideo} from "@/api/device/elevatoralarm";
+import {mapGetters} from "vuex";
+import {startPlay, stopPlay} from "@/api/device/elevatorUtil";
 
-  export default {
-    name: "elevatorAlarm",
-    data() {
-      return {
-        form: {},
-        query: {},
-        videoAlarmName: '',
-        videoAlarmVisible: false,
-        player: null,
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            /*{
-              label: "告警编号",
-              prop: "alarmCode",
-              rules: [{
-                required: true,
-                message: "请输入告警编号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "电梯注册编码",
-              prop: "registerCode",
-              rules: [{
-                required: true,
-                message: "请输入电梯注册编码",
-                trigger: "blur"
-              }]
-            },*/
-            {
-              label: "小区名称",
-              prop: "residentialName",
-              // search: true,
-              // searchSpan: 4,
+export default {
+  name: "elevatorAlarm",
+  data() {
+    return {
+      form: {},
+      query: {},
+      videoAlarmName: '',
+      videoAlarmVisible: false,
+      player: null,
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height:'auto',
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        menuWidth:350,
+        column: [
+          /*{
+            label: "告警编号",
+            prop: "alarmCode",
+            rules: [{
+              required: true,
+              message: "请输入告警编号",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "电梯注册编码",
+            prop: "registerCode",
+            rules: [{
+              required: true,
+              message: "请输入电梯注册编码",
+              trigger: "blur"
+            }]
+          },*/
+          {
+            label: "小区名称",
+            prop: "residentialName",
+            // search: true,
+            // searchSpan: 4,
 
+          },
+          {
+            label: "小区",
+            prop: "residentialId",
+            type: "select",
+            hide: true,
+            search: true,
+            searchSpan: 4,
+            searchFilterable: true,
+            // remote: true,
+            //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
+            dicUrl: "/api/cyzh-community/residential/list?size=1000&name={{key}}",
+            // dicUrl: "/api/community/elevator/elevator/getListWithYtelevatorXq",
+            props:{
+              label: "name",
+              value: "id"
             },
-            {
-              label: "小区",
-              prop: "residentialId",
-              type: "select",
-              hide: true,
-              search: true,
-              searchSpan: 4,
-              searchFilterable: true,
-              // remote: true,
-              //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
-              dicUrl: "/api/cyzh-community/residential/list?size=1000&name={{key}}",
-              // dicUrl: "/api/community/elevator/elevator/getListWithYtelevatorXq",
-              props:{
-                label: "name",
-                value: "id"
-              },
-            },
-            {
-              label: "告警大类",
-              prop: "standardType",
-              type: "select",
-              search: true,
-              searchSpan: 4,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_standard_type",
-              props:{
-                label: "dictValue",
-                value: "dictKey",
-              },
-              rules: [{
-                required: true,
-                message: "请输入告警大类{9000001:报警 ,9000002:故障, 9000004:事件}",
-                trigger: "blur"
-              }]
+          },
+          {
+            label: "告警大类",
+            prop: "standardType",
+            type: "select",
+            search: true,
+            searchSpan: 4,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_standard_type",
+            props:{
+              label: "dictValue",
+              value: "dictKey",
             },
-            {
-              label: "告警类型",
-              prop: "alarmType",
-              type: "select",
-              search: true,
-              searchSpan: 4,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_alarm_type",
-              props:{
-                label: "dictValue",
-                value: "dictKey",
-              },
-              rules: [{
-                required: true,
-                message: "请输入告警类型",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入告警大类{9000001:报警 ,9000002:故障, 9000004:事件}",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警类型",
+            prop: "alarmType",
+            type: "select",
+            search: true,
+            searchSpan: 4,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_alarm_type",
+            props:{
+              label: "dictValue",
+              value: "dictKey",
             },
-            {
-              label: "告警状态",
-              prop: "alarmStatus",
-              type: "select",
-              search: true,
-              searchSpan: 4,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_alarm_status",
-              dataType: "number",
-              props:{
-                label: "dictValue",
-                value: "dictKey",
-              },
-              rules: [{
-                required: true,
-                message: "请输入告警状态{1：告警中，6：自动结束，7：超期结束，8：自动处理}",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警时间",
-              prop: "alarmTime",
-              rules: [{
-                required: true,
-                message: "请输入告警时间",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警结束时间",
-              prop: "alarmEndTime",
-              rules: [{
-                required: true,
-                message: "请输入告警结束时间",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入告警类型",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警状态",
+            prop: "alarmStatus",
+            type: "select",
+            search: true,
+            searchSpan: 4,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_alarm_status",
+            dataType: "number",
+            props:{
+              label: "dictValue",
+              value: "dictKey",
             },
+            rules: [{
+              required: true,
+              message: "请输入告警状态{1：告警中，6：自动结束，7：超期结束，8：自动处理}",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警时间",
+            prop: "alarmTime",
+            rules: [{
+              required: true,
+              message: "请输入告警时间",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警结束时间",
+            prop: "alarmEndTime",
+            rules: [{
+              required: true,
+              message: "请输入告警结束时间",
+              trigger: "blur"
+            }]
+          },
 
-            {
-              label: "云梯状态",
-              prop: "ytStatus",
-              type: "select",
-              search: true,
-              searchSpan: 4,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_status",
-              props:{
-                label: "dictValue",
-                value: "dictKey",
-              },
-              rules: [{
-                required: true,
-                message: "请输入云梯告警状态{20：正常，40：演示，50：测试}",
-                trigger: "blur"
-              }]
+          {
+            label: "云梯状态",
+            prop: "ytStatus",
+            type: "select",
+            search: true,
+            searchSpan: 4,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=yt_status",
+            props:{
+              label: "dictValue",
+              value: "dictKey",
             },
-          ]
-        },
-        data: []
+            rules: [{
+              required: true,
+              message: "请输入云梯告警状态{20：正常，40：演示，50：测试}",
+              trigger: "blur"
+            }]
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.elevatoralarm_add, false),
+        viewBtn: this.vaildData(this.permission.elevatoralarm_view, false),
+        delBtn: this.vaildData(this.permission.elevatoralarm_delete, false),
+        editBtn: this.vaildData(this.permission.elevatoralarm_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.elevatoralarm_add, false),
-          viewBtn: this.vaildData(this.permission.elevatoralarm_view, false),
-          delBtn: this.vaildData(this.permission.elevatoralarm_delete, false),
-          editBtn: this.vaildData(this.permission.elevatoralarm_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
-        });
-        return ids.join(",");
-      }
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  props:["registerCode"],
+  methods: {
+    videoClose(){
+      stopPlay(this.player);
     },
-    props:["registerCode"],
-    methods: {
-      videoClose(){
-        stopPlay(this.player);
-      },
-      getAlarmVideoData(row){
-        let alarmCode = row.alarmCode;
-        this.videoAlarmName = row.$alarmType;
-        this.videoAlarmVisible = true;
-        alarmCode && getAlarmVideo(alarmCode).then(res => {
-          if (res.data.code == 200 && res.data.data.code == 0){
-            let videoUrl = res.data.data.data.urlSec;
-            this.videoDetail(videoUrl);
-          }
-        });
+    getAlarmVideoData(row){
+      let alarmCode = row.alarmCode;
+      this.videoAlarmName = row.$alarmType;
+      this.videoAlarmVisible = true;
+      alarmCode && getAlarmVideo(alarmCode).then(res => {
+        if (res.data.code == 200 && res.data.data.code == 0){
+          let videoUrl = res.data.data.data.urlSec;
+          this.videoDetail(videoUrl);
+        }
+      });
 
-      },
-      videoDetail(videoUrl){
+    },
+    videoDetail(videoUrl){
 
-        let elementId = 'videoAlarm';
-        this.player = startPlay(elementId, videoUrl, this.player);
-      },
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+      let elementId = 'videoAlarm';
+      this.player = startPlay(elementId, videoUrl, this.player);
+    },
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        params.registerCode = this.registerCode;
-        if (params.registerCode){
-          this.option.column[1].search = false;
-        }
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage){
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize){
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      params.registerCode = this.registerCode;
+      if (params.registerCode){
+        this.option.column[1].search = false;
+      }
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/device/iotalarm.vue

@@ -24,360 +24,364 @@
 </template>
 
 <script>
-  import{
-    getDetailByDeviceId
-  } from "../../api/device/iotdevice.js";
-  import {
-    getList,
-    getDetail,
-    add,
-    update,
-    remove
-  } from "../../api/device/iotalarm.js";
-  import {
-    mapGetters
-  } from "vuex";
-  // import {add as addDeviceJob} from "@/api/jobs/devicejob";
-  // import center from "@/components/grid/components/center";
+import{
+  getDetailByDeviceId
+} from "../../api/device/iotdevice.js";
+import {
+  getList,
+  getDetail,
+  add,
+  update,
+  remove
+} from "../../api/device/iotalarm.js";
+import {
+  mapGetters
+} from "vuex";
+import {add as addDeviceJob} from "../../api/order/deviceorder";
+// import center from "@/components/grid/components/center";
 
-  export default {
-    data() {
-      return {
-        deviceDetail:{},
-        alarmDetail: {},
-        alarmDetailVisible: false,
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          submitBtn:false,
-          emptyBtn:false,
-          // menuWidth: 200,
-          menuAlign:'center',
-          height: 'auto',
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          addBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            {
-              label: "告警原因",
-              prop: "name",
-              width: 100,
-              hide:true,
-              rules: [{
-                required: false,
-                message: "请输入告警原因",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备sn号",
-              prop: "deviceId",
-              search: true,
-              width: 150,
-              rules: [{
-                required: false,
-                message: "请输入告警设备sn号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备名称",
-              prop: "deviceName",
-              search: true,
-              width: 270,
-              overHidden: true,
-              rules: [{
-                required: false,
-                message: "请输入设备名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备类型",
-              prop: "deviceType",
-              type: "select",
-              search: true,
-              width: 100,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: false,
-                message: "请输入设备类型",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警次数",
-              prop: "alarmTimes",
-              width:80,
-              align:'center',
-              rules: [{
-                required: false,
-                message: "请输入告警次数",
-                trigger: "blur"
-              }]
+export default {
+  data() {
+    return {
+      deviceDetail:{},
+      alarmDetail: {},
+      alarmDetailVisible: false,
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        submitBtn:false,
+        emptyBtn:false,
+        // menuWidth: 200,
+        menuAlign:'center',
+        height: 'auto',
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        addBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        menuWidth:350,
+        column: [
+          {
+            label: "告警原因",
+            prop: "name",
+            width: 100,
+            hide:true,
+            rules: [{
+              required: false,
+              message: "请输入告警原因",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备sn号",
+            prop: "deviceId",
+            search: true,
+            width: 150,
+            rules: [{
+              required: false,
+              message: "请输入告警设备sn号",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备名称",
+            prop: "deviceName",
+            search: true,
+            width: 270,
+            overHidden: true,
+            rules: [{
+              required: false,
+              message: "请输入设备名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备类型",
+            prop: "deviceType",
+            type: "select",
+            search: true,
+            width: 100,
+            // dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_type",
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=iot_device_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              label: "告警等级",
-              prop: "level",
-              width:100,
-              align: 'center',
-              type: "select",
-              // dataType: "number",
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_level",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              rules: [{
-                required: false,
-                message: "请输入告警等级 1:严重告警,2:警告告警,3:提示告警",
-                trigger: "blur"
-              }]
+            dataType: "number",
+            rules: [{
+              required: false,
+              message: "请输入设备类型",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警次数",
+            prop: "alarmTimes",
+            width:80,
+            align:'center',
+            rules: [{
+              required: false,
+              message: "请输入告警次数",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警等级",
+            prop: "level",
+            width:100,
+            align: 'center',
+            type: "select",
+            // dataType: "number",
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_level",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            // {
-            //   label: "监测值",
-            //   prop: "monitorValue",
-            //   slot: true,
-            //   width: 100,
-            //   rules: [{
-            //     required: false,
-            //     message: "请输入监测值",
-            //     trigger: "blur"
-            //   }]
-            // },
+            rules: [{
+              required: false,
+              message: "请输入告警等级 1:严重告警,2:警告告警,3:提示告警",
+              trigger: "blur"
+            }]
+          },
+          // {
+          //   label: "监测值",
+          //   prop: "monitorValue",
+          //   slot: true,
+          //   width: 100,
+          //   rules: [{
+          //     required: false,
+          //     message: "请输入监测值",
+          //     trigger: "blur"
+          //   }]
+          // },
 
-            {
-              label: "告警时间",
-              prop: "recordTime",
-              width: 170,
-              align:"center",
-              rules: [{
-                required: false,
-                message: "请输入告警时间",
-                trigger: "blur"
-              }]
-            },
-            // {
-            //   label: "告警状态",
-            //   prop: "status",
-            //   type: "select",
-            //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_status",
-            //   props: {
-            //     label: "dictValue",
-            //     value: "dictKey"
-            //   },
-            //   dataType: "number",
-            //   rules: [{
-            //     required: false,
-            //     message: "请输入告警状态，0 实时告警，1-历史告警",
-            //     trigger: "blur"
-            //   }]
-            // },
-            {
-              label: "告警类型",
-              prop: "alarmType",
-              type: "select",
-              // width: 100,
-              // align:'center',
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: false,
-                message: "请输入告警类型, 0-业务告警；1-设备告警",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "最新告警时间",
-              prop: "lastNoticeDate",
-              width:170,
-              align:"center",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入最新告警时间",
-                trigger: "blur"
-              }]
+          {
+            label: "告警时间",
+            prop: "recordTime",
+            width: 170,
+            align:"center",
+            rules: [{
+              required: false,
+              message: "请输入告警时间",
+              trigger: "blur"
+            }]
+          },
+          // {
+          //   label: "告警状态",
+          //   prop: "status",
+          //   type: "select",
+          //   dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_status",
+          //   props: {
+          //     label: "dictValue",
+          //     value: "dictKey"
+          //   },
+          //   dataType: "number",
+          //   rules: [{
+          //     required: false,
+          //     message: "请输入告警状态，0 实时告警，1-历史告警",
+          //     trigger: "blur"
+          //   }]
+          // },
+          {
+            label: "告警类型",
+            prop: "alarmType",
+            type: "select",
+            // width: 100,
+            // align:'center',
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=alarm_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-          ]
-        },
-        data: []
+            dataType: "number",
+            rules: [{
+              required: false,
+              message: "请输入告警类型, 0-业务告警；1-设备告警",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "最新告警时间",
+            prop: "lastNoticeDate",
+            width:170,
+            align:"center",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入最新告警时间",
+              trigger: "blur"
+            }]
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.alarmlist_add, false),
+        viewBtn: this.vaildData(this.permission.alarmlist_view, false),
+        delBtn: this.vaildData(this.permission.alarmlist_delete, false),
+        editBtn: this.vaildData(this.permission.alarmlist_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.alarmlist_add, false),
-          viewBtn: this.vaildData(this.permission.alarmlist_view, false),
-          delBtn: this.vaildData(this.permission.alarmlist_delete, false),
-          editBtn: this.vaildData(this.permission.alarmlist_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  methods: {
+    ViewAlarmDetail(row) {
+      getDetailByDeviceId(row.deviceId).then(res=>{
+        this.deviceDetail = res.data.data;
+        console.log(res)
+      });
+      this.alarmDetail = row;
+      this.alarmDetailVisible = true;
+    },
+    createAlarmJob(row){
+      console.log(row,"生成工单");
+      addDeviceJob(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        // loading();
+        console.log("进入error")
+        // window.console.log(error);
+      });
     },
-    methods: {
-      ViewAlarmDetail(row) {
-        getDetailByDeviceId(row.deviceId).then(res=>{
-          this.deviceDetail = res.data.data;
-          console.log(res)
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        this.alarmDetail = row;
-        this.alarmDetailVisible = true;
-      },
-      createAlarmJob(row){
-        // addDeviceJob(row).then(() => {
-        //   this.onLoad(this.page);
-        //   this.$message({
-        //     type: "success",
-        //     message: "操作成功!"
-        //   });
-        //   done();
-        // }, error => {
-        //   loading();
-        //   window.console.log(error);
-        // });
-      },
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage) {
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize) {
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        // this.query.deviceName = "阅海万家"
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      // this.query.deviceName = "阅海万家"
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/device/iotalarmgroup.vue

@@ -41,466 +41,478 @@
 </template>
 
 <script>
-  import {
-    getList,
-    getDetail,
-    add,
-    update,
-    remove
-  } from "@/api/device/iotalarmgroup";
-  import {
-    getList as getUserList,
-    getDetail as getUserDetail,
-    add as addUser,
-    updata as updateUser,
-    remove as removeUser
-  } from "@/api/device/iotalarmgroupuser";
-  import {
-    mapGetters
-  } from "vuex";
+import {
+  getList,
+  getDetail,
+  add,
+  update,
+  remove
+} from "@/api/device/iotalarmgroup";
+import {
+  getList as getUserList,
+  getDetail as getUserDetail,
+  add as addUser,
+  updata as updateUser,
+  remove as removeUser
+} from "@/api/device/iotalarmgroupuser";
+import {
+  mapGetters
+} from "vuex";
 
-  var DIC = {
-    yes_no: [{
-      label: '否',
-      value: 0
-    }, {
-      label: '是',
-      value: 1
-    }]
-  }
+var DIC = {
+  yes_no: [{
+    label: '否',
+    value: 0
+  }, {
+    label: '是',
+    value: 1
+  }]
+}
+
+export default {
+  data() {
+    return {
+      formParent: {},
+      query: {},
+      loading: true,
+      pageParent: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      optionParent: {
+        height: 'auto',
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 8,
+        border: true,
+        index: true,
+        viewBtn: true,
+        dialogWidth: 600,
+        selection: true,
+        dialogClickModal: false,
+        menuPosition: "center",
+        menuWidth:340,
+        column: [{
+          label: "组名",
+          prop: "name",
+          row: true,
+          span: 20,
+          rules: [{
+            required: true,
+            message: "请输入组名",
+            trigger: "blur"
+          }]
 
-  export default {
-    data() {
-      return {
-        formParent: {},
-        query: {},
-        loading: true,
-        pageParent: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
         },
-        selectionList: [],
-        optionParent: {
-          height: 'auto',
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 8,
-          border: true,
-          index: true,
-          viewBtn: true,
-          dialogWidth: 600,
-          selection: true,
-          dialogClickModal: false,
-          menuPosition: "center",
-          column: [{
-            label: "组名",
-            prop: "name",
-            row: true,
+          {
+            label: "归属",
+            prop: "residentialId",
             span: 20,
+            row: true,
+            type: "select",
+            searchSpan: 12,
+            remote: true,
+            //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
+            dicUrl: "/api/cyzh-community/residential/list?size=10000&name={{key}}",
+            props: {
+              label: "name",
+              value: "id"
+            },
+            searchFilterable: true,
+            search: true,
+            slot: true,
             rules: [{
               required: true,
-              message: "请输入组名",
+              message: "请输入",
               trigger: "blur"
             }]
-
           },
-            {
-              label: "归属",
-              prop: "residentialId",
-              span: 20,
-              row: true,
-              type: "select",
-              searchSpan: 12,
-              remote: true,
-              //回显的时候有问题，如果所选不在前十条内，下拉框只会显示id
-              dicUrl: "/api/cyzh-community/residential/list?size=10000&name={{key}}",
-              props: {
-                label: "name",
-                value: "id"
-              },
-              searchFilterable: true,
-              search: true,
-              slot: true,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备类型",
-              prop: "tag",
-              type: "select",
-              row: true,
-              span: 20,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=iot_device_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey",
-              },
-              dataType: "number",
-              rules: [{
-                required: true,
-                message: "请输入标识",
-                trigger: "blur"
-              }]
+          {
+            label: "设备类型",
+            prop: "tag",
+            type: "select",
+            row: true,
+            span: 20,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=iot_device_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey",
             },
-          ]
-        },
-        dataParent: [],
-        //-----------------------------------------------------------------------------------------
-        formChild: {},
-        loadingChild: true,
-        pageChild: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
+            dataType: "number",
+            rules: [{
+              required: true,
+              message: "请输入标识",
+              trigger: "blur"
+            }]
+          },
+        ]
+      },
+      dataParent: [],
+      //-----------------------------------------------------------------------------------------
+      formChild: {},
+      loadingChild: true,
+      pageChild: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      optionChild: {
+        height: 'auto',
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        menuPosition: "center",
+        dialogWidth: 600,
+        border: true,
+        index: true,
+        viewBtn: true,
+        selection: true,
+        dialogClickModal: false,
+        menuWidth:340,
+        column: [{
+          label: "责任人",
+          prop: "person",
+          row: true,
+          span: 20,
+          labelWidth: 120,
+          rules: [{
+            required: true,
+            message: "请输入责任人",
+            trigger: "blur"
+          }]
         },
-        optionChild: {
-          height: 'auto',
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          menuPosition: "center",
-          dialogWidth: 600,
-          border: true,
-          index: true,
-          viewBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [{
-            label: "责任人",
-            prop: "person",
+          {
+            label: "责任人电话",
+            prop: "phone",
             row: true,
-            span: 20,
             labelWidth: 120,
+            span: 20,
             rules: [{
               required: true,
-              message: "请输入责任人",
+              message: "请输入责任人电话",
               trigger: "blur"
             }]
           },
-            {
-              label: "责任人电话",
-              prop: "phone",
-              row: true,
-              labelWidth: 120,
-              span: 20,
-              rules: [{
-                required: true,
-                message: "请输入责任人电话",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "是否为处理人",
-              prop: "isHandler",
-              type: "switch",
-              row: true,
-              span: 20,
-              labelWidth: 120,
-              dicData: DIC.yes_no,
-              mock: {
-                type: 'dic'
+          {
+            label: "是否为处理人",
+            prop: "isHandler",
+            type: "switch",
+            row: true,
+            span: 20,
+            labelWidth: 120,
+            // dicData: DIC.yes_no,
+            // mock: {
+            //   type: 'dic'
+            // },
+            dicData:[
+              {
+                label:'是',
+                value:true
               },
-              displayAs: 'switch',
-              rules: [{
-                required: false,
-                message: "请输入是否为处理人",
-                trigger: "blur"
-              }]
-            },
-          ]
-        },
-        dataChild: []
+              {
+                label:'否',
+                value: false
+              }
+            ],
+            displayAs: 'switch',
+            rules: [{
+              required: false,
+              message: "请输入是否为处理人",
+              trigger: "blur"
+            }]
+          },
+        ]
+      },
+      dataChild: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.iotalarmgroup_add, false),
+        viewBtn: this.vaildData(this.permission.iotalarmgroup_view, false),
+        delBtn: this.vaildData(this.permission.iotalarmgroup_delete, false),
+        editBtn: this.vaildData(this.permission.iotalarmgroup_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.alarmgroup_add, false),
-          viewBtn: this.vaildData(this.permission.alarmgroup_view, false),
-          delBtn: this.vaildData(this.permission.alarmgroup_delete, false),
-          editBtn: this.vaildData(this.permission.alarmgroup_edit, false)
-        };
-      },
-      permissionListChild() {
-        return {
-          addBtn: this.vaildData(this.permission.alarmgroupuser_add, false),
-          viewBtn: this.vaildData(this.permission.alarmgroupuser_view, false),
-          delBtn: this.vaildData(this.permission.alarmgroupuser_delete, false),
-          editBtn: this.vaildData(this.permission.alarmgroupuser_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    permissionListChild() {
+      return {
+        addBtn: this.vaildData(this.permission.iotalarmgroupuser_add, false),
+        viewBtn: this.vaildData(this.permission.iotalarmgroupuser_view, false),
+        delBtn: this.vaildData(this.permission.iotalarmgroupuser_delete, false),
+        editBtn: this.vaildData(this.permission.iotalarmgroupuser_edit, false)
+      };
+    },
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  mounted() {
+    let tenantType = localStorage.getItem("tenantType");
+    const residentialIdColumn = this.findObject(this.optionParent.column, "residentialId");
+    if (tenantType == 1) { //园区
+      residentialIdColumn.label = "所属区域"
+    } else { //社区
+      residentialIdColumn.label = "所属小区"
+    }
+  },
+  methods: {
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoadParent(this.pageParent);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
     },
-    mounted() {
-      let tenantType = localStorage.getItem("tenantType");
-      const residentialIdColumn = this.findObject(this.optionParent.column, "residentialId");
-      if (tenantType == 1) { //园区
-        residentialIdColumn.label = "所属区域"
-      } else { //社区
-        residentialIdColumn.label = "所属小区"
-      }
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoadParent(this.pageParent);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
     },
-    methods: {
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoadParent(this.pageParent);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoadParent(this.pageParent);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoadParent(this.pageParent);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoadParent(this.pageParent);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.formParent.id).then(res => {
-            this.formParent = res.data.data;
-          });
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.formParent.id).then(res => {
+          this.formParent = res.data.data;
+        });
+      }
+      done();
+    },
+    handleRowClick(row) {
+      this.query = {};
+      this.parentId = row.id;
+      debugger
+      this.dictValue = row.dictValue;
+      this.$refs.crudChild.value.code = row.code;
+      this.$refs.crudChild.value.parentId = row.id;
+      // this.$refs.crudChild.option.column.filter(item => {
+      //   if (item.prop === "code") {
+      //     item.value = row.code;
+      //   }
+      //   if (item.prop === "parentId") {
+      //     item.value = row.id;
+      //   }
+      // });
+      this.onLoadChild(this.pageChild);
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoadParent(this.pageParent);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.pageParent.currentPage = 1;
+      this.onLoadParent(this.pageParent, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.pageParent.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.pageParent.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoadParent(this.pageParent, this.query);
+    },
+    onLoadParent(page, params = {}) {
+      this.loading = true;
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.pageParent.total = data.total;
+        this.dataParent = data.records;
+        if (this.dataParent.length > 0) {
+          this.parentId = this.dataParent[0].id;
+          this.onLoadChild(this.pageChild);
         }
-        done();
-      },
-      handleRowClick(row) {
-        this.query = {};
-        this.parentId = row.id;
-        debugger
-        this.dictValue = row.dictValue;
-        this.$refs.crudChild.value.code = row.code;
-        this.$refs.crudChild.value.parentId = row.id;
-        // this.$refs.crudChild.option.column.filter(item => {
-        //   if (item.prop === "code") {
-        //     item.value = row.code;
-        //   }
-        //   if (item.prop === "parentId") {
-        //     item.value = row.id;
-        //   }
-        // });
+        this.loading = false;
+        this.selectionClear();
+      });
+    },
+    rowSaveChild(row, done, loading) {
+      row.groupId = this.parentId;
+      addUser(row).then(() => {
         this.onLoadChild(this.pageChild);
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoadParent(this.pageParent);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.pageParent.currentPage = 1;
-        this.onLoadParent(this.pageParent, params);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
         done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage) {
-        this.pageParent.currentPage = currentPage;
-      },
-      sizeChange(pageSize) {
-        this.pageParent.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoadParent(this.pageParent, this.query);
-      },
-      onLoadParent(page, params = {}) {
-        this.loading = true;
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.pageParent.total = data.total;
-          this.dataParent = data.records;
-          if (this.dataParent.length > 0) {
-            this.parentId = this.dataParent[0].id;
-            this.onLoadChild(this.pageChild);
-          }
-          this.loading = false;
-          this.selectionClear();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdateChild(row, index, done, loading) {
+      // row.groupId = this.parentId;
+      updateUser(row).then(() => {
+        this.onLoadChild(this.pageChild);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      rowSaveChild(row, done, loading) {
-        row.groupId = this.parentId;
-        addUser(row).then(() => {
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDelChild(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return removeUser(row.id);
+        })
+        .then(() => {
           this.onLoadChild(this.pageChild);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdateChild(row, index, done, loading) {
-        // row.groupId = this.parentId;
-        updateUser(row).then(() => {
+    },
+    handleDeleteChild() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoadChild(this.pageChild);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDelChild(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return removeUser(row.id);
-          })
-          .then(() => {
-            this.onLoadChild(this.pageChild);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDeleteChild() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoadChild(this.pageChild);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpenChild(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getUserDetail(this.formChild.id).then(res => {
-            this.formChild = res.data.data;
-          });
-        }
-        done();
-      },
-      searchResetChild() {
-        this.query = {};
-        this.onLoadChild(this.pageChild);
-      },
-      searchChangeChild(params, done) {
-        this.query = params;
-        this.pageChild.currentPage = 1;
-        this.onLoadChild(this.pageChild, params);
-        done();
-      },
-      selectionChangeChild(list) {
-        this.selectionList = list;
-      },
-      selectionClearChild() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChangeChild(currentPage) {
-        this.pageChild.currentPage = currentPage;
-      },
-      sizeChangeChild(pageSize) {
-        this.pageChild.pageSize = pageSize;
-      },
-      refreshChangeChild() {
-        this.onLoadChild(this.pageChild, this.query);
-      },
-      onLoadChild(page, params = {}) {
-        this.loadingChild = true;
-        params.groupId = this.parentId;
-        getUserList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.pageChild.total = data.total;
-          this.dataChild = data.records;
-          this.dataChild.forEach(item => {
-            item.isHandler = item.isHandler == 1;
-          })
-          this.loadingChild = false;
-          this.selectionClearChild();
+    },
+    beforeOpenChild(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getUserDetail(this.formChild.id).then(res => {
+          this.formChild = res.data.data;
         });
       }
+      done();
+    },
+    searchResetChild() {
+      this.query = {};
+      this.onLoadChild(this.pageChild);
+    },
+    searchChangeChild(params, done) {
+      this.query = params;
+      this.pageChild.currentPage = 1;
+      this.onLoadChild(this.pageChild, params);
+      done();
+    },
+    selectionChangeChild(list) {
+      this.selectionList = list;
+    },
+    selectionClearChild() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChangeChild(currentPage) {
+      this.pageChild.currentPage = currentPage;
+    },
+    sizeChangeChild(pageSize) {
+      this.pageChild.pageSize = pageSize;
+    },
+    refreshChangeChild() {
+      this.onLoadChild(this.pageChild, this.query);
+    },
+    onLoadChild(page, params = {}) {
+      this.loadingChild = true;
+      params.groupId = this.parentId;
+      getUserList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.pageChild.total = data.total;
+        this.dataChild = data.records;
+        this.dataChild.forEach(item => {
+          item.isHandler = item.isHandler == 1;
+        })
+        this.loadingChild = false;
+        this.selectionClearChild();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/device/iotdevice.vue

@@ -49,7 +49,7 @@
           <el-carousel :interval="5000" type="card" height="200px">
             <el-carousel-item v-for="item in deviceCount" :key="item">
               <el-container>
-                <el-header style="background-color: rgb(83,168,255);height: 65px">
+                <el-header style="background-color: rgb(29,67,58);height: 65px">
                   <div class="titleLabel">
                     <el-row :gutter="40">
                       <div @click="deviceClick(item.deviceType)">
@@ -96,10 +96,11 @@
 
       <template slot="mapSelectForm" slot-scope="scope">
         <div>
-          <input class="el-input--small el-input__inner" placeholder="选择地址" @click="mapVisible = true">
+          <el-button @click="mapVisible = true"> 选择地址</el-button>
           <el-dialog :append-to-body="true" :close-on-click-modal="false" :modal-append-to-body="false" :visible.sync="mapVisible"
                      title="编辑地址" width="80%">
-            <customAvueMap v-if="mapVisible" v-model="scope.row.mapSelect"></customAvueMap>
+            <!--            <customAvueMap v-if="mapVisible" v-model="scope.row.mapSelect"></customAvueMap>-->
+            <editPolygonMap v-if="mapVisible" v-model="scope.row.mapSelect" :visible.sync="mapVisible"></editPolygonMap>
           </el-dialog>
         </div>
         <!-- <avue-map v-model="scope.row.mapSelect"></avue-map> -->
@@ -113,11 +114,11 @@
               操作<i class="el-icon-arrow-down el-icon--right"> </i>
             </span>
             <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item v-if="permission.smartdevice_view" icon="el-icon-view" type="text" @click.native="viewDetail(scope.row)">查看</el-dropdown-item>
-              <el-dropdown-item v-if="permission.smartdevice_edit" divided @click.native="edit(scope.row)" icon="el-icon-edit">编辑</el-dropdown-item>
-              <el-dropdown-item v-if="permission.bind_residential" icon="el-icon-paperclip" :class="{changeBind: !!scope.row.residentialId}" type="text" @click.native="showDeviceBind(scope.row)">{{!scope.row.residentialId ? '设备绑定' : '设备改绑'}}</el-dropdown-item>
-              <el-dropdown-item v-if="permission.bind_enterprises" icon="el-icon-office-building" type="text" @click.native="showEnterpriseSelect(scope.row)">绑定企业</el-dropdown-item>
-              <el-dropdown-item divided v-if="permission.alarm_view && scope.row.imei!=''" @click.native="viewAlarmRecord(scope.row)" icon="el-icon-bell">历史告警</el-dropdown-item>
+              <el-dropdown-item icon="el-icon-view" type="text" @click.native="viewDetail(scope.row)">查看</el-dropdown-item>
+              <el-dropdown-item divided @click.native="edit(scope.row)" icon="el-icon-edit">编辑</el-dropdown-item>
+              <el-dropdown-item icon="el-icon-paperclip" :class="{changeBind: !!scope.row.residentialId}" type="text" @click.native="showDeviceBind(scope.row)">{{!scope.row.residentialId ? '设备绑定' : '设备改绑'}}</el-dropdown-item>
+              <el-dropdown-item icon="el-icon-office-building" type="text" @click.native="showEnterpriseSelect(scope.row)">绑定企业</el-dropdown-item>
+              <el-dropdown-item divided v-if="scope.row.imei!=''" @click.native="viewAlarmRecord(scope.row)" icon="el-icon-bell">历史告警</el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
         </el-button>
@@ -177,1287 +178,1290 @@
 
 
 <script>
-  import {
-    getList,
-    getDetail,
-    add,
-    update,
-    remove,
-    deviceListCount
-  } from "@/api/device/iotdevice";
-  // import { getList as getUserList} from "@/api/system/user";
-  import {
-    mapGetters
-  } from "vuex";
-  // import {getAllList} from "@/api/community/residential";
-  import alarmhistory from "../../components/device/alarmhistory.vue";
-  import {dataDisplay} from "@/api/dataview/dataviewoption";
-  import customAvueMap from "../../components/residential/customAvueMap.vue"
-  export default {
-    components:{
-      alarmhistory,customAvueMap
-    },
-    data() {
-      return {
-        mapVisible:false,
-        mapVisible2:false,
-        // alarmRecordForm:{},
-        // treeDateList:[],
-        enterpriseVisible:false,
-        enterpriseList:[],
-        enterpriseSelect:[],
+import {
+  getList,
+  getDetail,
+  add,
+  update,
+  remove,
+  deviceListCount
+} from "@/api/device/iotdevice";
+// import { getList as getUserList} from "@/api/system/user";
+import {
+  mapGetters
+} from "vuex";
+import {getAllList} from "@/api/community/residential";
+import alarmhistory from "../../components/device/alarmhistory.vue";
+import {dataDisplay} from "@/api/dataview/dataviewoption";
+import customAvueMap from "../../components/residential/customAvueMap.vue"
+import editPolygonMap from "../../components/residential/editPolygonMap.vue"
+import {getEnterpriseList} from "../../api/device/iotdevice";
+export default {
+  components:{
+    alarmhistory,customAvueMap,editPolygonMap
+  },
+  data() {
+    return {
+      mapVisible:false,
+      mapVisible2:false,
+      // alarmRecordForm:{},
+      // treeDateList:[],
+      enterpriseVisible:false,
+      enterpriseList:[],
+      enterpriseSelect:[],
 
-        imei:"",
-        alarmRecordVisible: false,
-        editForm: {},
-        editVisible: false,
-        residentialId : '',
-        SmartDeviceStaticVo: {},
-        deviceCount: {},
-        allVisible: true,
-        activeName: "first",
-        detailVisible: false,
-        bindVisible: false,
-        residentialList: [],
-        selectValue: '',
-        form: {},
-        detailForm:{
-        },
-        viewVisible:false,
-        titleText: '',
-        deviceDetail: {},
+      imei:"",
+      alarmRecordVisible: false,
+      editForm: {},
+      editVisible: false,
+      residentialId : '',
+      SmartDeviceStaticVo: {},
+      deviceCount: {},
+      allVisible: true,
+      activeName: "first",
+      detailVisible: false,
+      bindVisible: false,
+      residentialList: [],
+      selectValue: '',
+      form: {},
+      detailForm:{
+      },
+      viewVisible:false,
+      titleText: '',
+      deviceDetail: {},
 
-        alarmData: [],
-        alarmSetData: [],
+      alarmData: [],
+      alarmSetData: [],
 
-        homeUserData: [],
-        bindedHomeUserData: [],
-        query: {},
-        loading: true,
+      homeUserData: [],
+      bindedHomeUserData: [],
+      query: {},
+      loading: true,
 
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
 
-        selectionList: [],
-        dataShowOption: {},
-        transhbinRecordOption: {
-          height: 'auto',
-          menuWidth: 200,
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
+      selectionList: [],
+      dataShowOption: {},
+      transhbinRecordOption: {
+        height: 'auto',
+        menuWidth: 200,
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
 
-          addBtn: false,
+        addBtn: false,
 
-          menu: false,
+        menu: false,
 
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            // {
-            //   label:"企业绑定",
-            //   prop:"enterpriseBind",
-            //   type: 'tree',
-            //   filterText:'搜索关键字制自定义',
-            //   multiple:true,
-            //   dicData:DIC
-            // },
-            {
-              label: "时间",
-              prop: "time",
-              rules: [{
-                required: true,
-                message: "请输入设备唯一标识",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备号",
-              prop: "deviceNumber",
-              rules: [{
-                required: true,
-                message: "请输入设备唯一标识",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备名称",
-              prop: "deviceName",
-              search: true,
-              rules: [{
-                required: true,
-                message: "请输入设备名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "描述",
-              prop: "introduce",
-              rules: [{
-                required: true,
-                message: "请输入设备注册平台标识,1:aep,2:华为,3:厂商",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "卡号",
-              prop: "cardNo",
-              rules: [{
-                required: true,
-                message: "请输入产品,对应 aep 产品的 apikey",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "重量",
-              prop: "heavy",
-              rules: [{
-                required: true,
-                message: "请输入操作者",
-                trigger: "blur"
-              }]
-            }
-          ]
-        },
+        selection: true,
+        dialogClickModal: false,
+        column: [
+          // {
+          //   label:"企业绑定",
+          //   prop:"enterpriseBind",
+          //   type: 'tree',
+          //   filterText:'搜索关键字制自定义',
+          //   multiple:true,
+          //   dicData:DIC
+          // },
+          {
+            label: "时间",
+            prop: "time",
+            rules: [{
+              required: true,
+              message: "请输入设备唯一标识",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备号",
+            prop: "deviceNumber",
+            rules: [{
+              required: true,
+              message: "请输入设备唯一标识",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备名称",
+            prop: "deviceName",
+            search: true,
+            rules: [{
+              required: true,
+              message: "请输入设备名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "描述",
+            prop: "introduce",
+            rules: [{
+              required: true,
+              message: "请输入设备注册平台标识,1:aep,2:华为,3:厂商",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "卡号",
+            prop: "cardNo",
+            rules: [{
+              required: true,
+              message: "请输入产品,对应 aep 产品的 apikey",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "重量",
+            prop: "heavy",
+            rules: [{
+              required: true,
+              message: "请输入操作者",
+              trigger: "blur"
+            }]
+          }
+        ]
+      },
 
-        option: {
-          height: 'auto',
-          menuWidth: 300,
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 20,
-          border: true,
-          index: true,
-          viewBtn:false,
-          // addBtn: false,
-          delBtn: false,
-          editBtn: false,
-          selection: true,
-          dialogClickModal: false,
-          column: [{
-            label: "设备编码",
-            prop: "deviceId",
-            width: 100,
+      option: {
+        height: 'auto',
+        menuWidth: 300,
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 20,
+        border: true,
+        index: true,
+        viewBtn:false,
+        // addBtn: false,
+        delBtn: false,
+        editBtn: false,
+        selection: true,
+        dialogClickModal: false,
+        column: [{
+          label: "设备编码",
+          prop: "deviceId",
+          width: 100,
+          hide: true,
+          // search:true,
+          // display: false,
+          rules: [{
+            required: true,
+            message: "请输入设备唯一标识",
+            trigger: "blur"
+          }]
+        },
+          {
+            label: "IMEI号",
+            prop: "imei",
+            width: 130,
             hide: true,
-            // search:true,
-            // display: false,
             rules: [{
               required: true,
-              message: "请输入设备唯一标识",
+              message: "请输入IMEI号",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备名称",
+            prop: "deviceName",
+            searchSpan: 4,
+            search: true,
+            // width:200,
+            overHidden:true,
+            rules: [{
+              required: true,
+              message: "请输入设备名称",
               trigger: "blur"
             }]
           },
-            {
-              label: "IMEI号",
-              prop: "imei",
-              width: 130,
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入IMEI号",
-                trigger: "blur"
-              }]
+          {
+            label: "所属小区",
+            prop: "residentialId",
+            type:"select",
+            searchSpan: 4,
+            remote: true,
+            dicUrl: "/api/cyzh-community/residential/list?size=10000&name={{key}}",
+            props:{
+              label: "name",
+              value: "id"
             },
-            {
-              label: "设备名称",
-              prop: "deviceName",
-              searchSpan: 4,
-              search: true,
-              // width:200,
-              overHidden:true,
-              rules: [{
-                required: true,
-                message: "请输入设备名称",
-                trigger: "blur"
-              }]
+            dicFormatter:(res)=>{
+              return res.data.records;
             },
-            {
-              label: "所属小区",
-              prop: "residentialId",
-              type:"select",
-              searchSpan: 4,
-              remote: true,
-              dicUrl: "/api/cyzh-community/residential/list?size=10000&name={{key}}",
-              props:{
-                label: "name",
-                value: "id"
-              },
-              dicFormatter:(res)=>{
-                return res.data.records;
-              },
-              searchFilterable: true,
-              search: true,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
+            searchFilterable: true,
+            search: true,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "企业",
+            prop: "enterpriseIds",
+            type: "select",
+            searchSpan: 4,
+            display: false,
+            hide: true,
+            remote: true,
+            dicUrl: "/api/cyzh-enterprise/enterprise/list?enterpriseName={{key}}",
+            props:{
+              label: "enterpriseName",
+              value: "id"
             },
-            {
-              label: "企业",
-              prop: "enterpriseIds",
-              type: "select",
-              searchSpan: 4,
-              display: false,
-              hide: true,
-              remote: true,
-              dicUrl: "/api/cyzh-enterprise/enterprise/list?enterpriseName={{key}}",
-              props:{
-                label: "enterpriseName",
-                value: "id"
-              },
-              searchFilterable: true,
-              search: false,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
+            searchFilterable: true,
+            search: false,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备注册平台标识",
+            prop: "isAep",
+            type: "select",
+            width: 80,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_registry_label",
+            props: {
+              label: 'dictValue',
+              value: 'dictKey'
             },
-            {
-              label: "设备注册平台标识",
-              prop: "isAep",
-              type: "select",
-              width: 80,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_registry_label",
-              props: {
-                label: 'dictValue',
-                value: 'dictKey'
-              },
-              dataType: "number",
-              // search: true,
-              searchLabelWidth: 140,
-              searchSpan: 8,
+            dataType: "number",
+            // search: true,
+            searchLabelWidth: 140,
+            searchSpan: 8,
 
-              rules: [{
-                required: true,
-                message: "请输入设备注册平台标识,1:aep,2:华为,3:厂商",
-                trigger: "blur"
-              }]
-            },
-            {
-              label:'',
-              prop:'mapSelect',
-              // row: true,
-              // span: 20,
-              formslot: true,
-              hide: true,
-            },
-            {
-              label: "经纬度",
-              prop: "latitudeLongitude",
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入经纬度",
-                trigger: "blur"
-              }]
-            },
+            rules: [{
+              required: true,
+              message: "请输入设备注册平台标识,1:aep,2:华为,3:厂商",
+              trigger: "blur"
+            }]
+          },
+          {
+            label:'',
+            prop:'mapSelect',
+            // row: true,
+            // span: 20,
+            formslot: true,
+            hide: true,
+          },
+          {
+            label: "经纬度",
+            prop: "latitudeLongitude",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入经纬度",
+              trigger: "blur"
+            }]
+          },
 
-            {
-              label: "apikey",
-              prop: "masterKey",
-              hide: true,
-              viewDisplay:false,
-              rules: [{
-                required: false,
-                message: "请输入产品,对应 aep 产品的 apikey",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "操作者",
-              prop: "operator",
-              hide: true,
-              addDisplay: false,
-              display: false,
-              rules: [{
-                required: false,
-                message: "请输入操作者",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "产品ID",
-              prop: "productId",
-              hide: true,
-              addDisplay: false,
-              display: false,
-              rules: [{
-                required: false,
-                message: "请输入产品ID",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "订阅事件",
-              prop: "autoObserver",
-              type: "select",
-              hide: true,
-              addDisplay: false,
-              display: false,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=auto_subscribe",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: false,
-                message: "请输入0 自动订阅（默认），1 取消自动订阅 (LWM2M 协议选填，其他协议不填）",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备类型",
-              prop: "deviceType",
-              type: "select",
-              width: 70,
-              searchSpan: 4,
-              search: true,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=iot_device_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "string",
-              // display: false,
-              rules: [{
-                required: true,
-                message: "请输入设备类型",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "安装位置",
-              prop: "deviceInstallAddress",
-              search: true,
-              viewDisplay:false,
-              rules: [{
-                required: false,
-                message: "请输入安装位置",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备状态",
-              prop: "deviceStatus",
-              type: "select",
-              search: true,
-              searchSpan: 4,
-              width: 70,
-              display: false,
-              addDisplay: false,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_status",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: true,
-                message: "请输入设备状态",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "电池电量",
-              prop: "battery",
-              slot: true,
-              width: 100,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: true,
-                message: "请输入电池电量",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "信号强度",
-              prop: "signalIntensity",
-              slot: true,
-              display: false,
-              width: 80,
-              addDisplay: false,
-              rules: [{
-                required: true,
-                message: "请输入信号强度",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "厂家名称",
-              prop: "manufacturers",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入厂家名称",
-                trigger: "blur"
-              }]
+          {
+            label: "apikey",
+            prop: "masterKey",
+            hide: true,
+            viewDisplay:false,
+            rules: [{
+              required: false,
+              message: "请输入产品,对应 aep 产品的 apikey",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "操作者",
+            prop: "operator",
+            hide: true,
+            addDisplay: false,
+            display: false,
+            rules: [{
+              required: false,
+              message: "请输入操作者",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "产品ID",
+            prop: "productId",
+            hide: true,
+            addDisplay: false,
+            display: false,
+            rules: [{
+              required: false,
+              message: "请输入产品ID",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "订阅事件",
+            prop: "autoObserver",
+            type: "select",
+            hide: true,
+            addDisplay: false,
+            display: false,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=auto_subscribe",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              label: "厂商编号(附录)",
-              prop: "manufacturersNo",
-              hide: true,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: false,
-                message: "请输入厂商编号(附录)",
-                trigger: "blur"
-              }]
+            dataType: "number",
+            rules: [{
+              required: false,
+              message: "请输入0 自动订阅（默认），1 取消自动订阅 (LWM2M 协议选填，其他协议不填）",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备类型",
+            prop: "deviceType",
+            type: "select",
+            width: 70,
+            searchSpan: 4,
+            search: true,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=iot_device_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              label: "设备型号",
-              prop: "deviceSpecld",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入设备型号",
-                trigger: "blur"
-              }]
+            dataType: "string",
+            // display: false,
+            rules: [{
+              required: true,
+              message: "请输入设备类型",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "安装位置",
+            prop: "deviceInstallAddress",
+            search: true,
+            viewDisplay:false,
+            rules: [{
+              required: false,
+              message: "请输入安装位置",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备状态",
+            prop: "deviceStatus",
+            type: "select",
+            search: true,
+            searchSpan: 4,
+            width: 70,
+            display: false,
+            addDisplay: false,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_status",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
+            dataType: "number",
+            rules: [{
+              required: true,
+              message: "请输入设备状态",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "电池电量",
+            prop: "battery",
+            slot: true,
+            width: 100,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: true,
+              message: "请输入电池电量",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "信号强度",
+            prop: "signalIntensity",
+            slot: true,
+            display: false,
+            width: 80,
+            addDisplay: false,
+            rules: [{
+              required: true,
+              message: "请输入信号强度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "厂家名称",
+            prop: "manufacturers",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入厂家名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "厂商编号(附录)",
+            prop: "manufacturersNo",
+            hide: true,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: false,
+              message: "请输入厂商编号(附录)",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备型号",
+            prop: "deviceSpecld",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入设备型号",
+              trigger: "blur"
+            }]
+          },
 
-            {
-              label: "iccid",
-              prop: "iccid",
-              display: false,
-              addDisplay: false,
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入iccid",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "Mcu软件版本",
-              prop: "mcuEdition",
-              hide: true,
-              viewDisplay:false,
-              rules: [{
-                required: false,
-                message: "请输入Mcu软件版本",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "NB模组型号",
-              prop: "nbModuleModel",
-              hide: true,
-              viewDisplay:false,
-              rules: [{
-                required: false,
-                message: "请输入NB模组型号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "NB模组版本信息",
-              prop: "nbModuleEdition",
-              hide: true,
-              viewDisplay:false,
-              rules: [{
-                required: false,
-                message: "请输入NB模组版本信息",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "最后更新时间",
-              prop: "lastUpdateTime",
-              hide: true,
-              display: false,
-              addDisplay: false,
-              type: "datetime",
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
-              rules: [{
-                required: false,
-                message: "请输入最后更新时间",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "心跳保护时间",
-              prop: "heartbeatTime",
-              type: "datetime",
-              addDisplay: false,
-              display: false,
-              hide: true,
-              valueFormat: "yyyy-MM-dd HH:mm:ss",
-              rules: [{
-                required: false,
-                message: "请输入心跳保护时间",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "无线信号覆盖等级",
-              prop: "wirelessLevel",
-              hide: true,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: false,
-                message: "请输入无线信号覆盖等级",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "当前磁场值",
-              prop: "magneticField",
-              hide: true,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: false,
-                message: "请输入当前磁场值",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "终端发射功率",
-              prop: "transmittingPower",
-              hide: true,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: false,
-                message: "请输入终端发射功率",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "终端接收功率",
-              prop: "receivingPower",
-              hide: true,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: false,
-                message: "请输入终端接收功率",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "信噪比",
-              prop: "signalNoiseRatio",
-              hide: true,
-              addDisplay: false,
-              display: false,
-              rules: [{
-                required: false,
-                message: "请输入信噪比",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "IMSI",
-              prop: "imsi",
-              hide: true,
-              viewDisplay:false,
-              rules: [{
-                required: false,
-                message: "请输入IMSI",
-                trigger: "blur"
-              }]
-            },
+          {
+            label: "iccid",
+            prop: "iccid",
+            display: false,
+            addDisplay: false,
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入iccid",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "Mcu软件版本",
+            prop: "mcuEdition",
+            hide: true,
+            viewDisplay:false,
+            rules: [{
+              required: false,
+              message: "请输入Mcu软件版本",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "NB模组型号",
+            prop: "nbModuleModel",
+            hide: true,
+            viewDisplay:false,
+            rules: [{
+              required: false,
+              message: "请输入NB模组型号",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "NB模组版本信息",
+            prop: "nbModuleEdition",
+            hide: true,
+            viewDisplay:false,
+            rules: [{
+              required: false,
+              message: "请输入NB模组版本信息",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "最后更新时间",
+            prop: "lastUpdateTime",
+            hide: true,
+            display: false,
+            addDisplay: false,
+            type: "datetime",
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            rules: [{
+              required: false,
+              message: "请输入最后更新时间",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "心跳保护时间",
+            prop: "heartbeatTime",
+            type: "datetime",
+            addDisplay: false,
+            display: false,
+            hide: true,
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            rules: [{
+              required: false,
+              message: "请输入心跳保护时间",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "无线信号覆盖等级",
+            prop: "wirelessLevel",
+            hide: true,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: false,
+              message: "请输入无线信号覆盖等级",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "当前磁场值",
+            prop: "magneticField",
+            hide: true,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: false,
+              message: "请输入当前磁场值",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "终端发射功率",
+            prop: "transmittingPower",
+            hide: true,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: false,
+              message: "请输入终端发射功率",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "终端接收功率",
+            prop: "receivingPower",
+            hide: true,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: false,
+              message: "请输入终端接收功率",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "信噪比",
+            prop: "signalNoiseRatio",
+            hide: true,
+            addDisplay: false,
+            display: false,
+            rules: [{
+              required: false,
+              message: "请输入信噪比",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "IMSI",
+            prop: "imsi",
+            hide: true,
+            viewDisplay:false,
+            rules: [{
+              required: false,
+              message: "请输入IMSI",
+              trigger: "blur"
+            }]
+          },
 
-          ]
+        ]
+      },
+      //详情字段
+      detailoption: {
+        submitBtn:false,
+        emptyBtn:false,
+        column: [{
+          label: "设备编码",
+          prop: "deviceId",
+          width: 100,
+          hide: true,
+          // search:true,
+          // display: false,
+          rules: [{
+            required: true,
+            message: "请输入设备唯一标识",
+            trigger: "blur"
+          }]
         },
-        //详情字段
-        detailoption: {
-          submitBtn:false,
-          emptyBtn:false,
-          column: [{
-            label: "设备编码",
-            prop: "deviceId",
-            width: 100,
+          {
+            label: "IMEI号",
+            prop: "imei",
+            width: 130,
             hide: true,
-            // search:true,
-            // display: false,
             rules: [{
               required: true,
-              message: "请输入设备唯一标识",
+              message: "请输入IMEI号",
               trigger: "blur"
             }]
           },
-            {
-              label: "IMEI号",
-              prop: "imei",
-              width: 130,
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入IMEI号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备名称",
-              prop: "deviceName",
-              searchSpan: 4,
-              search: true,
-              // width:200,
-              overHidden:true,
-              rules: [{
-                required: true,
-                message: "请输入设备名称",
-                trigger: "blur"
-              }]
+          {
+            label: "设备名称",
+            prop: "deviceName",
+            searchSpan: 4,
+            search: true,
+            // width:200,
+            overHidden:true,
+            rules: [{
+              required: true,
+              message: "请输入设备名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "归属",
+            prop: "residentialId",
+            type:"select",
+            searchSpan: 4,
+            remote: true,
+            dicUrl: "/api/cyzh-community/residential/list?name={{key}}",
+            props:{
+              label: "name",
+              value: "id"
             },
-            {
-              label: "归属",
-              prop: "residentialId",
-              type:"select",
-              searchSpan: 4,
-              remote: true,
-              dicUrl: "/api/cyzh-community/residential/list?name={{key}}",
-              props:{
-                label: "name",
-                value: "id"
-              },
-              searchFilterable: true,
-              search: true,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
+            searchFilterable: true,
+            search: true,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "企业",
+            prop: "enterpriseIds",
+            type: "select",
+            searchSpan: 4,
+            display: false,
+            hide: true,
+            remote: true,
+            dicUrl: "/api/cyzh-enterprise/enterprise/list?enterpriseName={{key}}",
+            props:{
+              label: "enterpriseName",
+              value: "id"
             },
-            {
-              label: "企业",
-              prop: "enterpriseIds",
-              type: "select",
-              searchSpan: 4,
-              display: false,
-              hide: true,
-              remote: true,
-              dicUrl: "/api/cyzh-enterprise/enterprise/list?enterpriseName={{key}}",
-              props:{
-                label: "enterpriseName",
-                value: "id"
-              },
-              searchFilterable: true,
-              search: false,
-              rules: [{
-                required: true,
-                message: "请输入",
-                trigger: "blur"
-              }]
+            searchFilterable: true,
+            search: false,
+            rules: [{
+              required: true,
+              message: "请输入",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备注册平台标识",
+            prop: "isAep",
+            type: "select",
+            width: 80,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_registry_label",
+            props: {
+              label: 'dictValue',
+              value: 'dictKey'
             },
-            {
-              label: "设备注册平台标识",
-              prop: "isAep",
-              type: "select",
-              width: 80,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_registry_label",
-              props: {
-                label: 'dictValue',
-                value: 'dictKey'
-              },
-              dataType: "number",
-              // search: true,
-              searchLabelWidth: 140,
-              searchSpan: 8,
+            dataType: "number",
+            // search: true,
+            searchLabelWidth: 140,
+            searchSpan: 8,
 
-              rules: [{
-                required: true,
-                message: "请输入设备注册平台标识,1:aep,2:华为,3:厂商",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "经纬度",
-              prop: "latitudeLongitude",
-              hide: true,
-              rules: [{
-                required: true,
-                message: "请输入经纬度",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "操作者",
-              prop: "operator",
-              hide: true,
-              addDisplay: false,
-              display: false,
-              rules: [{
-                required: false,
-                message: "请输入操作者",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "产品ID",
-              prop: "productId",
-              hide: true,
-              addDisplay: false,
-              display: false,
-              rules: [{
-                required: false,
-                message: "请输入产品ID",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "订阅事件",
-              prop: "autoObserver",
-              type: "select",
-              hide: true,
-              addDisplay: false,
-              display: false,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=auto_subscribe",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: false,
-                message: "请输入0 自动订阅（默认），1 取消自动订阅 (LWM2M 协议选填，其他协议不填）",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备类型",
-              prop: "deviceType",
-              type: "select",
-              width: 70,
-              searchSpan: 4,
-              search: true,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=iot_device_type",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "string",
-              // display: false,
-              rules: [{
-                required: true,
-                message: "请输入设备类型",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备状态",
-              prop: "deviceStatus",
-              type: "select",
-              search: true,
-              searchSpan: 4,
-              width: 70,
-              display: false,
-              addDisplay: false,
-              dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_status",
-              props: {
-                label: "dictValue",
-                value: "dictKey"
-              },
-              dataType: "number",
-              rules: [{
-                required: true,
-                message: "请输入设备状态",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "电池电量",
-              prop: "battery",
-              slot: true,
-              width: 100,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: true,
-                message: "请输入电池电量",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "信号强度",
-              prop: "signalIntensity",
-              slot: true,
-              display: false,
-              width: 80,
-              addDisplay: false,
-              rules: [{
-                required: true,
-                message: "请输入信号强度",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "厂家名称",
-              prop: "manufacturers",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入厂家名称",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入设备注册平台标识,1:aep,2:华为,3:厂商",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "经纬度",
+            prop: "latitudeLongitude",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入经纬度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "操作者",
+            prop: "operator",
+            hide: true,
+            addDisplay: false,
+            display: false,
+            rules: [{
+              required: false,
+              message: "请输入操作者",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "产品ID",
+            prop: "productId",
+            hide: true,
+            addDisplay: false,
+            display: false,
+            rules: [{
+              required: false,
+              message: "请输入产品ID",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "订阅事件",
+            prop: "autoObserver",
+            type: "select",
+            hide: true,
+            addDisplay: false,
+            display: false,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=auto_subscribe",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              label: "厂商编号(附录)",
-              prop: "manufacturersNo",
-              hide: true,
-              display: false,
-              addDisplay: false,
-              rules: [{
-                required: false,
-                message: "请输入厂商编号(附录)",
-                trigger: "blur"
-              }]
+            dataType: "number",
+            rules: [{
+              required: false,
+              message: "请输入0 自动订阅（默认），1 取消自动订阅 (LWM2M 协议选填，其他协议不填）",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备类型",
+            prop: "deviceType",
+            type: "select",
+            width: 70,
+            searchSpan: 4,
+            search: true,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=iot_device_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              label: "设备型号",
-              prop: "deviceSpecld",
-              hide: true,
-              rules: [{
-                required: false,
-                message: "请输入设备型号",
-                trigger: "blur"
-              }]
+            dataType: "string",
+            // display: false,
+            rules: [{
+              required: true,
+              message: "请输入设备类型",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备状态",
+            prop: "deviceStatus",
+            type: "select",
+            search: true,
+            searchSpan: 4,
+            width: 70,
+            display: false,
+            addDisplay: false,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_status",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
+            dataType: "number",
+            rules: [{
+              required: true,
+              message: "请输入设备状态",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "电池电量",
+            prop: "battery",
+            slot: true,
+            width: 100,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: true,
+              message: "请输入电池电量",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "信号强度",
+            prop: "signalIntensity",
+            slot: true,
+            display: false,
+            width: 80,
+            addDisplay: false,
+            rules: [{
+              required: true,
+              message: "请输入信号强度",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "厂家名称",
+            prop: "manufacturers",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入厂家名称",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "厂商编号(附录)",
+            prop: "manufacturersNo",
+            hide: true,
+            display: false,
+            addDisplay: false,
+            rules: [{
+              required: false,
+              message: "请输入厂商编号(附录)",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备型号",
+            prop: "deviceSpecld",
+            hide: true,
+            rules: [{
+              required: false,
+              message: "请输入设备型号",
+              trigger: "blur"
+            }]
+          },
 
-          ]
-        },
-        data: []
+        ]
+      },
+      data: []
+    };
+  },
+
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.smartdevice_add, false),
+        viewBtn: this.vaildData(this.permission.smartdevice_view, false),
+        delBtn: this.vaildData(this.permission.smartdevice_delete, false),
+        editBtn: this.vaildData(this.permission.smartdevice_edit, false)
       };
     },
-
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.smartdevice_add, false),
-          viewBtn: this.vaildData(this.permission.smartdevice_view, false),
-          delBtn: this.vaildData(this.permission.smartdevice_delete, false),
-          editBtn: this.vaildData(this.permission.smartdevice_edit, false)
-        };
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  watch: {
+    'form.mapSelect': {
+      handler: function (value) {
+        if (!value) {
+          return
+        } else {
+          this.form.longitude = this.form.mapSelect.longitude;
+          this.form.latitude = this.form.mapSelect.latitude;
+          this.form.latitudeLongitude = this.form.mapSelect.longitude + ',' + this.form.mapSelect.latitude;
+          this.form.deviceInstallAddress = this.form.mapSelect.formattedAddress;
+        }
       },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
-        });
-        return ids.join(",");
-      }
     },
-    watch: {
-      'form.mapSelect': {
-        handler: function (value) {
-          if (!value) {
-            return
-          } else {
-            this.form.longitude = this.form.mapSelect.longitude;
-            this.form.latitude = this.form.mapSelect.latitude;
-            this.form.latitudeLongitude = this.form.mapSelect.longitude + ',' + this.form.mapSelect.latitude;
-            this.form.deviceInstallAddress = this.form.mapSelect.formattedAddress;
-          }
-        },
-      },
-      'editForm.mapSelect': {
-        handler: function (value) {
-          if (!value) {
-            return
-          } else {
-            this.editForm.longitude = this.editForm.mapSelect.longitude;
-            this.editForm.latitude = this.editForm.mapSelect.latitude;
-            this.editForm.latitudeLongitude = this.editForm.mapSelect.longitude + ',' + this.editForm.mapSelect.latitude;
-            // this.editForm.deviceInstallAddress = this.editForm.mapSelect.formattedAddress;
-          }
-        },
+    'editForm.mapSelect': {
+      handler: function (value) {
+        if (!value) {
+          return
+        } else {
+          this.editForm.longitude = this.editForm.mapSelect.longitude;
+          this.editForm.latitude = this.editForm.mapSelect.latitude;
+          this.editForm.latitudeLongitude = this.editForm.mapSelect.longitude + ',' + this.editForm.mapSelect.latitude;
+          // this.editForm.deviceInstallAddress = this.editForm.mapSelect.formattedAddress;
+        }
       },
     },
-    created() {
-      deviceListCount({deviceUsage : 20}).then(res =>{
-        this.deviceCount = res.data.data;
-      })
-    },
-    mounted() {
-      this.option.column[4].search = this.permission.bind_enterprises;
+  },
+  created() {
+    deviceListCount({deviceUsage : 20}).then(res =>{
+      this.deviceCount = res.data.data;
+    })
+  },
+  mounted() {
+    this.option.column[4].search = this.permission.bind_enterprises;
 
-      let tenantType = localStorage.getItem("tenantType");
-      const residentialColumn = this.findObject(this.option.column, "residentialId");
-      if (tenantType == 1) { //园区
-        residentialColumn.label = "所属区域";
-      } else { //社区
-        residentialColumn.label = "所属小区";
-      }
+    let tenantType = localStorage.getItem("tenantType");
+    const residentialColumn = this.findObject(this.option.column, "residentialId");
+    if (tenantType == 1) { //园区
+      residentialColumn.label = "所属区域";
+    } else { //社区
+      residentialColumn.label = "所属小区";
+    }
 
+  },
+  methods: {
+    dataShow(obj){
+      return dataDisplay(obj,this)
     },
-    methods: {
-      dataShow(obj){
-        return dataDisplay(obj,this)
-      },
-      select(deviceType,deviceStatus,params={}) {
-        this.$refs.crud.searchForm.deviceType = deviceType;
-        this.query.deviceType = deviceType;
-        this.$refs.crud.searchForm.deviceStatus = deviceStatus;
-        this.query.deviceStatus = deviceStatus;
-        this.onLoad(this.page,this.query);
-      },
-      enterpriseBindDevice(){
-        let enterpriseSelectStr = '';
+    select(deviceType,deviceStatus,params={}) {
+      this.$refs.crud.searchForm.deviceType = deviceType;
+      this.query.deviceType = deviceType;
+      this.$refs.crud.searchForm.deviceStatus = deviceStatus;
+      this.query.deviceStatus = deviceStatus;
+      this.onLoad(this.page,this.query);
+    },
+    enterpriseBindDevice(){
+      let enterpriseSelectStr = '';
 
-        for (let i = 0; i < this.enterpriseSelect.length; i++){
-          enterpriseSelectStr += this.enterpriseSelect[i]+',';
-        }
-        this.form.enterpriseIds = enterpriseSelectStr;
-        console.log(this.form.enterpriseIds);
-        //保存
-        update(this.form).then(() => {
-          this.onLoad(this.page);
-          this.enterpriseVisible = false;
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-        }, error => {
-          console.log(error);
+      for (let i = 0; i < this.enterpriseSelect.length; i++){
+        enterpriseSelectStr += this.enterpriseSelect[i]+',';
+      }
+      this.form.enterpriseIds = enterpriseSelectStr;
+      console.log(this.form.enterpriseIds);
+      //保存
+      update(this.form).then(() => {
+        this.onLoad(this.page);
+        this.enterpriseVisible = false;
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      showEnterpriseSelect(row){
-        if (this.enterpriseList.length == 0){
-          //  请求获取企业列表
-          getEnterpriseList().then(res => {
-            this.enterpriseList = res.data.data;
-            this.enterpriseVisible = true;
-            console.log(res);
-          })
-        }else{
+      }, error => {
+        console.log(error);
+      });
+    },
+    showEnterpriseSelect(row){
+      if (this.enterpriseList.length == 0){
+        //  请求获取企业列表
+        getEnterpriseList(5000).then(res => {
+          console.log(res.data.data,"企业列表数据");
+          this.enterpriseList = res.data.data.records;
           this.enterpriseVisible = true;
-        }
-        this.form = row;
-      },
-      viewAlarmRecord(row,params={}){
-        this.imei = row.imei;
-        this.alarmRecordVisible = true;
-        this.$nextTick(()=>{
-          this.$refs.alarmRecordRef.init();
+          console.log(res);
         })
-      },
-      submitSmartDevice(row,done,loading){
-        update(this.editForm).then(() => {
-          this.onLoad(this.page);
-          this.editVisible = false;
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
-        });
-      },
-      edit(row){
-        this.editForm = row;
-        this.editVisible = true;
-      },
-      deviceClick(type){
-        this.$refs.crud.searchForm.deviceType = type;
-        this.query.deviceType = type;
+      }else{
+        this.enterpriseVisible = true;
+      }
+      this.form = row;
+    },
+    viewAlarmRecord(row,params={}){
+      this.imei = row.imei;
+      this.alarmRecordVisible = true;
+      this.$nextTick(()=>{
+        this.$refs.alarmRecordRef.init();
+      })
+    },
+    submitSmartDevice(row,done,loading){
+      update(this.editForm).then(() => {
         this.onLoad(this.page);
-      },
-      handleClick(tab, event) {
-        console.log(tab + " " + event)
-      },
-      showDeviceBind(row){
-        this.selectValue = row.residentialId;
-        if (this.residentialList.length == 0){
-          //  请求获取小区列表
-          getAllList().then(res => {
-            this.residentialList = res.data.data;
-            this.bindVisible = true;
-          })
-        }else{
+        this.editVisible = false;
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    edit(row){
+      this.editForm = row;
+      this.editVisible = true;
+    },
+    deviceClick(type){
+      this.$refs.crud.searchForm.deviceType = type;
+      this.query.deviceType = type;
+      this.onLoad(this.page);
+    },
+    handleClick(tab, event) {
+      console.log(tab + " " + event)
+    },
+    showDeviceBind(row){
+      this.selectValue = row.residentialId;
+      if (this.residentialList.length == 0){
+        //  请求获取小区列表
+        getAllList(5000).then(res => {
+          this.residentialList = res.data.data.records;
           this.bindVisible = true;
-        }
-        this.form = row;
-      },
-      bindDevice(){
-        this.form.residentialId = this.selectValue;
-        //保存
-        update(this.form).then(() => {
-          this.onLoad(this.page);
-          this.bindVisible = false;
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-        }, error => {
-          console.log(error);
+        })
+      }else{
+        this.bindVisible = true;
+      }
+      this.form = row;
+    },
+    bindDevice(){
+      this.form.residentialId = this.selectValue;
+      //保存
+      update(this.form).then(() => {
+        this.onLoad(this.page);
+        this.bindVisible = false;
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-      },
-      rowView(row){
+      }, error => {
+        console.log(error);
+      });
+    },
+    rowView(row){
 
-      },
-      viewDetail(row) {
-        this.detailForm = row;
-        this.viewVisible = true;
-        // console.log("row" + JSON.stringify(row))
-        // this.titleText = row.$deviceType
-        // this.deviceDetail = row;
-        // /*getUserList(this.page.currentPage, this.page.pageSize, {residential: row.residentialId}).then(res =>{
-        //   this.alarmData = res.data.data.records;
-        // })*/
-        // this.residentialId = row.residentialId
-        // /*this.alarmData = [
-        //   {
-        //   name: "李德",
-        //   tel: "15089107336",
-        //   area: "阅海万家D区"
-        // }, {
-        //   name: "黄俊豪",
-        //   tel: "15145867336",
-        //   area: "阅海万家D区"
-        // }, {
-        //   name: "林旭光",
-        //   tel: "17899572954",
-        //   area: "阅海万家D区"
-        // }, {
-        //   name: "蔡志彬",
-        //   tel: "17899584512",
-        //   area: "阅海万家D区"
-        // }, {
-        //   name: "黄坚伟",
-        //   tel: "17899571256",
-        //   area: "阅海万家D区"
-        // } ];*/
-        // this.alarmSetData = [
-        //   {
-        //     name: "蔡志彬",
-        //     tel: "17899584512",
-        //     area: "阅海万家D区"
-        //   }, {
-        //     name: "黄坚伟",
-        //     tel: "17899571256",
-        //     area: "阅海万家D区"
-        //   }];
-        // this.homeUserData = [
-        //   {
-        //     name: "李德",
-        //     tel: "15089107336",
-        //     area: "阅海万家D区"
-        //   }, {
-        //     name: "黄俊豪",
-        //     tel: "15145867336",
-        //     area: "阅海万家D区"
-        //   }, {
-        //     name: "林旭光",
-        //     tel: "17899572954",
-        //     area: "阅海万家D区"
-        //   }, {
-        //     name: "蔡志彬",
-        //     tel: "17899584512",
-        //     area: "阅海万家D区"
-        //   }, {
-        //     name: "黄坚伟",
-        //     tel: "17899571256",
-        //     area: "阅海万家D区"
-        //   }];
-        // this.bindedHomeUserData = [];
-        // this.detailVisible = true;
-      },
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+    },
+    viewDetail(row) {
+      this.detailForm = row;
+      this.viewVisible = true;
+      // console.log("row" + JSON.stringify(row))
+      // this.titleText = row.$deviceType
+      // this.deviceDetail = row;
+      // /*getUserList(this.page.currentPage, this.page.pageSize, {residential: row.residentialId}).then(res =>{
+      //   this.alarmData = res.data.data.records;
+      // })*/
+      // this.residentialId = row.residentialId
+      // /*this.alarmData = [
+      //   {
+      //   name: "李德",
+      //   tel: "15089107336",
+      //   area: "阅海万家D区"
+      // }, {
+      //   name: "黄俊豪",
+      //   tel: "15145867336",
+      //   area: "阅海万家D区"
+      // }, {
+      //   name: "林旭光",
+      //   tel: "17899572954",
+      //   area: "阅海万家D区"
+      // }, {
+      //   name: "蔡志彬",
+      //   tel: "17899584512",
+      //   area: "阅海万家D区"
+      // }, {
+      //   name: "黄坚伟",
+      //   tel: "17899571256",
+      //   area: "阅海万家D区"
+      // } ];*/
+      // this.alarmSetData = [
+      //   {
+      //     name: "蔡志彬",
+      //     tel: "17899584512",
+      //     area: "阅海万家D区"
+      //   }, {
+      //     name: "黄坚伟",
+      //     tel: "17899571256",
+      //     area: "阅海万家D区"
+      //   }];
+      // this.homeUserData = [
+      //   {
+      //     name: "李德",
+      //     tel: "15089107336",
+      //     area: "阅海万家D区"
+      //   }, {
+      //     name: "黄俊豪",
+      //     tel: "15145867336",
+      //     area: "阅海万家D区"
+      //   }, {
+      //     name: "林旭光",
+      //     tel: "17899572954",
+      //     area: "阅海万家D区"
+      //   }, {
+      //     name: "蔡志彬",
+      //     tel: "17899584512",
+      //     area: "阅海万家D区"
+      //   }, {
+      //     name: "黄坚伟",
+      //     tel: "17899571256",
+      //     area: "阅海万家D区"
+      //   }];
+      // this.bindedHomeUserData = [];
+      // this.detailVisible = true;
+    },
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
+        });
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
 
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage) {
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize) {
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
 
 
-      onLoad(page, params = {}) {
-        this.loading = true;
-        params.deviceUsage = 20; //公共区域
-        /*getSmartDeviceStaticVo(Object.assign(params, this.query)).then(res =>{
-          this.SmartDeviceStaticVo = res.data.data;
-        })*/
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
-        });
+    onLoad(page, params = {}) {
+      this.loading = true;
+      params.deviceUsage = 20; //公共区域
+      /*getSmartDeviceStaticVo(Object.assign(params, this.query)).then(res =>{
+        this.SmartDeviceStaticVo = res.data.data;
+      })*/
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
 
 
-      }
     }
-  };
+  }
+};
 </script>
 
 <style scoped>
-  .avue-crud{
-    padding-bottom: 20px;
-    /* height: 800px; */
-  }
-  >>> .el-pagination{
-    position: absolute;
-    top: 0px;
-    bottom: 0px;
-    /* height: 100px; */
-  }
-  .shadow{
-    box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
-  }
-  .titleLabel{
-    color: white;
-    height: 65px;
-    line-height: 65px;
-  }
-  .titleText{
-    font-size: 25px;
-    font-weight: bolder;
-    padding-left: 10px;
-  }
-  .titleCount{
-    font-size: 25px;
-    font-weight: bolder;
-  }
-  .colMarginBottom{
-    margin-bottom: 0px;
-  }
-  .statusText{
-    font-size: 14px;
-    font-weight: bolder;
-    color: green;
-  }
-  .statusCount{
-    font-size: 14px;
-    font-weight: 700;
-    color: red;
-  }
-  .el-divider--vertical {
-    /* height: 100%; */
-  }
-  >>> .el-divider--horizontal{
-    margin: 0px !important;
-    margin-bottom: 5px !important;
-  }
-  >>> .el-main{
-    overflow: hidden;
-  }
-  >>> .divider-bottom{
-    margin: 0 !important;
-    margin-bottom: 10px !important;
-  }
-  >>> aside font {
-    cursor: pointer;
-  }
-  >>> .changeBind {
-    color: orange;
-  }
+.avue-crud{
+  padding-bottom: 20px;
+  /* height: 800px; */
+}
+>>> .el-pagination{
+  position: absolute;
+  top: 0px;
+  bottom: 0px;
+  /* height: 100px; */
+}
+.shadow{
+  box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
+}
+.titleLabel{
+  color: white;
+  height: 65px;
+  line-height: 65px;
+}
+.titleText{
+  font-size: 25px;
+  font-weight: bolder;
+  padding-left: 10px;
+}
+.titleCount{
+  font-size: 25px;
+  font-weight: bolder;
+}
+.colMarginBottom{
+  margin-bottom: 0px;
+}
+.statusText{
+  font-size: 14px;
+  font-weight: bolder;
+  color: green;
+}
+.statusCount{
+  font-size: 14px;
+  font-weight: 700;
+  color: red;
+}
+.el-divider--vertical {
+  /* height: 100%; */
+}
+>>> .el-divider--horizontal{
+  margin: 0px !important;
+  margin-bottom: 5px !important;
+}
+>>> .el-main{
+  overflow: hidden;
+}
+>>> .divider-bottom{
+  margin: 0 !important;
+  margin-bottom: 10px !important;
+}
+>>> aside font {
+  cursor: pointer;
+}
+>>> .changeBind {
+  color: orange;
+}
 
-  .el-carousel__item:nth-child(2n) {
-    background-color: rgb(217,236,255);
-  }
+.el-carousel__item:nth-child(2n) {
+  background-color: rgb(217,236,255);
+}
 
-  .el-carousel__item:nth-child(2n+1) {
-    background-color: rgb(236,245,255);
-  }
+.el-carousel__item:nth-child(2n+1) {
+  background-color: rgb(236,245,255);
+}
 </style>

src/views/device/videoSurveillance.vue

@@ -39,140 +39,140 @@
 
 
 <script>
-  import {
-    getList
-  } from "@/api/community/building"
-  import {
-    getByResidentialAndDeviceName
-  } from "@/api/device/videoclouddevice";
-  import {
-    getAllList
-  } from "@/api/community/residential";
-  import {
-    getTenantTypeDetailByTenantId
-  } from "../../api/system/tenant.js";
-  import {
-    mapGetters
-  } from "vuex";
-  export default {
-    data() {
-      // http://139.9.103.171/live?port=1935&app=myapp&stream=mystream
-      // http://139.9.103.171/live?port=1935&app=myapp&stream=mystream1
-      // http://139.9.103.171/live?port=1935&app=myapp&stream=mystream3
-      return {
-        selectBuilding: "",
-        buildingList:[],
-        tenantType: "",
-        deviceName: "",
-        selectResidential: "",
-        loading: false,
-        residentialList: [],
-        value: [],
-        // baseUrlVedio: "http://139.9.103.171/live?port=1935&app=myapp&stream=",
-        baseUrlVedio: "ws://36.103.228.148:8888/live/",
-        data: []
+import {
+  getList
+} from "@/api/community/building"
+import {
+  getByResidentialAndDeviceName
+} from "@/api/device/videoclouddevice";
+import {
+  getAllList
+} from "@/api/community/residential";
+import {
+  getTenantTypeDetailByTenantId
+} from "../../api/system/tenant.js";
+import {
+  mapGetters
+} from "vuex";
+export default {
+  data() {
+    // http://139.9.103.171/live?port=1935&app=myapp&stream=mystream
+    // http://139.9.103.171/live?port=1935&app=myapp&stream=mystream1
+    // http://139.9.103.171/live?port=1935&app=myapp&stream=mystream3
+    return {
+      selectBuilding: "",
+      buildingList:[],
+      tenantType: "",
+      deviceName: "",
+      selectResidential: "",
+      loading: false,
+      residentialList: [],
+      value: [],
+      // baseUrlVedio: "http://139.9.103.171/live?port=1935&app=myapp&stream=",
+      baseUrlVedio: "ws://36.103.228.148:8888/live/",
+      data: []
+    }
+  },
+  computed:{
+    ...mapGetters(["userInfo"])
+  },
+  mounted() {
+    getTenantTypeDetailByTenantId(this.userInfo.tenant_id).then(res => {
+
+      if (res.data.data.tenantType == 1) {
+        this.tenantType = 1;
       }
+    })
+    //  请求获取小区列表
+    getAllList().then(res => {
+      this.residentialList = res.data.data;
+
+    })
+    this.onLoad()
+  },
+  watch:{
+    "selectResidential":function(){
+      this.onLoad()
     },
-    computed:{
-      ...mapGetters(["userInfo"])
+    "selectBuilding":function(){
+      this.onLoad()
     },
-    mounted() {
-      getTenantTypeDetailByTenantId(this.userInfo.tenant_id).then(res => {
-
-        if (res.data.data.tenantType == 1) {
-          this.tenantType = 1;
+    "deviceName":function(){
+      this.onLoad()
+    }
+  },
+  methods: {
+    play() {
+      this.data.map((item, index) => {
+        try {
+          let videoElement = document.getElementById('videoId' + index);
+          let flvPlayer = flvjs.createPlayer({
+            type: 'flv',
+            url: item.src
+          });
+          flvPlayer.on(flvjs.Events.ERROR, (errType, errDetail) => {
+            // errType是 NetworkError时，对应errDetail有：Exception、HttpStatusCodeInvalid、ConnectingTimeout、EarlyEof、UnrecoverableEarlyEof
+            // errType是 MediaError时，对应errDetail是MediaMSEError
+          });
+          flvPlayer.on(flvjs.Events.MEDIA_SOURCE_CLOSE || flvjs.Events.MEDIA_SOURCE_ENDED, () => {})
+          flvPlayer.attachMediaElement(videoElement);
+          flvPlayer.load();
+          flvPlayer.play();
+        } catch (e) {
+          console.log(e);
         }
-      })
-      //  请求获取小区列表
-      getAllList().then(res => {
-        this.residentialList = res.data.data;
 
       })
-      this.onLoad()
     },
-    watch:{
-      "selectResidential":function(){
-        this.onLoad()
-      },
-      "selectBuilding":function(){
-        this.onLoad()
-      },
-      "deviceName":function(){
-        this.onLoad()
-      }
+    residentialIdChange(params={}){
+      params.residentialId = this.selectResidential;
+      getList(1,500,params).then((res)=>{
+        this.selectBuilding = "",
+          this.buildingList = res.data.data.records;
+      })
     },
-    methods: {
-      play() {
-        this.data.map((item, index) => {
-          try {
-            let videoElement = document.getElementById('videoId' + index);
-            let flvPlayer = flvjs.createPlayer({
-              type: 'flv',
-              url: item.src
-            });
-            flvPlayer.on(flvjs.Events.ERROR, (errType, errDetail) => {
-              // errType是 NetworkError时，对应errDetail有：Exception、HttpStatusCodeInvalid、ConnectingTimeout、EarlyEof、UnrecoverableEarlyEof
-              // errType是 MediaError时，对应errDetail是MediaMSEError
-            });
-            flvPlayer.on(flvjs.Events.MEDIA_SOURCE_CLOSE || flvjs.Events.MEDIA_SOURCE_ENDED, () => {})
-            flvPlayer.attachMediaElement(videoElement);
-            flvPlayer.load();
-            flvPlayer.play();
-          } catch (e) {
-            console.log(e);
+    onLoad() {
+      let _this = this;
+      if (this.value&&(this.selectResidential != ""||this.selectBuilding != "" || this.deviceName !="")) {
+        getByResidentialAndDeviceName(this.selectResidential,this.selectBuilding,this.deviceName).then(res => {
+          if (res.data.code == 200) {
+            this.data = [];
+            const data = res.data.data;
+            data.forEach(item => {
+              let obj = {};
+              obj.src = this.baseUrlVedio + item.deviceNum + ".flv";
+              obj.name = item.deviceName;
+              this.data.push(obj);
+            })
+            // _this.play();
+            setTimeout(function() {
+              _this.play();
+            }, 1000)
           }
 
-        })
-      },
-      residentialIdChange(params={}){
-        params.residentialId = this.selectResidential;
-        getList(1,500,params).then((res)=>{
-          this.selectBuilding = "",
-          this.buildingList = res.data.data.records;
-        })
-      },
-      onLoad() {
-        let _this = this;
-        if (this.value&&(this.selectResidential != ""||this.selectBuilding != "" || this.deviceName !="")) {
-          getByResidentialAndDeviceName(this.selectResidential,this.selectBuilding,this.deviceName).then(res => {
-            if (res.data.code == 200) {
-              this.data = [];
-              const data = res.data.data;
-              data.forEach(item => {
-                let obj = {};
-                obj.src = this.baseUrlVedio + item.deviceNum + ".flv";
-                obj.name = item.deviceName;
-                this.data.push(obj);
-              })
-              // _this.play();
-              setTimeout(function() {
-                _this.play();
-              }, 1000)
-            }
-
-          });
-        }else{
-          this.data = [];
-        }
+        });
+      }else{
+        this.data = [];
       }
     }
   }
+}
 </script>
 
 
 <style lang="less">
-  #videoSurveillance {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    box-sizing: border-box;
+#videoSurveillance {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  box-sizing: border-box;
 
-    .item {
-      width: calc(~"25% - 10px");
-      overflow: hidden;
-      border-radius: 5px;
-      margin: 5px;
-    }
+  .item {
+    width: calc(~"25% - 10px");
+    overflow: hidden;
+    border-radius: 5px;
+    margin: 5px;
   }
+}
 </style>

src/views/order/deviceorder.vue

@@ -1,30 +1,24 @@
 <template>
   <basic-container>
-    <avue-crud :option="option"
-               :table-loading="loading"
-               :data="data"
-               :page.sync="page"
-               :permission="permissionList"
-               :before-open="beforeOpen"
-               v-model="form"
-               ref="crud"
-               @row-update="rowUpdate"
-               @row-save="rowSave"
-               @row-del="rowDel"
-               @search-change="searchChange"
-               @search-reset="searchReset"
-               @selection-change="selectionChange"
-               @current-change="currentChange"
-               @size-change="sizeChange"
-               @refresh-change="refreshChange"
-               @on-load="onLoad">
-      <template slot="menuLeft">
-        <el-button type="danger"
-                   size="small"
-                   icon="el-icon-delete"
-                   plain
-                   v-if="permission.deviceorder_delete"
-                   @click="handleDelete">删 除
+    <el-dialog :modal-append-to-body="false" :visible.sync="doorRecordVisible" title="开门记录" width="80%">
+      <open-door-record :openDoorRecordList="openDoorRecordList"></open-door-record>
+    </el-dialog>
+    <el-dialog :modal-append-to-body="false" :visible.sync="solveDetailVisible" title="处理工单" width="50%">
+      <device-job ref="deviceJob"  :jobSolve="solveDetail" :visible="solveDetailVisible"
+                  @close-dialog="closeDialog"></device-job>
+    </el-dialog>
+    <avue-data-icons :option="countOption" style="margin-left: 250px"></avue-data-icons>
+    <avue-crud :option="option" :search.sync="searchForm" :table-loading="loading" :data="data" :page="page" :permission="permissionList"
+               :before-open="beforeOpen" v-model="form" ref="crud" @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel"
+               @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
+               @size-change="sizeChange" @refresh-change="refreshChange">
+
+      <template slot="menu" slot-scope="scope">
+        <el-button type="text" size="mini" icon="el-icon-s-order" plain v-if="permission.deviceorder_edit &&scope.row.jobStatus ==1" @click.native="handleSolve(scope.row)">处理工单
+        </el-button>
+        <el-button type="text" size="mini" icon="el-icon-s-order" plain v-if="permission.deviceorder_edit &&scope.row.jobStatus ==2" @click.native="handleSolve(scope.row)">处理结果
+        </el-button>
+        <el-button type="text" size="mini" icon="el-icon-info" plain v-if="scope.row.deviceType == 9" @click="openDoorRecord(scope.row)">开门记录
         </el-button>
       </template>
     </avue-crud>
@@ -32,330 +26,392 @@
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove} from "@/api/order/deviceorder";
-  import {mapGetters} from "vuex";
+import {
+  getList,
+  getDetail,
+  add,
+  update,
+  remove,
+  getDeviceJobStaticVo
+} from "../../api/order/deviceorder";
+import {
+  mapGetters
+} from "vuex";
+import {iconsOption} from "../../api/dataview/dataviewoption";
 
-  export default {
-    data() {
-      return {
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
+export default {
+  data() {
+    return {
+      searchForm:{},
+      deviceJobStaticVo:{},
+      openDoorRecordList: [],
+      doorRecordVisible: false,
+      solveDetailVisible: false,
+      solveDetail: {},
+      form: {},
+      query: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      countOption: {},
+      option: {
+        height: 'auto',
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        addBtn: false,
+        editBtn: false,
+        delBtn: false,
+        selection: true,
+        dialogClickModal: false,
+        column: [{
+          label: "设备编号",
+          prop: "deviceId",
+          search: true,
+          width: 150,
+          rules: [{
+            required: true,
+            message: "请输入设备编号",
+            trigger: "blur"
+          }]
         },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            {
-              label: "设备编号",
-              prop: "deviceId",
-              rules: [{
-                required: true,
-                message: "请输入设备编号",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警时间",
-              prop: "alarmTime",
-              rules: [{
-                required: true,
-                message: "请输入告警时间",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备类型",
-              prop: "deviceType",
-              rules: [{
-                required: true,
-                message: "请输入设备类型",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警地点",
-              prop: "alarmPosition",
-              rules: [{
-                required: true,
-                message: "请输入告警地点",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警类型",
-              prop: "alarmType",
-              rules: [{
-                required: true,
-                message: "请输入告警类型",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警原因",
-              prop: "alarmReason",
-              rules: [{
-                required: true,
-                message: "请输入告警原因",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "处理人",
-              prop: "handlePerson",
-              rules: [{
-                required: true,
-                message: "请输入处理人",
-                trigger: "blur"
-              }]
+          {
+            label: "设备名称",
+            prop: "deviceName",
+          },
+          {
+            label: "相关人",
+            prop: "person",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入相关人",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警时间",
+            prop: "alarmTime",
+            type: "datetime",
+            width: 150,
+            valueFormat: "yyyy-MM-dd HH:mm:ss",
+            rules: [{
+              required: true,
+              message: "请输入告警时间",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "设备类型",
+            prop: "deviceType",
+            search: true,
+            type: "select",
+            dataType: "number",
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=device_type",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              label: "处理人电话",
-              prop: "handlePhone",
-              rules: [{
-                required: true,
-                message: "请输入处理人电话",
-                trigger: "blur"
-              }]
+            rules: [{
+              required: true,
+              message: "请输入设备类型",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "告警地点",
+            prop: "alarmPosition",
+            width: 200,
+            rules: [{
+              required: true,
+              message: "请输入告警地点",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "处理人",
+            prop: "handler",
+            rules: [{
+              required: true,
+              message: "请输入处理人",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "电话",
+            prop: "phone",
+            width: 120,
+            rules: [{
+              required: true,
+              message: "请输入电话",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "工单状态",
+            prop: "jobStatus",
+            type: "select",
+            dataType: "number",
+            search: true,
+            dicUrl: "/api/blade-system/dict-biz/dictionary?code=job_status",
+            props: {
+              label: "dictValue",
+              value: "dictKey"
             },
-            {
-              label: "工单状态",
-              prop: "jobStatus",
-              rules: [{
-                required: true,
-                message: "请输入工单状态",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备名称",
-              prop: "deviceName",
-              rules: [{
-                required: true,
-                message: "请输入设备名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "告警内容",
-              prop: "alarmContent",
-              rules: [{
-                required: true,
-                message: "请输入告警内容",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "机构路径",
-              prop: "orgPosition",
-              rules: [{
-                required: true,
-                message: "请输入机构路径",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "处理备注",
-              prop: "remark",
-              rules: [{
-                required: true,
-                message: "请输入处理备注",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "设备用途{10：居家设备，20：公共设备}",
-              prop: "deviceUsage",
-              rules: [{
-                required: true,
-                message: "请输入设备用途{10：居家设备，20：公共设备}",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "流程定义主键",
-              prop: "processDefinitionId",
-              rules: [{
-                required: true,
-                message: "请输入流程定义主键",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "流程实例主键",
-              prop: "processInstanceId",
-              rules: [{
-                required: true,
-                message: "请输入流程实例主键",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "当前步骤",
-              prop: "currentStep",
-              rules: [{
-                required: true,
-                message: "请输入当前步骤",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "流程步骤标志",
-              prop: "flag",
-              rules: [{
-                required: true,
-                message: "请输入流程步骤标志",
-                trigger: "blur"
-              }]
-            },
-          ]
-        },
-        data: []
+            rules: [{
+              required: true,
+              message: "请输入工单状态",
+              trigger: "blur"
+            }]
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.deviceorder_add, false),
+        viewBtn: this.vaildData(this.permission.deviceorder_view, false),
+        delBtn: this.vaildData(this.permission.deviceorder_delete, false),
+        editBtn: this.vaildData(this.permission.deviceorder_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.deviceorder_add, false),
-          viewBtn: this.vaildData(this.permission.deviceorder_view, false),
-          delBtn: this.vaildData(this.permission.deviceorder_delete, false),
-          editBtn: this.vaildData(this.permission.deviceorder_edit, false)
-        };
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  mounted() {
+    this.$nextTick(()=>{
+      if (this.$route.params.todo){
+        this.$refs.crud.searchForm.jobStatus = 1;
+        this.query.jobStatus = 1;
+      }
+      this.onLoad(this.page,this.query);
+    })
+  },
+  watch:{
+    solveDetailVisible:function(value){
+
+      this.onLoad(this.page,this.query)
+
+    },
+  },
+  methods: {
+    openDoorRecord(row) {
+      this.openDoorRecordList = [{
+        openTime: "2020-05-14 12:55:45",
+        openStatus: "开"
       },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "关"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "关"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+        {
+          openTime: "2020-05-14 12:55:45",
+          openStatus: "开"
+        },
+      ];
+      this.doorRecordVisible = true;
+    },
+    closeDialog() {
+      this.solveDetail = {};
+      this.solveDetailVisible = false;
+      this.onLoad(this.page,this.query);
+    },
+    select(deviceType,params={}) {
+      this.$refs.crud.searchForm.deviceType = deviceType;
+      this.query.deviceType = deviceType;
+      this.onLoad(this.page,this.query);
+    },
+    handleSolve(row) {
+      this.solveDetail = row;
+      this.solveDetailVisible = true;
+      this.$nextTick(()=>{
+        this.$refs.deviceJob.init()
+      })
+    },
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
     },
-    methods: {
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+
+      if (params.jobStatus == 0) {
+        params.jobStatus = null;
+      }
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+      this.onLoad(this.page,this.query);
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      this.countOption = iconsOption(this)
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
+      // debugger
+      getDeviceJobStaticVo().then(res => {
+        this.deviceJobStaticVo = res.data.data;
+        this.countOption.data[0].count = this.deviceJobStaticVo.smokeCount;
+        this.countOption.data[1].count = this.deviceJobStaticVo.gasCount;
+        this.countOption.data[2].count = this.deviceJobStaticVo.coverCount;
+        this.countOption.data[3].count = this.deviceJobStaticVo.alarmCount;
+        this.countOption.data[4].count = this.deviceJobStaticVo.lampCount;
+        this.countOption.data[5].count = this.deviceJobStaticVo.xfCount;
+        this.countOption.data[6].count = this.deviceJobStaticVo.trashbinCount;
+        this.countOption.data[7].count = this.deviceJobStaticVo.parkCount;
+        this.countOption.data[8].count = this.deviceJobStaticVo.gateCount;
+        // console.log(this.deviceJobStaticVo.alarmCount)
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/order/publicevent.vue

@@ -19,298 +19,320 @@
                @refresh-change="refreshChange"
                @on-load="onLoad">
       <template slot="menuLeft">
-        <el-button type="danger"
-                   size="small"
-                   icon="el-icon-delete"
-                   plain
-                   v-if="permission.publicevent_delete"
-                   @click="handleDelete">删 除
+        <el-button
+          size="small"
+          plain
+          v-if="permission.publicevent_add"
+          @click="addEvent">上报事件
         </el-button>
       </template>
+      <template slot-scope="scope" slot="menu">
+        <el-button size="small"
+                   v-if="permission.publicevent_view"
+                   @click.stop="handleDetail(scope.row)">详情
+        </el-button>
+        <el-button size="small"
+                   v-if="permission.publicevent_view"
+                   @click.stop="handleImage(scope.row,scope.index)">跟踪
+        </el-button>
+      </template>
+      <template slot-scope="{row}"
+                slot="finish">
+        <el-tag>{{row.finish==='finish' ? '已完成' : '未完成'}}</el-tag>
+      </template>
     </avue-crud>
+
+    <el-dialog title="流程图"
+               append-to-body
+               :visible.sync="flowBox"
+               :fullscreen="true">
+      <iframe
+        style="border: solid 2px #dddddd;background: white"
+        :src=flowUrl
+        width="100%"
+        height="800"
+        title="流程图"
+        marginWidth="0"
+        marginHeight="0"
+        allowTransparency="yes">
+      </iframe>
+      <span slot="footer"
+            class="dialog-footer">
+        <el-button @click="flowBox = false">关 闭</el-button>
+      </span>
+    </el-dialog>
   </basic-container>
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove} from "@/api/order/publicevent";
-  import {mapGetters} from "vuex";
+import {getList, getDetail, add, update, remove} from "@/api/order/publicevent";
+import {mapGetters} from "vuex";
+import {startList} from "../../api/work/work";
 
-  export default {
-    data() {
+export default {
+  data() {
+    return {
+      form: {},
+      query: {},
+      flowBox: false,
+      loading: true,
+      processDefId: '',
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        editBtn: false,
+        delBtn: false,
+        addBtn: false,
+        height:'auto',
+        calcHeight: 30,
+        tip: false,
+        searchShow: true,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        selection: true,
+        dialogClickModal: false,
+        column: [
+          {
+            label: "姓名",
+            prop: "name",
+            rules: [{
+              required: true,
+              message: "请输入姓名",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "联系方式",
+            prop: "tel",
+            rules: [{
+              required: true,
+              message: "请输入联系方式",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "事件详情",
+            prop: "eventDetail",
+            rules: [{
+              required: true,
+              message: "请输入事件详情",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "流程定义主键",
+            prop: "processDefinitionId",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入流程定义主键",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "流程实例主键",
+            prop: "processInstanceId",
+            hide: true,
+            rules: [{
+              required: true,
+              message: "请输入流程实例主键",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "受理人",
+            prop: "auditor",
+            rules: [{
+              required: true,
+              message: "请输入受理人",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "事件发生地点",
+            prop: "location",
+            rules: [{
+              required: false,
+              message: "请输入受理人",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "处理人",
+            prop: "handlePerson",
+            rules: [{
+              required: true,
+              message: "请输入处理人",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "当前步骤",
+            prop: "currentStep",
+            rules: [{
+              required: true,
+              message: "请输入当前步骤",
+              trigger: "blur"
+            }]
+          },
+          {
+            label: "进度",
+            prop: "finish",
+            slot: true,
+          },
+        ]
+      },
+      data: []
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
       return {
-        form: {},
-        query: {},
-        loading: true,
-        page: {
-          pageSize: 10,
-          currentPage: 1,
-          total: 0
-        },
-        selectionList: [],
-        option: {
-          height:'auto',
-          calcHeight: 30,
-          tip: false,
-          searchShow: true,
-          searchMenuSpan: 6,
-          border: true,
-          index: true,
-          viewBtn: true,
-          selection: true,
-          dialogClickModal: false,
-          column: [
-            {
-              label: "姓名",
-              prop: "name",
-              rules: [{
-                required: true,
-                message: "请输入姓名",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "联系方式",
-              prop: "tel",
-              rules: [{
-                required: true,
-                message: "请输入联系方式",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "事件详情",
-              prop: "eventDetail",
-              rules: [{
-                required: true,
-                message: "请输入事件详情",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "流程定义主键",
-              prop: "processDefinitionId",
-              rules: [{
-                required: true,
-                message: "请输入流程定义主键",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "流程实例主键",
-              prop: "processInstanceId",
-              rules: [{
-                required: true,
-                message: "请输入流程实例主键",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "审核员",
-              prop: "auditor",
-              rules: [{
-                required: true,
-                message: "请输入审核员",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "处理人",
-              prop: "handlePerson",
-              rules: [{
-                required: true,
-                message: "请输入处理人",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "审核员名称",
-              prop: "auditorName",
-              rules: [{
-                required: true,
-                message: "请输入审核员名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "处理人名称",
-              prop: "handlePersonName",
-              rules: [{
-                required: true,
-                message: "请输入处理人名称",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "完成状态",
-              prop: "finish",
-              rules: [{
-                required: true,
-                message: "请输入完成状态",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "当前步骤",
-              prop: "currentStep",
-              rules: [{
-                required: true,
-                message: "请输入当前步骤",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "事件发生地点",
-              prop: "location",
-              rules: [{
-                required: true,
-                message: "请输入事件发生地点",
-                trigger: "blur"
-              }]
-            },
-            {
-              label: "流程步骤标志",
-              prop: "flag",
-              rules: [{
-                required: true,
-                message: "请输入流程步骤标志",
-                trigger: "blur"
-              }]
-            },
-          ]
-        },
-        data: []
+        addBtn: this.vaildData(this.permission.publicevent_add, false),
+        viewBtn: this.vaildData(this.permission.publicevent_view, false),
+        delBtn: this.vaildData(this.permission.publicevent_delete, false),
+        editBtn: this.vaildData(this.permission.publicevent_edit, false)
       };
     },
-    computed: {
-      ...mapGetters(["permission"]),
-      permissionList() {
-        return {
-          addBtn: this.vaildData(this.permission.publicevent_add, false),
-          viewBtn: this.vaildData(this.permission.publicevent_view, false),
-          delBtn: this.vaildData(this.permission.publicevent_delete, false),
-          editBtn: this.vaildData(this.permission.publicevent_edit, false)
-        };
-      },
-      ids() {
-        let ids = [];
-        this.selectionList.forEach(ele => {
-          ids.push(ele.id);
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  methods: {
+    handleDetail(row) {
+      this.$router.push({ path: `/work/process/publicevent/detail/${row.processInstanceId}/${row.id}`});
+    },
+    handleImage(row) {
+      this.flowUrl = `/api/blade-flow/process/diagram-view?processInstanceId=${row.processInstanceId}`;
+      this.flowBox = true;
+    },
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
         });
-        return ids.join(",");
-      }
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
     },
-    methods: {
-      rowSave(row, done, loading) {
-        add(row).then(() => {
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          window.console.log(error);
         });
-      },
-      rowUpdate(row, index, done, loading) {
-        update(row).then(() => {
+    },
+    addEvent(){
+      let path = `/work/process/publicEvent/form/`+this.processDefId;
+      this.$router.push({path});
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
           this.onLoad(this.page);
           this.$message({
             type: "success",
             message: "操作成功!"
           });
-          done();
-        }, error => {
-          loading();
-          console.log(error);
+          this.$refs.crud.toggleSelection();
         });
-      },
-      rowDel(row) {
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(row.id);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-          });
-      },
-      handleDelete() {
-        if (this.selectionList.length === 0) {
-          this.$message.warning("请选择至少一条数据");
-          return;
-        }
-        this.$confirm("确定将选择数据删除?", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning"
-        })
-          .then(() => {
-            return remove(this.ids);
-          })
-          .then(() => {
-            this.onLoad(this.page);
-            this.$message({
-              type: "success",
-              message: "操作成功!"
-            });
-            this.$refs.crud.toggleSelection();
-          });
-      },
-      beforeOpen(done, type) {
-        if (["edit", "view"].includes(type)) {
-          getDetail(this.form.id).then(res => {
-            this.form = res.data.data;
-          });
-        }
-        done();
-      },
-      searchReset() {
-        this.query = {};
-        this.onLoad(this.page);
-      },
-      searchChange(params, done) {
-        this.query = params;
-        this.page.currentPage = 1;
-        this.onLoad(this.page, params);
-        done();
-      },
-      selectionChange(list) {
-        this.selectionList = list;
-      },
-      selectionClear() {
-        this.selectionList = [];
-        this.$refs.crud.toggleSelection();
-      },
-      currentChange(currentPage){
-        this.page.currentPage = currentPage;
-      },
-      sizeChange(pageSize){
-        this.page.pageSize = pageSize;
-      },
-      refreshChange() {
-        this.onLoad(this.page, this.query);
-      },
-      onLoad(page, params = {}) {
-        this.loading = true;
-        getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
-          const data = res.data.data;
-          this.page.total = data.total;
-          this.data = data.records;
-          this.loading = false;
-          this.selectionClear();
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail(this.form.id).then(res => {
+          this.form = res.data.data;
         });
       }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage){
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize){
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    async onLoad(page, params = {}) {
+      this.loading = true;
+      this.processDefId = (await startList(1,10,{category: 'flow_3'})).data.data.records[0].id;
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
     }
-  };
+  }
+};
 </script>
 
 <style>

src/views/order/todo/publicevent.vue

@@ -0,0 +1,217 @@
+<template>
+  <basic-container>
+    <avue-crud :option="option"
+               :table-loading="loading"
+               :data="data"
+               ref="crud"
+               v-model="form"
+               @search-change="searchChange"
+               @search-reset="searchReset"
+               @selection-change="selectionChange"
+               @current-change="currentChange"
+               @size-change="sizeChange"
+               @refresh-change="refreshChange"
+               @on-load="onLoad">
+      <template slot-scope="scope" slot="menu">
+        <el-button type="text"
+                   size="small"
+                   v-if="permission.work_todo_handle"
+                   plain
+                   class="none-border"
+                   @click.stop="handleWork(scope.row)">事件处理
+        </el-button>
+        <el-button type="text"
+                   size="small"
+                   v-if="permission.work_todo_detail"
+                   plain
+                   class="none-border"
+                   @click.stop="handleDetail(scope.row)">详情
+        </el-button>
+        <el-button type="text"
+                   size="small"
+                   v-if="permission.work_todo_follow"
+                   plain
+                   class="none-border"
+                   @click.stop="handleImage(scope.row,scope.index)">跟踪
+        </el-button>
+      </template>
+      <template slot-scope="{row}"
+                slot="processDefinitionVersion">
+        <el-tag>v{{row.processDefinitionVersion}}</el-tag>
+      </template>
+    </avue-crud>
+    <el-dialog title="流程图"
+               append-to-body
+               :visible.sync="flowBox"
+               :fullscreen="true">
+      <iframe
+        :src=flowUrl
+        width="100%"
+        height="700"
+        title="流程图"
+        frameBorder="no"
+        border="0"
+        marginWidth="0"
+        marginHeight="0"
+        scrolling="no"
+        allowTransparency="yes">
+      </iframe>
+      <span slot="footer"
+            class="dialog-footer">
+        <el-button @click="flowBox = false">关 闭</el-button>
+      </span>
+    </el-dialog>
+  </basic-container>
+</template>
+
+<script>
+  import {mapGetters} from "vuex";
+  import {todoList} from "@/api/work/work";
+  import {flowCategory,flowRoute} from "@/util/flow";
+
+  export default {
+    data() {
+      return {
+        form: {},
+        selectionId: '',
+        selectionList: [],
+        query: {},
+        loading: true,
+        page: {
+          pageSize: 10,
+          currentPage: 1,
+          total: 0
+        },
+        flowBox: false,
+        flowUrl: '',
+        workBox: false,
+        option: {
+          height: 'auto',
+          calcHeight: 30,
+          tip: false,
+          simplePage: true,
+          searchShow: true,
+          searchMenuSpan: 6,
+          border: true,
+          index: true,
+          selection: true,
+          editBtn: false,
+          addBtn: false,
+          viewBtn: false,
+          delBtn: false,
+          dialogWidth: 900,
+          menuWidth: 150,
+          dialogClickModal: false,
+          column: [
+            {
+              label: "流程分类",
+              type: "select",
+              row: true,
+              dicUrl: "/api/blade-system/dict/dictionary?code=flow",
+              props: {
+                label: "dictValue",
+                value: "dictKey"
+              },
+              dataType: "number",
+              slot: true,
+              prop: "category",
+              search: true,
+              hide: true,
+              width: 100,
+            },
+            {
+              label: '流程名称',
+              prop: 'processDefinitionName',
+              search: true,
+            },
+            {
+              label: '当前步骤',
+              prop: 'taskName',
+            },
+            {
+              label: '流程版本',
+              prop: 'processDefinitionVersion',
+              slot: true,
+              width: 80,
+            },
+            {
+              label: '申请时间',
+              prop: 'createTime',
+              width: 165,
+            },
+          ]
+        },
+        data: []
+      };
+    },
+    computed: {
+      ...mapGetters(["permission", "flowRoutes"]),
+      ids() {
+        let ids = [];
+        this.selectionList.forEach(ele => {
+          ids.push(ele.id);
+        });
+        return ids.join(",");
+      },
+    },
+    methods: {
+      searchReset() {
+        this.query = {};
+        this.onLoad(this.page);
+      },
+      searchChange(params, done) {
+        this.query = params;
+        this.page.currentPage = 1;
+        this.onLoad(this.page, params);
+        done();
+      },
+      selectionChange(list) {
+        this.selectionList = list;
+      },
+      selectionClear() {
+        this.selectionList = [];
+        this.$refs.crud.toggleSelection();
+      },
+      handleWork(row) {
+        this.$router.push({ path: `/work/process/${flowRoute(this.flowRoutes, row.category)}/handle/${row.taskId}/${row.processInstanceId}/${row.businessId}` });
+      },
+      handleDetail(row) {
+        this.$router.push({ path: `/work/process/${flowRoute(this.flowRoutes, row.category)}/detail/${row.processInstanceId}/${row.businessId}` });
+      },
+      handleImage(row) {
+        this.flowUrl = `/api/blade-flow/process/diagram-view?processInstanceId=${row.processInstanceId}`;
+        this.flowBox = true;
+      },
+      currentChange(currentPage){
+        this.page.currentPage = currentPage;
+      },
+      sizeChange(pageSize){
+        this.page.pageSize = pageSize;
+      },
+      refreshChange() {
+        this.onLoad(this.page, this.query);
+      },
+      onLoad(page, params = {}) {
+        const query = {
+          ...this.query,
+          category: "flow_3"
+        };
+        this.loading = true;
+        todoList(page.currentPage, page.pageSize, Object.assign(params, query)).then(res => {
+          const data = res.data.data;
+          this.page.total = data.total;
+          this.data = data.records;
+          this.loading = false;
+          this.selectionClear();
+        });
+      }
+    }
+  };
+</script>
+
+<style>
+  .none-border {
+    border: 0;
+    background-color: transparent !important;
+  }
+</style>

src/views/work/process/publicEvent/detail.vue

@@ -0,0 +1,112 @@
+<template>
+  <basic-container>
+    <el-form ref="form" :model="form" label-width="80px">
+      <el-row type="flex" class="row-bg" justify="end">
+        <el-form-item>
+          <el-button @click="handleCancel">关闭</el-button>
+        </el-form-item>
+      </el-row>
+      <el-card shadow="hover">
+        <div slot="header">
+          <span>审批信息</span>
+        </div>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item  label="申请人">
+            <el-input :disabled="true" v-model="form.name" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系方式">
+            <el-input :disabled="true" v-model="form.tel" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="所在地点">
+          <el-input :disabled="true" type="textarea" v-model="form.location" placeholder="暂无数据"/>
+        </el-form-item>
+        <el-form-item label="事件详情" >
+          <el-input :disabled="true" type="textarea" v-model="form.eventDetail" placeholder="暂无数据" />
+        </el-form-item>
+      </el-card>
+      <el-card shadow="hover">
+        <div slot="header">
+          <span>流程信息</span>
+        </div>
+        <el-row type="flex" class="row-bg">
+          <el-timeline>
+            <el-timeline-item :key="flow.id" :timestamp="flow.createTime" v-for="flow in flowList" placement="top">
+              <el-card shadow="hover">
+                <p>{{flow.assigneeName}} 在 [{{flow.createTime}}] 开始处理 [{{flow.historyActivityName}}] 环节</p>
+                <p v-if="flow.historyActivityDurationTime!==''">任务历时 [{{flow.historyActivityDurationTime}}]</p>
+                <p v-if="flow.comment!==''">批复意见: [{{flow.comment}}]</p>
+                <p v-if="flow.endTime!==''">结束时间: [{{flow.endTime}}]</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </el-row>
+      </el-card>
+      <el-card shadow="hover">
+        <div slot="header">
+          <span>流程跟踪</span>
+        </div>
+        <el-row type="flex" class="row-bg" style="background: white">
+          <img :src="src" alt="design">
+        </el-row>
+      </el-card>
+    </el-form>
+  </basic-container>
+</template>
+
+<script>
+  import {historyFlowList} from "@/api/work/process";
+  import {getDetail} from "../../../../api/order/publicevent";
+
+  export default {
+    data() {
+      return {
+        businessId: '',
+        processInstanceId: '',
+        src: '',
+        flowList: [],
+        form: {
+          flow:{
+            assigneeName:'',
+          },
+          startTime: '',
+          endTime: '',
+          reason: '',
+        }
+      }
+    },
+    created() {
+      this.init();
+    },
+    methods: {
+      init() {
+        this.processInstanceId = this.$route.params.processInstanceId;
+        this.businessId = this.$route.params.businessId;
+
+        this.src = `/api/blade-flow/process/diagram-view?processInstanceId=${this.$route.params.processInstanceId}`;
+        historyFlowList(this.processInstanceId).then(res => {
+          const data = res.data;
+          if (data.success) {
+            this.flowList = data.data;
+            console.log(this.flowList)
+          }
+        })
+        getDetail(this.businessId).then(res => {
+          const data = res.data;
+          if (data.success) {
+            this.form = data.data;
+          }
+        })
+      },
+
+      handleCancel() {
+        this.$router.$avueRouter.closeTag();
+        this.$router.go(-1);
+      }
+    }
+  }
+</script>

src/views/work/process/publicEvent/form.vue

@@ -0,0 +1,114 @@
+<template>
+  <basic-container>
+    <avue-form :option="option" v-model="form" @submit="handleSubmit"/>
+  </basic-container>
+</template>
+
+<script>
+  import {leaveProcess} from "@/api/work/process";
+  import {publicevent} from "../../../../api/work/process";
+
+  export default {
+    data() {
+      return {
+        form: {},
+        option: {
+          group: [
+            {
+              icon: 'el-icon-info',
+              label: '填写--报事工单',
+              prop: 'group1',
+              column: [
+                {
+                  label: '受理人',
+                  prop: 'auditor',
+                  type: 'select',
+                  dicUrl: `/api/blade-user/user-list`,
+                  props: {
+                    label: "account",
+                    value: "id"
+                  },
+                  span: 8,
+                  rules: [
+                    {
+                      required: true,
+                      message: '请选择受理人员',
+                      trigger: 'blur'
+                    }
+                  ]
+                },
+                {
+                  label: '姓名',
+                  prop: 'name',
+                  span: 8,
+                  rules: [
+                    {
+                      required: true,
+                      message: '请填写姓名',
+                      trigger: 'blur'
+                    }
+                  ]
+                },
+                {
+                  label: '联系方式',
+                  prop: 'tel',
+                  span: 8,
+                  rules: [
+                    {
+                      required: true,
+                      message: '请填写联系方式',
+                      trigger: 'blur'
+                    }
+                  ]
+                },
+                {
+                  label: '所在地点',
+                  prop: 'location',
+                  span: 8,
+                  rules: [
+                    {
+                      required: false,
+                      message: '请填写所在地点',
+                      trigger: 'blur'
+                    }
+                  ]
+                },
+                {
+                  label: '事件描述',
+                  prop: 'eventDetail',
+                  type: 'textarea',
+                  span: 24,
+                  rules: [
+                    {
+                      required: true,
+                      message: '请填写事件详情',
+                      trigger: 'blur'
+                    }
+                  ]
+                },
+              ]
+            },
+          ],
+        }
+      }
+    },
+    methods: {
+      handleSubmit() {
+        const params = {
+          processDefinitionId: this.$route.params.processDefinitionId,
+          ...this.form,
+        };
+        publicevent(params).then(resp => {
+          const data = resp.data;
+          if (data.success) {
+            this.$message.success(data.msg);
+            this.$router.$avueRouter.closeTag();
+            this.$router.push({path: `/order/publicevent`});
+          } else {
+            this.$message.error(data.msg || '提交失败');
+          }
+        });
+      }
+    }
+  }
+</script>

src/views/work/process/publicEvent/handle.vue

@@ -0,0 +1,186 @@
+<template>
+  <basic-container>
+    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-row type="flex" class="row-bg" justify="end">
+        <el-form-item>
+          <el-button type="primary" @click="handleAgree">{{form.flag=='step1'? '同意':'事件完成'}}</el-button>
+          <el-button type="danger" @click="handleDisagree">{{form.flag=='step1'? '驳回':'事件未完成'}}</el-button>
+          <el-button @click="handleCancel">关闭</el-button>
+        </el-form-item>
+      </el-row>
+      <el-card shadow="hover">
+        <div slot="header">
+          <span>审批信息</span>
+        </div>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item  label="申请人">
+              <el-input :disabled="true" v-model="form.name" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="联系方式">
+              <el-input :disabled="true" v-model="form.tel" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="所在地点">
+          <el-input :disabled="true" type="textarea" v-model="form.location" placeholder="暂无数据"/>
+        </el-form-item>
+        <el-form-item label="事件详情" >
+          <el-input :disabled="true" type="textarea" v-model="form.eventDetail" placeholder="暂无数据" />
+        </el-form-item>
+        <el-form-item label="批复">
+          <el-input type="textarea" v-model="form.comment" placeholder="同意"></el-input>
+        </el-form-item>
+        <el-form-item v-if="form.flag=='step1'" label="事件受理人" label-width="300">
+          <el-select style="width: 40%" v-model="form.handlePerson" placeholder="请选择">
+            <el-option
+              v-for="item in selectOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+      </el-card>
+      <el-card shadow="hover">
+        <div slot="header">
+          <span>流程信息</span>
+        </div>
+        <el-row type="flex" class="row-bg">
+          <el-timeline>
+            <el-timeline-item :key="flow.id" :timestamp="flow.createTime" v-for="flow in flowList" placement="top">
+              <el-card shadow="hover">
+                <p>{{flow.assigneeName}} 在 [{{flow.createTime}}] 开始处理 [{{flow.historyActivityName}}] 环节</p>
+                <p v-if="flow.historyActivityDurationTime!==''">任务历时 [{{flow.historyActivityDurationTime}}]</p>
+                <p v-if="flow.comment!==''">批复意见: [{{flow.comment}}]</p>
+                <p v-if="flow.endTime!==''">结束时间: [{{flow.endTime}}]</p>
+              </el-card>
+            </el-timeline-item>
+          </el-timeline>
+        </el-row>
+      </el-card>
+      <el-card shadow="hover">
+        <div slot="header">
+          <span>流程跟踪</span>
+        </div>
+        <el-row type="flex" class="row-bg">
+          <img :src="src" alt="design">
+        </el-row>
+      </el-card>
+    </el-form>
+  </basic-container>
+</template>
+
+<script>
+  import {historyFlowList, leaveDetail} from "@/api/work/process";
+  import {completeTask} from "@/api/work/work";
+  import {complete, getDetail} from "../../../../api/order/publicevent";
+
+  export default {
+    data() {
+      return {
+        taskId: '',
+        businessId: '',
+        processInstanceId: '',
+        src: '',
+        flowList: [],
+        form: {
+          flow: {
+            assigneeName: '',
+          },
+          startTime: '',
+          endTime: '',
+          reason: '',
+          comment: '',
+        },
+      }
+    },
+    created() {
+      this.init();
+    },
+    computed: {
+      selectOptions(){
+        return [
+          {label: '管理员',value:'1123598821738675201'}
+        ];
+      }
+    },
+    beforeRouteUpdate(to, from, next) {
+      // 在当前路由改变，但是该组件被复用时调用
+      // 举例来说，对于一个带有动态参数的路径 /foo/:id，在 /foo/1 和 /foo/2 之间跳转的时候
+      // 由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个钩子就会在这个情况下被调用
+      // 可以访问组件实例 `this`
+      if (to.fullPath !== from.fullPath) {
+        next();
+        this.init();
+      }
+    },
+    methods: {
+      init() {
+        this.taskId = this.$route.params.taskId;
+        this.processInstanceId = this.$route.params.processInstanceId;
+        this.businessId = this.$route.params.businessId;
+        this.src = `/api/blade-flow/process/diagram-view?processInstanceId=${this.$route.params.processInstanceId}`;
+        historyFlowList(this.processInstanceId).then(res => {
+          const data = res.data;
+          if (data.success) {
+            this.flowList = data.data;
+            console.log(this.flowList);
+          }
+        })
+        getDetail(this.businessId).then(res => {
+          const data = res.data;
+          if (data.success) {
+            this.form = data.data;
+          }
+        })
+      },
+      handleAgree() {
+        if (this.form.flag=='step1' && !this.form.handlePerson) {
+          this.$message.warning('请先选择事件处理人');
+          return;
+        }
+        if(this.form.flag=='step2'){
+          this.form.success = true;
+        }
+        if(this.form.flag=='step1'){
+          this.form.pass = true;
+        }
+        this.form.taskId = this.taskId;
+        this.complete();
+
+      },
+      handleDisagree() {
+        if(!this.form.comment){
+          this.$message.warning('请填写批复意见');
+          return;
+        }
+        if(this.form.flag=='step2'){
+          this.form.success = false;
+        }
+        if(this.form.flag=='step1'){
+          this.form.pass = false;
+        }
+        this.form.taskId = this.taskId;
+        this.complete();
+      },
+      complete(){
+        complete(this.form).then(res => {
+          const data = res.data;
+          if (data.success) {
+            this.$message.success(data.msg);
+            this.$router.push({path: `/order/todo/publicEvent`});
+          } else {
+            this.$message.error(data.msg || '提交失败');
+          }
+        })
+      },
+      handleCancel() {
+        this.$router.$avueRouter.closeTag();
+        this.$router.go(-1);
+      }
+    }
+  }
+</script>