From 8835f633d382ee18d2341327b224b3ab2b539ef3 Mon Sep 17 00:00:00 2001
From: dataeaseShu <tong.shu@fit2cloud.com>
Date: Tue, 11 Jun 2024 10:35:39 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E6=9F=A5=E8=AF=A2=E7=BB=84=E4=BB=B6):=20?=
 =?UTF-8?q?=E6=97=A5=E6=9C=9F=E7=AD=9B=E9=80=89=E6=94=AF=E6=8C=81=E6=8C=89?=
 =?UTF-8?q?=E5=91=A8=EF=BC=8C=E6=8C=89=E6=9C=88=E8=8C=83=E5=9B=B4=E8=BF=87?=
 =?UTF-8?q?=E6=BB=A4=20#7310?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/custom-component/v-query/Time.vue     | 110 +++++++++++++++++-
 .../src/custom-component/v-query/shortcuts.ts |  75 ++++++------
 2 files changed, 146 insertions(+), 39 deletions(-)

diff --git a/core/core-frontend/src/custom-component/v-query/Time.vue b/core/core-frontend/src/custom-component/v-query/Time.vue
index 0600db27e8..f3003a3eb1 100644
--- a/core/core-frontend/src/custom-component/v-query/Time.vue
+++ b/core/core-frontend/src/custom-component/v-query/Time.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { toRefs, PropType, ref, onBeforeMount, watch, nextTick, computed, h } from 'vue'
+import { toRefs, PropType, ref, onBeforeMount, watch, nextTick, computed } from 'vue'
 import { type DatePickType } from 'element-plus-secondary'
 import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
 import type { ManipulateType } from 'dayjs'
@@ -81,8 +81,108 @@ watch(
     })
   }
 )
