Merge branch 'master' of ssh://111.61.77.35:15/gengdidi/gassafety

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>
+  <div class="app-container detail" style="background-color: rgb(238, 241, 245);">
+    <div style="padding-top: 10px;background: #fff;height: 100%;">
+      <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,105 +42,135 @@
               <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-divider></el-divider>
-
-        <div style="width: 100%;height: 350px;padding: 10px;height: 300px;">
-            <div style="width: 66.6%;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" />
-                <el-table-column label="报警类型" align="center" prop="alarmType" />
-              </el-table>
-
-              <el-table :data="dataListdetail2" style="width: 100%;margin-top: 20px;">
-                <el-table-column label="报警值" align="center" prop="alarmValue" />
-                <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">
-                  <template slot-scope="scope">
-                    <span v-if="scope.row.orderId == null || scope.row.orderId == ''">未生成工单</span>
-                    <span v-if="(scope.row.dealStatus == null || scope.row.dealStatus == '') &&
-                        scope.row.orderId != null && scope.row.orderId != ''">未处理</span>
-                    <span v-if="scope.row.dealStatus == 1">不需处理</span>
-                    <span v-if="scope.row.dealStatus == 2">已处理完成</span>
-                    <span v-if="scope.row.dealStatus == 3">未处理完成</span>
-                  </template>
-                </el-table-column>
-              </el-table>
+        </el-col>
+      </el-row>
 
+      <!-- <div style="width: 100%;height: 100px;"> -->
+       
+       
+       
+       
 
-            </div>
-          <div id="marbox" style="width: 33%;height: 304px; border: 1px solid rgb(218, 213, 213);float: right;">
+
+      <!-- </div> -->
+      <el-divider></el-divider>
+
+      <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" />
+              <el-table-column label="报警类型" align="center" prop="alarmType" />
+            </el-table>
+  
+            <el-table :data="dataListdetail2" style="width: 100%;margin-top: 20px;">
+              <el-table-column label="报警值" align="center" prop="alarmValue" />
+              <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">
+                <template slot-scope="scope">
+                  <span v-if="scope.row.orderId == null || scope.row.orderId == ''">未生成工单</span>
+                  <span v-if="(scope.row.dealStatus == null || scope.row.dealStatus == '') &&
+                          scope.row.orderId != null && scope.row.orderId != ''">未处理</span>
+                  <span v-if="scope.row.dealStatus == 1">不需处理</span>
+                  <span v-if="scope.row.dealStatus == 2">已处理完成</span>
+                  <span v-if="scope.row.dealStatus == 3">未处理完成</span>
+                </template>
+              </el-table-column>
+            </el-table>
+  
+          </div>
+        </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">
-              <p>暂无数据</p>
+      
+      <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>
-        <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">
-            <p>暂无数据</p>
-          </div>
-        </div>
-      </div>
+          </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>
+          </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>
+          </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>
+          </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 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">
-            <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">
-            <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> -->
+        <!-- <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>
+
+  </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,8 +194,8 @@ export default {
       this.alarmId = +this.$route.query.alarmId;
       this.getDetail();
     },
-    mounted(){
-      let gaoMap =  new gaodeMap("石家庄");
+    mounted() {
+      let gaoMap = new gaodeMap("石家庄");
       this.gaoMap = gaoMap;
     },
     methods: {
@@ -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,63 +575,77 @@ export default {
       },
     }
   }
