From 8b616deb94808e39bc13096911ea8631d81eadda Mon Sep 17 00:00:00 2001
From: fit2cloud-chenyw <yawen.chen@fit2cloud.com>
Date: Fri, 5 Aug 2022 03:05:56 -0400
Subject: [PATCH] =?UTF-8?q?perf(=E4=BB=AA=E8=A1=A8=E6=9D=BF-=E6=97=A5?=
 =?UTF-8?q?=E6=9C=9F=E8=8C=83=E5=9B=B4=E8=BF=87=E6=BB=A4=E5=99=A8):=20?=
 =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=97=B6=E5=88=86=E7=A7=92=E7=B2=BE=E5=BA=A6?=
 =?UTF-8?q?=E8=AE=BE=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/widget/DeWidget/DeDate.vue |  8 +++---
 .../serviceImpl/TimeDateRangeServiceImpl.js   | 15 ++++++-----
 .../defaultValue/DeDateRangeDefault.vue       | 26 +++++++++++++++++--
 3 files changed, 35 insertions(+), 14 deletions(-)

diff --git a/frontend/src/components/widget/DeWidget/DeDate.vue b/frontend/src/components/widget/DeWidget/DeDate.vue
index 73d97c5127..3dfc48ce2f 100644
--- a/frontend/src/components/widget/DeWidget/DeDate.vue
+++ b/frontend/src/components/widget/DeWidget/DeDate.vue
@@ -230,8 +230,9 @@ export default {
         }
         let start = values[0]
         let end = values[1]
-        start = timeSection(start, 'date')[0]
-        end = timeSection(end, 'date')[1]
+        start = timeSection(start, 'datetime', this.labelFormat)[0]
+        end = timeSection(end, 'datetime', this.labelFormat)[1]
+
         const results = [start, end]
         return results
       } else {
@@ -264,9 +265,6 @@ export default {
 .coustom-date-picker {
   border:1px solid var(--BrDateColor, #dfe4ed) !important;
   background: var(--BgDateColor, #FFFFFF) !important;
-  // .popper__arrow::after{
-  //   border-bottom-color: var(--BgDateColor, #FFFFFF) !important;
-  // }
 
   .popper__arrow,
   .popper__arrow::after {
diff --git a/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js b/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js
index 6fcd7d1cd5..c290b45e50 100644
--- a/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js
+++ b/frontend/src/components/widget/serviceImpl/TimeDateRangeServiceImpl.js
@@ -269,23 +269,24 @@ class TimeDateRangeServiceImpl extends WidgetService {
     if (!values || values.length === 0) {
       return []
     }
+    const componentType = element.options.attrs.showTime ? 'datetimerange' : 'daterange'
+    let labelFormat = 'yyyy-MM-dd'
+    if (element.options.attrs.showTime && element.options.attrs.accuracy) {
+      labelFormat = labelFormat + ' ' + element.options.attrs.accuracy
+    }
     if (element.options.attrs.type === 'daterange') {
       if (values.length !== 2) {
         return null
       }
       let start = values[0]
       let end = values[1]
-      start = timeSection(start, 'date')[0]
-      end = timeSection(end, 'date')[1]
+
+      start = timeSection(start, 'datetime', labelFormat)[0]
+      end = timeSection(end, 'datetime', labelFormat)[1]
       const results = [start, end]
       return results
     } else {
       const value = values[0]
-      const componentType = element.options.attrs.showTime ? 'datetimerange' : 'daterange'
-      let labelFormat = 'yyyy-MM-dd'
-      if (element.options.attrs.showTime && element.options.attrs.accuracy) {
-        labelFormat = labelFormat + ' ' + element.options.attrs.accuracy
-      }
 
       return timeSection(parseFloat(value), componentType || element.options.attrs.type, labelFormat)
     }
diff --git a/frontend/src/views/panel/filter/defaultValue/DeDateRangeDefault.vue b/frontend/src/views/panel/filter/defaultValue/DeDateRangeDefault.vue
index c0f923a970..9e72ba9ece 100644
--- a/frontend/src/views/panel/filter/defaultValue/DeDateRangeDefault.vue
+++ b/frontend/src/views/panel/filter/defaultValue/DeDateRangeDefault.vue
@@ -5,7 +5,7 @@
       <el-form-item :label="$t('dynamic_time.set_default')">
         <el-radio-group v-model="element.options.attrs.default.isDynamic" @change="dynamicChange">
           <el-radio :label="false">{{ $t('dynamic_time.fix') }}</el-radio>
-          <el-radio :label="true">{{ $t('dynamic_time.dynamic') }}</el-radio>
+          <el-radio :label="true" :disabled="isTimeWidget && element.options.attrs.showTime">{{ $t('dynamic_time.dynamic') }}</el-radio>
         </el-radio-group>
       </el-form-item>
 
@@ -136,7 +136,8 @@
       <el-form-item v-if="element.options.attrs.default.isDynamic" :label="$t('dynamic_time.preview')">
         <el-date-picker
           v-model="dval"
-          :type="element.options.attrs.type"
+          :type="componentType"
+          :format="labelFormat"
           disabled
           class="relative-time"
           placeholder=""
@@ -177,6 +178,27 @@ export default {
       dval: null
     }
   },
+  computed: {
+
+    isTimeWidget() {
+      const widget = ApplicationContext.getService(this.element.serviceName)
+      return widget.isTimeWidget && widget.isTimeWidget()
+    },
+    componentType() {
+      let result = 'daterange'
+      if (this.isTimeWidget && this.element.options.attrs.showTime) {
+        result = 'datetimerange'
+      }
+      return result
+    },
+    labelFormat() {
+      const result = 'yyyy-MM-dd'
+      if (this.isTimeWidget && this.element.options.attrs.showTime && this.element.options.attrs.accuracy) {
+        return result + ' ' + this.element.options.attrs.accuracy
+      }
+      return result
+    }
+  },
   created() {
     this.setDval()
   },