fix(KeepView、UserTrend): 修复初次请求没有正确传递时间的BUG

src/components/dataAnalysis/HeaderCard.vue

@@ -10,7 +10,7 @@
 import type { HeaderCardProps, IconDropdownItem } from '@/types/dataAnalysis'
 
 import { computed, onMounted, reactive, ref, watch } from 'vue'
-import { createDateRange } from '@/utils/common'
+import { shortcutsDate } from '@/utils/common'
 
 import router from '@/router'
 import WithIconSelect from '@/components/common/WithIconSelect.vue'
@@ -24,24 +24,8 @@ const props = withDefaults(defineProps<HeaderCardProps>(), {
 
 const emits = defineEmits(['changePf', 'changeDate'])
 
-// 快速选择日期
-const shortcuts = [
-  {
-    text: '上一周',
-    value: () => createDateRange(7)
-  },
-  {
-    text: '上个月',
-    value: () => createDateRange(30)
-  },
-  {
-    text: '近三个月',
-    value: () => createDateRange(90)
-  }
-]
-
 // 选择的日期
-const selectDate = ref<[Date, Date]>(shortcuts[0].value())
+const selectDate = ref<[Date, Date]>(shortcutsDate[0].value())
 
 // 面包屑列表
 const breadcrumbList = reactive<

src/utils/common/index.ts

@@ -291,3 +291,19 @@ export const getFileIconBySuffix = (filename: string, fileType: 'folder' | 'file
       return iconBasePath + 'unknow-file.png'
   }
 }
+
+// 快速选择日期
+export const shortcutsDate = [
+  {
+    text: '上一周',
+    value: () => createDateRange(7)
+  },
+  {
+    text: '上个月',
+    value: () => createDateRange(30)
+  },
+  {
+    text: '近三个月',
+    value: () => createDateRange(90)
+  }
+]

src/views/Home/Analysis/EventAnalysisTable.vue

@@ -18,7 +18,7 @@ import { FilterType } from '@/types/table'
 import { reactive, ref } from 'vue'
 import { useRequest } from '@/hooks/useRequest'
 import { useCommonStore } from '@/stores/useCommon'
-import { resetTimeToMidnight } from '@/utils/common'
+import { resetTimeToMidnight, shortcutsDate } from '@/utils/common'
 import { useAnalysis } from '@/hooks/useAnalysis'
 import { usePage } from '@/hooks/usePage'
 

src/views/Home/Analysis/KeepView.vue

@@ -9,9 +9,11 @@
 <script setup lang="ts">
 import type { TableFieldInfo, TablePaginationSetting } from '@/types/table'
 import type { HeaderCardProps, ReqConfig } from '@/types/dataAnalysis'
+import { MessageBox } from '@element-plus/icons-vue'
+import { ElMessageBox } from 'element-plus'
 
-import { reactive, ref, toRaw } from 'vue'
-import { resetTimeToMidnight } from '@/utils/common'
+import { onMounted, reactive, ref, toRaw } from 'vue'
+import { resetTimeToMidnight, shortcutsDate } from '@/utils/common'
 import { useRequest } from '@/hooks/useRequest'
 import { useCommonStore } from '@/stores/useCommon'
 import { useAnalysis } from '@/hooks/useAnalysis'
@@ -21,6 +23,10 @@ import Table from '@/components/table/CustomTable.vue'
 import HeaderCard from '@/components/dataAnalysis/HeaderCard.vue'
 import axiosInstance from '@/utils/axios/axiosInstance'
 
+type HeaderRef = InstanceType<typeof HeaderCard>
+
+const headerRef = ref<HeaderRef>()
+
 const { watchPageChange } = usePage()
 
 const { updateReqConfig } = useAnalysis()
@@ -33,6 +39,9 @@ const isSinglePf = true
 
 const loading = ref(true) // 加载状态
 
+const initStartDate = shortcutsDate[0].value()[0]
+const initEndDate = shortcutsDate[1].value()[1]
+
 // 数据详情表格信息
 const keepDataTableInfo = reactive<{
   paginationConfig: TablePaginationSetting
@@ -50,8 +59,8 @@ const keepDataTableInfo = reactive<{
     otherOptions: {
       pf: selectInfo.pf,
       gid: selectInfo.gid,
-      startTime: resetTimeToMidnight(new Date()),
-      endTime: resetTimeToMidnight(new Date()),
+      startTime: resetTimeToMidnight(initStartDate),
+      endTime: resetTimeToMidnight(initEndDate),
       type: 1
     }
   },
@@ -167,6 +176,7 @@ const headerCardInfo: HeaderCardProps = {
  */
 const getTableData = () => {
   loading.value = true
+
   axiosInstance
     .post(keepDataTableInfo.requestConfig.url, {
       ...keepDataTableInfo.requestConfig.otherOptions
@@ -213,6 +223,7 @@ watchPageChange(() => [keepDataTableInfo.requestConfig], backupReq, getTableData
   <div class="KeepViewBox">
     <div class="header">
       <HeaderCard
+        ref="headerRef"
         :title="headerCardInfo.title"
         :open-date-select="headerCardInfo.openDateSelect"
         @change-date="changeDate"

src/views/Home/Analysis/UserTrendView.vue

@@ -2,11 +2,11 @@
 import type { ReqConfig, StaticField, TemporalTrendInfo } from '@/types/dataAnalysis'
 import type { TableFieldInfo, TablePaginationSetting } from '@/types/table'
 
-import { reactive, ref, toRaw } from 'vue'
+import { onActivated, onMounted, reactive, ref, toRaw } from 'vue'
 import { useCommonStore } from '@/stores/useCommon'
 import { useRequest } from '@/hooks/useRequest'
 import { useAnalysis } from '@/hooks/useAnalysis'
-import { resetTimeToMidnight } from '@/utils/common'
+import { resetTimeToMidnight, shortcutsDate } from '@/utils/common'
 import { usePage } from '@/hooks/usePage'
 
 import HeaderCard from '@/components/dataAnalysis/HeaderCard.vue'
@@ -15,6 +15,10 @@ import StatisticText from '@/components/dataAnalysis/StatisticText.vue'
 import TemporalTrend from '@/components/dataAnalysis/TemporalTrend.vue'
 import axiosInstance from '@/utils/axios/axiosInstance'
 
+type HeaderRef = InstanceType<typeof HeaderCard>
+
+const headerRef = ref<HeaderRef>()
+
 const { watchPageChange } = usePage()
 
 const { updateReqConfig } = useAnalysis()
@@ -68,6 +72,9 @@ const userTrendDataReqConfig = reactive<ReqConfig>({
   }
 })
 
+const initStartDate = shortcutsDate[0].value()[0]
+const initEndDate = shortcutsDate[1].value()[1]
+
 // 数据趋势组件所需要的信息
 const dataTrendInfo = reactive<TemporalTrendInfo>({
   dataReqConfig: {
@@ -75,8 +82,8 @@ const dataTrendInfo = reactive<TemporalTrendInfo>({
     otherOptions: {
       pf: selectInfo.pf[0],
       gid: selectInfo.gid,
-      startTime: resetTimeToMidnight(new Date()),
-      endTime: resetTimeToMidnight(new Date())
+      startTime: resetTimeToMidnight(initStartDate),
+      endTime: resetTimeToMidnight(initEndDate)
     }
   },
   tabList: toRaw([
@@ -182,8 +189,8 @@ const detailDataTableInfo = reactive<{
     otherOptions: {
       pf: selectInfo.pf[0],
       gid: selectInfo.gid,
-      startTime: resetTimeToMidnight(new Date()),
-      endTime: resetTimeToMidnight(new Date())
+      startTime: resetTimeToMidnight(initStartDate),
+      endTime: resetTimeToMidnight(initEndDate)
     }
   },
   tableFieldsInfo: toRaw([
@@ -293,6 +300,7 @@ watchPageChange(() => [detailDataTableInfo.requestConfig], backupReq, getDetailD
   <div class="userTrendBox">
     <div class="header">
       <HeaderCard
+        ref="headerRef"
         :open-date-select="true"
         @change-date="changeDate"
         :title="'数据总览'"