vxe-table 4.13.21 → 4.13.22

package/es/table/render/index.js

@@ -144,7 +144,7 @@ const blurEvent = 'blur';
  * @param modelFunc
  * @param changeFunc
  */
-function getComponentOns(renderOpts, params, eFns) {
+function getComponentOns(renderOpts, params, eFns, eventOns) {
     const { events } = renderOpts;
     const modelEvent = getModelEvent(renderOpts);
     const changeEvent = getChangeEvent(renderOpts);
@@ -182,7 +182,7 @@ function getComponentOns(renderOpts, params, eFns) {
             }
         };
     }
-    return ons;
+    return eventOns ? Object.assign(ons, eventOns) : ons;
 }
 function getEditOns(renderOpts, params) {
     const { $table, row, column } = params;
@@ -706,6 +706,75 @@ renderer.mixin({
         renderTableFilter: defaultFilterRender,
         tableFilterDefaultMethod: handleFilterMethod
     },
+    VxeDateRangePicker: {
+        tableAutoFocus: 'input',
+        renderTableEdit(renderOpts, params) {
+            const { startField, endField } = renderOpts;
+            const { $table, row, column } = params;
+            const { model } = column;
+            const cellValue = getCellValue(row, column);
+            const seProps = {};
+            const seOs = {};
+            if (startField && endField) {
+                seProps.startValue = XEUtils.get(row, startField);
+                seProps.endValue = XEUtils.get(row, endField);
+                seOs['onUpdate:startValue'] = (value) => {
+                    if (startField) {
+                        XEUtils.set(row, startField, value);
+                    }
+                };
+                seOs['onUpdate:endValue'] = (value) => {
+                    if (endField) {
+                        XEUtils.set(row, endField, value);
+                    }
+                };
+            }
+            return [
+                h(getDefaultComponent(renderOpts), Object.assign(Object.assign({}, getCellEditProps(renderOpts, params, cellValue, seProps)), getComponentOns(renderOpts, params, {
+                    model(cellValue) {
+                        model.update = true;
+                        model.value = cellValue;
+                        setCellValue(row, column, cellValue);
+                    },
+                    change() {
+                        $table.updateStatus(params);
+                    },
+                    blur() {
+                        $table.handleCellRuleUpdateStatus('blur', params);
+                    }
+                }, seOs)))
+            ];
+        },
+        renderTableCell(renderOpts, params) {
+            const { startField, endField } = renderOpts;
+            const { row, column } = params;
+            let startValue = '';
+            let endValue = '';
+            if (startField && endField) {
+                startValue = XEUtils.get(row, startField);
+                endValue = XEUtils.get(row, endField);
+            }
+            else {
+                const cellValue = XEUtils.get(row, column.field);
+                if (cellValue) {
+                    if (XEUtils.isArray(cellValue)) {
+                        startValue = cellValue[0];
+                        endValue = cellValue[1];
+                    }
+                    else {
+                        const strs = `${cellValue}`.split(',');
+                        startValue = strs[0];
+                        endValue = strs[1];
+                    }
+                }
+            }
+            let cellLabel = '';
+            if (startValue && endValue) {
+                cellLabel = `${startValue} ~ ${endValue}`;
+            }
+            return getCellLabelVNs(renderOpts, params, cellLabel);
+        }
+    },
     VxeTextarea: {
         tableAutoFocus: 'textarea',
         renderTableEdit: defaultEditRender,

package/es/table/style.css

@@ -1806,6 +1806,7 @@
 .vxe-header--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-select,
 .vxe-header--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-tree-select,
 .vxe-header--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-date-picker,
+.vxe-header--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-date-range-picker,
 .vxe-header--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-number-input,
 .vxe-header--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-ico-picker,
 .vxe-footer--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-input,
@@ -1813,6 +1814,7 @@
 .vxe-footer--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-select,
 .vxe-footer--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-tree-select,
 .vxe-footer--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-date-picker,
+.vxe-footer--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-date-range-picker,
 .vxe-footer--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-number-input,
 .vxe-footer--column.fixed--width > .vxe-cell > .vxe-cell--wrapper .vxe-ico-picker {
   width: 100%;
@@ -1821,7 +1823,7 @@
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-default-input, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-default-textarea, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-default-select {
   width: 100%;
 }
-.vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-input, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-textarea, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-select, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-tree-select, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-date-picker, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-number-input, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-ico-picker {
+.vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-input, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-textarea, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-select, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-tree-select, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-date-picker, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-date-range-picker, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-number-input, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-ico-picker {
   width: 100%;
 }
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-row-group--tree-node .vxe-default-input,
@@ -1832,6 +1834,7 @@
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-row-group--tree-node .vxe-select,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-row-group--tree-node .vxe-tree-select,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-row-group--tree-node .vxe-date-picker,
+.vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-row-group--tree-node .vxe-date-range-picker,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-row-group--tree-node .vxe-number-input,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-row-group--tree-node .vxe-ico-picker, .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-default-input,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-default-textarea,
@@ -1841,6 +1844,7 @@
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-select,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-tree-select,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-date-picker,
+.vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-date-range-picker,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-number-input,
 .vxe-body--column.fixed--width > .vxe-cell > .vxe-cell--wrapper > .vxe-cell--tree-node .vxe-ico-picker {
   width: 100%;
@@ -1849,7 +1853,7 @@
 .vxe-table--filter-template > .vxe-default-input, .vxe-table--filter-template > .vxe-default-textarea, .vxe-table--filter-template > .vxe-default-select {
   width: 100%;
 }
-.vxe-table--filter-template > .vxe-input, .vxe-table--filter-template > .vxe-textarea, .vxe-table--filter-template > .vxe-select, .vxe-table--filter-template > .vxe-tree-select, .vxe-table--filter-template > .vxe-date-picker, .vxe-table--filter-template > .vxe-number-input, .vxe-table--filter-template > .vxe-ico-picker {
+.vxe-table--filter-template > .vxe-input, .vxe-table--filter-template > .vxe-textarea, .vxe-table--filter-template > .vxe-select, .vxe-table--filter-template > .vxe-tree-select, .vxe-table--filter-template > .vxe-date-picker, .vxe-table--filter-template > .vxe-date-range-picker, .vxe-table--filter-template > .vxe-number-input, .vxe-table--filter-template > .vxe-ico-picker {
   width: 100%;
 }