vxe-table 4.11.3 → 4.11.5

package/es/table/render/index.js

@@ -72,11 +72,11 @@ function getCellEditFilterProps(renderOpts, params, value, defaultProps) {
 function isImmediateCell(renderOpts, params) {
     return params.$type === 'cell' || getInputImmediateModel(renderOpts);
 }
-function getCellLabelVNs(renderOpts, params, cellLabel) {
+function getCellLabelVNs(renderOpts, params, cellLabel, opts) {
     const { placeholder } = renderOpts;
     return [
         h('span', {
-            class: 'vxe-cell--label'
+            class: ['vxe-cell--label', opts ? opts.class : '']
         }, placeholder && isEmptyValue(cellLabel)
             ? [
                 h('span', {
@@ -565,11 +565,12 @@ renderer.mixin({
         tableAutoFocus: 'input',
         renderTableEdit: defaultEditRender,
         renderTableCell(renderOpts, params) {
-            const { props = {} } = renderOpts;
+            const { props = {}, showNegativeStatus } = renderOpts;
             const { row, column } = params;
             const { type } = props;
             let cellValue = XEUtils.get(row, column.field);
-            if (cellValue) {
+            let isNegative = false;
+            if (!isEmptyValue(cellValue)) {
                 const numberInputConfig = getConfig().numberInput || {};
                 if (type === 'float') {
                     const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
@@ -578,12 +579,23 @@ renderer.mixin({
                     if (!autoFill) {
                         cellValue = XEUtils.toNumber(cellValue);
                     }
+                    if (showNegativeStatus) {
+                        if (cellValue < 0) {
+                            isNegative = true;
+                        }
+                    }
                 }
                 else if (type === 'amount') {
                     const autoFill = handleDefaultValue(props.autoFill, numberInputConfig.autoFill, true);
                     const digits = handleDefaultValue(props.digits, numberInputConfig.digits, 2);
                     const showCurrency = handleDefaultValue(props.showCurrency, numberInputConfig.showCurrency, false);
-                    cellValue = XEUtils.commafy(XEUtils.toNumber(cellValue), { digits });
+                    cellValue = XEUtils.toNumber(cellValue);
+                    if (showNegativeStatus) {
+                        if (cellValue < 0) {
+                            isNegative = true;
+                        }
+                    }
+                    cellValue = XEUtils.commafy(cellValue, { digits });
                     if (!autoFill) {
                         const [iStr, dStr] = cellValue.split('.');
                         if (dStr) {
@@ -595,8 +607,19 @@ renderer.mixin({
                         cellValue = `${props.currencySymbol || numberInputConfig.currencySymbol || getI18n('vxe.numberInput.currencySymbol') || ''}${cellValue}`;
                     }
                 }
+                else {
+                    if (showNegativeStatus) {
+                        if (XEUtils.toNumber(cellValue) < 0) {
+                            isNegative = true;
+                        }
+                    }
+                }
             }
-            return getCellLabelVNs(renderOpts, params, cellValue);
+            return getCellLabelVNs(renderOpts, params, cellValue, isNegative
+                ? {
+                    class: 'is--negative'
+                }
+                : {});
         },
         renderTableFooter(renderOpts, params) {
             const { props = {} } = renderOpts;

package/es/table/src/header.js

@@ -34,7 +34,7 @@ export default defineComponent({
         };
         const renderRows = (isGroup, isOptimizeMode, cols, $rowIndex) => {
             const { fixedType } = props;
-            const { resizable: allResizable, border, columnKey, headerCellClassName, headerCellStyle, showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign, mouseConfig } = tableProps;
+            const { resizable: allResizable, columnKey, headerCellClassName, headerCellStyle, showHeaderOverflow: allColumnHeaderOverflow, headerAlign: allHeaderAlign, align: allAlign, mouseConfig } = tableProps;
             const { currentColumn, scrollXLoad, scrollYLoad, overflowX } = tableReactData;
             const { scrollXStore } = tableInternalData;
             const columnOpts = computeColumnOpts.value;
@@ -154,9 +154,7 @@ export default defineComponent({
                      */
                     !fixedHiddenColumn && showResizable
                         ? h('div', {
-                            class: ['vxe-cell--col-resizable', {
-                                    'is--line': !border || border === 'none'
-                                }],
+                            class: 'vxe-cell--col-resizable',
                             onMousedown: (evnt) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams),
                             onDblclick: (evnt) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams)
                         })

package/es/table/style.css

@@ -1932,6 +1932,11 @@
   min-height: 100%;
 }
 
+/*负数显示红色*/
+.vxe-cell--label.is--negative {
+  color: var(--vxe-ui-table-cell-negative-color);
+}
+
 .vxe-table--checkbox-range,
 .vxe-table--cell-main-area,
 .vxe-table--cell-extend-area,
@@ -1942,7 +1947,7 @@
   display: none;
   position: absolute;
   pointer-events: none;
-  z-index: 6;
+  z-index: 1;
 }
 
 .vxe-table--header-wrapper .vxe-table--cell-col-status-area {
@@ -2566,6 +2571,20 @@
 .vxe-table--render-default.border--default.sx-pos--bottom .vxe-table--scroll-x-wrapper::before, .vxe-table--render-default.border--full.sx-pos--bottom .vxe-table--scroll-x-wrapper::before, .vxe-table--render-default.border--outer.sx-pos--bottom .vxe-table--scroll-x-wrapper::before, .vxe-table--render-default.border--inner.sx-pos--bottom .vxe-table--scroll-x-wrapper::before {
   top: -1px;
 }
+.vxe-table--render-default.border--default .vxe-cell--col-resizable:before, .vxe-table--render-default.border--default .vxe-cell--col-resizable:after, .vxe-table--render-default.border--none .vxe-cell--col-resizable:before, .vxe-table--render-default.border--none .vxe-cell--col-resizable:after, .vxe-table--render-default.border--outer .vxe-cell--col-resizable:before, .vxe-table--render-default.border--outer .vxe-cell--col-resizable:after, .vxe-table--render-default.border--inner .vxe-cell--col-resizable:before, .vxe-table--render-default.border--inner .vxe-cell--col-resizable:after {
+  content: "";
+  display: inline-block;
+  vertical-align: middle;
+}
+.vxe-table--render-default.border--default .vxe-cell--col-resizable:before, .vxe-table--render-default.border--none .vxe-cell--col-resizable:before, .vxe-table--render-default.border--outer .vxe-cell--col-resizable:before, .vxe-table--render-default.border--inner .vxe-cell--col-resizable:before {
+  width: 1px;
+  height: 50%;
+  background-color: var(--vxe-ui-table-resizable-line-color);
+}
+.vxe-table--render-default.border--default .vxe-cell--col-resizable:after, .vxe-table--render-default.border--none .vxe-cell--col-resizable:after, .vxe-table--render-default.border--outer .vxe-cell--col-resizable:after, .vxe-table--render-default.border--inner .vxe-cell--col-resizable:after {
+  width: 0;
+  height: 100%;
+}
 .vxe-table--render-default.border--default .vxe-table--header-wrapper, .vxe-table--render-default.border--full .vxe-table--header-wrapper, .vxe-table--render-default.border--outer .vxe-table--header-wrapper {
   background-color: var(--vxe-ui-table-header-background-color);
 }