vxe-pc-ui 4.15.23 → 4.15.25

package/dist/all.esm.js

@@ -81,7 +81,7 @@ function checkDynamic() {
 }
 
 const { log } = VxeUI;
-const uiVersion = `ui v${"4.15.23"}`;
+const uiVersion = `ui v${"4.15.25"}`;
 function createComponentLog(name) {
     const tableVersion = VxeUI.tableVersion ? `table v${VxeUI.tableVersion}` : '';
     const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -95,7 +95,7 @@ function createComponentLog(name) {
 const warnLog$g = log.create('warn', uiVersion);
 log.create('error', uiVersion);
 
-const version = "4.15.23";
+const version = "4.15.25";
 VxeUI.uiVersion = version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -2545,6 +2545,28 @@ function deModelValue(nodeid) {
     return nodeid ? decodeURIComponent(`${nodeid}`) : nodeid;
 }
 
+function createReactData$l() {
+    return {
+        target: null,
+        isUpdate: false,
+        visible: false,
+        tipPos: null,
+        tipContent: '',
+        tipActive: false,
+        tipTarget: null,
+        tipZindex: 0,
+        tipStore: {
+            style: {},
+            placement: '',
+            arrowStyle: {}
+        }
+    };
+}
+function createInternalData$k() {
+    return {
+    // showDelayTip: undefined
+    };
+}
 var VxeTooltipComponent = defineVxeComponent({
     name: 'VxeTooltip',
     props: {
@@ -2633,22 +2655,8 @@ var VxeTooltipComponent = defineVxeComponent({
         const { slots, emit } = context;
         const xID = XEUtils.uniqueId();
         const { computeSize } = useSize(props);
-        const reactData = reactive({
-            target: null,
-            isUpdate: false,
-            visible: false,
-            tipPos: null,
-            tipContent: '',
-            tipActive: false,
-            tipTarget: null,
-            tipZindex: 0,
-            tipStore: {
-                style: {},
-                placement: '',
-                arrowStyle: {}
-            }
-        });
-        const internalData = {};
+        const reactData = reactive(createReactData$l());
+        const internalData = createInternalData$k();
         const refElem = ref();
         const contentWrapperfElem = ref();
         const computeWrapperStyle = computed(() => {
@@ -3032,6 +3040,7 @@ var VxeTooltipComponent = defineVxeComponent({
             }
             reactData.isUpdate = false;
         });
+        handleDelayFn();
         onMounted(() => {
             const contentWrapperfEl = contentWrapperfElem.value;
             if (contentWrapperfEl) {
@@ -3090,7 +3099,10 @@ var VxeTooltipComponent = defineVxeComponent({
                 }
             }
         });
-        handleDelayFn();
+        onUnmounted(() => {
+            XEUtils.assign(reactData, createReactData$l());
+            XEUtils.assign(internalData, createInternalData$k());
+        });
         $xeTooltip.renderVN = renderVN;
         return $xeTooltip;
     },
@@ -3854,13 +3866,13 @@ dynamicApp.use(VxeButton);
 VxeUI.component(VxeButtonComponent);
 const Button = VxeButton;
 
-const { errLog: errLog$h } = createComponentLog('backtop');
-function createInternalData$i() {
+const { errLog: errLog$i } = createComponentLog('backtop');
+function createInternalData$j() {
     return {
         targetEl: null
     };
 }
-function createReactData$j() {
+function createReactData$k() {
     return {
         showBtn: false,
         backtopZindex: 0
@@ -3939,8 +3951,8 @@ var VxeBacktopComponent = defineVxeComponent({
         const xID = XEUtils.uniqueId();
         const refElem = ref();
         const { computeSize } = useSize(props);
-        const internalData = createInternalData$i();
-        const reactData = reactive(createReactData$j());
+        const internalData = createInternalData$j();
+        const reactData = reactive(createReactData$k());
         const refMaps = {
             refElem
         };
@@ -4032,13 +4044,13 @@ var VxeBacktopComponent = defineVxeComponent({
                 const { target } = props;
                 if (!target) {
                     removeScrollEvent();
-                    errLog$h('vxe.error.reqProp', ['target']);
+                    errLog$i('vxe.error.reqProp', ['target']);
                     return;
                 }
                 if (XEUtils.isString(target)) {
                     const tEl = document.querySelector(target);
                     if (!tEl) {
-                        errLog$h('vxe.error.errProp', [`target=${target}`, 'body']);
+                        errLog$i('vxe.error.errProp', [`target=${target}`, 'body']);
                     }
                     const { targetEl } = internalData;
                     if (targetEl !== tEl) {
@@ -4117,8 +4129,8 @@ var VxeBacktopComponent = defineVxeComponent({
         });
         onBeforeUnmount(() => {
             removeScrollEvent();
-            XEUtils.assign(reactData, createReactData$j());
-            XEUtils.assign(internalData, createInternalData$i());
+            XEUtils.assign(reactData, createReactData$k());
+            XEUtils.assign(internalData, createInternalData$j());
         });
         $xeBacktop.renderVN = renderVN;
         return $xeBacktop;
@@ -4560,7 +4572,7 @@ function parseDateValue(val, type, options) {
     const { valueFormat } = options;
     if (val) {
         if (type === 'time') {
-            return toStringTimeDate(val);
+            return toStringTimeDate(XEUtils.isArray(val) ? XEUtils.last(val) : val);
         }
         if (XEUtils.isNumber(val) || /^[0-9]{10,15}$/.test(`${val}`)) {
             return new Date(Number(val));
@@ -4568,6 +4580,9 @@ function parseDateValue(val, type, options) {
         if (XEUtils.isString(val)) {
             return XEUtils.toStringDate(XEUtils.last(val.split(',')), valueFormat);
         }
+        if (XEUtils.isArray(val)) {
+            return XEUtils.toStringDate(XEUtils.last(val), valueFormat);
+        }
         return XEUtils.toStringDate(val, valueFormat);
     }
     return null;
@@ -4738,8 +4753,42 @@ function checkDateInputFormat(numStr, formatKey) {
     }
     return numVal;
 }
+const getPrevYear = (date, size = 1) => {
+    const currtYear = date.getFullYear();
+    date.setFullYear(currtYear - size);
+    return date;
+};
+const getNextYear = (date, size = 1) => {
+    const currtYear = date.getFullYear();
+    date.setFullYear(currtYear + size);
+    return date;
+};
+const getPrevMonth = (date) => {
+    const currtYear = date.getFullYear();
+    const currMonth = date.getMonth();
+    if (currMonth) {
+        date.setMonth(currMonth - 1);
+    }
+    else {
+        date.setFullYear(currtYear - 1);
+        date.setMonth(11);
+    }
+    return date;
+};
+const getNextMonth = (date) => {
+    const currtYear = date.getFullYear();
+    const currMonth = date.getMonth();
+    if (currMonth < 11) {
+        date.setMonth(currMonth + 1);
+    }
+    else {
+        date.setFullYear(currtYear + 1);
+        date.setMonth(0);
+    }
+    return date;
+};
 
-const { errLog: errLog$g } = createComponentLog('calendar');
+const { errLog: errLog$h } = createComponentLog('calendar');
 const { menus: menus$2, getConfig: getConfig$2, getI18n: getI18n$1 } = VxeUI;
 var VxeCalendarComponent = defineVxeComponent({
     name: 'VxeCalendar',
@@ -6007,7 +6056,7 @@ var VxeCalendarComponent = defineVxeComponent({
             const { menuConfig } = props;
             const VxeUIContextMenu = VxeUI.getComponent('VxeContextMenu');
             if (menuConfig && !VxeUIContextMenu) {
-                errLog$g('vxe.error.reqComp', ['vxe-context-menu']);
+                errLog$h('vxe.error.reqComp', ['vxe-context-menu']);
             }
             dateOpenPanel();
         });
@@ -6820,7 +6869,7 @@ function clearRowAnimate(elem, clss) {
     }, 500);
 }
 
-const { errLog: errLog$f } = createComponentLog('tree');
+const { errLog: errLog$g } = createComponentLog('tree');
 function getRowKeyByField(row, keyField) {
     return row ? ('' + (row[keyField] || '')) : '';
 }
@@ -6831,7 +6880,7 @@ function getRowIdByField(row, keyField) {
     const rowKey = getRowKeyByField(row, keyField);
     return enModelValue(rowKey);
 }
-function createReactData$i() {
+function createReactData$j() {
     return {
         scrollYLoad: false,
         bodyHeight: 0,
@@ -6851,7 +6900,7 @@ function createReactData$i() {
         dragTipText: ''
     };
 }
-function createInternalData$h() {
+function createInternalData$i() {
     return {
         resizeObserver: undefined,
         fullData: [],
@@ -6924,8 +6973,8 @@ var VxeListComponent = defineVxeComponent({
         const xID = XEUtils.uniqueId();
         const browseObj = XEUtils.browse();
         const { computeSize } = useSize(props);
-        const reactData = reactive(createReactData$i());
-        const internalData = createInternalData$h();
+        const reactData = reactive(createReactData$j());
+        const internalData = createInternalData$i();
         const crossListDragRowInfo = getCrossListDragRowInfo();
         const refElem = ref();
         const refHeaderElem = ref();
@@ -8317,17 +8366,17 @@ var VxeListComponent = defineVxeComponent({
             const keyField = computeKeyField.value;
             if (!keyField) {
                 if (showRadio) {
-                    errLog$f('vxe.error.reqSupportProp', ['show-radio', 'row-config.keyField']);
+                    errLog$g('vxe.error.reqSupportProp', ['show-radio', 'row-config.keyField']);
                 }
                 if (showCheckbox) {
-                    errLog$f('vxe.error.reqSupportProp', ['show-checkbox', 'row-config.keyField']);
+                    errLog$g('vxe.error.reqSupportProp', ['show-checkbox', 'row-config.keyField']);
                 }
                 if (isDrag) {
-                    errLog$f('vxe.error.reqSupportProp', ['drag-config', 'row-config.keyField']);
+                    errLog$g('vxe.error.reqSupportProp', ['drag-config', 'row-config.keyField']);
                 }
             }
             if (useKey && !keyField) {
-                errLog$f('vxe.error.reqSupportProp', ['row-config.useKey', 'row-config.keyField']);
+                errLog$g('vxe.error.reqSupportProp', ['row-config.useKey', 'row-config.keyField']);
             }
             if (props.autoResize) {
                 const el = refElem.value;
@@ -8347,8 +8396,8 @@ var VxeListComponent = defineVxeComponent({
                 resizeObserver.disconnect();
             }
             globalEvents.off($xeList, 'resize');
-            XEUtils.assign(reactData, createReactData$i());
-            XEUtils.assign(internalData, createInternalData$h());
+            XEUtils.assign(reactData, createReactData$j());
+            XEUtils.assign(internalData, createInternalData$i());
         });
         $xeList.renderVN = renderVN;
         return $xeList;
@@ -11079,7 +11128,7 @@ const Input = VxeInput;
 function getNodeUniqueId$1() {
     return XEUtils.uniqueId('node_');
 }
-function createReactData$h() {
+function createReactData$i() {
     return {
         initialized: false,
         searchValue: '',
@@ -11102,7 +11151,7 @@ function createReactData$h() {
         lazyOptFlag: 1
     };
 }
-function createInternalData$g() {
+function createInternalData$h() {
     return {
         // hpTimeout: undefined,
         listVirtualYOpts: {
@@ -11229,8 +11278,8 @@ var VxeCascaderComponent = defineVxeComponent({
         const refInpSearch = ref();
         const refChunkWrapper = ref();
         const refOptionPanel = ref();
-        const reactData = reactive(createReactData$h());
-        const internalData = createInternalData$g();
+        const reactData = reactive(createReactData$i());
+        const internalData = createInternalData$h();
         const refMaps = {
             refElem
         };
@@ -12802,7 +12851,8 @@ var VxeCascaderComponent = defineVxeComponent({
             globalEvents.off($xeCascader, 'mousedown');
             globalEvents.off($xeCascader, 'blur');
             globalEvents.off($xeCascader, 'resize');
-            XEUtils.assign(internalData, createInternalData$g());
+            XEUtils.assign(reactData, createReactData$i());
+            XEUtils.assign(internalData, createInternalData$h());
         });
         provide('$xeCascader', $xeCascader);
         $xeCascader.renderVN = renderVN;
@@ -13206,10 +13256,10 @@ dynamicApp.use(VxeCheckboxButton);
 VxeUI.component(VxeCheckboxButtonComponent);
 const CheckboxButton = VxeCheckboxButton;
 
-function createReactData$g() {
+function createReactData$h() {
     return {};
 }
-function createInternalData$f() {
+function createInternalData$g() {
     return {
     // isLoaded: false
     };
@@ -13252,8 +13302,8 @@ var VxeCheckboxGroupComponent = defineVxeComponent({
         const $xeForm = inject('$xeForm', null);
         const formItemInfo = inject('xeFormItemInfo', null);
         const xID = XEUtils.uniqueId();
-        const reactData = reactive(createReactData$g());
-        const internalData = createInternalData$f();
+        const reactData = reactive(createReactData$h());
+        const internalData = createInternalData$g();
         const computeIsReadonly = computed(() => {
             const { readonly } = props;
             if (readonly === null) {
@@ -13425,8 +13475,8 @@ var VxeCheckboxGroupComponent = defineVxeComponent({
             });
         });
         onUnmounted(() => {
-            XEUtils.assign(reactData, createReactData$g());
-            XEUtils.assign(internalData, createInternalData$f());
+            XEUtils.assign(reactData, createReactData$h());
+            XEUtils.assign(internalData, createInternalData$g());
         });
         provide('$xeCheckboxGroup', $xeCheckboxGroup);
         $xeCheckboxGroup.renderVN = renderVN;
@@ -13559,7 +13609,7 @@ dynamicApp.use(VxeCol);
 VxeUI.component(VxeColComponent);
 const Col = VxeCol;
 
-function createReactData$f() {
+function createReactData$g() {
     return {
         staticPanes: [],
         cachePaneMaps: {},
@@ -13567,7 +13617,7 @@ function createReactData$f() {
         openKeyFlag: 0
     };
 }
-function createInternalData$e() {
+function createInternalData$f() {
     return {
         // esTime: null,
         activeKeyMaps: {},
@@ -13604,8 +13654,8 @@ var VxeCollapseComponent = defineVxeComponent({
         const xID = XEUtils.uniqueId();
         const { computeSize } = useSize(props);
         const refElem = ref();
-        const reactData = reactive(createReactData$f());
-        const internalData = createInternalData$e();
+        const reactData = reactive(createReactData$g());
+        const internalData = createInternalData$f();
         const refMaps = {
             refElem
         };
@@ -13884,8 +13934,8 @@ var VxeCollapseComponent = defineVxeComponent({
             if (esTime) {
                 clearTimeout(esTime);
             }
-            XEUtils.assign(reactData, createReactData$f());
-            XEUtils.assign(internalData, createInternalData$e());
+            XEUtils.assign(reactData, createReactData$g());
+            XEUtils.assign(internalData, createInternalData$f());
         });
         provide('$xeCollapse', $xeCollapse);
         $xeCollapse.renderVN = renderVN;
@@ -16270,12 +16320,12 @@ dynamicApp.use(VxeColorPicker);
 VxeUI.component(VxeColorPickerComponent);
 const ColorPicker = VxeColorPicker;
 
-function createInternalData$d() {
+function createInternalData$e() {
     return {
     // leaveTime: null
     };
 }
-function createReactData$e() {
+function createReactData$f() {
     return {
         visible: false,
         activeOption: null,
@@ -16330,8 +16380,8 @@ var VxeContextMenuComponent = defineVxeComponent({
         const xID = XEUtils.uniqueId();
         const refElem = ref();
         const { computeSize } = useSize(props);
-        const internalData = createInternalData$d();
-        const reactData = reactive(createReactData$e());
+        const internalData = createInternalData$e();
+        const reactData = reactive(createReactData$f());
         const refMaps = {
             refElem
         };
@@ -16886,8 +16936,8 @@ var VxeContextMenuComponent = defineVxeComponent({
             globalEvents.off($xeContextMenu, 'keydown');
             globalEvents.off($xeContextMenu, 'mousedown');
             globalEvents.off($xeContextMenu, 'blur');
-            XEUtils.assign(reactData, createReactData$e());
-            XEUtils.assign(internalData, createInternalData$d());
+            XEUtils.assign(reactData, createReactData$f());
+            XEUtils.assign(internalData, createInternalData$e());
         });
         $xeContextMenu.renderVN = renderVN;
         return $xeContextMenu;
@@ -17390,10 +17440,11 @@ dynamicApp.use(VxeCountdown);
 VxeUI.component(VxeCountdownComponent);
 const Countdown = VxeCountdown;
 
+const { errLog: errLog$f } = createComponentLog('date-panel');
 var VxeDatePanelComponent = defineVxeComponent({
     name: 'VxeDatePanel',
     props: {
-        modelValue: [String, Number, Date],
+        modelValue: [String, Number, Date, Array],
         type: {
             type: String,
             default: 'date'
@@ -17418,6 +17469,7 @@ var VxeDatePanelComponent = defineVxeComponent({
             type: [String, Number, Date],
             default: () => getConfig$3().datePanel.endDate
         },
+        defaultMode: String,
         defaultDate: [String, Number, Date],
         defaultTime: [String, Number, Date],
         minDate: [String, Number, Date],
@@ -17429,6 +17481,7 @@ var VxeDatePanelComponent = defineVxeComponent({
         labelFormat: String,
         valueFormat: String,
         timeFormat: String,
+        valueSort: Boolean,
         festivalMethod: {
             type: Function,
             default: () => getConfig$3().datePanel.festivalMethod
@@ -17473,32 +17526,26 @@ var VxeDatePanelComponent = defineVxeComponent({
             currentDate: null
         });
         const internalData = {
-            yearSize: 12,
-            monthSize: 20,
-            quarterSize: 8,
+            yearSize: 16,
+            monthSize: 12,
+            quarterSize: 4,
             hpTimeout: undefined
         };
         const refElem = ref();
         const refPanelWrapper = ref();
         const refInputTimeBody = ref();
-        const refMaps = {
-            refElem
-        };
-        const $xeDatePanel = {
-            xID,
-            props,
-            context,
-            reactData,
-            internalData,
-            getRefMaps: () => refMaps
-        };
-        const computeIsDateTimeType = computed(() => {
+        const computeIsTimeType = computed(() => {
             const { type } = props;
-            return type === 'time' || type === 'datetime';
+            return type === 'time';
+        });
+        const computeIsTimeOrDateTimeType = computed(() => {
+            const { type } = props;
+            const isTimeType = computeIsTimeType.value;
+            return isTimeType || type === 'datetime';
         });
         const computeIsDatePanelType = computed(() => {
-            const isDateTimeType = computeIsDateTimeType.value;
-            return isDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            return isTimeOrDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1;
         });
         const computeDateStartDate = computed(() => {
             return props.startDate ? XEUtils.toStringDate(props.startDate) : null;
@@ -17507,19 +17554,25 @@ var VxeDatePanelComponent = defineVxeComponent({
             return props.endDate ? XEUtils.toStringDate(props.endDate) : null;
         });
         const computeDateListValue = computed(() => {
-            const { modelValue, multiple } = props;
+            const { modelValue, valueFormat } = props;
             const isDatePanelType = computeIsDatePanelType.value;
             const dateValueFormat = computeDateValueFormat.value;
-            if (multiple && modelValue && isDatePanelType) {
-                return XEUtils.toValueString(modelValue).split(',').map(item => {
-                    const date = parseDate(item, dateValueFormat);
-                    if (XEUtils.isValidDate(date)) {
-                        return date;
+            const restList = [];
+            if (modelValue && isDatePanelType) {
+                (XEUtils.isArray(modelValue) ? modelValue : XEUtils.toValueString(modelValue).split(',')).forEach(val => {
+                    let strVal = val;
+                    if (val) {
+                        if (valueFormat === 'timestamp') {
+                            if (XEUtils.isString(val) && /^\d+$/.test(val)) {
+                                strVal = Number(strVal);
+                            }
+                        }
+                        const date = parseDate(strVal, dateValueFormat);
+                        restList.push(date);
                     }
-                    return date;
                 });
             }
-            return [];
+            return restList;
         });
         const computeDateMultipleValue = computed(() => {
             const dateListValue = computeDateListValue.value;
@@ -17551,12 +17604,14 @@ var VxeDatePanelComponent = defineVxeComponent({
             return handleValueFormat(type, valueFormat);
         });
         const computeDateValue = computed(() => {
-            const { modelValue } = props;
+            const { modelValue, defaultMode } = props;
             const isDatePanelType = computeIsDatePanelType.value;
             const dateValueFormat = computeDateValueFormat.value;
             let val = null;
             if (modelValue && isDatePanelType) {
-                const date = parseDate(modelValue, dateValueFormat);
+                const vals = XEUtils.isString(modelValue) ? modelValue.split(',') : modelValue;
+                const currVal = defaultMode === 'last' ? XEUtils.last(vals) : XEUtils.first(vals);
+                const date = parseDate(currVal, dateValueFormat);
                 if (XEUtils.isValidDate(date)) {
                     val = date;
                 }
@@ -17590,8 +17645,8 @@ var VxeDatePanelComponent = defineVxeComponent({
         });
         const computeDateHMSTime = computed(() => {
             const dateValue = computeDateValue.value;
-            const isDateTimeType = computeIsDateTimeType.value;
-            return dateValue && isDateTimeType ? (dateValue.getHours() * 3600 + dateValue.getMinutes() * 60 + dateValue.getSeconds()) * 1000 : 0;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            return dateValue && isTimeOrDateTimeType ? (dateValue.getHours() * 3600 + dateValue.getMinutes() * 60 + dateValue.getSeconds()) * 1000 : 0;
         });
         const computeDateLabelFormat = computed(() => {
             const { labelFormat } = props;
@@ -17609,7 +17664,7 @@ var VxeDatePanelComponent = defineVxeComponent({
                 const currFullYear = currentDate.getFullYear();
                 const selectFullYear = selectMonth.getFullYear();
                 const startYearDate = new Date(selectFullYear - selectFullYear % yearSize, 0, 1);
-                for (let index = -4; index < yearSize + 4; index++) {
+                for (let index = 0; index < yearSize; index++) {
                     const date = XEUtils.getWhatYear(startYearDate, index, 'first');
                     const itemFullYear = date.getFullYear();
                     years.push({
@@ -17709,7 +17764,7 @@ var VxeDatePanelComponent = defineVxeComponent({
                 const currQuarter = getDateQuarter(currentDate);
                 const firstYear = XEUtils.getWhatYear(selectMonth, 0, 'first');
                 const selFullYear = firstYear.getFullYear();
-                for (let index = -2; index < quarterSize - 2; index++) {
+                for (let index = 0; index < quarterSize; index++) {
                     const date = XEUtils.getWhatQuarter(firstYear, index);
                     const itemFullYear = date.getFullYear();
                     const itemQuarter = getDateQuarter(date);
@@ -17738,7 +17793,7 @@ var VxeDatePanelComponent = defineVxeComponent({
                 const currFullYear = currentDate.getFullYear();
                 const currMonth = currentDate.getMonth();
                 const selFullYear = XEUtils.getWhatYear(selectMonth, 0, 'first').getFullYear();
-                for (let index = -4; index < monthSize - 4; index++) {
+                for (let index = 0; index < monthSize; index++) {
                     const date = XEUtils.getWhatYear(selectMonth, 0, index);
                     const itemFullYear = date.getFullYear();
                     const itemMonth = date.getMonth();
@@ -17816,8 +17871,8 @@ var VxeDatePanelComponent = defineVxeComponent({
             const timeOpts = computeTimeOpts.value;
             const { hours: hourOptions, hourDisabledMethod } = timeOpts;
             const list = [];
-            const isDateTimeType = computeIsDateTimeType.value;
-            if (isDateTimeType) {
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            if (isTimeOrDateTimeType) {
                 if (hourOptions && hourOptions.length) {
                     hourOptions.forEach(item => {
                         if (XEUtils.isNumber(item) || XEUtils.isString(item)) {
@@ -17855,8 +17910,8 @@ var VxeDatePanelComponent = defineVxeComponent({
             const timeOpts = computeTimeOpts.value;
             const { minutes: minuteOptions, minuteDisabledMethod } = timeOpts;
             const list = [];
-            const isDateTimeType = computeIsDateTimeType.value;
-            if (isDateTimeType) {
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            if (isTimeOrDateTimeType) {
                 if (minuteOptions && minuteOptions.length) {
                     minuteOptions.forEach(item => {
                         if (XEUtils.isNumber(item) || XEUtils.isString(item)) {
@@ -17904,8 +17959,8 @@ var VxeDatePanelComponent = defineVxeComponent({
             const timeOpts = computeTimeOpts.value;
             const { seconds: secondOptions, secondDisabledMethod } = timeOpts;
             const list = [];
-            const isDateTimeType = computeIsDateTimeType.value;
-            if (isDateTimeType) {
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            if (isTimeOrDateTimeType) {
                 if (secondOptions && secondOptions.length) {
                     secondOptions.forEach(item => {
                         if (XEUtils.isNumber(item) || XEUtils.isString(item)) {
@@ -17939,6 +17994,22 @@ var VxeDatePanelComponent = defineVxeComponent({
             }
             return list;
         });
+        const refMaps = {
+            refElem
+        };
+        const computeMaps = {
+            computeSize,
+            computeYearList
+        };
+        const $xeDatePanel = {
+            xID,
+            props,
+            context,
+            reactData,
+            internalData,
+            getRefMaps: () => refMaps,
+            getComputeMaps: () => computeMaps
+        };
         const updateModelValue = (modelValue) => {
             const { type } = props;
             const dateValueFormat = computeDateValueFormat.value;
@@ -17950,10 +18021,10 @@ var VxeDatePanelComponent = defineVxeComponent({
         const parseDate = (value, format) => {
             const { type, multiple } = props;
             if (type === 'time') {
-                return toStringTimeDate(value);
+                return toStringTimeDate(XEUtils.isArray(value) ? XEUtils.last(value) : value);
             }
             if (XEUtils.isArray(value)) {
-                return XEUtils.toStringDate(value[0], format);
+                return XEUtils.toStringDate(XEUtils.last(value), format);
             }
             if (XEUtils.isString(value)) {
                 return XEUtils.toStringDate(multiple ? XEUtils.last(value.split(',')) : value, format);
@@ -18022,7 +18093,7 @@ var VxeDatePanelComponent = defineVxeComponent({
             reactData.inputValue = value;
             emit('update:modelValue', value);
         };
-        const handleChange = (value, evnt) => {
+        const handleChange = (value, evnt, params) => {
             const { type, modelValue, valueFormat } = props;
             const dateValueFormat = computeDateValueFormat.value;
             reactData.inputLabel = value;
@@ -18031,20 +18102,20 @@ var VxeDatePanelComponent = defineVxeComponent({
                 const timeNum = dateVal ? dateVal.getTime() : null;
                 emitModel(timeNum);
                 if (modelValue !== timeNum) {
-                    dispatchEvent('change', { value: timeNum }, evnt);
+                    dispatchEvent('change', { value: timeNum, currValue: params ? params.currValue : '' }, evnt);
                 }
             }
             else if (hasDateValueType(valueFormat)) {
                 const dateVal = parseDateValue(value, type, { valueFormat: dateValueFormat });
                 emitModel(dateVal);
                 if (modelValue && dateVal ? XEUtils.toStringDate(modelValue).getTime() !== dateVal.getTime() : modelValue !== dateVal) {
-                    dispatchEvent('change', { value: dateVal }, evnt);
+                    dispatchEvent('change', { value: dateVal, currValue: params ? params.currValue : '' }, evnt);
                 }
             }
             else {
                 emitModel(value);
                 if (XEUtils.toValueString(modelValue) !== value) {
-                    dispatchEvent('change', { value }, evnt);
+                    dispatchEvent('change', { value, currValue: params ? params.currValue : '' }, evnt);
                 }
             }
         };
@@ -18102,16 +18173,17 @@ var VxeDatePanelComponent = defineVxeComponent({
             }
         };
         const dateChange = (date, isReload) => {
-            const { modelValue, multiple } = props;
+            const { modelValue, multiple, valueSort } = props;
             const { datetimePanelValue } = reactData;
-            const isDateTimeType = computeIsDateTimeType.value;
+            const isTimeType = computeIsTimeType.value;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
             const dateValueFormat = computeDateValueFormat.value;
             const firstDayOfWeek = computeFirstDayOfWeek.value;
             if (props.type === 'week') {
                 const sWeek = XEUtils.toNumber(props.selectDay);
                 date = XEUtils.getWhatWeek(date, 0, sWeek, firstDayOfWeek);
             }
-            else if (isDateTimeType) {
+            else if (isTimeOrDateTimeType) {
                 if (datetimePanelValue) {
                     date.setHours(datetimePanelValue.getHours());
                     date.setMinutes(datetimePanelValue.getMinutes());
@@ -18120,13 +18192,13 @@ var VxeDatePanelComponent = defineVxeComponent({
             }
             const inpVal = XEUtils.toDateString(date, dateValueFormat, { firstDay: firstDayOfWeek });
             dateCheckMonth(date);
-            if (multiple) {
+            if (!isTimeType && multiple) {
                 const overCount = computeOverCount.value;
                 // 如果为多选
-                if (isDateTimeType) {
+                if (isTimeOrDateTimeType) {
                     // 如果是datetime特殊类型
                     const dateListValue = isReload ? [] : [...computeDateListValue.value];
-                    const datetimeRest = [];
+                    let datetimeRest = [];
                     const eqIndex = XEUtils.findIndexOf(dateListValue, val => XEUtils.isDateSame(date, val, 'yyyyMMdd'));
                     if (eqIndex === -1) {
                         if (overCount) {
@@ -18148,27 +18220,37 @@ var VxeDatePanelComponent = defineVxeComponent({
                             datetimeRest.push(item);
                         }
                     });
-                    handleChange(datetimeRest.map(date => XEUtils.toDateString(date, dateValueFormat)).join(','), { type: 'update' });
+                    // 排序
+                    if (valueSort) {
+                        datetimeRest = datetimeRest.sort((a, b) => a.getTime() - b.getTime());
+                    }
+                    handleChange(datetimeRest.map(date => XEUtils.toDateString(date, dateValueFormat)).join(','), { type: 'update' }, { currValue: inpVal });
                 }
                 else {
                     const dateMultipleValue = isReload ? [] : computeDateMultipleValue.value;
+                    let dateRest = [];
                     // 如果是日期类型
                     if (dateMultipleValue.some(val => XEUtils.isEqual(val, inpVal))) {
-                        handleChange(dateMultipleValue.filter(val => !XEUtils.isEqual(val, inpVal)).join(','), { type: 'update' });
+                        dateRest = dateMultipleValue.filter(val => !XEUtils.isEqual(val, inpVal));
                     }
                     else {
                         if (overCount) {
                             // 如果超出最大多选数量
                             return;
                         }
-                        handleChange(dateMultipleValue.concat([inpVal]).join(','), { type: 'update' });
+                        dateRest = dateMultipleValue.concat([inpVal]);
                     }
+                    // 排序
+                    if (valueSort) {
+                        dateRest = dateRest.sort();
+                    }
+                    handleChange(dateRest.join(','), { type: 'update' }, { currValue: inpVal });
                 }
             }
             else {
                 // 如果为单选
                 if (!XEUtils.isEqual(modelValue, inpVal)) {
-                    handleChange(inpVal, { type: 'update' });
+                    handleChange(inpVal, { type: 'update' }, { currValue: inpVal });
                 }
             }
         };
@@ -18449,19 +18531,21 @@ var VxeDatePanelComponent = defineVxeComponent({
         };
         const dateConfirmEvent = (evnt) => {
             const { multiple } = props;
-            const { datetimePanelValue } = reactData;
+            const { datetimePanelValue, currentDate } = reactData;
             const dateValue = computeDateValue.value;
-            const isDateTimeType = computeIsDateTimeType.value;
-            if (isDateTimeType) {
+            const isTimeType = computeIsTimeType.value;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            if (isTimeOrDateTimeType) {
                 const dateValueFormat = computeDateValueFormat.value;
-                if (multiple) {
+                if (!isTimeType && multiple) {
                     // 如果为多选
                     const dateMultipleValue = computeDateMultipleValue.value;
-                    if (isDateTimeType) {
+                    const dateListValue = computeDateListValue.value;
+                    if (isTimeOrDateTimeType) {
                         // 如果是datetime特殊类型
-                        const dateListValue = [...computeDateListValue.value];
+                        const listVals = dateListValue.length ? [...dateListValue] : [];
                         const datetimeRest = [];
-                        dateListValue.forEach(item => {
+                        listVals.forEach(item => {
                             if (item) {
                                 if (datetimePanelValue) {
                                     item.setHours(datetimePanelValue.getHours());
@@ -18479,7 +18563,7 @@ var VxeDatePanelComponent = defineVxeComponent({
                     }
                 }
                 else {
-                    dateChange(dateValue || reactData.currentDate);
+                    dateChange(dateValue || currentDate);
                 }
             }
             hidePanel();
@@ -18505,7 +18589,7 @@ var VxeDatePanelComponent = defineVxeComponent({
         };
         const dateOpenPanel = () => {
             const { type, defaultDate, defaultTime } = props;
-            const isDateTimeType = computeIsDateTimeType.value;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
             const dateValue = computeDateValue.value;
             if (['year', 'quarter', 'month', 'week'].indexOf(type) > -1) {
                 reactData.datePanelType = type;
@@ -18533,7 +18617,7 @@ var VxeDatePanelComponent = defineVxeComponent({
                     dateNowHandle();
                 }
             }
-            if (isDateTimeType) {
+            if (isTimeOrDateTimeType) {
                 let dtPanelValue = reactData.datePanelValue;
                 if (!dtPanelValue) {
                     dtPanelValue = XEUtils.getWhatDay(Date.now(), 0, 'first');
@@ -18563,6 +18647,10 @@ var VxeDatePanelComponent = defineVxeComponent({
             getModelValue() {
                 return reactData.inputValue;
             },
+            getViewType() {
+                const { datePanelType } = reactData;
+                return datePanelType;
+            },
             setPanelDate(date) {
                 if (date) {
                     dateCheckMonth(date);
@@ -19136,6 +19224,12 @@ var VxeDatePanelComponent = defineVxeComponent({
         });
         initValue();
         dateOpenPanel();
+        onMounted(() => {
+            const { type, multiple } = props;
+            if (multiple && type === 'time') {
+                errLog$f('vxe.error.notSupportProp', [`type=${type}`, 'multiple=true', 'multiple=false']);
+            }
+        });
         $xeDatePanel.renderVN = renderVN;
         return $xeDatePanel;
     },
@@ -19161,7 +19255,7 @@ const parseInputKayMaps = {};
 inputMaskedKeys.forEach(key => {
     parseInputKayMaps[key] = true;
 });
-function createReactData$d() {
+function createReactData$e() {
     return {
         initialized: false,
         panelIndex: 0,
@@ -19174,7 +19268,7 @@ function createReactData$d() {
         labelFlag: 0
     };
 }
-function createInternalData$c() {
+function createInternalData$d() {
     return {
         // hpTimeout: undefined,
         // fsTimeout: undefined,
@@ -19314,8 +19408,8 @@ var VxeDatePickerComponent = defineVxeComponent({
         const formItemInfo = inject('xeFormItemInfo', null);
         const xID = XEUtils.uniqueId();
         const { computeSize } = useSize(props);
-        const reactData = reactive(createReactData$d());
-        const internalData = createInternalData$c();
+        const reactData = reactive(createReactData$e());
+        const internalData = createInternalData$d();
         const refElem = ref();
         const refInputTarget = ref();
         const refInputPanel = ref();
@@ -19370,20 +19464,25 @@ var VxeDatePickerComponent = defineVxeComponent({
             }
             return disabled;
         });
-        const computeIsDateTimeType = computed(() => {
+        const computeIsTimeType = computed(() => {
             const { type } = props;
-            return type === 'time' || type === 'datetime';
+            return type === 'time';
+        });
+        const computeIsTimeOrDateTimeType = computed(() => {
+            const { type } = props;
+            const isTimeType = computeIsTimeType.value;
+            return isTimeType || type === 'datetime';
         });
         const computeIsDatePickerType = computed(() => {
-            const isDateTimeType = computeIsDateTimeType.value;
-            return isDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            return isTimeOrDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1;
         });
         const computeIsClearable = computed(() => {
             return props.clearable;
         });
         const computeIsDatePanelType = computed(() => {
-            const isDateTimeType = computeIsDateTimeType.value;
-            return isDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
+            return isTimeOrDateTimeType || ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1;
         });
         const computeDateListValue = computed(() => {
             const { modelValue, type, multiple } = props;
@@ -19597,7 +19696,7 @@ var VxeDatePickerComponent = defineVxeComponent({
         };
         const dateChange = (date, isReload) => {
             const { modelValue, multiple } = props;
-            const isDateTimeType = computeIsDateTimeType.value;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
             const dateValueFormat = computeDateValueFormat.value;
             const firstDayOfWeek = computeFirstDayOfWeek.value;
             if (props.type === 'week') {
@@ -19608,7 +19707,7 @@ var VxeDatePickerComponent = defineVxeComponent({
             if (multiple) {
                 const overCount = computeOverCount.value;
                 // 如果为多选
-                if (isDateTimeType) {
+                if (isTimeOrDateTimeType) {
                     // 如果是datetime特殊类型
                     const dateListValue = [...computeDateListValue.value];
                     const datetimeRest = [];
@@ -20161,9 +20260,9 @@ var VxeDatePickerComponent = defineVxeComponent({
         const panelChangeEvent = (params) => {
             const { multiple, autoClose } = props;
             const { value, $event } = params;
-            const isDateTimeType = computeIsDateTimeType.value;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
             handleChange(value, $event);
-            if (!multiple && !isDateTimeType) {
+            if (!multiple && !isTimeOrDateTimeType) {
                 if (autoClose) {
                     hidePanel();
                 }
@@ -20447,7 +20546,7 @@ var VxeDatePickerComponent = defineVxeComponent({
             const btnTransfer = computeBtnTransfer.value;
             const shortcutOpts = computeShortcutOpts.value;
             const isClearable = computeIsClearable.value;
-            const isDateTimeType = computeIsDateTimeType.value;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
             const shortcutList = computeShortcutList.value;
             const timeOpts = computeTimeOpts.value;
             const dateStartDate = computeDateStartDate.value;
@@ -20461,7 +20560,7 @@ var VxeDatePickerComponent = defineVxeComponent({
             const rightSlot = slots.right;
             const ppClassName = popupOpts.className;
             const hasShortcutBtn = shortcutList.length > 0;
-            const showConfirmBtn = (showConfirmButton === null ? (isDateTimeType || multiple) : showConfirmButton);
+            const showConfirmBtn = (showConfirmButton === null ? (isTimeOrDateTimeType || multiple) : showConfirmButton);
             const showClearBtn = (showClearButton === null ? (isClearable && showConfirmBtn && type !== 'time') : showClearButton);
             return h(Teleport, {
                 to: 'body',
@@ -20717,6 +20816,7 @@ var VxeDatePickerComponent = defineVxeComponent({
         watch(() => props.modelValue, () => {
             updateModelValue();
         });
+        updateModelValue();
         nextTick(() => {
             globalEvents.on($xeDatePicker, 'mousewheel', handleGlobalMousewheelEvent);
             globalEvents.on($xeDatePicker, 'mousedown', handleGlobalMousedownEvent);
@@ -20741,8 +20841,9 @@ var VxeDatePickerComponent = defineVxeComponent({
             globalEvents.off($xeDatePicker, 'keydown');
             globalEvents.off($xeDatePicker, 'blur');
             globalEvents.off($xeDatePicker, 'resize');
+            XEUtils.assign(reactData, createReactData$e());
+            XEUtils.assign(internalData, createInternalData$d());
         });
-        updateModelValue();
         provide('$xeDatePicker', $xeDatePicker);
         $xeDatePicker.renderVN = renderVN;
         return $xeDatePicker;
@@ -20762,6 +20863,27 @@ VxeUI.component(VxeDatePickerComponent);
 const DatePicker = VxeDatePicker;
 
 const { errLog: errLog$d } = createComponentLog('date-range-picker');
+function createReactData$d() {
+    return {
+        initialized: false,
+        panelIndex: 0,
+        visiblePanel: false,
+        isAniVisible: false,
+        panelStyle: {},
+        panelPlacement: '',
+        isActivated: false,
+        selectStValue: '',
+        selectEdValue: '',
+        paneStartVal: [],
+        paneEndVal: []
+    };
+}
+function createInternalData$c() {
+    return {
+    // selectStatus: false
+    // hpTimeout: undefined
+    };
+}
 var VxeDateRangePickerComponent = defineVxeComponent({
     name: 'VxeDateRangePicker',
     props: {
@@ -20898,21 +21020,8 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         const formItemInfo = inject('xeFormItemInfo', null);
         const xID = XEUtils.uniqueId();
         const { computeSize } = useSize(props);
-        const reactData = reactive({
-            initialized: false,
-            panelIndex: 0,
-            visiblePanel: false,
-            isAniVisible: false,
-            panelStyle: {},
-            panelPlacement: '',
-            isActivated: false,
-            startValue: '',
-            endValue: ''
-        });
-        const internalData = {
-        // selectStatus: false
-        // hpTimeout: undefined
-        };
+        const reactData = reactive(createReactData$d());
+        const internalData = createInternalData$c();
         const refElem = ref();
         const refInputTarget = ref();
         const refInputPanel = ref();
@@ -20999,9 +21108,14 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             const { startValue, endValue } = props;
             return `${startValue || ''}${endValue || ''}`;
         });
-        const computeIsDateTimeType = computed(() => {
+        const computeIsTimeType = computed(() => {
             const { type } = props;
-            return type === 'time' || type === 'datetime';
+            return type === 'time';
+        });
+        const computeIsTimeOrDateTimeType = computed(() => {
+            const { type } = props;
+            const isTimeType = computeIsTimeType.value;
+            return isTimeType || type === 'datetime';
         });
         const computeIsDatePickerType = computed(() => {
             return ['date', 'week', 'month', 'quarter', 'year'].indexOf(props.type) > -1;
@@ -21058,8 +21172,8 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             return XEUtils.toNumber(startDay);
         });
         const computePanelLabelObj = computed(() => {
-            const { startValue, endValue } = reactData;
-            const vals = startValue || endValue ? [startValue || '', endValue || ''] : [];
+            const { selectStValue, selectEdValue } = reactData;
+            const vals = selectStValue || selectEdValue ? [selectStValue || '', selectEdValue || ''] : [];
             return formatRangeLabel(vals);
         });
         const computeInputLabel = computed(() => {
@@ -21153,7 +21267,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             };
         };
         const updateModelValue = (isModel) => {
-            const { modelValue, startValue, endValue } = props;
+            const { modelValue, startValue, endValue, valueFormat } = props;
             let restObj = {
                 sValue: '',
                 eValue: ''
@@ -21174,13 +21288,25 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                     restObj = paraeUpdateModel();
                 }
             }
-            reactData.startValue = restObj.sValue;
-            reactData.endValue = restObj.eValue;
+            let startRest = restObj.sValue;
+            let endRest = restObj.eValue;
+            if (valueFormat === 'timestamp') {
+                if (XEUtils.isString(startRest) && /^\d+$/.test(startRest)) {
+                    startRest = Number(startRest);
+                }
+                if (XEUtils.isString(endRest) && /^\d+$/.test(endRest)) {
+                    endRest = Number(endRest);
+                }
+            }
+            reactData.selectStValue = startRest;
+            reactData.selectEdValue = endRest;
+            reactData.paneEndVal = [startRest, endRest];
+            reactData.paneStartVal = [startRest, endRest];
         };
         const triggerEvent = (evnt) => {
-            const { startValue, endValue } = reactData;
-            const value = getRangeValue(startValue, endValue);
-            dispatchEvent(evnt.type, { value, startValue, endValue }, evnt);
+            const { selectStValue, selectEdValue } = reactData;
+            const value = getRangeValue(selectStValue, selectEdValue);
+            dispatchEvent(evnt.type, { value, startValue: selectStValue, endValue: selectEdValue }, evnt);
         };
         const handleChange = (sValue, eValue, evnt) => {
             const { type, modelValue, valueFormat } = props;
@@ -21205,8 +21331,8 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                     endRest = parseDateValue(endRest, type, { valueFormat: dateValueFormat });
                 }
             }
-            reactData.startValue = startRest;
-            reactData.endValue = endRest;
+            reactData.selectStValue = startRest;
+            reactData.selectEdValue = endRest;
             const value = getRangeValue(startRest, endRest);
             const isFinish = (startRest && endRest) || (!startRest && !endRest);
             emit('update:modelValue', value);
@@ -21241,9 +21367,9 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         const clickPrefixEvent = (evnt) => {
             const isDisabled = computeIsDisabled.value;
             if (!isDisabled) {
-                const { startValue, endValue } = reactData;
-                const value = getRangeValue(startValue, endValue);
-                dispatchEvent('prefix-click', { value, startValue, endValue }, evnt);
+                const { selectStValue, selectEdValue } = reactData;
+                const value = getRangeValue(selectStValue, selectEdValue);
+                dispatchEvent('prefix-click', { value, startValue: selectStValue, endValue: selectEdValue }, evnt);
             }
         };
         const hidePanel = () => {
@@ -21277,8 +21403,8 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             }
         };
         const panelCellClassName = ({ date }) => {
-            const startValue = reactData.startValue;
-            const endValue = reactData.endValue;
+            const startValue = reactData.selectStValue;
+            const endValue = reactData.selectEdValue;
             if (startValue && endValue) {
                 const currTime = date.getTime();
                 const startTime = XEUtils.toStringDate(startValue).getTime();
@@ -21291,18 +21417,18 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         };
         const handleSelectClose = () => {
             const { autoClose } = props;
-            const { startValue, endValue } = reactData;
+            const { selectStValue, selectEdValue } = reactData;
             const { selectStatus } = internalData;
             const isDatePickerType = computeIsDatePickerType.value;
             if (autoClose) {
                 if (selectStatus && isDatePickerType) {
-                    if (startValue && endValue) {
+                    if (selectStValue && selectEdValue) {
                         hidePanel();
                     }
                 }
             }
             else {
-                if (startValue && endValue) {
+                if (selectStValue && selectEdValue) {
                     internalData.selectStatus = false;
                 }
             }
@@ -21310,23 +21436,23 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         const clickSuffixEvent = (evnt) => {
             const isDisabled = computeIsDisabled.value;
             if (!isDisabled) {
-                const { startValue, endValue } = reactData;
-                const value = getRangeValue(startValue, endValue);
-                dispatchEvent('suffix-click', { value, startValue, endValue }, evnt);
+                const { selectStValue, selectEdValue } = reactData;
+                const value = getRangeValue(selectStValue, selectEdValue);
+                dispatchEvent('suffix-click', { value, startValue: selectStValue, endValue: selectEdValue }, evnt);
             }
         };
         const blurEvent = (evnt) => {
-            const { startValue, endValue } = reactData;
+            const { selectStValue, selectEdValue } = reactData;
             const inpImmediate = computeInpImmediate.value;
             const value = '';
             if (!inpImmediate) {
-                handleChange(startValue, endValue, evnt);
+                handleChange(selectStValue, selectEdValue, evnt);
             }
             if (!reactData.visiblePanel) {
                 reactData.isActivated = false;
                 checkValue();
             }
-            dispatchEvent('blur', { value, startValue, endValue }, evnt);
+            dispatchEvent('blur', { value, startValue: selectStValue, endValue: selectEdValue }, evnt);
             // 自动更新校验状态
             if ($xeForm && formItemInfo) {
                 $xeForm.triggerItemEvent(evnt, formItemInfo.itemConfig.field, value);
@@ -21339,12 +21465,17 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             triggerEvent(evnt);
         };
         const confirmEvent = (evnt) => {
+            const isTimeType = computeIsTimeType.value;
             const $startDatePanel = refStartDatePanel.value;
             const $endDatePanel = refEndDatePanel.value;
             if ($startDatePanel && $endDatePanel) {
                 const startValue = $startDatePanel.getModelValue();
                 const endValue = $endDatePanel.getModelValue();
-                if ((startValue && !endValue) || (!startValue && endValue)) {
+                if (isTimeType) {
+                    $startDatePanel.confirmByEvent(evnt);
+                    $endDatePanel.confirmByEvent(evnt);
+                }
+                else if ((startValue && !endValue) || (!startValue && endValue)) {
                     handleChange('', '', evnt);
                 }
                 else {
@@ -21358,107 +21489,232 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         };
         const startPanelChangeEvent = (params) => {
             const { selectStatus } = internalData;
-            const { value, $event } = params;
-            const endValue = selectStatus ? reactData.endValue : '';
-            handleChange(value, endValue, $event);
+            const { value, currValue, $event } = params;
+            const paneVals = value ? (XEUtils.isString(value) ? value.split(',') : [value]) : [];
+            let startValue = '';
+            let endValue = '';
+            if (selectStatus) {
+                startValue = paneVals[0];
+                if (paneVals[1]) {
+                    endValue = paneVals[1];
+                }
+                else {
+                    endValue = reactData.selectEdValue;
+                }
+            }
+            else {
+                startValue = currValue || XEUtils.last(paneVals);
+            }
+            reactData.paneEndVal = [startValue, endValue];
+            reactData.paneStartVal = [startValue, endValue];
+            handleChange(startValue, endValue, $event);
             handleSelectClose();
-            if (!selectStatus) {
+            if (selectStatus) {
+                if (startValue && endValue) {
+                    internalData.selectStatus = false;
+                }
+            }
+            else {
                 internalData.selectStatus = true;
             }
             nextTick(() => {
-                const $startDatePanel = refStartDatePanel.value;
-                const $endDatePanel = refEndDatePanel.value;
-                if ($startDatePanel && $endDatePanel) {
-                    const startValue = $startDatePanel.getModelValue();
-                    if (!endValue && startValue) {
-                        $endDatePanel.setPanelDate(XEUtils.toStringDate(startValue));
-                    }
-                }
+                handleUpdateStartPanelDate();
             });
         };
         const endPanelChangeEvent = (params) => {
             const { selectStatus } = internalData;
-            const { value, $event } = params;
-            const startValue = selectStatus ? reactData.startValue : '';
-            handleChange(startValue, value, $event);
+            const { value, currValue, $event } = params;
+            const paneVals = value ? (XEUtils.isString(value) ? value.split(',') : [value]) : [];
+            let startValue = '';
+            let endValue = '';
+            if (selectStatus) {
+                endValue = paneVals[0];
+                if (paneVals[1]) {
+                    startValue = paneVals[0];
+                    endValue = paneVals[1];
+                }
+                else {
+                    startValue = reactData.selectStValue;
+                }
+            }
+            else {
+                endValue = currValue || XEUtils.last(paneVals);
+            }
+            reactData.paneEndVal = [startValue, endValue];
+            reactData.paneStartVal = [startValue, endValue];
+            handleChange(startValue, endValue, $event);
             handleSelectClose();
-            if (!selectStatus) {
+            if (selectStatus) {
+                if (startValue && endValue) {
+                    internalData.selectStatus = false;
+                }
+            }
+            else {
                 internalData.selectStatus = true;
             }
             nextTick(() => {
-                const $startDatePanel = refStartDatePanel.value;
-                const $endDatePanel = refEndDatePanel.value;
-                if ($startDatePanel && $endDatePanel) {
-                    const endValue = $endDatePanel.getModelValue();
-                    if (!startValue && endValue) {
-                        $startDatePanel.setPanelDate(XEUtils.toStringDate(endValue));
+                handleUpdateEndPanelDate();
+            });
+        };
+        const handleUpdateStartPanelDate = () => {
+            const $startDatePanel = refStartDatePanel.value;
+            const $endDatePanel = refEndDatePanel.value;
+            if (!$startDatePanel || !$endDatePanel) {
+                return;
+            }
+            const startPanelDate = $startDatePanel.getPanelDate();
+            const endPanelDate = $endDatePanel.getPanelDate();
+            if (!startPanelDate || !endPanelDate) {
+                return;
+            }
+            const viewType = $startDatePanel.getViewType();
+            const startYear = startPanelDate.getFullYear();
+            const startMonth = startPanelDate.getMonth();
+            const endYear = endPanelDate.getFullYear();
+            const endMonth = endPanelDate.getMonth();
+            switch (viewType) {
+                case 'day':
+                case 'date':
+                case 'week': {
+                    if (endYear <= startYear && endMonth <= startMonth) {
+                        $endDatePanel.setPanelDate(getNextMonth(startPanelDate));
                     }
+                    break;
                 }
-            });
+                case 'month':
+                case 'quarter': {
+                    if (endYear <= startYear) {
+                        $endDatePanel.setPanelDate(getNextYear(startPanelDate));
+                    }
+                    break;
+                }
+                case 'year': {
+                    const { computeYearList } = $startDatePanel.getComputeMaps();
+                    const yearList = computeYearList.value;
+                    if (yearList.some((item) => XEUtils.isDateSame(item.date, endPanelDate, 'yyyy'))) {
+                        $endDatePanel.setPanelDate(getNextYear(startPanelDate, yearList.length));
+                    }
+                    break;
+                }
+            }
         };
-        const startPanelDateBtnChangeEvent = (params) => {
+        const startPanelDateBtnChangeEvent = () => {
             const { linkedPanels } = props;
+            const $startDatePanel = refStartDatePanel.value;
+            const $endDatePanel = refEndDatePanel.value;
+            if (!$startDatePanel || !$endDatePanel) {
+                return;
+            }
+            const startPanelDate = $startDatePanel.getPanelDate();
+            const endPanelDate = $endDatePanel.getPanelDate();
+            if (!startPanelDate || !endPanelDate) {
+                return;
+            }
+            const viewType = $startDatePanel.getViewType();
             if (linkedPanels) {
-                const { viewType } = params;
-                const $startDatePanel = refStartDatePanel.value;
-                const $endDatePanel = refEndDatePanel.value;
-                if (!$startDatePanel || !$endDatePanel) {
-                    return;
-                }
-                const startPanelDate = $startDatePanel.getPanelDate();
-                if (!startPanelDate) {
-                    return;
-                }
-                const endYear = startPanelDate.getFullYear();
-                const endMonth = startPanelDate.getMonth();
                 switch (viewType) {
                     case 'day':
                     case 'date':
                     case 'week': {
-                        if (endMonth < 11) {
-                            startPanelDate.setMonth(endMonth + 1);
-                        }
-                        else {
-                            startPanelDate.setFullYear(endYear + 1);
-                            startPanelDate.setMonth(0);
-                        }
-                        $endDatePanel.setPanelDate(startPanelDate);
+                        $endDatePanel.setPanelDate(getNextMonth(startPanelDate));
+                        break;
+                    }
+                    case 'month':
+                    case 'quarter': {
+                        $endDatePanel.setPanelDate(getNextYear(startPanelDate));
+                        break;
+                    }
+                    case 'year': {
+                        const { computeYearList } = $startDatePanel.getComputeMaps();
+                        const yearList = computeYearList.value;
+                        $endDatePanel.setPanelDate(getNextYear(startPanelDate, yearList.length));
                         break;
                     }
                 }
             }
+            else {
+                handleUpdateStartPanelDate();
+            }
         };
-        const endPanelDateBtnChangeEvent = (params) => {
-            const { linkedPanels } = props;
-            if (linkedPanels) {
-                const { viewType } = params;
-                const $startDatePanel = refStartDatePanel.value;
-                const $endDatePanel = refEndDatePanel.value;
-                if (!$startDatePanel || !$endDatePanel) {
-                    return;
+        const handleUpdateEndPanelDate = () => {
+            const $startDatePanel = refStartDatePanel.value;
+            const $endDatePanel = refEndDatePanel.value;
+            if (!$startDatePanel || !$endDatePanel) {
+                return;
+            }
+            const startPanelDate = $startDatePanel.getPanelDate();
+            const endPanelDate = $endDatePanel.getPanelDate();
+            if (!startPanelDate || !endPanelDate) {
+                return;
+            }
+            const viewType = $endDatePanel.getViewType();
+            const startYear = startPanelDate.getFullYear();
+            const startMonth = startPanelDate.getMonth();
+            const endYear = endPanelDate.getFullYear();
+            const endMonth = endPanelDate.getMonth();
+            switch (viewType) {
+                case 'day':
+                case 'date':
+                case 'week': {
+                    if (startYear >= endYear && startMonth >= endMonth) {
+                        $startDatePanel.setPanelDate(getPrevMonth(endPanelDate));
+                    }
+                    break;
                 }
-                const endPanelDate = $endDatePanel.getPanelDate();
-                if (!endPanelDate) {
-                    return;
+                case 'month':
+                case 'quarter': {
+                    if (startYear >= endYear) {
+                        $startDatePanel.setPanelDate(getPrevYear(endPanelDate));
+                    }
+                    break;
+                }
+                case 'year': {
+                    const { computeYearList } = $endDatePanel.getComputeMaps();
+                    const yearList = computeYearList.value;
+                    if (yearList.some((item) => XEUtils.isDateSame(item.date, startPanelDate, 'yyyy'))) {
+                        $startDatePanel.setPanelDate(getPrevYear(endPanelDate, yearList.length));
+                    }
+                    break;
                 }
-                const endYear = endPanelDate.getFullYear();
-                const endMonth = endPanelDate.getMonth();
+            }
+        };
+        const endPanelDateBtnChangeEvent = () => {
+            const { linkedPanels } = props;
+            const $startDatePanel = refStartDatePanel.value;
+            const $endDatePanel = refEndDatePanel.value;
+            if (!$startDatePanel || !$endDatePanel) {
+                return;
+            }
+            const startPanelDate = $startDatePanel.getPanelDate();
+            const endPanelDate = $endDatePanel.getPanelDate();
+            if (!startPanelDate || !endPanelDate) {
+                return;
+            }
+            const viewType = $endDatePanel.getViewType();
+            if (linkedPanels) {
                 switch (viewType) {
                     case 'day':
                     case 'date':
                     case 'week': {
-                        if (endMonth) {
-                            endPanelDate.setMonth(endMonth - 1);
-                        }
-                        else {
-                            endPanelDate.setFullYear(endYear - 1);
-                            endPanelDate.setMonth(11);
-                        }
-                        $startDatePanel.setPanelDate(endPanelDate);
+                        $startDatePanel.setPanelDate(getPrevMonth(endPanelDate));
+                        break;
+                    }
+                    case 'month':
+                    case 'quarter': {
+                        $startDatePanel.setPanelDate(getPrevYear(endPanelDate));
+                        break;
+                    }
+                    case 'year': {
+                        const { computeYearList } = $endDatePanel.getComputeMaps();
+                        const yearList = computeYearList.value;
+                        $startDatePanel.setPanelDate(getPrevYear(endPanelDate, yearList.length));
                         break;
                     }
                 }
             }
+            else {
+                handleUpdateEndPanelDate();
+            }
         };
         // 全局事件
         const handleGlobalMousedownEvent = (evnt) => {
@@ -21583,6 +21839,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                 reactData.isAniVisible = true;
                 setTimeout(() => {
                     reactData.visiblePanel = true;
+                    handleUpdateStartPanelDate();
                     updatePlacement();
                 }, 10);
                 updateZindex();
@@ -21618,8 +21875,8 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             const shortcutOpts = computeShortcutOpts.value;
             const { autoClose } = shortcutOpts;
             const { code, clickMethod } = option;
-            let startValue = reactData.startValue;
-            let endValue = reactData.endValue;
+            let startValue = reactData.selectStValue;
+            let endValue = reactData.selectEdValue;
             let value = getRangeValue(startValue, endValue);
             const shortcutParams = {
                 $dateRangePicker: $xeDateRangePicker,
@@ -21682,8 +21939,8 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         dateRangePickerMethods = {
             dispatchEvent,
             setModelValue(startValue, endValue) {
-                reactData.startValue = startValue || '';
-                reactData.endValue = endValue || '';
+                reactData.selectStValue = startValue || '';
+                reactData.selectEdValue = endValue || '';
                 const value = getRangeValue(startValue, endValue);
                 emit('update:modelValue', value);
             },
@@ -21737,15 +21994,16 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             if (popupOpts.enabled === false) {
                 return renderEmptyElement($xeDateRangePicker);
             }
-            const { type, separator, autoClose, showConfirmButton, showClearButton } = props;
-            const { initialized, isAniVisible, visiblePanel, panelPlacement, panelStyle, startValue, endValue } = reactData;
+            const { type, separator, autoClose, valueFormat, showConfirmButton, showClearButton } = props;
+            const { initialized, isAniVisible, visiblePanel, panelPlacement, panelStyle, selectStValue, selectEdValue, paneStartVal, paneEndVal } = reactData;
             const vSize = computeSize.value;
             const btnTransfer = computeBtnTransfer.value;
             const shortcutOpts = computeShortcutOpts.value;
             const isClearable = computeIsClearable.value;
             const panelLabelObj = computePanelLabelObj.value;
             const shortcutList = computeShortcutList.value;
-            const isDateTimeType = computeIsDateTimeType.value;
+            const isTimeType = computeIsTimeType.value;
+            const isTimeOrDateTimeType = computeIsTimeOrDateTimeType.value;
             const defaultDates = computeDefaultDates.value;
             const defaultTimes = computeDefaultTimes.value;
             const timeOpts = computeTimeOpts.value;
@@ -21761,7 +22019,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
             const [sdDate, edDate] = defaultDates;
             const [sdTime, edTime] = defaultTimes;
             const hasShortcutBtn = shortcutList.length > 0;
-            const showConfirmBtn = (showConfirmButton === null ? (isDateTimeType || !autoClose) : showConfirmButton);
+            const showConfirmBtn = (showConfirmButton === null ? (isTimeOrDateTimeType || !autoClose) : showConfirmButton);
             const showClearBtn = (showClearButton === null ? isClearable : showClearButton);
             return h(Teleport, {
                 to: 'body',
@@ -21815,15 +22073,18 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                                     }, [
                                         h(VxeDatePanel, {
                                             ref: refStartDatePanel,
-                                            modelValue: startValue,
+                                            modelValue: paneStartVal,
+                                            multiple: !isTimeType,
+                                            valueSort: true,
+                                            limitCount: 3,
+                                            defaultMode: 'first',
                                             type: props.type,
                                             className: props.className,
                                             minDate: props.minDate,
                                             maxDate: props.maxDate,
-                                            endDate: endValue,
                                             startDay: props.startDay,
                                             labelFormat: props.labelFormat,
-                                            valueFormat: props.valueFormat,
+                                            valueFormat: valueFormat === 'date' || valueFormat === 'timestamp' ? '' : valueFormat,
                                             timeFormat: props.timeFormat,
                                             defaultDate: sdDate,
                                             defaultTime: sdTime,
@@ -21839,15 +22100,18 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                                         }),
                                         h(VxeDatePanel, {
                                             ref: refEndDatePanel,
-                                            modelValue: endValue,
+                                            modelValue: paneEndVal,
+                                            multiple: !isTimeType,
+                                            valueSort: true,
+                                            limitCount: 3,
+                                            defaultMode: 'last',
                                             type: props.type,
                                             className: props.className,
                                             minDate: props.minDate,
                                             maxDate: props.maxDate,
-                                            startDate: startValue,
                                             startDay: props.startDay,
                                             labelFormat: props.labelFormat,
-                                            valueFormat: props.valueFormat,
+                                            valueFormat: valueFormat === 'date' || valueFormat === 'timestamp' ? '' : valueFormat,
                                             timeFormat: props.timeFormat,
                                             defaultDate: edDate,
                                             defaultTime: edTime,
@@ -21883,7 +22147,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                                             showClearBtn
                                                 ? h(VxeButton, {
                                                     size: 'mini',
-                                                    disabled: !(startValue || endValue),
+                                                    disabled: !(selectStValue || selectEdValue),
                                                     content: getI18n$2('vxe.button.clear'),
                                                     onClick: clearValueEvent
                                                 })
@@ -21937,13 +22201,13 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         };
         const renderSuffixIcon = () => {
             const { suffixIcon } = props;
-            const { startValue, endValue } = reactData;
+            const { selectStValue, selectEdValue } = reactData;
             const suffixSlot = slots.suffix;
             const isDisabled = computeIsDisabled.value;
             const isClearable = computeIsClearable.value;
             return h('div', {
                 class: ['vxe-date-range-picker--suffix', {
-                        'is--clear': isClearable && !isDisabled && (startValue || endValue)
+                        'is--clear': isClearable && !isDisabled && (selectStValue || selectEdValue)
                     }]
             }, [
                 isClearable
@@ -21983,7 +22247,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         };
         const renderVN = () => {
             const { className, type, name, autoComplete } = props;
-            const { startValue, endValue, visiblePanel, isActivated } = reactData;
+            const { selectStValue, selectEdValue, visiblePanel, isActivated } = reactData;
             const vSize = computeSize.value;
             const isDisabled = computeIsDisabled.value;
             const formReadonly = computeFormReadonly.value;
@@ -22007,7 +22271,7 @@ var VxeDateRangePickerComponent = defineVxeComponent({
                         'is--visible': visiblePanel,
                         'is--disabled': isDisabled,
                         'is--active': isActivated,
-                        'show--clear': isClearable && !isDisabled && (startValue || endValue)
+                        'show--clear': isClearable && !isDisabled && (selectStValue || selectEdValue)
                     }],
                 spellcheck: false
             }, [
@@ -22055,14 +22319,16 @@ var VxeDateRangePickerComponent = defineVxeComponent({
         onDeactivated(() => {
             checkValue();
         });
+        onBeforeUnmount(() => {
+            checkValue();
+        });
         onUnmounted(() => {
             globalEvents.off($xeDateRangePicker, 'mousewheel');
             globalEvents.off($xeDateRangePicker, 'mousedown');
             globalEvents.off($xeDateRangePicker, 'blur');
             globalEvents.off($xeDateRangePicker, 'resize');
-        });
-        onBeforeUnmount(() => {
-            checkValue();
+            XEUtils.assign(reactData, createReactData$d());
+            XEUtils.assign(internalData, createInternalData$c());
         });
         provide('$xeDateRangePicker', $xeDateRangePicker);
         $xeDateRangePicker.renderVN = renderVN;
@@ -25068,6 +25334,7 @@ var VxeFormComponent = defineVxeComponent({
         });
         onUnmounted(() => {
             globalEvents.off($xeForm, 'resize');
+            XEUtils.assign(reactData, createReactData$c());
             XEUtils.assign(internalData, createInternalData$b());
         });
         reactData.collapseAll = !!props.collapseStatus;