From 928c61ccddebc8d2c697b86ee9bee0c207330a8c Mon Sep 17 00:00:00 2001
From: schangxiang@126.com <schangxiang@126.com>
Date: 周二, 06 5月 2025 07:18:22 +0800
Subject: [PATCH] 222
---
HIAWms/web/src/components/DateTimePickRange/DateTimePickRange.tsx | 91 +++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 91 insertions(+), 0 deletions(-)
diff --git a/HIAWms/web/src/components/DateTimePickRange/DateTimePickRange.tsx b/HIAWms/web/src/components/DateTimePickRange/DateTimePickRange.tsx
new file mode 100644
index 0000000..494c511
--- /dev/null
+++ b/HIAWms/web/src/components/DateTimePickRange/DateTimePickRange.tsx
@@ -0,0 +1,91 @@
+import { defineComponent, onMounted, reactive, ref, watch } from 'vue'
+import styles from './DateTimePickRange.module.scss'
+import dayjs from 'dayjs'
+import { ElMessage } from 'element-plus'
+export default defineComponent({
+ name: '鏃ユ湡鑼冨洿',
+ props: {
+ label: {
+ type: String,
+ default: '鏃堕棿鑼冨洿',
+ },
+ From: {
+ type: String,
+ default: '',
+ requred: true,
+ },
+ To: {
+ type: String,
+ default: '',
+ requred: true,
+ },
+ valueFormat: {
+ type: String,
+ default: 'YYYY-MM-DD HH:mm:ss',
+ },
+ clearable: {
+ type: Boolean,
+ default: true
+ }
+ },
+ emits: ['change'],
+ setup(props, { attrs, slots, emit }) {
+ // todo 鏀寔閰嶇疆榛樿鏃堕棿
+ const times = reactive({
+ From: '',
+ To: '',
+ })
+
+ onMounted(() => {
+ if (props.From) {
+ times.From = props.From
+ }
+ if (props.To) {
+ times.To = props.To
+ }
+ })
+
+ const onChangeFrom = (val: Date) => {
+ console.log(val)
+ if (times.To && dayjs(val).isAfter(times.To)) {
+ ElMessage.warning('寮�濮嬫椂闂村繀椤绘瘮缁撴潫鏃堕棿灏�')
+ return
+ }
+ emit('change', times)
+ }
+
+ const onChangeTo = (val: Date) => {
+ console.log(val);
+ if (times.To && dayjs(val).isBefore(times.From)) {
+ ElMessage.warning('寮�濮嬫椂闂村繀椤绘瘮缁撴潫鏃堕棿灏�')
+ return
+ }
+ emit('change', times)
+ }
+
+ return () => {
+ return (
+ <div class={styles.DateTimePickRange}>
+ <span class={styles.label}>{props.label}</span>
+ <el-date-picker
+ v-model={times.From}
+ type="datetime"
+ placeholder="璇烽�夋嫨寮�濮嬫椂闂�"
+ onChange={onChangeFrom}
+ valueFormat={props.valueFormat}
+ clearable={props.clearable}
+ />
+ <span class={styles.line}>-</span>
+ <el-date-picker
+ v-model={times.To}
+ type="datetime"
+ placeholder="璇烽�夋嫨缁撴潫鏃堕棿"
+ onChange={onChangeTo}
+ valueFormat={props.valueFormat}
+ clearable={props.clearable}
+ />
+ </div>
+ )
+ }
+ },
+})
--
Gitblit v1.9.3