设备：量测初始化时间设置

ui/dasadmin/src/views/backend/equipment/equipmentManagement/measurement.vue

@@ -41,12 +41,12 @@
         </div>
     </div>
     <el-dialog v-model="lineChartVisible" title="历史曲线" @close="closeLineChart" :width="910">
-        <el-form :inline="true" :model="seachOptions" :rules="searchRules" ref="searchFormRef">
+        <el-form :inline="true" :model="searchOptions" :rules="searchRules" ref="searchFormRef">
             <div class="searchPart">
                 <div>
                     <el-form-item prop="datePickerValue" label="历史区间：">
                         <el-date-picker
-                            v-model="seachOptions.datePickerValue"
+                            v-model="searchOptions.datePickerValue"
                             type="datetimerange"
                             start-placeholder="开始时间"
                             end-placeholder="结束时间"
@@ -60,7 +60,7 @@
                 </div>
                 <div>
                     <el-form-item prop="interval" label="时间间隔：">
-                        <el-select v-model="seachOptions.interval" placeholder="请选择时间间隔" style="width: 100px">
+                        <el-select v-model="searchOptions.interval" placeholder="请选择时间间隔" style="width: 100px">
                             <el-option label="原始" value="40s"></el-option>
                             <el-option label="1分钟" value="1m"></el-option>
                             <el-option label="5分钟" value="5m"></el-option>
@@ -267,26 +267,12 @@ const getcurrentPage = () => {
 
 const openLineChart = (data: any) => {
     lineChartVisible.value = true
+    loading.value = false
     searchInfo.attr = data.attributeCode
     searchInfo.name = data.attributeName
     searchInfo.unit = data.unit
 }
 
-watch(
-    () => props.show,
-    (newVal) => {
-        if (newVal) {
-            getCompleteData()
-            loading.value = false
-        } else {
-            autoUpdateTimer.value && clearInterval(autoUpdateTimer.value)
-            autoUpdateTimer.value = null
-        }
-    },
-    {
-        immediate: true,
-    }
-)
 const autoUpdateTimer: any = ref(null)
 watch(
     () => props.autoUpdate,
@@ -343,29 +329,31 @@ const getChartData = () => {
         if (valid) {
             loading.value = true
             getRealValueRangeReq({
-                startTime: dayjs(seachOptions.datePickerValue[0]).valueOf(),
-                endTime: dayjs(seachOptions.datePickerValue[1]).valueOf(),
+                startTime: dayjs(searchOptions.datePickerValue[0]).valueOf(),
+                endTime: dayjs(searchOptions.datePickerValue[1]).valueOf(),
                 devices: [
                     {
                         deviceId: props.deviceId,
                         attributes: [searchInfo.attr],
                     },
                 ],
-                interval: seachOptions.interval,
-            }).then((res) => {
-                initChart(res.data?.[props.deviceId]?.[searchInfo.attr])
-            }).catch(()=>{
-                ElMessage.error('获取数据失败')
-                loading.value = false
+                interval: searchOptions.interval,
             })
+                .then((res) => {
+                    initChart(res.data?.[props.deviceId]?.[searchInfo.attr])
+                })
+                .catch(() => {
+                    ElMessage.error('获取数据失败')
+                    loading.value = false
+                })
         }
     })
 }
 
 const chartRef = ref()
 let chartInstance: any = null
-const seachOptions = reactive({
-    datePickerValue: [0, 0],
+const searchOptions = reactive<{ datePickerValue: Date[]; interval: string }>({
+    datePickerValue: [],
     interval: '5m',
 })
 
@@ -485,7 +473,7 @@ const initChart = (data: { values: number[]; times: number[] }) => {
                 },
                 smooth: 0.6,
                 symbol: 'none',
-                data: data?.values ?? []
+                data: data?.values ?? [],
             },
         ],
     }
@@ -504,6 +492,22 @@ watch(
         getCompleteData()
     }
 )
+
+watch(
+    () => props.show,
+    (newVal) => {
+        if (newVal) {
+            getCompleteData()
+            searchOptions.datePickerValue = shortcuts[0].value()
+        } else {
+            autoUpdateTimer.value && clearInterval(autoUpdateTimer.value)
+            autoUpdateTimer.value = null
+        }
+    },
+    {
+        immediate: true,
+    }
+)
 </script>
 
 <style scoped lang="scss">