深基坑(测点监控):项目监测详请echsrts图处理

src/views/projectFront/deepFoundationPitManage/monitorData.vue

@@ -395,7 +395,7 @@
                           :value="item.measurePointNumber"
                         ></el-option>
                       </el-select>
-                      <span>传感器编号：</span>
+                      <span style="margin-left:15px">传感器编号：</span>
                       <el-select
                         v-model="checkList2"
                         size="small"
@@ -426,13 +426,20 @@
                     </div>
                   </div>
                 </div>
-                <div class="echart-box">
+                <div v-if="tableData2.length != 0" class="echart-box">
                   <div class="echart-title">
                     <!-- 曲线分析(累计变化) -->
                     {{$t('message.deepFoundConfig.echartTitle')}}
                   </div>
                   <div id="echart7" ref="echart7"></div>
                 </div>
+                <div v-else style="text-align: center;padding-top: 80px">
+                  <img src="@/assets/images/noData2.png" />
+                  <!-- 暂无数据 -->
+                  <span
+                    style="display: block;margin-top: 20px"
+                  >{{$t('message.deepFoundConfig.noData')}}</span>
+                </div>
                 <div class="table-box">
                   <div class="table-title">
                     <!-- 数据列表 -->
@@ -613,7 +620,8 @@ export default {
       options: [],
       getSensorList: [], // 传感器列表
       checkList: "",
-      checkList2: "",
+      checkList2: {},
+      firstSelect: "",
       dateTime: [],
       searchDate: 1,
       pointList: [],
@@ -658,7 +666,7 @@ export default {
         relaId: this.relaId,
         projectSn: this.projectSn,
         startTime: this.dateTime != null ? this.dateTime[0] : "",
-        endTime: this.dateTime != null ? this.dateTime[1] : "",
+        endTime: this.dateTime != null ? this.dateTime[1] : ""
       }).then(res => {
         console.log("有数据吗", res);
         if (res.code == 200 && res.result) {
@@ -1716,22 +1724,29 @@ export default {
       // this.createdEchart7()
     },
     checkNum(val) {
+      this.firstSelect = val;
       console.log("当前选择", val);
-      getSensorListApi({ measurePointNumber: val }).then(res => {
+      getSensorListApi({ measurePointNumber: this.firstSelect }).then(res => {
         if (res.code == 200 && res.result) {
+          console.log("---------", res);
           this.getSensorList = res.result;
+          if (this.getSensorList.length != 0) {
+            this.checkList2 = this.getSensorList[0].sensorSn;
+            this.getEchartsData();
+          }
         }
       });
     },
+
     getEchartsData(val) {
       console.log("第二个选择", val);
       selectDeepExcavationCurrentDataListApi({
         measurePointNumber: this.checkList,
         relaId: this.relaId,
-        sensorSn : val,
+        sensorSn: val,
         projectSn: this.projectSn,
         startTime: this.dateTime != null ? this.dateTime[0] : "",
-        endTime: this.dateTime != null ? this.dateTime[1] : "",
+        endTime: this.dateTime != null ? this.dateTime[1] : ""
       }).then(res => {
         // console.log("有数据吗", res);
         if (res.code == 200 && res.result) {
@@ -1755,15 +1770,25 @@ export default {
       });
     },
     checkDateTime(val) {
-        if(this.checkList == '' || this.checkList2 == '' ){
-            this.$message({
-          message: '请先选择传感器名称和编号哦！',
-          type: 'warning'
+      if (this.checkList == "" || this.checkList2 == "") {
+        this.$message({
+          message: "请先选择传感器名称和编号哦！",
+          type: "warning"
         });
-        }
+      }
       console.log(val);
       this.selectDeepExcavationCurrentDataList();
     }
+  },
+  watch: {
+    firstSelect: {
+      handler(newval, oldval) {
+        if (newval != oldval) {
+          (this.checkList2 = ""), this.getEchartsData();
+        }
+      },
+      immediate: true
+    }
   }
 };
 </script>