优化

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

@@ -7,6 +7,7 @@
   >
     <el-row>
       <el-form ref="form" :model="form" :rules="rules" label-width="135px">
+        <el-row>
           <el-col :span="22">
             <el-form-item label="所属管道" prop="pipeCode">
               <el-select v-model="form.pipeCode" placeholder="请选择所属管道">
@@ -20,18 +21,27 @@
               </el-select>
             </el-form-item>
           </el-col>
-
+        </el-row>
+        <el-row>
           <el-col :span="11">
             <el-form-item label="设备名称" prop="deviceName">
-            <el-input v-model="form.deviceName" placeholder="请输入设备名称" />
+              <el-input
+                v-model="form.deviceName"
+                placeholder="请输入设备名称"
+              />
             </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="请输入设备型号"
+              />
             </el-form-item>
           </el-col>
+        </el-row>
+
         <el-col :span="11">
           <el-form-item label="所在地址" prop="deviceAddr">
             <el-input v-model="form.deviceAddr" placeholder="请输入所在地址" />
@@ -46,7 +56,7 @@
 
         <el-col :span="22">
           <el-form-item label="经纬度坐标" prop="">
-            <el-card class="box-card">
+            <el-card shadow="newver" class="box-card">
               <div v-text="`[[${form.longitude},${form.latitude}]]`"></div>
             </el-card>
           </el-form-item>
