fix: 解决图表控制台报错的问题

src/components/home/LineChart.vue

@@ -42,7 +42,7 @@ watch(
       xAxis: {
         type: 'category',
         boundaryGap: false,
-        data: newValue.data.map(item => formatDateTime('HH:mm:ss', item.timestamp)),
+        data: newValue.data?.map(item => formatDateTime('HH:mm:ss', item.timestamp)),
       },
       yAxis: {
         type: 'value',
@@ -51,7 +51,7 @@ watch(
         {
           name: '温度',
           type: 'line',
-          data: newValue.data.map(item => item.temp.toFixed(2)),
+          data: newValue.data?.map(item => item.temp.toFixed(2)),
           symbol: 'circle',
           symbolSize: 2,
           lineStyle: {
@@ -62,7 +62,7 @@ watch(
         {
           name: '湿度',
           type: 'line',
-          data: newValue.data.map(item => item.rh.toFixed(2)),
+          data: newValue.data?.map(item => item.rh.toFixed(2)),
           symbol: 'circle',
           symbolSize: 2,
           lineStyle: {
@@ -73,7 +73,7 @@ watch(
         {
           name: 'H2O2浓度',
           type: 'line',
-          data: newValue.data.map(item => item.h2o2.toFixed(2)),
+          data: newValue.data?.map(item => item.h2o2.toFixed(2)),
           symbol: 'circle',
           symbolSize: 2,
           lineStyle: {
@@ -84,7 +84,7 @@ watch(
         {
           name: 'H2O2饱和度',
           type: 'line',
-          data: newValue.data.map(item => item.rs.toFixed(2)),
+          data: newValue.data?.map(item => item.rs.toFixed(2)),
           symbol: 'circle',
           symbolSize: 2,
           lineStyle: {

src/views/home/chart.vue

@@ -27,20 +27,12 @@ const curStateRemainTime = ref(homeStore.curStateRemainTime)
 const disinfectFormulaVisible = ref(false)
 const isDeviceIdle = ref(homeStore.isDeviceIdle)
 const loading = ref(false)
-const h2O2SensorData = ref(homeStore.h2O2SensorData)
 
 watchEffect(() => {
   formulaInfo.value = formulaStore.currentSelectedFormulaInfo
   disinfectionState.value = homeStore.disinfectionState
   curStateRemainTime.value = homeStore.curStateRemainTime
   isDeviceIdle.value = homeStore.isDeviceIdle
-  h2O2SensorData.value = homeStore.h2O2SensorData.map((item, index) => {
-    return {
-      ...item,
-      title: index === 0 ? '仓内' : `探头${index}`,
-      chartId: index === 0 ? 'inside' : `env${index}`,
-    }
-  })
 })
 
 const onDisinfectConfig = () => {
@@ -72,7 +64,7 @@ const onSave = () => {
 }
 
 const goHome = () => {
-  router.back()
+  router.push('/home')
 }
 const onClose = () => {
   disinfectFormulaVisible.value = false
@@ -85,15 +77,17 @@ const operationState = computed(() => {
 
 let poll = null
 
-const getData = async () => {
+const getData = async (type?: string) => {
   const data = await syncSendCmd({
     className: 'H2O2SensorMgr',
     fnName: 'getH2O2SensorList',
   })
-  chartList.value = data.rely
-  for (let i = 0; i < chartList.value.length; i++) {
-    const item: any = chartList.value[i]
-    const list = await syncSendCmd({
+
+  const list = data.rely
+  !type && (chartList.value = list.map(item => ({ ...item, data: [] })))
+  for (let i = 0; i < list.length; i++) {
+    const item: any = list[i]
+    const res = await syncSendCmd({
       className: 'H2O2SensorMgr',
       fnName: 'getDisinfectionH2O2DataRecordList',
       params: {
@@ -102,18 +96,23 @@ const getData = async () => {
         interval: 30,
       },
     })
-    chartList.value[i].data = list.rely
+    item.data = res.rely
   }
+  chartList.value = list
   console.log(chartList.value)
 }
+
+const chartLoading = ref(false)
 onMounted(async () => {
+  chartLoading.value = true
   await getData()
+  chartLoading.value = false
   poll = setInterval(() => {
     if (operationState.value) {
       clearInterval(poll)
       return
     }
-    getData()
+    getData('interval')
   }, 1000 * 30)
 })
 
@@ -145,7 +144,11 @@ onUnmounted(() => {
         </bt-button>
       </div>
     </div>
-    <div class="line-chart-content" :style="{ 'grid-template-columns': `repeat(${chartList.length},1fr)` }">
+    <div
+      v-loading="chartLoading"
+      class="line-chart-content"
+      :style="{ 'grid-template-columns': `repeat(${chartList.length},1fr)` }"
+    >
       <div v-for="(item, index) in chartList" :key="index">
         <LineChart :env-data="item" />
       </div>

src/views/home/index.vue

@@ -190,7 +190,7 @@ const deviceType = computed(() => {
               && homeStore.h2O2SensorData.length === 3,
             'card-center-2':
               index === 0
-              && deviceType !== deviceStore.deviceTypeMap.LargeSpaceDM_B
+              && deviceType === deviceStore.deviceTypeMap.LargeSpaceDM_B
               && homeStore.h2O2SensorData.length === 5,
           }"
         >