|
|
|
@ -621,6 +621,57 @@ function getTimestamp() { |
|
|
|
return timestamp; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 使用 computed 替代方法调用 |
|
|
|
const displayText = computed(() => { |
|
|
|
if (!props.modelValue) { |
|
|
|
hasValue.value = false |
|
|
|
return "请选择时间" |
|
|
|
} |
|
|
|
|
|
|
|
const val = new Date(parseInt(props.modelValue, 10)) |
|
|
|
if (isNaN(val.getTime())) { |
|
|
|
hasValue.value = false |
|
|
|
return "请选择时间" |
|
|
|
} |
|
|
|
|
|
|
|
hasValue.value = true |
|
|
|
return formatDate(val, props.data.control.type, props.data.control.valueFormat) |
|
|
|
}) |
|
|
|
|
|
|
|
// 提取格式化逻辑到独立函数 |
|
|
|
function formatDate(date: Date, group: string, format: string) { |
|
|
|
const validDate = dayJs(date) |
|
|
|
if (!validDate.isValid()) return "请选择时间" |
|
|
|
|
|
|
|
switch (group) { |
|
|
|
case "year": |
|
|
|
return format === "x" |
|
|
|
? validDate.format('YYYY') + "年" |
|
|
|
: validDate.format(format) + "年" |
|
|
|
case "month": |
|
|
|
return format === "x" |
|
|
|
? validDate.format('YYYY年MM月') |
|
|
|
: validDate.format(format) + "月" |
|
|
|
case "datetime": |
|
|
|
return format === "x" |
|
|
|
? validDate.format('YYYY年MM月DD日 HH时mm分ss秒') |
|
|
|
: validDate.format(format) |
|
|
|
case "week": |
|
|
|
return format === "x" |
|
|
|
? validDate.format('YYYY年 第ww周') |
|
|
|
: validDate.format(format) |
|
|
|
default: |
|
|
|
return format === "x" |
|
|
|
? validDate.format('YYYY年MM月DD日') |
|
|
|
: validDate.format(format) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</script> |
|
|
|
<template> |
|
|
|
|
|
|
|
@ -654,43 +705,41 @@ function getTimestamp() { |
|
|
|
|
|
|
|
|
|
|
|
<div v-if="selectType == 'single'" |
|
|
|
style="border: 0.5px solid #DCDFE6; padding-left: 10px; width: 100%;height: 97%;border-radius: 5px;" |
|
|
|
style="border: 1px solid #DCDFE6; padding-left: 10px; width: 100%;height: 97%;border-radius: 5px;" |
|
|
|
@click="singleShow"> |
|
|
|
<el-text v-if="hasValue" class="wordColor">{{ valPrint(value, props.data.control.type, |
|
|
|
props.data.control.valueFormat) |
|
|
|
}}</el-text> |
|
|
|
<el-text v-if="!hasValue" class="wordColor1">{{ valPrint(value, props.data.control.type, |
|
|
|
props.data.control.valueFormat) |
|
|
|
}}</el-text> |
|
|
|
<div v-if="hasValue" class="wordColor">{{ displayText |
|
|
|
}}</div> |
|
|
|
<div v-if="!hasValue" class="wordColor1">{{ displayText |
|
|
|
}}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 区间 --> |
|
|
|
<div v-if="selectType == 'range'" |
|
|
|
style="border: 0.5px solid #DCDFE6; padding-left: 10px; width: 46.5%;height: 97%;border-radius: 5px;" |
|
|
|
style="border: 1px solid #DCDFE6; padding-left: 10px; width: 46.5%;height: 97%;border-radius: 5px;" |
|
|
|
@click="rangeShowStart"> |
|
|
|
<el-text v-if="hasValue1" class="wordColor">{{ formatStart |
|
|
|
}}</el-text> |
|
|
|
<el-text v-if="!hasValue1" class="wordColor1">{{ formatStart |
|
|
|
}}</el-text> |
|
|
|
<div v-if="hasValue1" class="wordColor">{{ formatStart |
|
|
|
}}</div> |
|
|
|
<div v-if="!hasValue1" class="wordColor1">{{ formatStart |
|
|
|
}}</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-if="selectType == 'range'" |
|
|
|
style="border: 0px solid #DCDFE6; padding-left:1.5%; width: 7%;height: 97%;border-radius: 5px;"> |
|
|
|
<el-text class="wordColor">至</el-text> |
|
|
|
<div class="wordColor">至</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div v-if="selectType == 'range'" |
|
|
|
style="border: 0.5px solid #DCDFE6; padding-left: 10px; width: 46.5%;height: 97%;border-radius: 5px;" |
|
|
|
style="border: 1px solid #DCDFE6; padding-left: 10px; width: 46.5%;height: 97%;border-radius: 5px;" |
|
|
|
@click="rangeShowEnd"> |
|
|
|
<el-text v-if="hasValue2" class="wordColor">{{ formatEnd |
|
|
|
}}</el-text> |
|
|
|
<el-text v-if="!hasValue2" class="wordColor1">{{ formatEnd |
|
|
|
}}</el-text> |
|
|
|
<div v-if="hasValue2" class="wordColor">{{ formatEnd |
|
|
|
}}</div> |
|
|
|
<div v-if="!hasValue2" class="wordColor1">{{ formatEnd |
|
|
|
}}</div> |
|
|
|
</div> |
|
|
|
<!-- <div v-if="selectType == 'range'" |
|
|
|
style="border: 0px solid #DCDFE6; padding-left: 8px; width: 10%;height: 97%;border-radius: 5px;"> |
|
|
|
<el-text class="wordColor">时长:23天</el-text> |
|
|
|
<div class="wordColor">时长:23天</div> |
|
|
|
</div> --> |
|
|
|
<div v-if="selectType == 'range' && value[0] && value[1]" |
|
|
|
style="float:right;border: black 0px solid;position: absolute; pointer-events: none;bottom: -26px;color:#A8ABB2 ;width: 100%; font-size: smaller;"> |
|
|
|
|