diff --git a/.eslintrc.js b/.eslintrc.js index 8853509017..70acbf4e93 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -12,7 +12,7 @@ module.exports = { ecmaVersion: 2020 }, rules: { - 'no-console': 'off', + 'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off', 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off', '@typescript-eslint/no-unused-vars': process.env.NODE_ENV === 'production' ? 'error' : 'warn', '@typescript-eslint/no-explicit-any': 'off' diff --git a/examples/views/grid/GridTest.vue b/examples/views/grid/GridTest.vue index a226f1d825..fa0d018fdf 100644 --- a/examples/views/grid/GridTest.vue +++ b/examples/views/grid/GridTest.vue @@ -1,227 +1,43 @@ - diff --git a/package.json b/package.json index 854166751e..598b0224f3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vxe-table", - "version": "4.11.3", + "version": "4.11.5", "description": "一个基于 vue 的 PC 端表格组件,支持增删改查、虚拟树、拖拽排序,懒加载、快捷菜单、数据校验、树形结构、打印、导入导出、自定义模板、渲染器、JSON 配置式...", "scripts": { "update": "npm install --legacy-peer-deps", @@ -28,7 +28,7 @@ "style": "lib/style.css", "typings": "types/index.d.ts", "dependencies": { - "vxe-pc-ui": "^4.3.90" + "vxe-pc-ui": "^4.3.91" }, "devDependencies": { "@types/resize-observer-browser": "^0.1.11", diff --git a/packages/locale/lang/zh-CHT.ts b/packages/locale/lang/zh-CHT.ts index 6526e73880..4e3ad2cde8 100644 --- a/packages/locale/lang/zh-CHT.ts +++ b/packages/locale/lang/zh-CHT.ts @@ -293,7 +293,7 @@ export default { } }, numberInput: { - currencySymbol: '¥' + currencySymbol: '¥' }, imagePreview: { popupTitle: '預覽', diff --git a/packages/locale/lang/zh-CN.ts b/packages/locale/lang/zh-CN.ts index ddf031adaa..b558b0e3f7 100644 --- a/packages/locale/lang/zh-CN.ts +++ b/packages/locale/lang/zh-CN.ts @@ -293,7 +293,7 @@ export default { } }, numberInput: { - currencySymbol: '¥' + currencySymbol: '¥' }, imagePreview: { popupTitle: '预览', diff --git a/packages/table/render/index.ts b/packages/table/render/index.ts index d63bd80126..ce604988ce 100644 --- a/packages/table/render/index.ts +++ b/packages/table/render/index.ts @@ -92,11 +92,13 @@ function isImmediateCell (renderOpts: VxeColumnPropTypes.EditRender, params: any return params.$type === 'cell' || getInputImmediateModel(renderOpts) } -function getCellLabelVNs (renderOpts: any, params: any, cellLabel: any) { +function getCellLabelVNs (renderOpts: any, params: any, cellLabel: any, opts?: { + class?: string +}) { const { placeholder } = renderOpts return [ h('span', { - class: 'vxe-cell--label' + class: ['vxe-cell--label', opts ? opts.class : ''] }, placeholder && isEmptyValue(cellLabel) ? [ h('span', { @@ -678,11 +680,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) @@ -691,11 +694,22 @@ 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) { @@ -706,9 +720,19 @@ renderer.mixin({ if (showCurrency) { 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 diff --git a/packages/table/src/header.ts b/packages/table/src/header.ts index 83a3375506..d97f7fa90e 100644 --- a/packages/table/src/header.ts +++ b/packages/table/src/header.ts @@ -44,7 +44,7 @@ export default defineComponent({ const renderRows = (isGroup: boolean, isOptimizeMode: boolean, cols: VxeTableDefines.ColumnInfo[], $rowIndex: number) => { 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 @@ -174,9 +174,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: MouseEvent) => $xeTable.handleColResizeMousedownEvent(evnt, fixedType, cellParams), onDblclick: (evnt: MouseEvent) => $xeTable.handleColResizeDblclickEvent(evnt, cellParams) }) diff --git a/styles/components/table.scss b/styles/components/table.scss index 60fed86fec..2de25e0087 100644 --- a/styles/components/table.scss +++ b/styles/components/table.scss @@ -263,6 +263,13 @@ } } +/*负数显示红色*/ +.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, @@ -273,7 +280,7 @@ display: none; position: absolute; pointer-events: none; - z-index: 6; + z-index: 1; } .vxe-table--header-wrapper { @@ -1119,6 +1126,28 @@ } } &.border--default, + &.border--none, + &.border--outer, + &.border--inner { + .vxe-cell--col-resizable { + &:before, + &:after { + content: ""; + display: inline-block; + vertical-align: middle; + } + &:before { + width: 1px; + height: 50%; + background-color: var(--vxe-ui-table-resizable-line-color); + } + &:after { + width: 0; + height: 100%; + } + } + } + &.border--default, &.border--full, &.border--outer { .vxe-table--header-wrapper { diff --git a/styles/theme/base.scss b/styles/theme/base.scss index e7701b073b..18cb5ae76e 100644 --- a/styles/theme/base.scss +++ b/styles/theme/base.scss @@ -46,6 +46,7 @@ --vxe-ui-table-cell-padding-small: 6px; --vxe-ui-table-cell-padding-mini: 4px; --vxe-ui-table-cell-placeholder-color: #C0C4CC; + --vxe-ui-table-cell-negative-color: #f56c6c; --vxe-ui-table-cell-input-height-default: var(--vxe-ui-table-row-height-default) - 6; --vxe-ui-table-cell-input-height-medium: var(--vxe-ui-table-row-height-medium) - 6; --vxe-ui-table-cell-input-height-small: var(--vxe-ui-table-row-height-small) - 6; diff --git a/styles/variable.scss b/styles/variable.scss index b9aed7e465..5189c6bd55 100644 --- a/styles/variable.scss +++ b/styles/variable.scss @@ -38,3 +38,4 @@ $vxe-ui-table-row-current-background-color: #e6f7ff !default; $vxe-ui-table-row-hover-current-background-color: #d7effb !default; $vxe-ui-table-fixed-scrolling-box-shadow-color: rgba(0, 0, 0, 0.12) !default; $vxe-ui-table-drag-over-background-color:rgba(255,255,200,0.3) !default; +