-const callback = () => {
-  return true
+const isInRange = (ele, startWindowTime, timeStamp) => {
+  const {
+    intervalType,
+    regularOrTrends,
+    regularOrTrendsValue,
+    relativeToCurrent,
+    timeNum,
+    relativeToCurrentType,
+    around,
+    dynamicWindow,
+    maximumSingleQuery,
+    timeNumRange,
+    relativeToCurrentTypeRange,
+    aroundRange
+  } = ele.timeRange || {}
+  let isDynamicWindowTime = false
+  const noTime = ele.timeGranularityMultiple.split('time').join('').split('range')[0]
+  const queryTimeType = noTime === 'date' ? 'day' : (noTime as ManipulateType)
+  if (startWindowTime && dynamicWindow) {
+    isDynamicWindowTime =
+      dayjs(startWindowTime)
+        .add(maximumSingleQuery, queryTimeType)
+        .startOf(queryTimeType)
+        .valueOf() -
+        1000 <
+      timeStamp
+  }
+
+  if (intervalType === 'none') {
+    if (dynamicWindow) return isDynamicWindowTime
+    return false
+  }
+  let startTime
+  if (relativeToCurrent === 'custom') {
+    startTime = getAround(relativeToCurrentType, around === 'f' ? 'subtract' : 'add', timeNum)
+  } else {
+    switch (relativeToCurrent) {
+      case 'thisYear':
+        startTime = getThisStart('year')
+        break
+      case 'lastYear':
+        startTime = getLastStart('year')
+        break
+      case 'thisMonth':
+        startTime = getThisStart('month')
+        break
+      case 'lastMonth':
+        startTime = getLastStart('month')
+        break
+      case 'today':
+        startTime = getThisStart('day')
+        break
+      case 'yesterday':
+        startTime = getLastStart('day')
+        break
+      case 'monthBeginning':
+        startTime = getThisStart('month')
+        break
+      case 'yearBeginning':
+        startTime = getThisStart('year')
+        break
+
+      default:
+        break
+    }
+  }
+  const startValue = regularOrTrends === 'fixed' ? regularOrTrendsValue : startTime
+  if (intervalType === 'start') {
+    return startWindowTime < +new Date(startValue) || isDynamicWindowTime
+  }
+
+  if (intervalType === 'end') {
+    return timeStamp > +new Date(startValue) || isDynamicWindowTime
+  }
+
+  if (intervalType === 'timeInterval') {
+    const startTime =
+      regularOrTrends === 'fixed'
+        ? regularOrTrendsValue[0]
+        : getAround(relativeToCurrentType, around === 'f' ? 'subtract' : 'add', timeNum)
+    const endTime =
+      regularOrTrends === 'fixed'
+        ? regularOrTrendsValue[1]
+        : getAround(
+            relativeToCurrentTypeRange,
+            aroundRange === 'f' ? 'subtract' : 'add',
+            timeNumRange
+          )
+    return (
+      startWindowTime < +new Date(startTime) - 1000 ||
+      timeStamp > +new Date(endTime) ||
+      isDynamicWindowTime
+    )
+  }
+}
+const callback = param => {
+  startWindowTime.value = param[0]
+  const disabled = param.some(ele => {
+    return disabledDate(ele)
+  })
+  startWindowTime.value = 0
+  return disabled
 }
 
 const { shortcuts } = useShortcuts(callback)
@@ -382,7 +482,9 @@ const formatDate = computed(() => {
     @calendar-change="calendarChange"
     :format="formatDate"
     v-if="multiple"
-    :shortcuts="shortcuts"
+    :shortcuts="
+      ['datetimerange', 'daterange'].includes(config.timeGranularityMultiple) ? shortcuts : []
+    "
     @change="handleValueChange"
     :range-separator="$t('cron.to')"
     :start-placeholder="$t('datasource.start_time')"
diff --git a/core/core-frontend/src/custom-component/v-query/shortcuts.ts b/core/core-frontend/src/custom-component/v-query/shortcuts.ts
index 06433f1fd1..c2fcd5fef1 100644
--- a/core/core-frontend/src/custom-component/v-query/shortcuts.ts
+++ b/core/core-frontend/src/custom-component/v-query/shortcuts.ts
@@ -37,70 +37,75 @@ let callback: Function = () => {}
 const shortcuts = [
   {
     text: 'dynamic_time.cweek',
-    onClick: ({ attrs, slots, emit }) => {
-      if (
-        callback([
-          new Date(+new Date(getThisStart('week')) + 24 * 1000 * 3600),
-          new Date(+new Date(getThisEnd('week')) + 24 * 1000 * 3600)
-        ])
-      )
-        return
-      emit('pick', [
-        dayjs(new Date(+new Date(getThisStart('week')) + 24 * 1000 * 3600)),
-        dayjs(new Date(+new Date(getThisEnd('week')) + 24 * 1000 * 3600))
-      ])
+    onClick: ({ emit }) => {
+      const startTime = new Date(+new Date(getThisStart('week')) + 24 * 1000 * 3600)
+      const endTime = new Date(+new Date(getThisEnd('week')) + 24 * 1000 * 3600)
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   },
   {
     text: 'dynamic_month.current',
-    value: () => {
-      return [getThisStart('month'), getThisEnd('month')]
-    },
-    onClick: () => {
-      console.log(113)
+    onClick: ({ emit }) => {
+      const startTime = getThisStart('month')
+      const endTime = getThisEnd('month')
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   },
   {
     text: 'dynamic_time.cquarter',
-    value: () => {
-      return [getThisStart('quarter'), getThisEnd('quarter')]
-    },
-    onClick: () => {
-      console.log(113)
+    onClick: ({ emit }) => {
+      const startTime = getThisStart('quarter')
+      const endTime = getThisEnd('quarter')
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   },
   {
     text: 'dynamic_year.current',
-    value: () => {
-      return [getThisStart('year'), getThisEnd('year')]
+    onClick: ({ emit }) => {
+      const startTime = getThisStart('year')
+      const endTime = getThisEnd('year')
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   },
 
   {
     text: 'dynamic_time.lweek',
-    value: () => {
-      return [
-        new Date(+new Date(getLastStart('week')) + 24 * 1000 * 3600),
-        new Date(+new Date(getLastEnd('week')) + 24 * 1000 * 3600)
-      ]
+    onClick: ({ emit }) => {
+      const startTime = new Date(+new Date(getLastStart('week')) + 24 * 1000 * 3600)
+      const endTime = new Date(+new Date(getLastEnd('week')) + 24 * 1000 * 3600)
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   },
   {
     text: 'dynamic_month.last',
-    value: () => {
-      return [getLastStart('month'), getLastEnd('month')]
+    onClick: ({ emit }) => {
+      const startTime = getLastStart('month')
+      const endTime = getLastEnd('month')
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   },
   {
     text: 'dynamic_time.lquarter',
-    value: () => {
-      return [getLastStart('quarter'), getLastEnd('quarter')]
+    onClick: ({ emit }) => {
+      const startTime = getLastStart('quarter')
+      const endTime = getLastEnd('quarter')
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   },
   {
     text: 'dynamic_year.last',
-    value: () => {
-      return [getLastStart('year'), getLastEnd('year')]
+    onClick: ({ emit }) => {
+      const startTime = getLastStart('year')
+      const endTime = getLastEnd('year')
+      if (callback([startTime, endTime])) return
+      emit('pick', [dayjs(startTime), dayjs(endTime)])
     }
   }
 ]