@@ -161,12 +171,8 @@ export default {
         iotNo: [
           { required: true, message: "请输入物联网编号", trigger: "blur" },
         ],
-        linkman: [
-          { required: true, message: "请输入联系人", trigger: "blur" },
-        ],
-        phone: [
-          { required: true, message: "请输入联系电话", trigger: "blur" },
-        ],
+        linkman: [{ required: true, message: "请输入联系人", trigger: "blur" }],
+        phone: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
         iconUrl: [{ required: true, message: "请上传图片", trigger: "change" }],
         installationTime: [
           {
@@ -203,23 +209,22 @@ export default {
               this.msgSuccess("修改成功");
             });
           } else {
-              addDeviceInfo(this.form).then(response => {
-                if(response.code == 200){
+            addDeviceInfo(this.form).then((response) => {
+              if (response.code == 200) {
                 this.remove();
                 this.map.remove(this.obj);
                 this.form.deviceId = response.data;
-                  this.gaoMap.addMarker(this.gaoMap.deviceType,this.form);
+                this.gaoMap.addMarker(this.gaoMap.deviceType, this.form);
                 //this.gaoMap.placeSearch.clear();
                 this.gaoMap.closeAddMarker();
                 this.msgSuccess("新增成功");
-                }else{
+              } else {
                 this.msgSuccess("新增失败");
               }
             });
           }
         }
-        }
-      );
+      });
     },
     handleClose(done) {
       done();

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

@@ -25,7 +25,6 @@
         <el-col>
           <el-form-item v-show="false" label="企业id" prop="enterpriseId">
             <el-input disabled v-model="editForm.enterpriseId"></el-input>
-            
           </el-form-item>
         </el-col>
 
@@ -41,7 +40,7 @@
         </el-col>
         <el-col :span="11">
           <el-form-item label="管道长度" prop="pipeLength">
-            <el-input type="number" min=0 v-model="editForm.pipeLength">
+            <el-input type="number" min="0" v-model="editForm.pipeLength">
               <i
                 slot="suffix"
                 style="color: #000; font-style: normal; margin-right: 10px"
@@ -229,10 +228,20 @@ export default {
     console.log("lineData", this.lineData, this.lnglatsArr, this.pipeLength);
     if (this.lineData?.pipeId) {
       this.editForm = { ...this.lineData };
+    } else {
+      // 如果是新建的里面天蝎过东西就存档
+      console.log("内部lineDate", this.target.getExtData());
+      const { lineData } = this.target.getExtData();
+      console.log(lineData)
+      if (lineData) {
+        this.editForm = { ...lineData };
+      }
     }
     this.editForm.coordinates = getString(this.lnglatsArr);
     // 如果有图片路径就赋显，如果没有就啥也没有
-    this.fileArr = this.lineData.pipeId ? [{ url: this.editForm.iconUrl }] : [];
+    this.fileArr = this.editForm?.iconUrl
+      ? [{ url: this.editForm.iconUrl }]
+      : [];
   },
   methods: {
     mouseup() {
@@ -293,11 +302,17 @@ export default {
       this.remove();
     },
     handleClose(done) {
-      this.$confirm("确认关闭？")
-        .then((_) => {
+      let options = this.target.getExtData();
+      options.lineData = { ...this.editForm };
+      this.target.setExtData(options);
+      // 把值带出去
       done();
-        })
-        .catch((_) => {});
+
+      // this.$confirm("确认关闭？")
+      //   .then((_) => {
+      //     done();
+      //   })
+      //   .catch((_) => {});
     },
     // 图片上传成功
     fileFinshed(e) {

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

@@ -3,36 +3,85 @@
     :title="title"
     :visible.sync="dialogVisible"
     width="80%"
-    :before-close="handleClose">
+    :before-close="handleClose"
+  >
+    <el-row>
       <el-form ref="form" :model="form" :rules="rules" label-width="135px">
+        <el-row>
+          <el-col :span="22">
             <el-form-item label="所属管道" prop="pipeCode">
               <el-select v-model="form.pipeCode" placeholder="请选择所属管道">
                 <el-option
                   v-for="item in pipeList"
                   :key="item.pipeCode"
                   :label="item.pipeName"
-            :value="item.pipeCode">
+                  :value="item.pipeCode"
+                >
                 </el-option>
               </el-select>
             </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-row>
+          <el-col :span="11">
             <el-form-item label="设备名称" prop="deviceName">
-        <el-input v-model="form.deviceName" placeholder="请输入设备名称" />
+              <el-input
+                v-model="form.deviceName"
+                placeholder="请输入设备名称"
+              />
+            </el-form-item>
+          </el-col>
+
+          <el-col :span="11">
+            <el-form-item label="设备型号" prop="deviceModel">
+              <el-input
+                v-model="form.deviceModel"
+                placeholder="请输入设备型号"
+              />
             </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-col :span="11">
           <el-form-item label="所在地址" prop="deviceAddr">
             <el-input v-model="form.deviceAddr" placeholder="请输入所在地址" />
           </el-form-item>
-      <el-form-item label="设备型号" prop="deviceModel">
-        <el-input v-model="form.deviceModel" placeholder="请输入设备型号" />
+        </el-col>
+
+        <el-col :span="11">
+          <el-form-item label="物联网编号" prop="iotNo">
+            <el-input v-model="form.iotNo" placeholder="请输入物联网编号" />
           </el-form-item>
-      <el-form-item label="经度" prop="longitude">
-        <el-input v-model="form.longitude" placeholder="请输入经度" />
+        </el-col>
+
+        <el-col :span="22">
+          <el-form-item label="经纬度坐标" prop="">
+            <el-card shadow="newver" class="box-card">
+              <div v-text="`[[${form.longitude},${form.latitude}]]`"></div>
+            </el-card>
           </el-form-item>
+        </el-col>
+
+        <!-- <el-col>
           <el-form-item label="纬度" prop="latitude">
             <el-input v-model="form.latitude" placeholder="请输入纬度" />
           </el-form-item>
-      <el-form-item label="物联网编号" prop="iotNo">
-        <el-input v-model="form.iotNo" placeholder="请输入物联网编号" />
+        </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="11">
+          <el-form-item label="联系电话" prop="phone">
+            <el-input v-model="form.phone" placeholder="请输入联系电话" />
           </el-form-item>
+        </el-col>
+
+        <el-col>
           <el-form-item label="设备图片上传" prop="iconUrl">
             <MyFileUpload
               listType="picture-card"
@@ -40,25 +89,35 @@
               @remove="listRemove"
               :fileArr="fileArr"
             />
+            <el-input v-show="false" disabled v-model="form.iconUrl"></el-input>
           </el-form-item>
-      <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-col>
+
+        <el-col>
           <el-form-item label="安装时间" prop="installationTime">
-        <el-date-picker clearable size="small"
+            <el-date-picker
+              clearable
+              size="small"
               v-model="form.installationTime"
-                        type="datetime"
+              type="date"
               value-format="yyyy-MM-dd HH:mm:ss"
-                        placeholder="选择安装时间">
+              placeholder="选择安装时间"
+            >
             </el-date-picker>
           </el-form-item>
+        </el-col>
+
+        <el-col :span="22">
           <el-form-item label="备注" prop="remarks">
-        <el-input v-model="form.remarks" placeholder="请输入备注" />
+            <el-input
+              type="textarea"
+              v-model="form.remarks"
+              placeholder="请输入备注"
+            />
           </el-form-item>
+        </el-col>
       </el-form>
+    </el-row>
     <span slot="footer" class="dialog-footer">
       <el-button @click="dialogVisible = false">取 消</el-button>
       <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -67,67 +126,69 @@
 </template>
 
 <script>
+import {
+  getAllDeviceInfo,
+  addDeviceInfo,
+  updateDeviceInfo,
+} from "@/api/device/deviceInfo";
+import { pipeAllInfoList } from "@/api/device/pipe";
+import MyFileUpload from "@/components/MyFileUpload";
+import { DEVICE_TYPE } from "utils/gaodeMap.js";
 
-  import { getAllDeviceInfo ,addDeviceInfo, updateDeviceInfo } from "@/api/device/deviceInfo";
-  import { pipeAllInfoList } from "@/api/device/pipe";
-  import MyFileUpload from "@/components/MyFileUpload";
-  import { DEVICE_TYPE } from "utils/gaodeMap.js";
-
-  export default {
+export default {
   props: {
-      title: { type: String }
+    title: { type: String },
   },
-    data () {
+  data() {
     return {
-        form : {
-          deviceType : "4"
+      form: {
+        deviceType: "4",
       },
-        dialogVisible : false,
+      dialogVisible: false,
       fileList: [],
       // 表单校验
-        rules: {
-        },
-        map : null,
-        obj : null,
-        gaoMap : null,
+      rules: {},
+      map: null,
+      obj: null,
+      gaoMap: null,
       fileArr: [],
-        pipeList: []
-      }
+      pipeList: [],
+    };
   },
   components: {
     MyFileUpload,
   },
   methods: {
-      show () {
+    show() {
       this.dialogVisible = true;
     },
-      hide () {
-        this.remove()
+    hide() {
+      this.remove();
     },
-      getFileInfo(res){
+    getFileInfo(res) {
       this.form.iconUrl = res.url;
     },
     submitForm() {
-        this.$refs["form"].validate(valid => {
+      this.$refs["form"].validate((valid) => {
         if (valid) {
           if (this.form.deviceId != null) {
-              updateDeviceInfo(this.form).then(response => {
+            updateDeviceInfo(this.form).then((response) => {
               this.dialogVisible = false;
               this.map.remove(this.obj);
-                this.gaoMap.addMarker(this.gaoMap.deviceType,this.form);
+              this.gaoMap.addMarker(this.gaoMap.deviceType, this.form);
               this.msgSuccess("修改成功");
             });
           } else {
-              addDeviceInfo(this.form).then(response => {
-                if(response.code == 200){
+            addDeviceInfo(this.form).then((response) => {
+              if (response.code == 200) {
                 this.remove();
                 this.map.remove(this.obj);
                 this.form.deviceId = response.data;
-                  this.gaoMap.addMarker(this.gaoMap.deviceType,this.form);
+                this.gaoMap.addMarker(this.gaoMap.deviceType, this.form);
                 //this.gaoMap.placeSearch.clear();
                 this.gaoMap.closeAddMarker();
                 this.msgSuccess("新增成功");
-                }else{
+              } else {
                 this.msgSuccess("新增失败");
               }
             });
@@ -141,14 +202,14 @@
     listRemove(e) {
       this.form.url = "";
       this.fileArr = [];
-      }
     },
-    mounted(){
-      pipeAllInfoList({}).then(response => {
+  },
+  mounted() {
+    pipeAllInfoList({}).then((response) => {
       this.pipeList = response.data;
     });
-    }
-  }
+  },
+};
 </script>
 
 

gassafety-web/src/utils/gaodeMap.js

@@ -152,7 +152,6 @@ class gaodeMap {
       options.scrollWheel = true;
       map.setStatus(options);
     });
-    that.markerInfoWindow = infoWindow;
     let marker = new AMap.Marker({
       position: [data.longitude, data.latitude],
       map: map,
@@ -226,6 +225,8 @@ class gaodeMap {
       map.setStatus(options);
       infoWindow.setContent(e.target.content);
       infoWindow.open(map, e.target.getPosition());
+      that.markerInfoWindow = infoWindow;
+
 
     }
   }
@@ -522,8 +523,9 @@ class gaodeMap {
     }
   }
   // 新建line增加编辑以及右键菜单
-  closeLineInfoWindow() {
+  closeInfoWindow() {
     this.showInfoWindow && this.showInfoWindow.close();
+    this.markerInfoWindow && this.markerInfoWindow.close();
   }
   // 新line与老line添加点击事件
   newLineAddEvent(obj) {
@@ -563,6 +565,7 @@ class gaodeMap {
         const pipeLength = obj.getLength();
         // 传回来的数据 如果是新管道就是空
         const lineData = type == "newLine" ? {} : obj.getExtData().lineData;
+        // const lineData =  obj.getExtData().lineData;
         console.log("lineData===================>传入组件的数据", lineData);
         this.infoWindowPipelineView({
           target: obj,

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

@@ -235,8 +235,8 @@ export default {
         this.gaoMap.lineType = 0;
         this.gaoMap.mouseTool.close();
       }
-      // 关闭当前线条的infowindow
-      this.gaoMap.closeLineInfoWindow();
+      // 关闭当前的infowindow
+      this.gaoMap.closeInfoWindow();
 
       this.deviceType = !this.deviceType;
       this.gaoMap.mapOperateType = "add";
@@ -294,6 +294,8 @@ export default {
         // this.gaoMap.placeSearch.clear();
         this.gaoMap.closeAddMarker();
       }
+        // 关闭当前的infowindow
+      this.gaoMap.closeInfoWindow();
       this.createReset();
     },
     deleteDevice() {
@@ -313,6 +315,8 @@ export default {
         //this.gaoMap.placeSearch.clear();
         this.gaoMap.closeAddMarker();
       }
+        // 关闭当前的infowindow
+      this.gaoMap.closeInfoWindow();
       this.createReset();
     },
     selectDeviceType(val) {
@@ -384,7 +388,7 @@ export default {
       console.log("window");
       this.deviceType = false;
       // 关闭当前线条的infowindow
-      this.gaoMap.closeLineInfoWindow()
+      this.gaoMap.closeInfoWindow()
       // 如果没有选择的时候点window 则高亮消失
       if (this.targetNum == 1 && this.iconClass == "icon-create") {
         this.targetNum = 0;