Merge remote-tracking branch 'origin/master'

# Conflicts:
#	gassafety-web/src/views/device/deviceInfo/index.vue

gassafety-web/src/components/PopWindow/flowMeter.vue

@@ -8,17 +8,17 @@
       <el-form ref="form" :model="form" :rules="rules" label-width="135px">
         <el-row>
           <el-col :span="11">
-            <el-form-item label="所属管道" prop="pipeCode">
+            <el-form-item label="所属管道" prop="pipeId">
               <el-select
-                v-model="form.pipeCode"
+                v-model="form.pipeId"
                 placeholder="请选择所属管道"
                 style="width: 100%"
               >
                 <el-option
                   v-for="item in pipeList"
-                  :key="item.pipeCode"
+                  :key="item.pipeId"
                   :label="item.pipeName"
-                  :value="item.pipeCode"
+                  :value="item.pipeId" 
                 >
                 </el-option>
               </el-select>
@@ -163,7 +163,7 @@ export default {
       pipeList: [],
 
       rules: {
-        pipeCode: [
+        pipeId: [
           { required: true, message: "请选择所属管道", trigger: "blur" },
           // { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" },
         ],
@@ -211,6 +211,8 @@ export default {
     },
     submitForm() {
       this.$refs["form"].validate((valid) => {
+          // console.log("this.form流量计",this.form)
+          // return;
         if (valid) {
           if (this.form.deviceId != null) {
             updateDeviceInfo(this.form).then((response) => {

gassafety-web/src/components/PopWindow/pressureGage.vue

@@ -8,17 +8,17 @@
       <el-form ref="form" :model="form" :rules="rules" label-width="135px">
         <el-row>
           <el-col :span="11">
-            <el-form-item label="所属管道" prop="pipeCode">
+            <el-form-item label="所属管道" prop="pipeId">
               <el-select
-                v-model="form.pipeCode"
+                v-model="form.pipeId"
                 placeholder="请选择所属管道"
                 style="width: 100%"
               >
                  <el-option
                   v-for="item in pipeList"
-                  :key="item.pipeCode"
+                  :key="item.pipeId"
                   :label="item.pipeName"
-                  :value="item.pipeCode"
+                  :value="item.pipeId"
                 >
                 </el-option>
               </el-select>
@@ -156,7 +156,7 @@ export default {
       fileList: [],
       // 表单校验
       rules: {
-        pipeCode: [
+        pipeId: [
           { required: true, message: "请选择所属管道", trigger: "blur" },
           // { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" },
         ],
@@ -209,6 +209,8 @@ export default {
     },
     submitForm() {
       this.$refs["form"].validate((valid) => {
+          // console.log("this.form)",this.form)
+
         if (valid) {
           if (this.form.deviceId != null) {
             updateDeviceInfo(this.form).then((response) => {

gassafety-web/src/components/PopWindow/regulatorBox.vue

@@ -8,17 +8,17 @@
       <el-form ref="form" :model="form" :rules="rules" label-width="135px">
         <el-row>
           <el-col :span="11">
-            <el-form-item label="所属管道" prop="pipeCode">
+            <el-form-item label="所属管道" prop="pipeId">
               <el-select
-                v-model="form.pipeCode"
+                v-model="form.pipeId"
                 placeholder="请选择所属管道"
                 style="width: 100%"
               >
                  <el-option
                   v-for="item in pipeList"
-                  :key="item.pipeCode"
+                  :key="item.pipeId"
                   :label="item.pipeName"
-                  :value="item.pipeCode"
+                  :value="item.pipeId"
                 >
                 </el-option>
               </el-select>
@@ -160,7 +160,7 @@ export default {
       fileArr: [],
       pipeList: [],
       rules: {
-        pipeCode: [
+        pipeId: [
           { required: true, message: "请选择所属管道", trigger: "blur" },
           // { min: 3, max: 5, message: "长度在 3 到 5 个字符", trigger: "blur" },
         ],
@@ -209,6 +209,7 @@ export default {
     },
     submitForm() {
       this.$refs["form"].validate((valid) => {
+        // console.log("this.form",this.form)
         if (valid) {
           if (this.form.deviceId != null) {
             updateDeviceInfo(this.form).then((response) => {

gassafety-web/src/components/PopWindowGis/lineInfoWindow.vue

@@ -132,9 +132,10 @@ export default {
     deviceMore() {
       console.log(this.obj.polyline.getExtData().lineData)
       this.obj.polyline.getExtData().class.view.$router.push({
-        path: "/realtimeData/realtimedetail",
+        path: "/dataMonitoring/realtimedetail",
         query: {
           deviceId: this.obj.polyline.getExtData().lineData.pipeId,
+          deviceType:"0"
         },
       });
     },

gassafety-web/src/components/mapDialog/index.vue → gassafety-web/src/components/mapDialog/checkDeviceLoaction.vue

@@ -23,10 +23,11 @@
       <el-button size="small" @click="$emit('dialogcancelFun')">取消</el-button
       >
     </el-row>
-    <div style="width: 47vw; height: 57vh" id="container"></div>
+    <div style="width: 47vw; height: 65vh" id="container"></div>
 
     <el-col :span="8" class="button">
-      <el-input id="ss" placeholder="输入地址" v-model="keyWorld"  ></el-input><el-button size="small" type="primary" icon="el-icon-search" @click="search" style="position: fixed;margin-left: 3px;">搜索</el-button>
+      <el-input id="ss" placeholder="输入地址" v-model="keyWorld"  ></el-input>
+      <el-button size="small" type="primary" icon="el-icon-search" @click="search" style="position: fixed;margin-left: 3px;">搜索</el-button>
     </el-col>
 
   </el-dialog>
@@ -47,7 +48,10 @@
         keyWorld: ""
       }
     },
-    mounted(){
+    watch:{
+      dialogTableVisible:{
+        handler(value) {
+          if(value){
             let that = this;
             that.$nextTick(() => {
               //初始化地图
@@ -58,10 +62,9 @@
                 viewMode: "3D",
                 showLabel: true,
                 pitch: 8,
-          zoom: 10
+                zoom: 12
               });
-        map.setFitView();
-
+              var overlays = [];
               //坐标回显
               if (typeof that.slng == "number" && that.slng != 0) {
                 that.lnglat.lng = that.slng;
@@ -71,12 +74,12 @@
                 });
                 marker.setMap(map);
                 map.setCenter([that.slng,that.slat]);
+                overlays.push(marker);
               }
 
               //点击获取坐标点
               var mouseTool = new AMap.MouseTool(map);
               //监听draw事件可获取画好的覆盖物
-        var overlays = [];
               mouseTool.on('draw',function(e){
                 map.remove(overlays);
                 overlays.push(e.obj);
@@ -92,6 +95,12 @@
                 });
               });
             })
+          }
+        },
+        // 代表在wacth里声明了firstName这个方法之后立即先去执行handler方法
+        immediate: true
+
+      }
     },
     methods:{
       confirmFun(){
@@ -123,7 +132,7 @@
 
   .button{
     position: relative;
-    top: -393px;
+    top: -453px;
     left: 14px;
   }
 

gassafety-web/src/components/mapDialog/checkPipeLineLocation.vue

+<template>
+  <el-dialog
+    title="拾取坐标"
+    :visible.sync="dialogTableVisible"
+    :show-close="false"
+    :close-on-click-modal="false"
+  >
+    <div style="postion:relative">
+      <el-row :span="8" class="button">
+        <el-input id="ss" placeholder="输入地址" v-model="keyWorld"  ></el-input>
+        <el-button size="small" type="primary" icon="el-icon-search" @click="search">搜索</el-button>
+      </el-row>
+    </div>
+    <div style="" id="container" ref="elD"></div>
+    <el-row class="lt">
+      <el-button type="primary" size="small" @click="confirmFun">确定</el-button>
+      <el-button size="small" @click="$emit('dialogcancelFun')">取消</el-button>
+    </el-row>
+
+  </el-dialog>
+</template>
+<script>
+  import gaodeMap from "./js/gaodeMapDialog.js";
+  import { getString } from "@/utils/gassafety.js";
+  export default {
+    props: {
+      dialogTableVisible: {
+        type:Boolean,
+      },
+      slat: 0,
+      slng: 0,
+      str:{
+        type:String,
+      }
+
+    },
+    data(){
+      return{
+        lnglat: {
+          lat: "",
+          lng: ""
+        },
+        keyWorld: "",
+        map:{},
+        div:null,
+
+      }
+    },
+    watch:{
+      dialogTableVisible:{
+        handler(value) {
+          if(value){
+            window.addEventListener("click", this.barClose);
+            this.$nextTick(() => {
+              this.map = new gaodeMap("石家庄");
+              this.map.addMouseTool();
+              if(this.str){
+                this.map.addPolyline([{coordinates:this.str}]);
+              }
+
+              this.map.lineType = 1;
+              if (this.map.newLineObj == null) {
+                this.map.createNewLine();
+              }
+
+            })
+          }else{
+             console.log("清除事件")
+            window.removeEventListener("click", this.barClose);
+          }
+        },
+        // 代表在wacth里声明了firstName这个方法之后立即先去执行handler方法
+        immediate: true
+
+      }
+    },
+    methods:{
+      confirmFun(){
+        console.log("path",this.map.newLineObj.getPath())
+        const pathArr = this.map.newLineObj.getPath().map(item=>{
+          return [
+            item.lng,item.lat
+          ]
+        })
+        const str = getString(pathArr)
+        this.$emit('confirmFun',str);
+        this.$emit('dialogcancelFun');
+      },
+      search(){
+        this.placeSearch.search(this.keyWorld);  //关键字查询查询
+      },
+      barClose() {
+        console.log("window");
+        this.deviceType = false;
+        // 关闭当前线条的infowindow
+        this.map.closeInfoWindow();
+        this.map.lineFlag = false;
+      },
+    },
+
+    beforeDestroy() {
+    },
+  }
+
+</script>
+
+<style scoped lang="scss">
+  .dialog{
+    position:relative;
+  }
+  #container{
+    width: 100%;
+    height: 500px;
+  }
+  .lt{
+    margin-top: 15px;
+    text-align: right;
+  }
+  .lt .el-input {
+    width: 120px;
+    margin-right: 15px;
+    display: inline-block;
+  }
+
+  .button{
+    position: absolute;
+    top: 90px;
+    left: 30px;
+    z-index: 999;
+  }
+
+  .button .el-input{
+    width: 180px;
+    margin-right: 10px;
+    display: inline-block;
+  }
+</style>

gassafety-web/src/components/mapDialog/js/gaodeMapDialog.js

+ import createPop from "@/utils/createPop";
+import regulatorBox from "@/components/PopWindow/regulatorBox.vue";
+import valveWell from "@/components/PopWindow/valveWell.vue";
+import flowMeter from "@/components/PopWindow/flowMeter.vue";
+import pressureGage from "@/components/PopWindow/pressureGage.vue";
+import pipelineView from "@/components/PopWindow/pipelineView.vue";
+import lineInfoWindow from "@/components/PopWindow/lineInfoWindow.vue";
+import { delDeviceInfo } from "@/api/device/deviceInfo";
+import markerInfoWindow from "@/components/PopWindow/markerInfoWindow.vue";
+import { getArray } from "@/utils/gassafety.js";
+import { delPipe } from "@/api/device/pipe.js";
+import vue from "@/main";
+let defaultCenter = "石家庄";
+export let map;
+export const DEVICE_TYPE = {
+  PIPEPLINE: "1",
+  REGEULATORBOX: "2",
+  VALUEWELL: "3",
+  FLOWMETER: "4",
+  DUTYPERSON: "5",
+  WORKORDER: "6",
+  PRESSUREGAGE: "7",
+  INSPECTOR: "8"
+};
+class gaodeMap {
+  // 所有线的数组
+  polyLines = [];
+  // 是否开启新增
+  lineType = 0;
+  // 创建一个新的lineObj
+  newLineObj = null;
+  // onceFlag=false;
+  lineFlag = false;
+  mouseTool = null;
+  myMap = null;
+  showInfoWindow = null;
+
+  //构造函数中设置中央点默认值
+  constructor(center) {
+    this.markers = [];
+    this.center = center ? center : defaultCenter;
+    map = new AMap.Map("container", {
+      //mask: addMask(result.districtList[0].boundaries),
+      center: [114.72995, 38.37417],
+      // resizeEnable: true,
+      disableSocket: true,
+      viewMode: "3D",
+      showLabel: true,
+      // labelzIndex: 110,
+      pitch: 8,
+      zoom: 12
+      //mapStyle: 'amap://styles/darkblue',
+      // mapStyle: 'amap://styles/3b679a15f448a4740ba2ff7524e1a4ae',
+    });
+    this.myMap = map;
+
+    this.myMap.on("click", e => {
+      // if (this.lineType !=1 || this.lineFlag) return;
+      if (this.lineType != 1 || this.lineFlag) return;
+
+      // 除了这里，还要利用vue页面的window事件辅助，当组件出来的时候，就得利用window事件
+      if (this.newLineObj) {
+        vue
+          .$confirm("是否重新画管道")
+          .then(() => {
+            this.newLineObj.polyEditor.close();
+            map.remove(this.newLineObj);
+            this.newLineObj = null;
+            this.lineFlag = false;
+            this.createNewLine();
+
+            console.log("map点击事件新建");
+          })
+          .catch(() => {});
+      }
+      // console.log("抬起来了");
+    });
+
+       // 地图开始平移删除infowindow
+       this.myMap.on("movestart",()=>{
+        // console.log("地图平移");
+        this.closeInfoWindow()
+      })
+      // 地图开始缩放删除infowindow
+      this.myMap.on("zoomstart",()=>{
+        // console.log("缩放开始")
+        this.closeInfoWindow()
+      })
+    this.districtBoundaries();
+  }
+
+  /**
+   * 获取map
+   * @returns {AMap.Map}
+   */
+  get getMap() {
+    return this.map;
+  }
+
+  /**
+   * 重新设置中央点
+   * @param value
+   */
+  set setCenter(value) {
+    this.center = value;
+    this.districtBoundaries();
+  }
+
+  resetMapCenter(value) {
+    map.setCenter(value);
+  }
+
+  /**
+   * 设置城市边界
+   */
+
+  districtBoundaries() {
+    let that = this;
+    let opts = {
+      subdistrict: 0,
+      extensions: "all",
+      level: "city"
+    };
+    let district = new AMap.DistrictSearch(opts);
+    district.search(that.center, function(status, result) {
+      if (status == "complete") {
+        let defaultCenter = [];
+        defaultCenter.push(result.districtList[0].center.lng);
+        defaultCenter.push(result.districtList[0].center.lat);
+        map.setCenter(defaultCenter);
+        let bounds = result.districtList[0].boundaries;
+        for (let i = 0; i < bounds.length; i += 1) {
+          new AMap.Polyline({
+            path: bounds[i],
+            strokeColor: "#0088ff",
+            strokeWeight: 5,
+            strokeOpacity: 7,
+            map: map
+          });
+        }
+      }
+    });
+  }
+
+  /**
+   * 添加Market
+   * @param markerType
+   * @param lnglats
+   */
+  addMarker(markerType, data) {
+    let that = this;
+    that.markerType = markerType;
+    let infoWindow = new AMap.InfoWindow({
+      isCustom: true,
+      offset: new AMap.Pixel(24, -38),
+      anchor: "left-top"
+    });
+    infoWindow.on("mouseover",function () {
+      let options = map.getStatus();
+      options.scrollWheel = false;
+      map.setStatus(options);
+    });
+    infoWindow.on("mouseout",function () {
+      let options = map.getStatus();
+      options.scrollWheel = true;
+      map.setStatus(options);
+    });
+    let marker = new AMap.Marker({
+      position: [data.longitude, data.latitude],
+      map: map,
+      offset: new AMap.Pixel(0, 5)
+    });
+    this.setMarkerIcon(marker);
+    if (DEVICE_TYPE.WORKORDER != markerType && DEVICE_TYPE.INSPECTOR != markerType) {
+      marker.content = this.getMarketContent(data);
+      marker.on("mouseover", infoOpen);
+      marker.on("mouseout", infoClose);
+      marker.setExtData(data);
+      that.deviceType = markerType;
+      let editWindow = that.createInfowindow("编辑");
+      editWindow.fileArr =
+        data.iconUrl != "" && data.iconUrl != undefined
+          ? [{ url: data.iconUrl }]
+          : [];
+      editWindow.obj = marker;
+      editWindow.gaoMap = that;
+      editWindow.map = map;
+      marker.on("click", function(e) {
+        if ("edit" == that.mapOperateType) {
+          editWindow.form = e.target.getExtData();
+          editWindow.show();
+        } else if ("delete" == that.mapOperateType) {
+          let diviceType = {"2":"调压箱","3":"阀门井","4":"流量计","7":"压力表",};
+          vue.$confirm('是否删除名称为"'+e.target.getExtData().deviceName+'"的'+diviceType[markerType]+" ?", "提示", {
+              type: "warning"
+              // center: true
+            }).then(() => {
+              map.remove(marker);
+              that.deleteMarker(markerType, data.deviceId);
+            }).catch(() => {
+              vue.$message({
+                type: "info",
+                // center:true,
+                offset: 100,
+                message: "已取消删除"
+              });
+            });
+        } /*else {
+          //map.setZoomAndCenter(13, e.target.getPosition());
+          let infoWindow = new AMap.InfoWindow({
+            isCustom: true,
+            offset: new AMap.Pixel(24, -38),
+            anchor: "left-top"
+          });
+          infoWindow.setContent(e.target.content);
+          infoWindow.open(map, e.target.getPosition());
+        }*/
+      });
+      marker.on("dragend", function(e) {
+        editWindow.form.longitude = e.lnglat.lng;
+        editWindow.form.latitude = e.lnglat.lat;
+      });
+    }else{
+      marker.on("mouseover",function(){
+        marker.setLabel({
+            offset: new AMap.Pixel(0, -10),  //设置文本标注偏移量
+            content: "<div class='info'>"+data.deviceName+"</div>", //设置文本标注内容
+            direction: 'top' //设置文本标注方位
+        });
+
+      });
+      marker.on("mouseout",function(){
+        marker.setLabel({
+          content: null
+      });
+
+      });
+
+    }
+
+    this.markers.push(marker);
+    map.setZoom("11");
+    //map.setFitView();
+
+    function infoClose(e) {
+      let options = map.getStatus();
+      options.scrollWheel = true;
+      map.setStatus(options);
+      //infoWindow.close(map, e.target.getPosition());
+    }
+
+    function infoOpen(e) {
+      let options = map.getStatus();
+      options.scrollWheel = false;
+      map.setStatus(options);
+      infoWindow.setContent(e.target.content);
+      infoWindow.open(map, e.target.getPosition());
+      that.markerInfoWindow = infoWindow;
+
+
+    }
+  }
+
+  /**
+   * marker添加拖拽事件
+   */
+  addMarkerDragg() {
+    for (var i = 0; i < this.markers.length; i++) {
+      this.markers[i].setDraggable(true);
+    }
+  }
+
+  /**
+   * marker移除拖拽事件
+   */
+  removeMarkerDragg() {
+    for (var i = 0; i < this.markers.length; i++) {
+      this.markers[i].setDraggable(false);
+    }
+  }
+
+  /**
+   * 添加marker信息
+   * @param data
+   * @returns {string}
+   */
+  getMarketContent(data) {
+    switch (this.markerType) {
+      case DEVICE_TYPE.REGEULATORBOX: {
+        const dom = createPop(markerInfoWindow, {
+          title: "调压箱",
+          data: data,
+          map: map
+        });
+        const html = dom.$el;
+        dom.remove();
+        return html;
+      }
+      case DEVICE_TYPE.VALUEWELL: {
+        const dom = createPop(markerInfoWindow, {
+          title: "阀门井",
+          data: data,
+          map: map
+        });
+        const html = dom.$el;
+        dom.remove();
+        return html;
+      }
+      case DEVICE_TYPE.FLOWMETER: {
+        const dom = createPop(markerInfoWindow, {
+          title: "流量计",
+          data: data,
+          map: map
+        });
+        const html = dom.$el;
+        dom.remove();
+        return html;
+      }
+      case DEVICE_TYPE.PRESSUREGAGE: {
+        const dom = createPop(markerInfoWindow, {
+          title: "压力表",
+          data: data,
+          map: map
+        });
+        const html = dom.$el;
+        dom.remove();
+        return html;
+      }
+    }
+  }
+
+  /**
+   * 删除marker
+   * @param delType
+   * @param deviceId
+   */
+  deleteMarker(delType, deviceId) {
+    if (
+      DEVICE_TYPE.REGEULATORBOX == delType ||
+      DEVICE_TYPE.VALUEWELL == delType ||
+      DEVICE_TYPE.FLOWMETER == delType ||
+      DEVICE_TYPE.PRESSUREGAGE == delType
+    ) {
+      delDeviceInfo(deviceId);
+    }
+  }
+
+  /**
+   * 设置设备图标
+   * @param marker
+   */
+  setMarkerIcon(marker) {
+    switch (this.markerType) {
+      case DEVICE_TYPE.REGEULATORBOX: {
+        let icon = new AMap.Icon({
+          //size: new AMap.Size(51, 23),
+          image: require("@/assets/images/tiaoyaxiang.png")
+        });
+        marker.setIcon(icon);
+        break;
+      }
+      case DEVICE_TYPE.VALUEWELL: {
+        let icon = new AMap.Icon({
+          //size: new AMap.Size(51, 23),
+          image: require("@/assets/images/famenjing.png")
+        });
+        marker.setIcon(icon);
+        break;
+      }
+      case DEVICE_TYPE.FLOWMETER: {
+        let icon = new AMap.Icon({
+          //size: new AMap.Size(51, 23),
+          image: require("@/assets/images/liuliangji.png")
+        });
+        marker.setIcon(icon);
+        break;
+      }
+      case DEVICE_TYPE.DUTYPERSON: {
+        let icon = new AMap.Icon({
+          //size: new AMap.Size(51, 23),
+          image: require("@/assets/images/zhibanrenyuan.png")
+        });
+        marker.setIcon(icon);
+        break;
+      }
+      case DEVICE_TYPE.WORKORDER: {
+        let icon = new AMap.Icon({
+          //size: new AMap.Size(51, 23),
+          image: require("@/assets/images/zhibanrenyuan.png")
+        });
+        marker.setIcon(icon);
+        break;
+      }
+      case DEVICE_TYPE.PRESSUREGAGE: {
+        let icon = new AMap.Icon({
+          //size: new AMap.Size(51, 23),
+          image: require("@/assets/images/yalibiao.png")
+        });
+        marker.setIcon(icon);
+        break;
+      }
+      case DEVICE_TYPE.INSPECTOR: {
+        let icon = new AMap.Icon({
+          //size: new AMap.Size(51, 23),
+          image: require("@/assets/images/zhibanrenyuan.png")
+        });
+        marker.setIcon(icon);
+        break;
+      }
+    }
+  }
+
+  /**
+   * 添加折线
+   * @param path
+   */
+  addPolyline(arr) {
+    // this` polyLines = [];
+    console.log("包装的数组", arr);
+    for (let i = 0; i < arr.length; i++) {
+      const item = arr[i];
+      let { coordinates } = item;
+      // console.log("coordinates",coordinates)
+      // let path = coordinates ? getArray(coordinates) :[];
+      // 字符串转二维数组
+
+      let path = coordinates ? eval(coordinates) : [];
+      let polyline = new AMap.Polyline({
+        path,
+        strokeColor: "#80d8ff",
+        strokeWeight: 4,
+        strokeOpacity: 0.9,
+        zIndex: 50,
+        bubble: true,
+        geodesic: true,
+        extData: {
+          type: "newLine",
+          //当前line状态 0:正常状态 1:正在编辑状态
+          isState: 0,
+          lineData: item
+        }
+      });
+
+      this.polyLines.push(polyline);
+      this.newLineObj=polyline;
+      // 信息窗体
+      const dom = createPop(lineInfoWindow, {
+        obj: { a: 123, editorPage: true, ...item, polyline }
+      });
+
+      console.log("dom", dom.$el);
+      dom.$el.addEventListener("mouseover", () => {
+        let options = this.myMap.getStatus();
+        options.scrollWheel = false;
+        this.myMap.setStatus(options);
+      });
+      dom.$el.addEventListener("mouseout", () => {
+        let options = this.myMap.getStatus();
+        options.scrollWheel = true;
+        this.myMap.setStatus(options);
+      });
+      let infoWindow = new AMap.InfoWindow({
+        isCustom: true,
+        autoMove: false,
+        content: dom.$el,
+        //信息船体偏移量
+        offset: new AMap.Pixel(0, 0),
+        anchor: "left-top"
+      });
+
+      this.newLineAddEvent(polyline);
+      polyline.infoWindow = infoWindow;
+      //添加事件
+      polyline.on("mouseover", e => {
+        if (this.lineType == 1) return;
+        // 上方导航的高
+        const topBar = 81;
+        // 坐标导航的宽
+        const leftBar = 100;
+        // 屏幕可视区的宽高
+        const {
+          clientWidth: windowClientWidth,
+          clientHeight: windowClientHeight
+        } = document.body;
+        // 弹出的信息窗口的宽高
+
+        const {
+          offsetWidth: infoWindowWidth,
+          offsetHeight: infoWindowHeight
+        } = { offsetWidth: 406, offsetHeight: 316 };
+        // 鼠标碰到线后的位置
+        const { clientX: mouseClientX, clientY: mouseClientY } = e.originEvent;
+        // 鼠标到左边界的距离
+        const offsetLeftX = mouseClientX - 100;
+        // 鼠标到右边界的距离
+        const offsetRightX = windowClientWidth - mouseClientX;
+        const offsetTopY = mouseClientY - 81;
+        const offsetBottomY = windowClientHeight - mouseClientY;
+
+        const offsetY = mouseClientY - 80 - infoWindowHeight;
+        let X = 20,
+          Y = -20;
+        if (offsetLeftX <= infoWindowWidth) {
+          console.log("靠左了");
+          X = 20;
+        } else if (offsetRightX <= infoWindowWidth) {
+          console.log("靠右了");
+          X = -infoWindowWidth - 20;
+        }
+        if (offsetTopY <= infoWindowHeight) {
+          console.log("靠上了");
+          Y = 20;
+        } else if (offsetBottomY <= infoWindowHeight + 81) {
+          console.log("靠下了");
+          Y = -infoWindowHeight - 20;
+        }
+        polyline.setOptions({ strokeColor: "#80d8ff" });
+        infoWindow.setOffset(new AMap.Pixel(X, Y));
+        infoWindow.open(map, e.lnglat);
+        // polyline.infoWindow=infoWindow;
+        this.showInfoWindow = infoWindow;
+
+        // const
+      });
+      polyline.on("mouseout", e => {
+        polyline.setOptions({ strokeColor: "#80d8ff" });
+        // infoWindow.close();
+      });
+      // 计算info的位置
+      // function infoPosition() {}
+    }
+    map.add(this.polyLines);
+    // 缩放地图到合适的视野级别
+    map.setFitView();
+  }
+  // 创建一条新的线
+  createNewLine() {
+    map.remove(this.markerOverlays);
+    this.mouseTool.polyline({
+      // bubbles:false,
+      strokeWeight: 4,
+      strokeColor: "#80d8ff",
+      extData: {
+        type: "newLine",
+        //当前line状态 0:正常状态 1:正在编辑状态
+        isState: 0
+      }
+      //同Polyline的Option设置
+    });
+    // 让它不再等于null
+    // this.newLineObj={a:123}
+  }
+  // 创建出来的新线归位，重置，当点击编辑跟删除的时候
+  newLineReset() {
+    this.lineFlag = false;
+    if (this.mouserTool) {
+      this.mouseTool.close();
+    }
+    if (this.newLineObj) {
+      this.newLineObj.polyEditor.close();
+      map.remove(this.newLineObj);
+      this.newLineObj = null;
+    }
+  }
+  // 新建line增加编辑以及右键菜单
+  closeInfoWindow() {
+    this.showInfoWindow && this.showInfoWindow.close();
+    this.markerInfoWindow && this.markerInfoWindow.close();
+  }
+  // 新line与老line添加点击事件
+  newLineAddEvent(obj) {
+    obj.polyEditor = new AMap.PolyEditor(map, obj);
+    // obj.polyEditor.on('adjust',(e)=>{
+    //   console.log("addnode")
+    // })
+    obj.on("mousedown", e => {
+      console.log(e.originEvent);
+      console.log("lineType", this.lineType);
+      this.lineFlag = true;
+      // 每次点击关闭然后再次激活
+      // 如果是新线就关闭
+      if (obj.getExtData().type == "newLine") {
+        this.mouseTool.close();
+      }
+      // 删除
+      if (this.lineType == 3) {
+        this.lineDelete(obj);
+        return;
+      }
+      // 获取当前状态 0普通状态，1是正编辑状态
+      const { isState, type } = obj.getExtData();
+      // 如果不是新线的时候并且没点编辑，点击是无效的
+      if (type != "newLine" && this.lineType != 2) return;
+      if (isState == 0) {
+        // 如果是0，就打开编辑，变成编辑状态
+        obj.polyEditor.open();
+        let opstions = obj.getExtData();
+        opstions.isState = 1;
+        console.log(opstions);
+        obj.setExtData(opstions);
+      } else {
+        return;
+        // 经纬度
+        const lnglatsArr = obj.getPath().map(item => [item.lng, item.lat]);
+        // 管道总长度
+        const pipeLength = obj.getLength();
+        // 传回来的数据 如果是新管道就是空
+        const lineData = type == "newLine" ? {} : obj.getExtData().lineData;
+        // const lineData =  obj.getExtData().lineData;
+        console.log("lineData===================>传入组件的数据", lineData);
+        this.infoWindowPipelineView({
+          target: obj,
+          lineType: type,
+          lnglatsArr,
+          pipeLength,
+          lineData
+        });
+      }
+    });
+  }
+  // 隐藏所有管道
+  lineShow(bool) {
+    bool
+      ? this.polyLines.forEach(item => item.show())
+      : this.polyLines.forEach(item => item.hide());
+    if (this.newLineObj) {
+      bool ? this.newLineObj.show() : this.newLineObj.hide();
+    }
+  }
+  markerShow(type, bool) {
+    this.markers.forEach(item => {
+      const { deviceType } = item.getExtData();
+      if (deviceType == type) {
+        bool ? item.show() : item.hide();
+      }
+      // console.log("deviceType",deviceType);
+    });
+  }
+  lineDelete(obj) {
+    const {
+      lineData: { pipeName }
+    } = obj.getExtData();
+    vue
+      .$confirm(`是否删除名称为"${pipeName}"的管道 ?`, "提示", {
+        // confirmButtonText: "确定",
+        // cancelButtonText: "取消",
+        type: "warning"
+        // center: true
+      })
+      .then(() => {
+        const {
+          lineData: { pipeId }
+        } = obj.getExtData();
+        console.log(pipeId);
+        delPipe(pipeId).then(res => {
+          const index = this.polyLines.indexOf(obj);
+          // 如果是老线，就要线删除原来的，然后重新包装一遍
+          if (index >= 0) {
+            this.polyLines.splice(index, 1);
+            map.remove(obj);
+          }
+          vue.$message({
+            type: "success",
+            offset: 100,
+            // center:true,
+            message: "删除成功!"
+          });
+          // 关闭当前线条的infowindow
+          // this.closeLineInfoWindow();
+        });
+      })
+      .catch(() => {
+        vue.$message({
+          type: "info",
+          // center:true,
+          offset: 100,
+          message: "已取消删除"
+        });
+      });
+  }
+  // 关闭所有已经上传的线的编辑状态
+  linePolyEditorAllClose() {
+    this.polyLines.forEach(item => {
+      item.polyEditor.close();
+      let opstions = item.getExtData();
+      opstions.isState = 0;
+      item.setExtData(opstions);
+
+      let attr = item.getOptions();
+      attr.strokeColor = "#F7FE38";
+      item.setOptions(attr);
+    });
+  }
+
+  // 传进组件的会调 点确认的时候调
+  lineOkCallBack(target, data) {
+    target.polyEditor.close();
+    const index = this.polyLines.indexOf(target);
+    // 如果是老线，就要线删除原来的，然后重新包装一遍
+    if (index >= 0) {
+      this.polyLines.splice(index, 1);
+    }
+    console.log("data999-=================>传回来的data", data);
+    this.addPolyline([data]);
+    map.remove(target);
+    // console.log('polyLines',this.polyLines)
+  }
+  // 上传服务器用的组件
+
+  infoWindowPipelineView(options) {
+    // const {} =options;
+    const notice = createPop(pipelineView, {
+      title: "管道",
+      // 数据
+      // lineData: options.lineData,
+      // lnglatsArr:options.lnglatsArr,
+      // pipeLength:options.pipeLength,
+      // //线是新线还是老线
+      // lineType: options.lineType,
+      // target: options.obj,
+      ...options,
+      //把当前对象当作that传进去
+      gaodeMap: this,
+      lineOkCallBack: this.lineOkCallBack
+    });
+    notice.show();
+  }
+  /**
+   * 添加鼠标事件
+   */
+  addMouseTool() {
+    this.mouseTool = new AMap.MouseTool(map);
+    //监听draw事件可获取画好的覆盖物
+    this.overlays = [];
+    let that = this;
+    this.markerOverlays = [];
+    this.mouseTool.on("draw", function(e) {
+      if (e.obj.getExtData().type != "newLine") {
+        map.remove(that.markerOverlays);
+        const device = that.createInfowindow("新增");
+        device.map = map;
+        device.obj = e.obj;
+        device.gaoMap = that;
+        e.obj.on("click", function(aa) {
+          let postion = aa.target._position;
+          //兼容拖拽后单击事件，拖拽后点击事件返回位置为数组
+          if (postion instanceof Array) {
+            device.form.longitude = postion[0];
+            device.form.latitude = postion[1];
+          } else {
+            device.form.longitude = postion.lng;
+            device.form.latitude = postion.lat;
+          }
+
+          device.show();
+        });
+        e.obj.on("mouseover",function () {
+          that.mouseTool.close();
+        });
+
+        e.obj.on("mouseout",function () {
+          that.draw(that.deviceType);
+        })
+
+        that.markerOverlays.push(e.obj);
+      }
+
+
+      if (e.obj && e.obj.getExtData().type == "newLine") {
+        console.log("挂上事件");
+        that.newLineAddEvent(e.obj);
+        // 记录这条线
+        // console.log(e.obj.getPath().length)
+        // 如果只有一个点，并没有连成线的时候就不close 大于一个点的时候才执行clse
+        console.log(that.lineType)
+        if (e.obj.getPath().length > 1) {
+          that.newLineObj = e.obj;
+          that.mouseTool.close();
+        } else {
+          // that.newLineObj = null;
+        }
+        // 关闭
+        // 创建一条新线，然后在点地图的时候删除原来的旧线
+        // that.createNewLine();
+
+        // 右键菜单
+        // that.addEditorAndMenu(e.obj)
+      }
+
+      // if(e.obj.getExtData().type=="line"){
+      //   return;
+      // }
+      //that.mouseTool.close();
+      that.overlays.push(e.obj);
+    });
+  }
+
+  /**
+   * 创建弹框事件
+   */
+  createInfowindow(val) {
+    switch (this.deviceType) {
+      case DEVICE_TYPE.PIPEPLINE: {
+        break;
+      }
+      case DEVICE_TYPE.REGEULATORBOX: {
+        return createPop(regulatorBox, {
+          title: val+ "调压箱"
+        });
+      }
+      case DEVICE_TYPE.VALUEWELL: {
+        return createPop(valveWell, {
+          title: val+ "阀门井"
+        });
+      }
+      case DEVICE_TYPE.FLOWMETER: {
+        return createPop(flowMeter, {
+          title: val+ "流量计"
+        });
+      }
+      case DEVICE_TYPE.PRESSUREGAGE: {
+        return createPop(pressureGage, {
+          title: val+ "压力表"
+        });
+      }
+    }
+  }
+
+  /**
+   * 鼠标画图事件
+   * @param deviceType 设备类型
+   */
+  draw(deviceType) {
+    let that = this;
+    that.deviceType = deviceType;
+    if (
+      DEVICE_TYPE.REGEULATORBOX == deviceType ||
+      DEVICE_TYPE.VALUEWELL == deviceType ||
+      DEVICE_TYPE.FLOWMETER == deviceType ||
+      DEVICE_TYPE.PRESSUREGAGE == deviceType
+    ) {
+      that.mouseTool.marker({
+        draggable: true
+      });
+    }
+    if (DEVICE_TYPE.PIPEPLINE == deviceType) {
+      that.mouseTool.polyline({
+        strokeWeight: 9,
+        strokeColor: "#80d8ff"
+        //同Polyline的Option设置
+      });
+    }
+  }
+
+  /**
+   * 添加地图控件
+   */
+  addMapControl() {
+    AMap.plugin(
+      [
+        "AMap.ToolBar",
+        "AMap.Scale",
+        "AMap.HawkEye",
+        "AMap.MapType",
+        "AMap.Geolocation"
+      ],
+      function() {
+        // 在图面添加工具条控件，工具条控件集成了缩放、平移、定位等功能按钮在内的组合控件
+        //map.addControl(new AMap.ToolBar());
+
+        // 在图面添加比例尺控件，展示地图在当前层级和纬度下的比例尺
+        map.addControl(new AMap.Scale());
+
+        // 在图面添加鹰眼控件，在地图右下角显示地图的缩略图
+        map.addControl(new AMap.HawkEye({ isOpen: true }));
+
+        // 在图面添加类别切换控件，实现默认图层与卫星图、实施交通图层之间切换的控制
+        map.addControl(
+          new AMap.MapType({ position: { top: "10px", left: "100px" } })
+        );
+
+        // 在图面添加定位控件，用来获取和展示用户主机所在的经纬度位置
+        // map.addControl(new AMap.Geolocation());
+      }
+    );
+  }
+
+  searchTips(inputId) {
+    let that = this;
+    AMap.plugin(["AMap.AutoComplete", "AMap.PlaceSearch"], function() {
+      //输入提示
+      // var autoOptions = {
+      //   input: inputId
+      // };
+      // let auto = new AMap.AutoComplete(autoOptions);
+      that.placeSearch = new AMap.PlaceSearch({
+        map: map
+      });
+      //构造地点查询类
+      // auto.on("select", function(e) {
+      //   that.searchSelectAdcode = e.poi.adcode;
+      //   that.searchSelectName = e.poi.name;
+      // });
+    });
+  }
+
+
+  closeAddMarker() {
+    this.mouseTool.close();
+    map.remove(this.markerOverlays);
+  }
+}
+export default gaodeMap;

gassafety-web/src/permission.js

@@ -54,8 +54,11 @@ router.afterEach((to, from) => {
   // console.log('全局后置钩子',to, from)
   if (to.path == "/enterprise/mapView") {
     store.dispatch("app/toggleDevice", "mobile");
+    store.dispatch("app/closeSideBar", { withoutAnimation: true });
+
   } else {
     store.dispatch("app/toggleDevice", "desktop");
+    store.dispatch("app/closeSideBar", { withoutAnimation: false });
   }
   NProgress.done();
 });

gassafety-web/src/utils/gaodeMap.js

@@ -5,10 +5,10 @@ import flowMeter from "../components/PopWindow/flowMeter.vue";
 import pressureGage from "../components/PopWindow/pressureGage.vue";
 import pipelineView from "../components/PopWindow/pipelineView.vue";
 import lineInfoWindow from "../components/PopWindow/lineInfoWindow.vue";
-import { delDeviceInfo } from "@/api/device/deviceInfo";
+import { delDeviceInfo, updateDeviceInfo } from "@/api/device/deviceInfo";
 import markerInfoWindow from "../components/PopWindow/markerInfoWindow.vue";
 import { getArray } from "@/utils/gassafety.js";
-import { delPipe } from "@/api/device/pipe.js";
+import { delPipe, updatePipe } from "@/api/device/pipe.js";
 import vue from "../main";
 let defaultCenter = "石家庄";
 export let map;
@@ -77,15 +77,15 @@ class gaodeMap {
     });
 
     // 地图开始平移删除infowindow
-       this.myMap.on("movestart",()=>{
+    this.myMap.on("movestart", () => {
       // console.log("地图平移");
-        this.closeInfoWindow()
-      })
+      this.closeInfoWindow();
+    });
     // 地图开始缩放删除infowindow
-      this.myMap.on("zoomstart",()=>{
+    this.myMap.on("zoomstart", () => {
       // console.log("缩放开始")
-        this.closeInfoWindow()
-      })
+      this.closeInfoWindow();
+    });
     this.districtBoundaries();
   }
 
@@ -155,12 +155,12 @@ class gaodeMap {
       offset: new AMap.Pixel(24, -38),
       anchor: "left-top"
     });
-    infoWindow.on("mouseover",function () {
+    infoWindow.on("mouseover", function() {
       let options = map.getStatus();
       options.scrollWheel = false;
       map.setStatus(options);
     });
-    infoWindow.on("mouseout",function () {
+    infoWindow.on("mouseout", function() {
       let options = map.getStatus();
       options.scrollWheel = true;
       map.setStatus(options);
@@ -171,7 +171,10 @@ class gaodeMap {
       offset: new AMap.Pixel(0, 5)
     });
     this.setMarkerIcon(marker);
-    if (DEVICE_TYPE.WORKORDER != markerType && DEVICE_TYPE.INSPECTOR != markerType) {
+    if (
+      DEVICE_TYPE.WORKORDER != markerType &&
+      DEVICE_TYPE.INSPECTOR != markerType
+    ) {
       marker.content = this.getMarketContent(data);
       marker.on("mouseover", infoOpen);
       marker.on("mouseout", infoClose);
@@ -190,14 +193,40 @@ class gaodeMap {
           editWindow.form = e.target.getExtData();
           editWindow.show();
         } else if ("delete" == that.mapOperateType) {
-          let diviceType = {"2":"调压箱","3":"阀门井","4":"流量计","7":"压力表",};
-          vue.$confirm('是否删除名称为"'+e.target.getExtData().deviceName+'"的'+diviceType[markerType]+" ?", "提示", {
+          let diviceType = {
+            "2": "调压箱",
+            "3": "阀门井",
+            "4": "流量计",
+            "7": "压力表"
+          };
+          vue
+            .$confirm(
+              '是否删除名称为"' +
+                e.target.getExtData().deviceName +
+                '"的' +
+                diviceType[markerType] +
+                " ?",
+              "提示",
+              {
                 type: "warning"
                 // center: true
-            }).then(() => {
+              }
+            )
+            .then(() => {
+              // that.deleteMarker(markerType, data.deviceId);
+              that.deleteMarker(markerType, data).then(res => {
+                if (res.code == 200) {
                   map.remove(marker);
-              that.deleteMarker(markerType, data.deviceId);
-            }).catch(() => {
+                  // 数组里也删了
+                  const ind = that.markers.indexOf(marker);
+                  if (ind >= 0) {
+                    that.markers.splice(ind, 1);
+                    console.log(that.markers)
+                  }
+                }
+              });
+            })
+            .catch(() => {
               vue.$message({
                 type: "info",
                 // center:true,
@@ -220,22 +249,19 @@ class gaodeMap {
         editWindow.form.longitude = e.lnglat.lng;
         editWindow.form.latitude = e.lnglat.lat;
       });
-    }else{
-      marker.on("mouseover",function(){
+    } else {
+      marker.on("mouseover", function() {
         marker.setLabel({
           offset: new AMap.Pixel(0, -10), //设置文本标注偏移量
-            content: "<div class='info'>"+data.deviceName+"</div>", //设置文本标注内容
-            direction: 'top' //设置文本标注方位
+          content: "<div class='info'>" + data.deviceName + "</div>", //设置文本标注内容
+          direction: "top" //设置文本标注方位
         });
-
       });
-      marker.on("mouseout",function(){
+      marker.on("mouseout", function() {
         marker.setLabel({
           content: null
         });
-
       });
-     
     }
 
     this.markers.push(marker);
@@ -256,8 +282,6 @@ class gaodeMap {
       infoWindow.setContent(e.target.content);
       infoWindow.open(map, e.target.getPosition());
       that.markerInfoWindow = infoWindow;
-
-
     }
   }
 
@@ -334,14 +358,17 @@ class gaodeMap {
    * @param delType
    * @param deviceId
    */
-  deleteMarker(delType, deviceId) {
+  deleteMarker(delType, deviceData) {
     if (
       DEVICE_TYPE.REGEULATORBOX == delType ||
       DEVICE_TYPE.VALUEWELL == delType ||
       DEVICE_TYPE.FLOWMETER == delType ||
       DEVICE_TYPE.PRESSUREGAGE == delType
     ) {
-      delDeviceInfo(deviceId);
+      // delDeviceInfo(deviceId);
+      const upDataObj = { ...deviceData };
+      upDataObj.isDel = 1;
+      return updateDeviceInfo(upDataObj);
     }
   }
 
@@ -634,27 +661,60 @@ class gaodeMap {
       // console.log("deviceType",deviceType);
     });
   }
+  // 其实是修改了状态，不是真的删除
   lineDelete(obj) {
     const {
-      lineData: { pipeName }
+      lineData: { pipeName, deviceInfoList }
     } = obj.getExtData();
+    console.log("deviceInfoList", deviceInfoList);
+
+    var devices = " ";
+    for (var i = 0; i < deviceInfoList.length; i++) {
+      var item = deviceInfoList[i];
+      devices = devices + item.deviceName + " ";
+    }
     vue
-      .$confirm(`是否删除名称为"${pipeName}"的管道 ?`, "提示", {
+      .$confirm(
+        '请确认是否删除管道名称为"' +
+          pipeName +
+          '"的数据项，该管道下包含的设备（' +
+          devices +
+          "）将一并删除",
+        "提示",
+        {
           // confirmButtonText: "确定",
           // cancelButtonText: "取消",
           type: "warning"
           // center: true
-      })
+        }
+      )
       .then(() => {
-        const {
-          lineData: { pipeId }
-        } = obj.getExtData();
-        console.log(pipeId);
-        delPipe(pipeId).then(res => {
+        const { lineData } = obj.getExtData();
+        // updatePipe
+        // delPipe(pipeId).then(res => {
+        let upDataObj = { ...lineData };
+        upDataObj.isDel = 1;
+        updatePipe(upDataObj).then(res => {
+          if (res.code == 200) {
             const index = this.polyLines.indexOf(obj);
             // 如果是老线，就要线删除原来的，然后重新包装一遍
             if (index >= 0) {
               this.polyLines.splice(index, 1);
+              // 删除管道的时候，与管道管理额的设备也要删除
+              for (var i = 0; i < deviceInfoList.length; i++) {
+                const item = deviceInfoList[i];
+                for (let j = 0; j < this.markers.length; j++) {
+                  const item2 = this.markers[j];
+                  if (item.deviceId == item2.getExtData().deviceId) {
+                    map.remove(item2);
+                    const ind = this.markers.indexOf(item2);
+                    if (ind >= 0) {
+                      this.markers.splice(ind, 1);
+                    }
+                    break;
+                  }
+                }
+              }
               map.remove(obj);
             }
             vue.$message({
@@ -665,9 +725,12 @@ class gaodeMap {
             });
             // 关闭当前线条的infowindow
             // this.closeLineInfoWindow();
+            console.log("改变线条");
+          }
         });
       })
-      .catch(() => {
+      .catch(err => {
+        console.log(err);
         vue.$message({
           type: "info",
           // center:true,
@@ -752,25 +815,24 @@ class gaodeMap {
 
           device.show();
         });
-        e.obj.on("mouseover",function () {
+        e.obj.on("mouseover", function() {
           that.mouseTool.close();
         });
 
-        e.obj.on("mouseout",function () {
+        e.obj.on("mouseout", function() {
           that.draw(that.deviceType);
-        })
+        });
 
         that.markerOverlays.push(e.obj);
       }
 
-
       if (e.obj && e.obj.getExtData().type == "newLine") {
         console.log("挂上事件");
         that.newLineAddEvent(e.obj);
         // 记录这条线
         // console.log(e.obj.getPath().length)
         // 如果只有一个点，并没有连成线的时候就不close 大于一个点的时候才执行clse
-        console.log(that.lineType)
+        console.log(that.lineType);
         if (e.obj.getPath().length > 1) {
           that.newLineObj = e.obj;
           that.mouseTool.close();
@@ -803,22 +865,22 @@ class gaodeMap {
       }
       case DEVICE_TYPE.REGEULATORBOX: {
         return createPop(regulatorBox, {
-          title: val+ "调压箱"
+          title: val + "调压箱"
         });
       }
       case DEVICE_TYPE.VALUEWELL: {
         return createPop(valveWell, {
-          title: val+ "阀门井"
+          title: val + "阀门井"
         });
       }
       case DEVICE_TYPE.FLOWMETER: {
         return createPop(flowMeter, {
-          title: val+ "流量计"
+          title: val + "流量计"
         });
       }
       case DEVICE_TYPE.PRESSUREGAGE: {
         return createPop(pressureGage, {
-          title: val+ "压力表"
+          title: val + "压力表"
         });
       }
     }
@@ -902,7 +964,6 @@ class gaodeMap {
     });
   }
 
-
   closeAddMarker() {
     this.mouseTool.close();
     map.remove(this.markerOverlays);

gassafety-web/src/views/dataMonitoring/alarmdetail/index.vue

 <template>
   <div class="app-container detail" style="background-color: rgb(238, 241, 245);">
     <div style="padding-top: 10px;background: #fff;height: 100%;">
-        <div>
-          <div style="width: 5%;height: 45px;margin-left: 20px;" @click="$router.go(-1)">
-            <el-button
-            size="medium"
-            type="text"
-            style="font-size: 18px; color: rgb(7, 63, 112);float: left;"
-            >返回</el-button>
+      <el-row>
+        <el-col :span="24" style="padding-left: 15px;">
+          <div style="height: 45px;" @click="$router.go(-1)">
+            <el-button size="medium" type="text" style="font-size: 18px; color: rgb(7, 63, 112);float: left;">返回
+            </el-button>
             <div style="float: left;margin-top: 8px;margin-left: 5px;"><img src="../../../assets/logo/fanhui.png" style="width: 25px;" alt=""></div>
           </div>
-        </div>
+        </el-col>
+      </el-row>
 
 
-        <div style="width: 100%;height: 100px;">
-          <!-- <div style="color: #31EAEA;width: 30%;height: 30px;">
-            <ul><li>详细信息</li></ul>
-          </div> -->
-          <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="float: left;margin-left: 50px;">
+      <el-row style="padding-left: 50px;">
+        <el-col :span="6">
+          <el-form ref="form" v-model="form" :rules="rules" style="width: 100%;">
             <el-form-item label="设备类型:" prop="deviceType">
               <font>{{form.deviceType}}</font>
             </el-form-item>
@@ -25,7 +22,9 @@
               <font>{{form.deviceCode}}</font>
             </el-form-item>
           </el-form>
-          <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="float: left;margin-left: 50px;">
+        </el-col>
+        <el-col :span="6">
+          <el-form ref="form" v-model="form" :rules="rules"  style="width: 100%;">
             <el-form-item label="报警类型:" prop="alarmType">
               <font>{{form.alarmType}}</font>
             </el-form-item>
@@ -33,7 +32,9 @@
               <font>{{form.alarmValue}}</font>
             </el-form-item>
           </el-form>
-          <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="float: left;margin-left: 50px;">
+        </el-col>
+        <el-col :span="6">
+          <el-form ref="form" v-model="form" :rules="rules"  style="width: 100%;">
             <el-form-item label="报警开始时间:" prop="startTime">
               <font>{{form.startTime}}</font>
             </el-form-item>
@@ -41,23 +42,38 @@
               <font>{{form.endTime}}</font>
             </el-form-item>
           </el-form>
-          <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="float: left;margin-left: 50px;">
+        </el-col>
+        <el-col :span="6">
+          <el-form ref="form" v-model="form" :rules="rules"  style="width: 100%;">
             <el-form-item label="工单编号:" prop="orderId">
               <font>{{form.orderId}}</font>
             </el-form-item>
             <el-form-item label="处理状态:" prop="dealStatus">
               <font v-if="form.orderId == null || form.orderId == ''">未生成工单</font>
-              <font v-if="(form.dealStatus == null || form.dealStatus == '') && form.orderId != null && form.orderId != ''">未处理</font>
+              <font
+                v-if="(form.dealStatus == null || form.dealStatus == '') && form.orderId != null && form.orderId != ''">
+                未处理</font>
               <font v-if="form.dealStatus == 1">不需处理</font>
               <font v-if="form.dealStatus == 2">已处理完成</font>
               <font v-if="form.dealStatus == 3">未处理完成</font>
             </el-form-item>
           </el-form>
-        </div>
+        </el-col>
+      </el-row>
+
+      <!-- <div style="width: 100%;height: 100px;"> -->
+       
+       
+       
+       
+
+
+      <!-- </div> -->
       <el-divider></el-divider>
 
-        <div style="width: 100%;height: 350px;padding: 10px;height: 300px;">
-            <div style="width: 66.6%;float: left;height: 100%;">
+      <el-row>
+        <el-col :span="16" style="padding: 10px;">
+          <div style="width: 100%;float: left;height: 100%;">
             <el-table :data="dataListdetail1" style="width: 100%">
               <el-table-column label="设备名称" align="center" prop="deviceName" />
               <el-table-column label="设备编号" align="center" prop="deviceCode" />
@@ -69,6 +85,7 @@
               <el-table-column label="报警开始时间" align="center" prop="startTime" />
             </el-table>
   
+  
             <el-table :data="dataListdetail3" style="width: 100%;margin-top: 20px;">
               <el-table-column label="报警结束时间" align="center" prop="endTime" />
               <el-table-column label="处理状态" align="center" prop="dealStatus">
@@ -83,63 +100,77 @@
               </el-table-column>
             </el-table>
   
-
           </div>
-          <div id="marbox" style="width: 33%;height: 304px; border: 1px solid rgb(218, 213, 213);float: right;">
+        </el-col>
+        <el-col :span="8" style="padding: 10px;padding-left: 0px;">
+          <div id="marbox" style="width: 100%;height: 304px; border: 1px solid rgb(218, 213, 213);float: right;">
             <div style="width: 100%;height: 100%" id="container"></div>
           </div>
-        </div>
+        </el-col>
+      </el-row>
 
-        <div v-if="form.deviceType != '压力表'" style="height: 320px;width: 100%;margin-top: 15px;padding: 10px;">
-          <div id="main1" style="float: left;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
-            <div v-if = "form.deviceReportDataList == null" class="div-null">
+      
+      <template v-if="$route.query.deviceType!='管道'">
+
+
+        <el-row v-if="form.deviceType != '压力表'">
+          <el-col :span="12" style="padding: 10px;">
+            <div id="main1" style="height:300px;background-color: rgb(247 247 247);padding: 5px;">
+              <div v-if="form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-        <div id="main2" style="float: right;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
-          <div v-if = "form.deviceReportDataList == null" class="div-null">
+          </el-col>
+          <el-col :span="12" style="padding: 10px;">
+            <div id="main2" style="height:300px;background-color: rgb(247 247 247);padding: 5px;">
+              <div v-if="form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-      </div>
-
-
-      <div style="height: 320px;width: 100%;padding: 10px;margin-top: 10px;">
-        <div v-if="form.deviceType != '压力表'" id="main3" style="float: left;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
-          <div v-if = "form.deviceReportDataList == null" class="div-null">
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12" style="padding: 10px;" v-if="form.deviceType != '压力表'">
+            <div id="main3" style="height:300px;background-color: rgb(247 247 247);padding: 5px;">
+              <div v-if="form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-        <div id="main4" style="float: left;width: 49.8%;margin-left: 5px;height:300px;background-color: rgb(247 247 247);padding: 5px;">
-          <div v-if = "form.deviceReportDataList == null" class="div-null">
+          </el-col>
+          <el-col :span="12" style="padding: 10px;">
+            <div id="main4" style="height:300px;background-color: rgb(247 247 247);padding: 5px;">
+              <div v-if="form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-      </div>
-        <!-- <div style="height: 320px;width: 100%;margin-top: 15px;padding: 10px;">
-          <div id="main1" style="float: left;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
-          </div>
-          <div id="main2" style="float: right;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
-          </div>
-        </div> -->
+          </el-col>
+        </el-row>
+        <!-- <div v-if="form.deviceType != '压力表'" style="height: 320p x;width: 100%;margin-top: 15px;padding: 10px;"> -->
+          
+          
+        <!-- </div> -->
+
+
+        <!-- <div style="height: 320px;width: 100%;padding: 10px;margin-top: 10px;"> -->
+          
+         
+        <!-- </div> -->
+
+      </template>
 
 
-        <!-- <div style="height: 320px;width: 100%;padding: 10px;margin-top: 10px;">
-          <div id="main3" style="float: left;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
-          </div>
-          <div id="main4" style="float: left;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;margin-left: 5px;">
-          </div>
-        </div> -->
     </div>
+
   </div>
 </template>
 
-  <script>
+<script>
 
   import { getDeviceAlarm } from "@/api/dataMonitoring/deviceAlarm";
   import { deviceTree } from "@/api/device/deviceInfo";
   import gaodeMap from "utils/gaodeMap.js";
-  import {map, DEVICE_TYPE} from "utils/gaodeMap.js";
+  import { map, DEVICE_TYPE } from "utils/gaodeMap.js";
+  import { inspectorList } from "@/api/system/user";
   import echarts from 'echarts';
 
 export default {
@@ -163,7 +194,7 @@ export default {
       this.alarmId = +this.$route.query.alarmId;
       this.getDetail();
     },
-    mounted(){
+    mounted() {
       let gaoMap = new gaodeMap("石家庄");
       this.gaoMap = gaoMap;
     },
@@ -498,9 +529,9 @@ export default {
           this.dataListdetail3.push(obj3);
 
           this.form = response.data;
-          console.log("this.form",this.form)
+          console.log("this.form", this.form)
           this.active = parseInt(response.data.orderStatus) + 1;
-          this.gaoMap.resetMapCenter([this.form.longitude,this.form.latitude]);
+          this.gaoMap.resetMapCenter([this.form.longitude, this.form.latitude]);
           this.gaoMap.addMarker(DEVICE_TYPE.WORKORDER, this.form)
 
           var getData1 = [];
@@ -512,7 +543,7 @@ export default {
           var getData7 = [];
           //先进行赋值
           for (let i = 0; i < this.form.deviceReportDataList.length; i++) {
-            getData1.push( this.form.deviceReportDataList[i].standardConditionFlow)
+            getData1.push(this.form.deviceReportDataList[i].standardConditionFlow)
             getData2.push(this.form.deviceReportDataList[i].workingConditionFlow)
             getData3.push(this.form.deviceReportDataList[i].reportTime)
             getData4.push(this.form.deviceReportDataList[i].standardConditionAccumulation)
@@ -525,15 +556,16 @@ export default {
           this.main3(getData6, getData3);
           this.main4(getData7, getData3);
           console.log(this.form.deviceReportDataList)
-          console.log("getData1",getData1)
-          console.log("getData2",getData2)
-          console.log("getData3",getData3)
+          console.log("getData1", getData1)
+          console.log("getData2", getData2)
+          console.log("getData3", getData3)
+
 
           if(this.form.orderType == '1') {
             // 获取设备列表树
             let data = {
-              key1:this.form.deviceInfoList,
-              key2:this.form.pipeList
+              key1: this.form.deviceInfoList,
+              key2: this.form.pipeList
             };
             deviceTree(data).then(response => {
               this.deviceOptions[0].childList = response.data;
@@ -543,27 +575,33 @@ export default {
       },
     }
   }
-  </script>
-  <style>
-    .div-null{
+</script>
+<style>
+  .div-null {
     width: 100%;
     height: 300px;
     text-align: center;
     line-height: 250px;
   }
-    .el-tree-node__content{
+
+  .el-tree-node__content {
     width: 150px;
   }
+
   .el-divider--horizontal {
     display: block;
     height: 1px;
     width: 100%;
     margin: 20px 0;
   }
-    .feedbackTime-div{
-      float: left;margin-left: 150px;margin-top: 10px;
+
+  .feedbackTime-div {
+    float: left;
+    margin-left: 150px;
+    margin-top: 10px;
   }
-    .feedbackTime{
+
+  .feedbackTime {
     height: 120px;
     width: 120px;
     float: left;
@@ -574,22 +612,28 @@ export default {
     justify-content: center;
     align-items: center;
   }
+
   .el-card__body {
     padding: 5px 20px 20px 20px;
   }
-    .detail .el-form{
+
+  .detail .el-form {
     width: 20%;
   }
-    .detail .el-form-item{
+
+  .detail .el-form-item {
     margin-bottom: 0px;
   }
-    .el-tree{
+
+  .el-tree {
     margin-top: 5px;
   }
-    .avatar-uploader{
+
+  .avatar-uploader {
     width: 25%;
     float: left;
   }
+
   .avatar-uploader .el-upload {
     border: 1px dashed #d9d9d9;
     border-radius: 6px;
@@ -597,9 +641,11 @@ export default {
     position: relative;
     overflow: hidden;
   }
+
   .avatar-uploader .el-upload:hover {
     border-color: #409EFF;
   }
+
   .avatar-uploader-icon {
     font-size: 28px;
     color: #8c939d;
@@ -608,13 +654,15 @@ export default {
     line-height: 178px;
     text-align: center;
   }
+
   .avatar {
     width: 178px;
     height: 178px;
     display: block;
   }
-  li{
+
+  li {
     font-size: 15px;
     font-weight: 900;
   }
-  </style>
+</style>
\ No newline at end of file

gassafety-web/src/views/dataMonitoring/deviceAlarm/index.vue

@@ -351,7 +351,8 @@ export default {
       this.$router.push({
         path: '/dataMonitoring/alarmdetail',
         query: {
-          alarmId: row.alarmId
+          alarmId: row.alarmId,
+          deviceType:row.deviceType
         }
       }) //带参跳转
     },

gassafety-web/src/views/dataMonitoring/realtimeData/index.vue

@@ -177,7 +177,8 @@ export default {
       this.$router.push({
         path: '/dataMonitoring/realtimedetail',
         query:{
-          deviceId : row.deviceId
+          deviceId : row.deviceId,
+          deviceType: row.deviceType
         }
       }) //带参跳转
     },

gassafety-web/src/views/dataMonitoring/realtimedetail/index.vue

 <template>
   <div class="app-container detail" style="background-color: rgb(238, 241, 245);">
     <div style="padding-top: 10px;background: #fff;height: 100%;">
-      <div>
-        <div style="width: 5%;height: 45px;margin-left: 20px;" @click="$router.go(-1)">
+        
+      <el-row>
+        <el-col :span="24" style="padding-left: 15px;">
+          <div style="height: 45px;" @click="$router.go(-1)">
             <el-button size="medium" type="text" style="font-size: 18px; color: rgb(7, 63, 112);float: left;">返回
             </el-button>
-          <div style="float: left;margin-top: 8px;margin-left: 5px;"><img src="../../../assets/logo/fanhui.png"
-              style="width: 25px;" alt=""></div>
-        </div>
+            <div style="float: left;margin-top: 8px;margin-left: 5px;"><img src="../../../assets/logo/fanhui.png" style="width: 25px;" alt=""></div>
           </div>
+        </el-col>
+      </el-row>
 
-      <div style="width: 100%;height: 350px;padding: 10px;height: 300px;">
-        <div style="width: 66.6%;float: left;height: 100%;">
+      <el-row>
+        <el-col :span="16" style="padding: 10px;">
+          <div style="height: 100%;">
             <el-table :data="dataListdetail1" style="width: 100%">
               <el-table-column label="设备名称" align="center" prop="deviceName" />
               <el-table-column label="设备编号" align="center" prop="deviceCode" />
@@ -39,41 +42,62 @@
               <el-table-column label="设备状态" align="center" prop="deviceStatus">
               </el-table-column>
             </el-table>
-
-
-
           </div>
-        <div id="marbox" style="width: 33%;height: 350px; border: 1px solid rgb(218, 213, 213);float: right;margin-top: -45px;">
+        </el-col>
+        <el-col :span="8" style="padding: 10px;padding-left: 0px;">
+          <div id="marbox" style="height: 350px; border: 1px solid rgb(218, 213, 213);margin-top: -45px;">
             <div style="width: 100%;height: 100%" id="container"></div>
           </div>
-      </div>
+        </el-col>
+      </el-row>
+
+
       
-      <div v-if="form.deviceType != '4'" style="height: 320px;width: 100%;margin-top: 15px;padding: 10px;">
-          <div id="main1" style="float: left;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
+      <template v-if="$route.query.deviceType !='0'">
+        <el-row  v-if="form.deviceType != '4'">
+          <el-col :span="12" style="padding: 10px;">
+            <div id="main1" style="height:300px;background-color: rgb(247 247 247);padding: 5px;">
               <div v-if = "form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-        <div id="main2" style="float: right;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
+          </el-col>
+          <el-col :span="12" style="padding: 10px;">
+            <div id="main2" style="height:300px;background-color: rgb(247 247 247);padding: 5px;">
               <div v-if = "form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-      </div>
-
-
-      <div style="height: 320px;width: 100%;padding: 10px;margin-top: 10px;">
-        <div v-if="form.deviceType != '4'" id="main3" style="float: left;width: 49.8%;height:300px;background-color: rgb(247 247 247);padding: 5px;">
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="12" style="padding: 10px;" v-if="form.deviceType != '4'">
+            <div id="main3" style="height:300px;background-color: rgb(247 247 247);padding: 5px;">
               <div v-if = "form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-        <div id="main4" style="float: left;width: 49.8%;margin-left: 5px;height:300px;background-color: rgb(247 247 247);padding: 5px;">
+          </el-col>
+          <el-col :span="12" style="padding: 10px;">
+            <div id="main4" style="margin-left: 5px;height:300px;background-color: rgb(247 247 247);padding: 5px;">
               <div v-if = "form.deviceReportDataList == null" class="div-null">
                 <p>暂无数据</p>
               </div>
             </div>
-      </div>
+          </el-col>
+        </el-row>
+        <!-- <div v-if="form.deviceType != '4'" style="height: 320px;width: 100%;margin-top: 15px;padding: 10px;"> -->
+          
+        
+      <!-- </div> -->
+
+
+        <!-- <div style="height: 320px;width: 100%;padding: 10px;margin-top: 10px;"> -->
+          
+         
+        <!-- </div> -->
+      </template>
+      
 
       
     </div>

gassafety-web/src/views/device/deviceInfo/index.vue

@@ -133,31 +133,20 @@
     />
 
     <!-- 添加或修改设备信息对话框 -->
-    <el-dialog :title="title" :visible.sync="open" append-to-body @close="cancel">
+    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="135px">
-        <el-col :span="11">
         <el-form-item label="所属管道" prop="pipeId">
-            <el-select v-model="form.pipeId" placeholder="请选择所属管道" style="width: 100%" >
+          <el-select v-model="form.pipeId" placeholder="请选择所属管道" clearable size="small" style="width: 600px">
             <el-option
               v-for="item in options"
               :key="item.pipeId"
               :label="item.pipeName"
               :value="item.pipeId"
-              >
-              </el-option>
+            ></el-option>
           </el-select>
         </el-form-item>
-        </el-col>
-
-        <el-col :span="12">
-          <el-form-item label="设备编号" prop="deviceCode">
-            <el-input v-model="form.deviceCode" placeholder="请输入设备编号" />
-          </el-form-item>
-        </el-col>
-
-        <el-col :span="11">
-          <el-form-item label="设备类型" prop="deviceType">
-            <el-select v-model="form.deviceType" placeholder="请选择设备类型" style="width: 100%" >
+        <el-form-item label="设备类型">
+          <el-select v-model="form.deviceType" placeholder="请选择设备类型" style="width: 600px">
             <el-option
               v-for="dict in typeOptions"
               :key="dict.dictValue"
@@ -166,72 +155,34 @@
             ></el-option>
           </el-select>
         </el-form-item>
-        </el-col>
-
-        <el-col :span="12">
         <el-form-item label="设备名称" prop="deviceName">
-            <el-input
-              v-model="form.deviceName"
-              placeholder="请输入设备名称"
-            />
+          <el-input v-model="form.deviceName" placeholder="请输入设备名称" style="width: 600px" />
+        </el-form-item>
+        <el-form-item label="设备编号" prop="deviceCode">
+          <el-input v-model="form.deviceCode" placeholder="请输入设备编号" style="width: 600px" />
         </el-form-item>
-        </el-col>
-
-        <el-col :span="11">
         <el-form-item label="设备型号" prop="deviceModel">
-            <el-input
-              v-model="form.deviceModel"
-              placeholder="请输入设备型号"
-            />
+          <el-input v-model="form.deviceModel" placeholder="请输入设备型号" style="width: 600px" />
         </el-form-item>
-        </el-col>
-
-        <el-col :span="12">
         <el-form-item label="物联网编号" prop="iotNo">
           <el-input v-model="form.iotNo" placeholder="请输入物联网编号" />
         </el-form-item>
-        </el-col>
-
-        <el-col :span="23">
         <el-form-item label="所在地址" prop="deviceAddr">
-            <el-input v-model="form.deviceAddr" placeholder="请输入所在地址" />
+          <el-input v-model="form.deviceAddr" placeholder="请输入所在地址" style="width: 600px" />
         </el-form-item>
-        </el-col>
-
-        <el-col :span="23">
-          <el-form-item label="经纬度坐标" prop="longitude">
+        <el-form-item label="经纬度" >
           <el-row>
             <el-col :span="8">
               <el-input v-model.number="form.longitude" placeholder="请输入经度" />
             </el-col>
-              <el-col :span="8" style="margin-left: 10px">
+            <el-col :span="8">
               <el-input v-model.number="form.latitude" placeholder="请输入纬度"/>
             </el-col>
-              <el-col :span="5" style="margin-left: 10px">
+            <el-col :span="5">
               <el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button>
             </el-col>
           </el-row>
         </el-form-item>
-        </el-col>
-
-        <el-col :span="11">
-          <el-form-item label="联系人" prop="linkman">
-            <el-input v-model="form.linkman" placeholder="请输入联系人" />
-          </el-form-item>
-        </el-col>
-
-        <el-col :span="12">
-          <el-form-item label="联系电话" prop="phone">
-            <el-input
-              type="number"
-              maxlength="12"
-              v-model="form.phone"
-              placeholder="请输入联系电话"
-            />
-          </el-form-item>
-        </el-col>
-
-        <el-col>
         <el-form-item label="设备图片上传" prop="iconUrl">
           <MyFileUpload
             listType="picture-card"
@@ -239,44 +190,31 @@
             @remove="listRemove"
             :fileArr="fileList"
           />
-            <el-input v-show="false" disabled v-model="form.iconUrl"></el-input>
         </el-form-item>
-        </el-col>
-
-        <el-col>
-          <el-form-item label="安装日期" prop="installationTime">
-            <el-col :span="11">
+        <el-form-item label="联系人" prop="linkman">
+          <el-input v-model="form.linkman" placeholder="请输入联系人" />
+        </el-form-item>
+        <el-form-item label="电话" prop="phone">
+          <el-input v-model="form.phone" placeholder="请输入电话" />
+        </el-form-item>
+        <el-form-item label="安装时间" prop="installationTime">
           <el-date-picker clearable size="small"
-                style="width: 100%"
             v-model="form.installationTime"
-                type="date"
-                value-format="yyyy-MM-dd"
-                placeholder="请选择安装日期">
+            type="datetime"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            placeholder="选择安装时间">
           </el-date-picker>
-            </el-col>
         </el-form-item>
-        </el-col>
-
-        <el-col :span="23">
-          <el-form-item label="备注信息" prop="remarks">
-            <el-input type="textarea" v-model="form.remarks" placeholder="请输入备注信息" />
+        <el-form-item label="备注" prop="remarks">
+          <el-input v-model="form.remarks" placeholder="请输入备注" />
         </el-form-item>
-        </el-col>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
-
-    <Mapdialog
-      v-if="loadmap"
-      :dialogTableVisible="dialogTableVisible"
-      @dialogcancelFun="dialogcancelFun"
-      :slat="form.latitude"
-      :slng="form.longitude"
-      @confirmFun="confirmFun($event)"
-    ></Mapdialog>
+<!--    <Mapdialog v-if="loadmap" :dialogTableVisible="dialogTableVisible" @dialogcancelFun="dialogcancelFun" :slat="form.latitude" :slng="form.longitude" @confirm="qrFun" />-->
   </div>
 </template>
 
@@ -284,13 +222,12 @@
 import { listDeviceInfo, getDeviceInfo, addDeviceInfo, updateDeviceInfo, exportDeviceInfo } from "@/api/device/deviceInfo";
 import { pipeAllInfoList } from "@/api/device/pipe";
 import MyFileUpload from '@/components/MyFileUpload';
-import Mapdialog from "@/components/mapDialog/checkDeviceLoaction.vue";
+// import Mapdialog from "@/components/maplnglat.vue";
 
 export default {
   name: "DeviceInfo",
   components: {
     MyFileUpload,
-    Mapdialog
   },
   data() {
     return {
@@ -347,43 +284,6 @@ export default {
       form: {},
       // 表单校验
       rules: {
-        pipeId: [
-          { required: true, message: "请选择所属管道", trigger: "blur" },
-        ],
-        deviceType: [
-          { required: true, message: "请选择设备类型", trigger: "blur" },
-        ],
-        deviceName: [
-          { required: true, message: "请输入设备名称", trigger: "blur" },
-        ],
-        deviceCode: [
-          { required: true, message: "请输入设备编号", trigger: "blur" },
-        ],
-        deviceModel: [
-          { required: true, message: "请输入设备型号", trigger: "blur" },
-        ],
-        deviceAddr: [
-          { required: true, message: "请输入所在地址", trigger: "blur" },
-        ],
-        longitude: [
-          { required: true, message: "请输入经纬度", trigger: "blur" },
-        ],
-        iotNo: [
-          { required: true, message: "请输入物联网编号", trigger: "blur" },
-        ],
-        /*linkman: [
-          { required: true, message: "请输入联系人", trigger: "blur" }
-        ],
-        phone: [
-          { required: true, message: "请输入联系电话", trigger: "blur" },
-          { min: 11, max: 11, message: "长度11个数字", trigger: "blur" },
-        ],
-        iconUrl: [
-          { required: true, message: "请上传图片", trigger: "change" }
-        ],
-        installationTime: [
-          { required: true, message: "请选择日期", trigger: "change" },
-        ],*/
       }
     };
   },
@@ -407,22 +307,22 @@ export default {
       this.form.iconUrl = res.url;
     },
     listRemove(e) {
-      this.form.iconUrl = "";
+      this.form.url = "";
       this.fileList = [];
     },
-    confirmFun(res) {
-      //确认选择经纬度
-      this.form.longitude = res.lng;
-      this.form.latitude = res.lat;
-    },
-    MapdialogFun() {
-      this.loadmap = true;
-      this.dialogTableVisible = true;
-    },
-    dialogcancelFun() {
-      this.loadmap = false;
-      this.dialogTableVisible = false;
-    },
+    // qrFun(res) {
+    //   //确认选择经纬度
+    //   this.form.longitude = res.lng;
+    //   this.form.latitude = res.lat;
+    // },
+    // MapdialogFun() {
+    //   this.loadmap = true;
+    //   this.dialogTableVisible = true;
+    // },
+    // dialogcancelFun() {
+    //   this.loadmap = false;
+    //   this.dialogTableVisible = false;
+    // },
     // 取消按钮
     cancel() {
       this.open = false;
@@ -473,7 +373,7 @@ export default {
       pipeAllInfoList().then(response => {
         this.options = response.data;
         this.open = true;
-        this.title = "新增设备信息";
+        this.title = "添加设备信息";
       });
     },
     /** 修改按钮操作 */
@@ -485,14 +385,14 @@ export default {
       const deviceId = row.deviceId || this.ids
       getDeviceInfo(deviceId).then(response => {
         this.form = response.data;
+        this.open = true;
+        this.title = "修改设备信息";
+      });
       if (this.form.iconUrl) {
         this.fileList.push({
           url: this.form.iconUrl,
         });
       }
-        this.open = true;
-        this.title = "修改设备信息";
-      });
     },
     /** 提交按钮 */
     submitForm() {
@@ -557,15 +457,8 @@ export default {
 };
 </script>
 <style>
-  .notice {
-    background: white;
-    position: fixed;
-    top: 102px;
-    right: 0;
-    left: 0;
-    margin: auto;
-    width: 80%;
-    height: 80%;
-    border: solid 1px;
+  .el-col {
+    margin-left: 0;
+    margin-right: 10px;
   }
 </style>

gassafety-web/src/views/enterprise/mapView/index.vue

@@ -342,6 +342,7 @@ export default {
   created() {
     // 让左边的框隐藏
     this.$store.dispatch("app/toggleDevice", "mobile");
+    console.log("sasdasdas")
   },
 
   mounted() {
@@ -396,7 +397,6 @@ export default {
           }
         });
     },
-
     getDeviceInfo(queryParams) {
       this.loading = true;
       return getAllDeviceInfo(queryParams).then((response) => {

gassafety-web/src/views/login.vue

@@ -81,7 +81,7 @@ export default {
         code: [{ required: true, trigger: "change", message: "验证码不能为空" }]
       },
       loading: false,
-      redirect: "/index"
+      redirect: ""
     };
   },
   watch: {
@@ -134,7 +134,9 @@ export default {
           Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
 
           this.$store.dispatch("Login", this.loginForm).then(() => {
-            this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
+            // this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
+            // console.log(this.redirect)
+            this.$router.push({ path: "/enterprise/mapView" || "/" }).catch(()=>{});
           }).catch(() => {
             this.loading = false;
             this.getCode();

gassafety-web/src/views/workOrder/detail/index.vue

@@ -2,15 +2,16 @@
     <div class="app-container detail" style="background-color: rgb(238, 241, 245);">
       <!-- 工单信息 -->
       <div style="padding-top: 10px;background: #fff;height: 100%;">
-        <div>
-          <div style="width: 5%;height: 45px;margin-left: 20px;" @click="$router.go(-1)">
-            <el-button
-            size="medium"
-            type="text"
-            style="font-size: 18px; color: rgb(7, 63, 112);float: left;"
-          >返回</el-button>
+        <el-row>
+          <el-col :span="24" style="padding-left: 15px;">
+            <div style="height: 45px;" @click="$router.go(-1)">
+              <el-button size="medium" type="text" style="font-size: 18px; color: rgb(7, 63, 112);float: left;">返回
+              </el-button>
               <div style="float: left;margin-top: 8px;margin-left: 5px;"><img src="../../../assets/logo/fanhui.png" style="width: 25px;" alt=""></div>
             </div>
+          </el-col>
+        </el-row>
+
           <el-steps :active="active" finish-status="success" simple prop="orderStatus" style="margin-top: 5px">
               <el-step title="未接收" ></el-step>
               <el-step title="已接收" ></el-step>
@@ -18,47 +19,56 @@
               <el-step title="已反馈" ></el-step>
               <el-step title="已归档" ></el-step>
           </el-steps>
-        </div>
         
-        <div style="width: 100%;height: 265px;">
           <el-divider></el-divider>
-          <div style="color: #31EAEA;width: 30%;height: 30px;">
+
+
+
+          <el-row style="width: 100%;">
+            <el-col :span="24">
+              <div style="color: #31EAEA;height: 25px;">
                 <ul><li>详细信息</li></ul>
               </div>
-          <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="float: left;margin-left: 50px;">
-              <el-form-item label="工单类型:" prop="orderType">
+            </el-col> 
+          </el-row>
+          <el-row style="width: 100%;padding: 10px;padding-left: 40px;">
+            <el-col :span="6">
+              <el-form ref="form" v-model="form" :rules="rules" style="width: 100%;">
+                <el-form-item label="工单类型:" prop="orderType" style="margin-bottom: 0px;">
                   <font v-if="form.orderType == 1">巡检信息</font>
                   <font v-if="form.orderType == 2">隐患信息</font>
                   <font v-if="form.orderType == 3">报警信息</font>
                 </el-form-item>
-              <el-form-item label="工单编号:" prop="orderId">
+                <el-form-item label="工单编号:" prop="orderId" style="margin-bottom: 0px;">
                   <font>{{form.orderId}}</font>
                 </el-form-item>
-              <el-form-item label="工单名称:" prop="orderName">
+                <el-form-item label="工单名称:" prop="orderName" style="margin-bottom: 0px;">
                   <font>{{form.orderName}}</font>
                 </el-form-item>
-              <el-form-item label="工单状态:" prop="orderStatus">
+                <el-form-item label="工单状态:" prop="orderStatus" style="margin-bottom: 0px;">
                   <font v-if="form.orderStatus == 0">未接收</font>
                   <font v-if="form.orderStatus == 1">已接收</font>
                   <font v-if="form.orderStatus == 2">已反馈</font>
                   <font v-if="form.orderStatus == 3">已归档</font>
                 </el-form-item>
-              <el-form-item label="指定执行人员:" prop="appointInspectorName">
+                <el-form-item label="指定执行人员:" prop="appointInspectorName" style="margin-bottom: 0px;">
                   <font>{{form.appointInspectorName}}</font>
                 </el-form-item>
-              <el-form-item label="工单描述:" prop="remarks">
+                <el-form-item label="工单描述:" prop="remarks" style="margin-bottom: 0px;">
                   <font>{{form.remarks}}</font>
                 </el-form-item>
             </el-form>
-          <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="float: left;width: 25%;">
-              <el-form-item label="设备类型:" prop="deviceType" v-if="form.orderType != 1">
+            </el-col>
+            <el-col :span="6">
+              <el-form ref="form" v-model="form" :rules="rules" style="width: 100%;">
+                <el-form-item label="设备类型:" prop="deviceType" v-if="form.orderType != 1" style="margin-bottom: 0px;">
                   <font v-if="form.deviceType == 0">管道</font>
                   <font v-if="form.deviceType == 1">调压阀</font>
                   <font v-if="form.deviceType == 2">阀门井</font>
                   <font v-if="form.deviceType == 3">流量计</font>
                   <font v-if="form.deviceType == 4">压力表</font>
                 </el-form-item>
-              <el-form-item label="设备名称:" prop="deviceName">
+                <el-form-item label="设备名称:" prop="deviceName" style="margin-bottom: 0px;">
                   <font v-if="form.orderType != 1">{{form.deviceName}}</font>
                   <el-tree
                     :data="deviceOptions"
@@ -69,37 +79,53 @@
                     v-if="form.orderType == 1"
                   />
                 </el-form-item>
-              <el-form-item label="设备位置:" v-if="form.orderType != 1">
+                <el-form-item label="设备位置:" v-if="form.orderType != 1" style="margin-bottom: 0px;">
                   <font>{{form.address}}</font>
                 </el-form-item>
-              <el-form-item label="工单进度:" v-if="form.orderType == 1">
+                <el-form-item label="工单进度:" v-if="form.orderType == 1" style="margin-bottom: 0px;">
                   <font>{{form.finishNum}}/{{form.deviceNum}}</font>
                 </el-form-item>
-              <el-form-item label="下发时间:" prop="allotTime">
+                <el-form-item label="下发时间:" prop="allotTime" style="margin-bottom: 0px;">
                   <font>{{form.allotTime}}</font>
                 </el-form-item>
-              <!-- <el-form-item label="接收时间:" prop="actualTime">
-                <font>{{form.actualTime}}</font>
-              </el-form-item> -->
             </el-form>
-          <div id="marbox" style="width: 700px;height: 250px;float: left;margin-top: -35px; border: 1px solid rgb(218, 213, 213);">
+            </el-col>
+            <el-col :span="12">
+              <div id="marbox" style="width: 100%;height: 250px;margin-top: -35px; border: 1px solid rgb(218, 213, 213);">
                 <div style="width: 100%;height: 100%" id="container"></div>
               </div>
-        </div>
+            </el-col>
+          </el-row>
+
+          
         <!-- 接单信息 -->
+
+        
         <div v-if="form.actualTime != '' && form.actualTime != null">
           <el-divider></el-divider>
+          <el-row>
+            <el-col :span="24">
               <div style="color: #31EAEA;width: 100%;height: 40px;">
                 <ul><li>接单信息</li></ul>
               </div>
-          <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="margin-left: 50px;height: 30px;width: 100%;">
-            <el-form-item label="接单人:" prop="actualInspectorName" style="float: left;width: 20%;">
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="6">
+              <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="height: 30px;width: 100%;">
+                <el-form-item label="接单人:" prop="actualInspectorName">
                   <font>{{form.actualInspectorName}}</font>
                 </el-form-item>
-            <el-form-item label="接单时间:" prop="actualTime" style="float: left;">
+              </el-form>
+            </el-col>
+            <el-col :span="6">
+              <el-form ref="form" v-model="form" :rules="rules" label-width="100px" style="height: 30px;width: 100%;">
+                <el-form-item label="接单时间:" prop="actualTime">
                   <font>{{form.actualTime}}</font>
                 </el-form-item>
               </el-form>
+            </el-col>
+          </el-row>
         </div>
         <el-divider></el-divider>
         <!-- 反馈信息 -->
@@ -111,9 +137,9 @@
                 <el-timeline ref="timeline">
                   <el-timeline-item v-for="(activity, index) in form.feedbackList"  v-show='index>1?false:true' :key="index" :timestamp="activity.feedbackTime">
                     <el-card>
-                    <div style="width: 600px;float: left;">
-                      <div style=" width: 600px;">
-                        <div style="float: left;margin-left: 50px; width: 250px;">
+
+                      <el-row>
+                        <el-col :span="6">
                           <p>设备类型：
                             <span v-if="activity.deviceType == 0">管道</span>
                             <span v-if="activity.deviceType == 1">调压箱</span>
@@ -136,14 +162,12 @@
                               <span>{{activity.contents}}</span>
                             </p>
                           </div>
-                        </div>
-                        <div style="float: left;margin-left: 50px; width: 250px;">
+                        </el-col>
+                        <el-col :span="6">
                           <p>设备名称：{{activity.deviceName}}</p>
                             <p>反馈时间：{{activity.feedbackTime}}</p>
-
-                        </div>
-                      </div>
-                    </div>
+                        </el-col>
+                        <el-col :span="12">
                           <div class="feedbackTime-div">
                             <div class="feedbackTime">
                               <el-image :src="activity.pictureUrl1" :preview-src-list="[activity.pictureUrl1]" v-if="activity.pictureUrl1 != null && activity.pictureUrl1 != ''" style="width: 90px;"></el-image>
@@ -155,6 +179,20 @@
                               <el-image :src="activity.pictureUrl3" :preview-src-list="[activity.pictureUrl3]"  v-if="activity.pictureUrl3 != null && activity.pictureUrl3 != ''" style="width: 90px;"></el-image>
                             </div>
                           </div>
+                        </el-col>
+                      </el-row>
+                      <!-- <div style="width: 600px;float: left;">
+                        <div style=" width: 600px;">
+                          <div style="float: left;margin-left: 50px; width: 250px;">
+                            
+                          </div>
+                          <div style="float: left;margin-left: 50px; width: 250px;">
+                            
+
+                          </div>
+                        </div>
+                      </div>
+                       -->
                     </el-card>
                   </el-timeline-item>
                 </el-timeline>
@@ -236,6 +274,7 @@
         </div>
       </div>
     </div>
+    </div>
   </template>
 
   <script>
@@ -567,12 +606,6 @@ export default {
     .el-card__body {
       padding: 5px 20px 20px 20px;
     }
-    .detail .el-form{
-        width: 20%;
-    }
-    .detail .el-form-item{
-        margin-bottom: 0px;
-    }
     .el-tree{
       margin-top: 5px;
     }