feat: 增加查询最近

global.types/components.d.ts

@@ -29,6 +29,7 @@ declare module 'vue' {
     ElEmpty: typeof import('element-plus/es')['ElEmpty']
     ElHeader: typeof import('element-plus/es')['ElHeader']
     ElInput: typeof import('element-plus/es')['ElInput']
+    ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
     ElOption: typeof import('element-plus/es')['ElOption']

src/api/module/transfer/index.ts

@@ -17,7 +17,7 @@ export const getDeviceDetails = (params: IGetDeviceDataParams) =>
     url: `/api/query`,
     method: 'POST',
     data: params,
-    timeout: 0,
+    timeout: 1000 * 50,
   })
 
 export interface ISite {

src/views/stationData/component/newDataChart.vue

@@ -7,7 +7,7 @@
       :autoresize="autoresize"
       :loading-options="loadingOpt"
       :loading="loading"
-      @legendselectchanged="changeLegend"/>
+  />
   </div>
 </template>
 
@@ -91,6 +91,7 @@ const chartOption = computed<EChartsOption>(() => {
       connectNulls: true,
       data: entry,
       sampling: 'lttb',
+      animation: false,
     }
     if (props.smooth) {
       lineData.smooth = true
@@ -149,10 +150,10 @@ const chartOption = computed<EChartsOption>(() => {
       itemHeight: 10,
       pageIconSize: 12,
       data: props.legends.map(item => item.label),
-      selected: unCheckArr.value.reduce((acc, cur) => {
-        acc[cur] = false
-        return acc
-      }, {} as Record<string, boolean>),
+      // selected: unCheckArr.value.reduce((acc, cur) => {
+      //   acc[cur] = false
+      //   return acc
+      // }, {} as Record<string, boolean>),
     },
     xAxis: {
       type: 'time',

src/views/stationData/topology/components/detailDrawer.vue

@@ -46,8 +46,12 @@
                 :percentage="progress"
                 status="success"
               />
-              <div class="text-xl">
-                <div>当前加载数据量较大请稍等。。。</div>
+              <div class="text-center text-gray-700 text-lg leading-relaxed">
+                正在加载数据，请稍等。<br>
+                当前已查询
+                <span class="font-semibold text-green-600">{{ reqPointCount }}</span> /
+                <span class="font-semibold text-blue-600">{{ pointCount }}</span> 个点位，剩余
+                <span class="font-semibold text-red-500">{{ remainingPointCount }}</span> 个点位。
               </div>
             </div>
           </div>
@@ -65,6 +69,10 @@
               />
             </div>
             <el-button type="primary" @click="loadChardData">查询数据</el-button>
+            查询最近
+            <el-input-number :key="refreshKey" v-model="num" :min="1" :max="diffHours"
+                             @input="handleInput"/>
+            小时
           </div>
           <NewDataChart
             v-if="isShowChart"
@@ -93,8 +101,37 @@ import dayjs from 'dayjs'
 import { nextTick } from "vue";
 import EdfsWrap from "@/components/Edfs-wrap.vue";
 import PointCheckbox from "@/views/stationData/component/pointCheckbox.vue";
+import { debounce } from 'lodash-es'
+
 
 const env = import.meta.env
+
+
+const num = ref<number>()
+const diffHours = ref<number>()
+const refreshKey = ref(0)
+
+const handleInput = debounce(async (val: number) => {
+  if (diffHours.value && val > diffHours.value) {
+    num.value = diffHours.value
+    refreshKey.value++
+    await nextTick()
+  } else if (val < 1) {
+    num.value = 1
+    refreshKey.value++
+    await nextTick()
+  } else {
+    num.value = val
+  }
+  const endTime =
+    curDevice.value!.end_time ?
+      dayjs(curDevice.value!.end_time).valueOf() : dayjs().valueOf()
+
+  const startTime = dayjs(endTime).subtract(num.value, 'hour').valueOf()
+  time.value = [dayjs(startTime).format('YYYY-MM-DD HH:mm:ss'), dayjs(endTime).format('YYYY-MM-DD HH:mm:ss')]
+}, 300)
+
+
 const isShowDrawer = defineModel<boolean>()
 const title = computed(() =>
   (
@@ -133,6 +170,14 @@ async function open(device: IDevice & {
       message.error('获取点位数据失败')
       fullscreenLoading.value?.close()
     })
+  const deviceOff = curDevice.value as IOfflineDevice
+  if (!deviceOff.start_time || !deviceOff.end_time) {
+    diffHours.value = 168 // 默认一周时间
+    return
+  }
+  const start = dayjs(deviceOff.start_time)
+  const end = dayjs(deviceOff.end_time)
+  diffHours.value = end.diff(start, "hour") + 1;
 }
 
 const selectValue = ref()
@@ -212,6 +257,13 @@ const chartLimit = ref(1000)
 const chartOffset = ref(0)
 const progress = ref(0)
 
+
+const pointCount = computed(() => chartAllTotal.value * checkPointList.value.length)
+const reqPointCount = ref(0)
+
+// 剩余点位数
+const remainingPointCount = computed(() => pointCount.value - reqPointCount.value)
+
 async function loadChardData() {
   if (!time.value || time.value.length !== 2) {
     message.error('请选择时间范围')
@@ -287,11 +339,11 @@ async function loadChardData() {
       message.error('获取设备数据失败')
       return
     }
+    reqPointCount.value += res?.data?.results?.length || 0
     const pointData = Array.isArray(res.data.results) ? res.data.results : []
     setChartData(pointData)
-    progress.value = Math.min(100, Math.floor(((i + 1) / pageCount) * 100))
+    progress.value = Math.min(100, Math.floor(((i + 1) / pageCount) * 100)) - 1
   }
-
   resetChartStatus()
 }
 
@@ -344,6 +396,7 @@ function clearData() {
   legends.value = []
   chartData.clear()
   axisData.clear()
+  reqPointCount.value = 0
 }
 
 function resetChartStatus() {

src/views/stationData/transfer/components/deviceDrawer.vue

@@ -30,8 +30,12 @@
                 :percentage="progress"
                 status="success"
               />
-              <div class="text-xl">
-                <div>当前加载数据量较大请稍等。。。</div>
+              <div class="text-center text-gray-700 text-lg leading-relaxed">
+                正在加载数据，请稍等。<br>
+                当前已查询
+                <span class="font-semibold text-green-600">{{ reqPointCount }}</span> /
+                <span class="font-semibold text-blue-600">{{ pointCount }}</span> 个点位，剩余
+                <span class="font-semibold text-red-500">{{ remainingPointCount }}</span> 个点位。
               </div>
             </div>
           </div>
@@ -49,8 +53,11 @@
               />
             </div>
             <el-button type="primary" @click="loadChardData">查询数据</el-button>
+            查询最近
+            <el-input-number :key="refreshKey" v-model="num" :min="1" :max="diffHours"
+                             @input="handleInput"/>
+            小时
           </div>
-
           <NewDataChart v-if="isShowChart" :chart-datas="chartData" :legends="legends"
                         :axis-data="Array.from(axisData)" ref="chartRef"/>
         </div>
@@ -78,11 +85,36 @@ import dayjs from 'dayjs'
 import { nextTick } from "vue";
 import EdfsWrap from "@/components/Edfs-wrap.vue";
 import { bms_cellRewriteName } from "@/views/stationData/utils";
+import { debounce } from 'lodash-es'
 
 const time = ref<[string, string]>()
 
 const env = import.meta.env
 
+const num = ref<number>()
+const diffHours = ref<number>()
+const refreshKey = ref(0)
+
+const handleInput = debounce(async (val: number) => {
+  if (diffHours.value && val > diffHours.value) {
+    num.value = diffHours.value
+    refreshKey.value++
+    await nextTick()
+  } else if (val < 1) {
+    num.value = 1
+    refreshKey.value++
+    await nextTick()
+  } else {
+    num.value = val
+  }
+  const endTime =
+    curDevice.value!.end_time ?
+      dayjs(curDevice.value!.end_time).valueOf() : dayjs().valueOf()
+
+  const startTime = dayjs(endTime).subtract(num.value, 'hour').valueOf()
+  time.value = [dayjs(startTime).format('YYYY-MM-DD HH:mm:ss'), dayjs(endTime).format('YYYY-MM-DD HH:mm:ss')]
+}, 300)
+
 
 const isShowDrawer = defineModel<boolean>()
 const title = computed(() =>
@@ -117,6 +149,14 @@ async function open(device: IOfflineDevice | IOnlineDevice) {
       message.error('获取点位组数据失败')
       fullscreenLoading.value?.close()
     })
+  const deviceOff = curDevice.value as IOfflineDevice
+  if (!deviceOff.start_time || !deviceOff.end_time) {
+    diffHours.value = 168 // 默认一周时间
+    return
+  }
+  const start = dayjs(deviceOff.start_time)
+  const end = dayjs(deviceOff.end_time)
+  diffHours.value = end.diff(start, "hour") + 1;
 }
 
 
@@ -187,6 +227,12 @@ const chartLimit = ref(1000)
 const chartOffset = ref(0)
 const progress = ref(0)
 
+const pointCount = computed(() => chartAllTotal.value * checkPointList.value.length)
+const reqPointCount = ref(0)
+
+// 剩余点位数
+const remainingPointCount = computed(() => pointCount.value - reqPointCount.value)
+
 async function loadChardData() {
   if (!time.value || time.value.length !== 2) {
     message.error('请选择时间范围')
@@ -260,11 +306,11 @@ async function loadChardData() {
       message.error('获取设备数据失败')
       return
     }
+    reqPointCount.value += res?.data?.results?.length || 0
     const pointData = Array.isArray(res.data.results) ? res.data.results : []
     setChartData(pointData)
-    progress.value = Math.min(100, Math.floor(((i + 1) / pageCount) * 100))
+    progress.value = Math.min(100, Math.floor(((i + 1) / pageCount) * 100)) - 1
   }
-
   resetChartStatus()
 }
 
@@ -315,6 +361,7 @@ function clearData() {
   legends.value = []
   chartData.clear()
   axisData.clear()
+  reqPointCount.value = 0
 }
 
 function resetChartStatus() {