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()
   },