-  </script>
-  <style>
-    .div-null{
-      width: 100%;
-      height: 300px;
-      text-align: center;
-      line-height: 250px;
-    }
-    .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{
-      height: 120px;
-      width: 120px;
-      float: left;
-      margin-left: 15px;
-      margin-top: 5px;
-      margin-bottom: 15px;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }
-    .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;
-    }
-    .avatar-uploader{
-        width: 25%;
-        float: left;
-    }
-    .avatar-uploader .el-upload {
+</script>
+<style>
+  .div-null {
+    width: 100%;
+    height: 300px;
+    text-align: center;
+    line-height: 250px;
+  }
+
+  .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 {
+    height: 120px;
+    width: 120px;
+    float: left;
+    margin-left: 15px;
+    margin-top: 5px;
+    margin-bottom: 15px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .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;
+  }
+
+  .avatar-uploader {
+    width: 25%;
+    float: left;
+  }
+
+  .avatar-uploader .el-upload {
     border: 1px dashed #d9d9d9;
     border-radius: 6px;
     cursor: pointer;
     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-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>
-
-      <div style="width: 100%;height: 350px;padding: 10px;height: 300px;">
-        <div style="width: 66.6%;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" />
-            <el-table-column label="设备类型" align="center" prop="deviceType">
-              <template slot-scope="scope">
-                <span v-if="scope.row.deviceType == '3'">流量计</span>
-                <span v-if="scope.row.deviceType == '4'">压力表</span>
-              </template>
-            </el-table-column>
-            <el-table-column label="标况累计量" align="center" prop="standardConditionAccumulation" />
-          </el-table>
-
-          <el-table :data="dataListdetail2" style="width: 100%;margin-top: 20px;">
-            <el-table-column label="工况累计量" align="center" prop="workingConditionAccumulation" />
-            <el-table-column label="剩余量" align="center" prop="residualQuantity" />
-            <el-table-column label="标况流量" align="center" prop="standardConditionFlow" />
-            <el-table-column label="工况流量" align="center" prop="workingConditionFlow" />
-          </el-table>
-
-
-          <el-table :data="dataListdetail3" style="width: 100%;margin-top: 20px;">
-            <el-table-column label="温度" align="center" prop="temperature" />
-            <el-table-column label="压力" align="center" prop="pressure" />
-            <el-table-column label="上报时间" align="center" prop="reportTime" />
-            <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;">
-          <div style="width: 100%;height: 100%" id="container"></div>
-        </div>
-      </div>
-
-      <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;">
-            <div v-if = "form.deviceReportDataList == null" class="div-null">
-              <p>暂无数据</p>
-            </div>
+        
+      <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-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" />
+              <el-table-column label="设备类型" align="center" prop="deviceType">
+                <template slot-scope="scope">
+                  <span v-if="scope.row.deviceType == '3'">流量计</span>
+                  <span v-if="scope.row.deviceType == '4'">压力表</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="标况累计量" align="center" prop="standardConditionAccumulation" />
+            </el-table>
+  
+            <el-table :data="dataListdetail2" style="width: 100%;margin-top: 20px;">
+              <el-table-column label="工况累计量" align="center" prop="workingConditionAccumulation" />
+              <el-table-column label="剩余量" align="center" prop="residualQuantity" />
+              <el-table-column label="标况流量" align="center" prop="standardConditionFlow" />
+              <el-table-column label="工况流量" align="center" prop="workingConditionFlow" />
+            </el-table>
+  
+  
+            <el-table :data="dataListdetail3" style="width: 100%;margin-top: 20px;">
+              <el-table-column label="温度" align="center" prop="temperature" />
+              <el-table-column label="压力" align="center" prop="pressure" />
+              <el-table-column label="上报时间" align="center" prop="reportTime" />
+              <el-table-column label="设备状态" align="center" prop="deviceStatus">
+              </el-table-column>
+            </el-table>
           </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">
-            <p>暂无数据</p>
+        </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>
-      </div>
+        </el-col>
+      </el-row>
 
 
-      <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;">
-          <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">
-            <p>暂无数据</p>
-          </div>
-        </div>
-      </div>
+      
+      <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>
+          </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>
+          </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>
+          </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>
+          </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

@@ -457,8 +457,4 @@ export default {
 };
 </script>
 <style>
-  .el-col {
-    margin-left: 0;
-    margin-right: 10px;
-  }
 </style>

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>
-          <div style="float: left;margin-top: 8px;margin-left: 5px;"><img src="../../../assets/logo/fanhui.png" style="width: 25px;" alt=""></div>
-        </div>
+        <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,88 +19,113 @@
               <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;">
-            <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">
-                <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">
-                <font>{{form.orderId}}</font>
-              </el-form-item>
-              <el-form-item label="工单名称:" prop="orderName">
-                <font>{{form.orderName}}</font>
-              </el-form-item>
-              <el-form-item label="工单状态:" prop="orderStatus">
-                <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">
-                <font>{{form.appointInspectorName}}</font>
-              </el-form-item>
-              <el-form-item label="工单描述:" prop="remarks">
-                <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">
-                <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">
-                <font v-if="form.orderType != 1">{{form.deviceName}}</font>
-                <el-tree
-                  :data="deviceOptions"
-                  :props="defaultProps"
-                  :expand-on-click-node="false"
-                  ref="tree"
-                  @node-click="handleNodeClick"
-                  v-if="form.orderType == 1"
-                />
-              </el-form-item>
-              <el-form-item label="设备位置:" v-if="form.orderType != 1">
-                <font>{{form.address}}</font>
-              </el-form-item>
-              <el-form-item label="工单进度:" v-if="form.orderType == 1">
-                <font>{{form.finishNum}}/{{form.deviceNum}}</font>
-              </el-form-item>
-              <el-form-item label="下发时间:" prop="allotTime">
-                <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);">
-            <div style="width: 100%;height: 100%" id="container"></div>
-          </div>
-        </div>
+
+
+
+          <el-row style="width: 100%;">
+            <el-col :span="24">
+              <div style="color: #31EAEA;height: 25px;">
+                <ul><li>详细信息</li></ul>
+              </div>
+            </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" style="margin-bottom: 0px;">
+                  <font>{{form.orderId}}</font>
+                </el-form-item>
+                <el-form-item label="工单名称:" prop="orderName" style="margin-bottom: 0px;">
+                  <font>{{form.orderName}}</font>
+                </el-form-item>
+                <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" style="margin-bottom: 0px;">
+                  <font>{{form.appointInspectorName}}</font>
+                </el-form-item>
+                <el-form-item label="工单描述:" prop="remarks" style="margin-bottom: 0px;">
+                  <font>{{form.remarks}}</font>
+                </el-form-item>
+            </el-form>
+            </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" style="margin-bottom: 0px;">
+                  <font v-if="form.orderType != 1">{{form.deviceName}}</font>
+                  <el-tree
+                    :data="deviceOptions"
+                    :props="defaultProps"
+                    :expand-on-click-node="false"
+                    ref="tree"
+                    @node-click="handleNodeClick"
+                    v-if="form.orderType == 1"
+                  />
+                </el-form-item>
+                <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" style="margin-bottom: 0px;">
+                  <font>{{form.finishNum}}/{{form.deviceNum}}</font>
+                </el-form-item>
+                <el-form-item label="下发时间:" prop="allotTime" style="margin-bottom: 0px;">
+                  <font>{{form.allotTime}}</font>
+                </el-form-item>
+            </el-form>
+            </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>
+            </el-col>
+          </el-row>
+
+          
         <!-- 接单信息 -->
+
+        
         <div v-if="form.actualTime != '' && form.actualTime != null">
           <el-divider></el-divider>
-          <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%;">
-              <font>{{form.actualInspectorName}}</font>
-            </el-form-item>
-            <el-form-item label="接单时间:" prop="actualTime" style="float: left;">
-              <font>{{form.actualTime}}</font>
-            </el-form-item>
-          </el-form>
+          <el-row>
+            <el-col :span="24">
+              <div style="color: #31EAEA;width: 100%;height: 40px;">
+                <ul><li>接单信息</li></ul>
+              </div>
+            </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>
+            </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,25 +162,37 @@
                               <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>
+                            <p>反馈时间：{{activity.feedbackTime}}</p>
+                        </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>
+                            </div>
+                            <div class="feedbackTime">
+                              <el-image :src="activity.pictureUrl2" :preview-src-list="[activity.pictureUrl2]"  v-if="activity.pictureUrl2 != null && activity.pictureUrl2 != ''" style="width: 90px;"></el-image>
+                            </div>
+                            <div class="feedbackTime">
+                              <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>
-                    </div>
-                      <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>
-                        </div>
-                        <div class="feedbackTime">
-                          <el-image :src="activity.pictureUrl2" :preview-src-list="[activity.pictureUrl2]"  v-if="activity.pictureUrl2 != null && activity.pictureUrl2 != ''" style="width: 90px;"></el-image>
-                        </div>
-                        <div class="feedbackTime">
-                          <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-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;
     }