diff --git a/src/components/DesignForm/public/expand/datePicker.vue b/src/components/DesignForm/public/expand/datePicker.vue
index dbf3ec6..249e9c2 100644
--- a/src/components/DesignForm/public/expand/datePicker.vue
+++ b/src/components/DesignForm/public/expand/datePicker.vue
@@ -23,6 +23,64 @@ const value = computed({
 		emits('update:modelValue', newVal)
 	},
 });
+
+
+const shichangShowFlag = computed(() => {
+    if(props.data.control.type=="datetimerange"||props.data.control.type=="daterange"){//monthrange
+		if(value.value){
+			return true
+		}else{
+			return false
+		}
+	}else{
+		return false
+	}
+})
+
+function calculateTimeDiff(startTimestamp: string, endTimestamp: string) {
+    // 解析时间戳为数字
+    const start = parseInt(startTimestamp, 10);
+    const end = parseInt(endTimestamp, 10);
+    
+    // 计算时间差（毫秒）并取绝对值
+    const diffMs = Math.abs(end - start);
+    
+    // 计算总分钟数并四舍五入
+    const totalMinutes = Math.round(diffMs / 60000);
+    
+    // 计算总小时数（带小数）
+    const totalHours = totalMinutes / 60;
+    
+    // 处理小时进位情况
+    if (totalHours < 24) {
+        // 不足一天：四舍五入到小时
+        return `${Math.round(totalHours)} 小时`;
+    } else {
+        // 计算完整天数
+        const days = Math.floor(totalHours / 24);
+        // 计算剩余小时数（四舍五入）
+        const remainingHours = Math.round(totalHours % 24);
+        
+        // 处理小时进位（当剩余小时为24时）
+        if (remainingHours === 24) {
+            return `${days + 1} 天 0 小时`;
+        }
+        return `${days} 天 ${remainingHours} 小时`;
+    }
+}
+
+
+const valueFormat = "x"
+
+const shichang = computed(() => {
+	console.log(value.value)
+	let start = value.value[0]
+	let end = value.value[1]
+	console.log(start)
+	console.log(end)
+	let a = calculateTimeDiff(start,end)
+	return a
+})
 </script>
 <template>
 	<el-date-picker
@@ -34,10 +92,29 @@ const value = computed({
 		end-placeholder="结束日期"
 		:teleported="true"
 		:placeholder="props.data.control.placeholder"
-		:value-format="props.data.valueFormat"
+		:value-format="valueFormat"
 		:format="props.data.control.format"
     />
 
+	
+		
+		
+		<!-- 2 天 3 小时 -->
+		<div v-if="shichangShowFlag" class="duration-text">时长 {{shichang}}</div>
+
+
+
 </template>
-<style  lang='scss' scoped>
+<style lang='scss' scoped>
+
+.duration-text {
+			margin-left: 20px;
+            margin-right: 60px;
+            color: #A8ABB2;
+            font-size: 13px;
+            z-index: 10;
+            pointer-events: none;
+            
+        }
+
 </style>