src/views/main/meteorological/components/AirHumidity.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -88,7 +76,10 @@
           series: [
             {
               smooth: true,
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (!!e) return e
+                return 0
+              }),
               type: 'line',
               itemStyle: {
                 color: '#5ab1ef',

src/views/main/meteorological/components/AirTemperature.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   import echarts from '/@/utils/lib/echarts'
   const props = defineProps({
@@ -32,19 +32,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -52,6 +39,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -64,7 +52,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -89,7 +77,10 @@
           series: [
             {
               smooth: true,
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (!!e) return e
+                return 0
+              }),
               type: 'line',
               areaStyle: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [

src/views/main/meteorological/components/CO2.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -87,7 +75,10 @@
           grid: { left: '5%', right: '1%', top: '2  %', bottom: 0, containLabel: true },
           series: [
             {
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
               type: 'bar',
               itemStyle: {
                 color: '#5ab1ef',

src/views/main/meteorological/components/LightIntensity.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -89,7 +77,10 @@
             {
               symbolSize: 20,
               type: 'scatter',
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
             },
           ],
           dataZoom: [

src/views/main/meteorological/components/Noise.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -87,7 +75,10 @@
           grid: { left: '5%', right: '1%', top: '2  %', bottom: 0, containLabel: true },
           series: [
             {
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
               type: 'bar',
               itemStyle: {
                 color: '#5ab1ef',

src/views/main/meteorological/components/PM10.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -87,7 +75,10 @@
           grid: { left: '5%', right: '1%', top: '2  %', bottom: 0, containLabel: true },
           series: [
             {
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
               type: 'bar',
               itemStyle: {
                 color: '#5ab1ef',

src/views/main/meteorological/components/PM25.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -87,7 +75,10 @@
           grid: { left: '5%', right: '1%', top: '2  %', bottom: 0, containLabel: true },
           series: [
             {
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
               type: 'bar',
               itemStyle: {
                 color: '#5ab1ef',

src/views/main/meteorological/components/Pressure.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -87,7 +75,10 @@
           grid: { left: '5%', right: '1%', top: '2  %', bottom: 0, containLabel: true },
           series: [
             {
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
               type: 'bar',
               itemStyle: {
                 color: '#5ab1ef',

src/views/main/meteorological/components/Rainfall.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -89,7 +77,10 @@
             {
               symbolSize: 20,
               type: 'scatter',
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
             },
           ],
           dataZoom: [

src/views/main/meteorological/components/WindDirection.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   const props = defineProps({
     loading: Boolean,
@@ -31,19 +31,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -51,6 +38,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -63,7 +51,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -89,7 +77,10 @@
             {
               symbolSize: 20,
               type: 'scatter',
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (e === 0) return null
+                return e
+              }),
             },
           ],
           dataZoom: [

src/views/main/meteorological/components/WindSpeed.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   import echarts from '/@/utils/lib/echarts'
   const props = defineProps({
@@ -32,19 +32,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -52,6 +39,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -64,7 +52,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -89,7 +77,10 @@
           series: [
             {
               smooth: true,
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (!!e) return e
+                return 0
+              }),
               type: 'line',
               areaStyle: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [

src/views/main/meteorological/index.vue

@@ -48,7 +48,7 @@
             <FormItem label="日期">
               <RangePicker
                 :disabledDate="disabledDate"
-                @change="onChangTime"
+                @change="onChange('time')"
                 v-model:value="formState.time"
               />
             </FormItem>
@@ -89,7 +89,6 @@
           :extra="name"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- 空气湿度 -->
@@ -98,7 +97,6 @@
           :data="statisData.air_humidity"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- 光照强度 -->
@@ -107,13 +105,11 @@
           :data="statisData.illumination"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- 降雨量 -->
         <Rainfall
           :extra="name"
-          :time="formState.time"
           :data="statisData.daily_rainfall"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
@@ -125,7 +121,6 @@
           :data="statisData.wind_speed"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- 风力 -->
@@ -134,7 +129,6 @@
           :data="statisData.wind_degree"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- 风向 -->
@@ -143,7 +137,6 @@
           :data="statisData.wind_direction"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- 噪声 -->
@@ -152,7 +145,6 @@
           :data="statisData.noise"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- PM10 -->
@@ -161,7 +153,6 @@
           :data="statisData.pm10"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- PM25 -->
@@ -170,7 +161,6 @@
           :data="statisData.pm25"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
         <!-- CO2 -->
@@ -179,7 +169,6 @@
           :data="statisData.co2"
           class="md:w-386px w-full !mr-4 !mb-4"
           :loading="false"
-          :time="formState.time"
           :company="formState.time_interval"
         />
       </div>
@@ -276,11 +265,6 @@
     if (e === 'time_interval') formState.time = undefined
     getPoint()
   }
-  const onChangTime = (e) => {
-    if (e === null) formState.time_interval = 'day'
-    else formState.time_interval = ''
-    getPoint()
-  }
   onMounted(() => {
     getBase()
   })

src/views/main/soil-monitoring/components/LineCharts.vue

@@ -11,7 +11,7 @@
 <script lang="ts" setup>
   import dayjs from 'dayjs'
   import { Card } from 'ant-design-vue'
-  import { Ref, ref, watch, computed } from 'vue'
+  import { Ref, ref, watch } from 'vue'
   import { useECharts } from '/@/hooks/web/useECharts'
   import echarts from '/@/utils/lib/echarts'
   const props = defineProps({
@@ -36,19 +36,6 @@
       type: String as PropType<string>,
       default: '',
     },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
   })
   const chartRef = ref<HTMLDivElement | null>(null)
   const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
@@ -56,6 +43,7 @@
     () => props.data,
     (e) => {
       if (e) {
+        const format = props.company === 'day' ? 'HH:mm' : 'YYYY-MM-DD'
         setOptions({
           tooltip: {
             trigger: 'axis',
@@ -68,7 +56,7 @@
           },
           xAxis: {
             type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+            data: Object.keys(e).map((e) => dayjs(e).format(format)),
             axisTick: {
               show: false,
             },
@@ -93,7 +81,10 @@
           series: [
             {
               smooth: true,
-              data: Object.values(e),
+              data: Object.values(e).map((e) => {
+                if (!!e) return e
+                return 0
+              }),
               type: 'line',
               areaStyle: {
                 color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [

src/views/main/soil-monitoring/index.vue

@@ -18,7 +18,7 @@
                 :options="baseDate"
                 v-model:value="formState.base_id"
                 placeholder="请选择基地"
-              ></Select>
+              />
             </FormItem>
           </Col>
           <Col
@@ -31,11 +31,11 @@
           >
             <FormItem label="检测点">
               <Select
-                @select="onChange('device_id')"
+                @select="onChange('')"
                 placeholder="请选择检测点"
                 :options="pointDate"
                 v-model:value="formState.device_id"
-              ></Select>
+              />
             </FormItem>
           </Col>
           <Col
@@ -47,11 +47,7 @@
             :xxl="{ span: 4 }"
           >
             <FormItem label="日期">
-              <RangePicker
+              <RangePicker @change="onChange('time')" v-model:value="formState.time" />
-                :disabledDate="disabledDate"
-                @change="onChangTime"
-                v-model:value="formState.time"
-              ></RangePicker>
             </FormItem>
           </Col>
           <Col
@@ -112,7 +108,6 @@
           :loading="false"
           :title="currentActiveLable"
           :data="chartData"
-          :time="formState.time"
         />
       </div>
     </Card>
@@ -151,6 +146,7 @@
     message,
   } from 'ant-design-vue'
   import type { FormInstance } from 'ant-design-vue'
+
   const RadioButton = Radio.Button
   const RadioGroup = Radio.Group
 
@@ -250,9 +246,6 @@
     },
   ]
 
-  const disabledDate = (current) => {
-    return current && current > dayjs().endOf('day')
-  }
   // 获取基地数据
   const getBase = async () => {
     const res = await getGriculturalDeviceBasic({ device_type: 2 })
@@ -313,12 +306,6 @@
     getPoint()
   }
 
-  const onChangTime = (e) => {
-    if (e === null) formState.time_interval = 'day'
-    else formState.time_interval = ''
-    getPoint()
-  }
-
   const handleSetting = () => {
     openDrawer(true, {
       isUpdate: false,

src/views/main/water-quality/components/EarlyWarningItem.vue

@@ -13,14 +13,14 @@
 
 <script setup lang="ts">
   // import { Ref, ref, watch } from 'vue';
-  import { SvgIcon } from '/@/components/Icon/index'
+  import { SvgIcon } from '/@/components/Icon/index';
   defineProps({
     loading: Boolean,
     data: {
       type: Object,
       default: () => {},
     },
-  })
+  });
 </script>
 
 <style scoped></style>

src/views/main/water-quality/components/FormDrawer.vue

@@ -3,101 +3,59 @@
     v-bind="$attrs"
     @register="registerDrawer"
     showFooter
-    title="设置"
+    :title="getTitle"
     width="500px"
     @ok="handleSubmit"
   >
-    <div v-for="(item, index) in Title" :key="index" class="mt-10px">
+    <a-form>
-      <div class="text-20px font-semibold">{{ enumName[item] }}</div>
+      <div class="text-20px font-medium">温度</div>
-      <div class="mt-30px flex" v-for="(item1, index1) in setFormat(item)" :key="index1">
+      <div class="mt-30px flex">
-        <div class="w-90px leading-42px">{{ enumName1[item1] }}：</div>
+        <div class="w-90px leading-32px">Ⅰ级预警：</div>
         <div>
-          <div
+          <div class="flex w-full items-center" v-for="item in 3" :key="item">
-            class="flex w-full items-center mt-10px"
+            <a-form-item>
-            v-for="(item2, index2) in roulsDate.value[item][item1]"
+              <a-input suffix="℃" />
-            :key="index2"
+            </a-form-item>
-          >
+            <div class="mb-24px px-10px">-</div>
-            <Input
+            <a-form-item>
-              type="number"
+              <a-input suffix="℃" />
-              v-model:value="item2.min"
+            </a-form-item>
-              placeholder="请输入"
-              :suffix="enumCompany[item]"
-            />
-            <div class="mx-10px">-</div>
-            <Input
-              type="number"
-              v-model:value="item2.max"
-              placeholder="请输入"
-              :suffix="enumCompany[item]"
-            />
-          </div>
           </div>
         </div>
       </div>
+    </a-form>
   </BasicDrawer>
 </template>
 
-<script lang="ts" setup>
+<script lang="ts">
-  import { getDeviceWarningRules } from '/@/api/sys/user'
+  import { defineComponent, ref, computed, unref } from 'vue';
-  import { ref, computed } from 'vue'
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
-  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer'
+  import { Form, Input } from 'ant-design-vue';
-  import { Input } from 'ant-design-vue'
-  import { editDeviceWarningRules } from '/@/api/sys/user'
-  const emits = defineEmits(['success', 'register'])
-  const enumName = {
-    conductivity: '电导率',
-    humidity: '湿度',
-    temperature: '温度',
-    k: '氮',
-    n: '磷',
-    p: '钾',
-  }
-  const enumCompany = {
-    temperature: '℃',
-    conductivity: 'us/cm',
-    humidity: '%',
-    k: 'mg/kg',
-    n: 'mg/kg',
-    p: 'mg/kg',
-  }
-  const enumName1 = {
-    1: 'Ⅰ级预警',
-    2: 'Ⅱ级预警',
-    3: 'Ⅲ级预警',
-    4: 'Ⅳ级预警',
-  }
-  const roulsDate = ref(null)
-  const Title = computed(() => {
-    if (!roulsDate.value) return []
-    return Object.keys(roulsDate.value.value)
-  })
-  const setFormat = (e: string) => {
-    if (!roulsDate.value) return []
-    return Object.keys(roulsDate.value.value[e])
-  }
-  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async () => {
-    setDrawerProps({ confirmLoading: false })
 
-    const res = await getDeviceWarningRules({})
+  export default defineComponent({
-    roulsDate.value = res.find((e) => e.slug === 'device_warning_rule_soil')
+    components: {
-  })
+      BasicDrawer,
+      [Form.name]: Form,
+      [Form.Item.name]: Form.Item,
+      [Input.name]: Input,
+    },
+    setup() {
+      const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
+        setDrawerProps({ confirmLoading: false });
+        // 需要在setFieldsValue之前先填充treeData，否则Tree组件可能会报key not exist警告
+      });
 
-  const handleSubmit = async () => {
+      const getTitle = '设置';
-    if (!roulsDate.value) return
+
-    try {
+      async function handleSubmit() {}
-      const params = {
+
-        slug: roulsDate.value.slug,
+      return {
-        value: roulsDate.value.value,
+        getTitle,
-      }
+        registerDrawer,
-      console.log(params)
+        handleSubmit,
-      const res = await editDeviceWarningRules(params)
+      };
-      console.log(res)
+    },
-      closeDrawer()
+  });
-      emits('success')
-    } finally {
-      setDrawerProps({ confirmLoading: false })
-    }
-  }
 </script>
 
 <style scoped></style>

src/views/main/water-quality/components/LineCharts.vue

@@ -3,17 +3,16 @@
     <template #title>
       <div class="text-18px font-extrabold">{{ title }}</div>
     </template>
-    <template #extra></template>
+    <template #extra>普润镇桔博园-设备间旁边</template>
     <div ref="chartRef" :style="{ width, height }"></div>
   </Card>
 </template>
 
 <script lang="ts" setup>
-  import dayjs from 'dayjs'
+  import { Card } from 'ant-design-vue';
-  import { Card } from 'ant-design-vue'
+  import { Ref, ref, watch } from 'vue';
-  import { Ref, ref, watch, computed } from 'vue'
+  import { useECharts } from '/@/hooks/web/useECharts';
-  import { useECharts } from '/@/hooks/web/useECharts'
+  import echarts from '/@/utils/lib/echarts';
-  import echarts from '/@/utils/lib/echarts'
   const props = defineProps({
     loading: Boolean,
     title: {
@@ -28,34 +27,15 @@
       type: String as PropType<string>,
       default: '300px',
     },
-    data: {
+  });
-      type: Object as PropType<object>,
+  const chartRef = ref<HTMLDivElement | null>(null);
-      default: () => {},
+  const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
-    },
-    company: {
-      type: String as PropType<string>,
-      default: '',
-    },
-    time: {
-      type: Object as PropType<object>,
-      default: () => {},
-    },
-  })
-  const format = computed(() => {
-    if (props.time) {
-      const start_time = dayjs(props.time?.[0]).format('YYYY-MM-DD')
-      const end_time = dayjs(props.time?.[1]).format('YYYY-MM-DD')
-      if (start_time === end_time) return 'HH:mm'
-    }
-    if (props.company === 'day') return 'HH:mm'
-    return 'YYYY-MM-DD'
-  })
-  const chartRef = ref<HTMLDivElement | null>(null)
-  const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>)
   watch(
-    () => props.data,
+    () => props.loading,
-    (e) => {
+    () => {
-      if (e) {
+      if (props.loading) {
+        return;
+      }
       setOptions({
         tooltip: {
           trigger: 'axis',
@@ -68,7 +48,7 @@
         },
         xAxis: {
           type: 'category',
-            data: Object.keys(e).map((e) => dayjs(e).format(format.value)),
+          data: [...new Array(18)].map((_item, index) => `${index + 6}:00`),
           axisTick: {
             show: false,
           },
@@ -93,7 +73,7 @@
         series: [
           {
             smooth: true,
-              data: Object.values(e),
+            data: [11, 22, 40, 18, 3, 55, 66, 33, 14, 30, 66, 44, 22, 11, 40, 20, 50, 33, 22, 11],
             type: 'line',
             areaStyle: {
               color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@@ -112,20 +92,12 @@
             },
           },
         ],
-          dataZoom: [
+      });
-            {
-              type: 'inside', //slider表示有滑动块的，inside表示内置的
-              show: false,
-              xAxisIndex: 0,
-            },
-          ],
-        })
-      }
     },
     {
       immediate: true,
     },
-  )
+  );
 </script>
 
 <style scoped></style>

src/views/main/water-quality/index.vue

@@ -1,85 +1,16 @@
 <template>
   <PageWrapper>
-    <Card>
+    <a-card>
-      <Form ref="formRef" :model="formState">
+      <BasicForm
-        <Row :gutter="[16, 16]">
+        autoFocusFirstItem
-          <Col
+        :labelWidth="0"
-            :xs="{ span: 24 }"
+        :schemas="schemas"
-            :sm="{ span: 12 }"
+        :rowProps="{ gutter: [16, 0] }"
-            :md="{ span: 8 }"
+        :showActionButtonGroup="false"
-            :lg="{ span: 6 }"
+      />
-            :xl="{ span: 6 }"
-            :xxl="{ span: 4 }"
-          >
-            <FormItem label="基地">
-              <Select
-                @select="onChange('base_id')"
-                :fieldNames="{ label: 'name', value: 'id' }"
-                :options="baseDate"
-                v-model:value="formState.base_id"
-                placeholder="请选择基地"
-              ></Select>
-            </FormItem>
-          </Col>
-          <Col
-            :xs="{ span: 24 }"
-            :sm="{ span: 12 }"
-            :md="{ span: 8 }"
-            :lg="{ span: 6 }"
-            :xl="{ span: 6 }"
-            :xxl="{ span: 4 }"
-          >
-            <FormItem label="检测点">
-              <Select
-                @select="onChange('')"
-                placeholder="请选择检测点"
-                :options="pointDate"
-                v-model:value="formState.device_id"
-              ></Select>
-            </FormItem>
-          </Col>
-          <Col
-            :xs="{ span: 24 }"
-            :sm="{ span: 12 }"
-            :md="{ span: 8 }"
-            :lg="{ span: 6 }"
-            :xl="{ span: 6 }"
-            :xxl="{ span: 4 }"
-          >
-            <FormItem label="日期">
-              <RangePicker
-                :disabledDate="disabledDate"
-                @change="onChangTime"
-                v-model:value="formState.time"
-              ></RangePicker>
-            </FormItem>
-          </Col>
-          <Col
-            :xs="{ span: 24 }"
-            :sm="{ span: 12 }"
-            :md="{ span: 8 }"
-            :lg="{ span: 6 }"
-            :xl="{ span: 6 }"
-            :xxl="{ span: 4 }"
-          >
-            <FormItem>
-              <RadioGroup
-                @change="onChange('time_interval')"
-                button-style="solid"
-                v-model:value="formState.time_interval"
-              >
-                <RadioButton value="day">今天</RadioButton>
-                <RadioButton value="week">近一周</RadioButton>
-                <RadioButton value="month">近一个月</RadioButton>
-              </RadioGroup>
-            </FormItem>
-          </Col>
-        </Row>
-      </Form>
-      <!--  -->
       <div class="flex justify-between">
         <span class="text-xl">预警数据统计</span>
-        <Button @click="handleSetting">设置</Button>
+        <a-button @click="handleSetting">设置</a-button>
       </div>
       <div class="mt-20px flex">
         <EarlyWarningItem
@@ -95,7 +26,7 @@
           :key="item.value"
           class="flex items-center mr-28px font-medium text-[#828fa2] mt-24px cursor-pointer"
           :class="{ active: item.value == activeKey }"
-          @click="onChangeTag(item.value)"
+          @click="onChangeTag(item)"
         >
           <img
             class="w-16px h-16px"
@@ -106,233 +37,225 @@
         </div>
       </div>
       <div class="mt-20px">
-        <LineCharts
+        <LineCharts :loading="false" :title="currentActiveLable" />
-          :company="formState.time_interval"
-          :extra="extra"
-          :loading="false"
-          :title="currentActiveLable"
-          :data="chartData"
-          :time="formState.time"
-        />
       </div>
-    </Card>
+    </a-card>
     <FormDrawer @register="registerDrawer" @success="handleSuccess" />
   </PageWrapper>
 </template>
 
-<script lang="ts" setup>
+<script lang="ts">
-  import dayjs from 'dayjs'
+  import { PageWrapper } from '/@/components/Page';
-  import { formatDataByObject, getWeek, getMonth } from '/@/utils/index'
+  import { defineComponent, ref, computed } from 'vue';
-  import { PageWrapper } from '/@/components/Page'
+  import { BasicForm, FormSchema } from '/@/components/Form/index';
-  import { ref, reactive, onMounted, computed } from 'vue'
+  import { Card, Button } from 'ant-design-vue';
-  import EarlyWarningItem from './components/EarlyWarningItem.vue'
+  import { ColEx } from '/@/components/Form/src/types';
-  import icon1 from '/@/assets/images/icon_1.png'
+  import EarlyWarningItem from './components/EarlyWarningItem.vue';
-  import uicon1 from '/@/assets/images/uicon_1.png'
+  import icon1 from '/@/assets/images/icon_1.png';
-  import LineCharts from './components/LineCharts.vue'
+  import uicon1 from '/@/assets/images/uicon_1.png';
-  import FormDrawer from './components/FormDrawer.vue'
+  import LineCharts from './components/LineCharts.vue';
-  import { useDrawer } from '/@/components/Drawer'
+  import FormDrawer from './components/FormDrawer.vue';
+  import { useDrawer } from '/@/components/Drawer';
+  const valueSelectA = ref<string[]>([]);
 
-  import {
-    getGriculturalDeviceBasic,
-    getaGriculturalDevicePoint,
-    getAmonitoringData,
-    getDeviceWarningNums,
-  } from '/@/api/sys/user'
-  import {
-    Card,
-    Form,
-    FormItem,
-    Select,
-    Row,
-    Col,
-    Radio,
-    RangePicker,
-    Button,
-    message,
-  } from 'ant-design-vue'
-  import type { FormInstance } from 'ant-design-vue'
-  const RadioButton = Radio.Button
-  const RadioGroup = Radio.Group
-  const [registerDrawer, { openDrawer }] = useDrawer()
-  const formRef = ref<FormInstance>()
-  const formState = reactive({
-    base_id: undefined, //基地
-    device_id: undefined, //监控点
-    time: undefined, //时间
-    time_interval: 'day',
-  })
-  const baseDate = ref([])
-  const pointDate = ref<any>([])
-  const statisData = ref<any>({})
-  // 预警数量
-  const earlyNums = ref<any>({})
-  // 选中
-  const activeKey = ref('conductivity')
   interface EarlyWarningItem {
-    icon: String
+    icon: String;
-    title: String
+    title: String;
-    value: String | Number
+    value: String;
   }
-  const earlyWarningList = computed(() => {
+
-    const arr: EarlyWarningItem[] = [
+  const colProps: Partial<ColEx> = {
+    xs: 24,
+    sm: 12,
+    md: 8,
+    lg: 6,
+    xl: 6,
+    xxl: 4,
+  };
+
+  const schemas: FormSchema[] = [
+    {
+      field: 'field1',
+      component: 'Select',
+      label: '',
+      colProps,
+      componentProps: {
+        placeholder: '基地',
+        options: [
+          {
+            label: '选项2',
+            value: '1',
+            key: '1',
+          },
+        ],
+        onChange: (e: any) => {
+          console.log(e);
+        },
+      },
+    },
+    {
+      field: 'field1',
+      component: 'Select',
+      label: '',
+      colProps,
+      componentProps: {
+        placeholder: '检测点',
+        options: [
+          {
+            label: '选项2',
+            value: '1',
+            key: '1',
+          },
+        ],
+        onChange: (e: any) => {
+          console.log(e);
+        },
+      },
+    },
+    {
+      field: 'time',
+      component: 'RangePicker',
+      label: '',
+      colProps,
+      componentProps: {
+        placeholder: ['开始日期', '结束日期'],
+      },
+    },
+    {
+      field: 'disclosure',
+      component: 'RadioButtonGroup',
+      label: '',
+      colProps: colProps,
+      componentProps: {
+        options: [
+          {
+            label: '今天',
+            value: '1',
+          },
+          {
+            label: '近一周',
+            value: '2',
+          },
+          {
+            label: '近一个月',
+            value: '3',
+          },
+        ],
+      },
+    },
+  ];
+
+  const earlyWarningList: EarlyWarningItem[] = [
     {
       icon: 'yujing1',
       title: 'Ⅰ级预警',
-        value: '',
+      value: '1',
     },
     {
       icon: 'yujing2',
       title: 'Ⅱ级预警',
-        value: '',
+      value: '1',
     },
     {
       icon: 'yujing3',
       title: 'Ⅲ级预警',
-        value: '',
+      value: '1',
     },
     {
       icon: 'yujing4',
       title: 'Ⅳ级预警',
-        value: '',
+      value: '100',
     },
-    ]
+  ];
-    Object.values(earlyNums.value).forEach((v: number | string, index: number) => {
+
-      arr[index].value = v
-    })
-    return arr
-  })
-  const currentActiveLable = computed(
-    () => tagMenus.find((e) => e.value === activeKey.value)?.lable ?? '',
-  )
-  const chartData = computed(() => statisData.value[activeKey.value])
-  const extra = computed(() => {
-    const name1 = baseDate.value?.find((e: any) => e.id === formState.base_id)?.name
-    const name2 = pointDate.value?.find((e: any) => e.value === formState.device_id)?.label ?? ''
-    return name1 + '-' + name2
-  })
   const tagMenus = [
-    {
-      lable: '电导率',
-      value: 'conductivity',
-      icon: icon1,
-      icon1: uicon1,
-    },
-    {
-      lable: '湿度',
-      value: 'humidity',
-      icon: icon1,
-      icon1: uicon1,
-    },
     {
       lable: '温度',
-      value: 'temperature',
+      value: 0,
+      icon: icon1,
+      icon1: uicon1,
+    },
+    {
+      lable: '电导率',
+      value: 1,
+      icon: icon1,
+      icon1: uicon1,
+    },
+    {
+      lable: '水分',
+      value: 2,
       icon: icon1,
       icon1: uicon1,
     },
     {
       lable: '氮',
-      value: 'k',
+      value: 3,
       icon: icon1,
       icon1: uicon1,
     },
     {
       lable: '磷',
-      value: 'n',
+      value: 4,
       icon: icon1,
       icon1: uicon1,
     },
     {
       lable: '钾',
-      value: 'p',
+      value: 5,
       icon: icon1,
       icon1: uicon1,
     },
-  ]
+  ];
 
-  const disabledDate = (current) => {
+  export default defineComponent({
-    return current && current > dayjs().endOf('day')
+    components: {
-  }
+      [Card.name]: Card,
-  // 获取基地数据
+      [Button.name]: Button,
-  const getBase = async () => {
+      BasicForm,
-    const res = await getGriculturalDeviceBasic({ device_type: 2 })
+      PageWrapper,
-    baseDate.value = res
+      EarlyWarningItem,
-    if (!formState.base_id) formState.base_id = res?.[0]?.id ?? undefined
+      LineCharts,
-    getPoint()
+      FormDrawer,
-  }
+    },
-  // 获取监控点数据
+
-  const getPoint = async () => {
+    setup() {
-    const res = await getaGriculturalDevicePoint({
+      const activeKey = ref(1);
-      device_type: 2,
+
-      agricultural_basic: formState.base_id,
+      const [registerDrawer, { openDrawer }] = useDrawer();
-    })
+
-    pointDate.value = formatDataByObject(res)
+      const currentActiveLable = computed(
-    if (!formState.device_id) formState.device_id = pointDate.value?.[0]?.value ?? undefined
+        () => tagMenus.find((e) => e.value == activeKey.value)?.lable ?? '',
-    getDate()
+      );
-    getNums()
+
-  }
+      function onChangeTag(item) {
-  // 获取数据
+        activeKey.value = item.value;
-  const getDate = async () => {
-    const params = {
-      device_id: formState.device_id,
-      start_time: '',
-      end_time: '',
-    }
-    if (formState.time) {
-      params.start_time = dayjs(formState.time?.[0]).format('YYYY-MM-DD')
-      params.end_time = dayjs(formState.time?.[1]).format('YYYY-MM-DD')
-    }
-    if (formState.time_interval === 'week') {
-      const { WeekStartDate, WeekEndDate } = getWeek()
-      params.start_time = WeekStartDate
-      params.end_time = WeekEndDate
-    } else if (formState.time_interval === 'month') {
-      const { MonthStartDate, MonthEndDate } = getMonth()
-      params.start_time = MonthStartDate
-      params.end_time = MonthEndDate
-    } else if (formState.time_interval === 'day') {
-      params.start_time = ''
-      params.end_time = ''
-    }
-    const res = await getAmonitoringData(params)
-    statisData.value = res
-  }
-  // 获取预警数量
-  const getNums = async () => {
-    let res = await getDeviceWarningNums({
-      base: formState.base_id,
-      device: formState.device_id,
-      status: 0,
-    })
-    earlyNums.value = res
-  }
-  const onChange = (e: string | undefined) => {
-    if (e === 'base_id') formState.device_id = undefined
-    if (e === 'time') formState.time_interval = ''
-    if (e === 'time_interval') formState.time = undefined
-    getPoint()
       }
 
-  const onChangTime = (e) => {
+      function handleSetting() {
-    if (e === null) formState.time_interval = 'day'
-    else formState.time_interval = ''
-    getPoint()
-  }
-
-  const handleSetting = () => {
         openDrawer(true, {
           isUpdate: false,
-    })
+        });
       }
-  const handleSuccess = () => {
+
-    message.success('操作成功')
+      function handleSuccess() {
+        // reload();
+        console.log('=========');
       }
-  //
+
-  const onChangeTag = (e: string) => {
+      return {
-    activeKey.value = e
+        activeKey,
-  }
+        valueSelectA,
-  onMounted(() => {
+        schemas,
-    getBase()
+        earlyWarningList,
-  })
+        tagMenus,
+        currentActiveLable,
+        registerDrawer,
+        onChangeTag,
+        handleSetting,
+        handleSuccess,
+      };
+    },
+  });
 </script>
 
 <style scoped lang="less">