From e9640ccdc9fe57f91919e3f51462c780e44fadb0 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 23 十二月 2020 13:14:20 +0800
Subject: [PATCH] 2020-12-23
---
src/menu/components/table/normal-table/columns/index.jsx | 144 ++++++++++++++++++++---------------------------
1 files changed, 61 insertions(+), 83 deletions(-)
diff --git a/src/menu/components/table/normal-table/columns/index.jsx b/src/menu/components/table/normal-table/columns/index.jsx
index 093fb0d..5041887 100644
--- a/src/menu/components/table/normal-table/columns/index.jsx
+++ b/src/menu/components/table/normal-table/columns/index.jsx
@@ -41,7 +41,9 @@
return !is(fromJS(this.props.column), fromJS(nextProps.column)) ||
!is(fromJS(this.props.fields), fromJS(nextProps.fields)) ||
- this.props.index !== nextProps.index
+ this.props.index !== nextProps.index ||
+ this.props.rowSpan !== nextProps.rowSpan ||
+ this.props.colSpan !== nextProps.colSpan
}
render() {
@@ -66,10 +68,10 @@
)
} else if (column) {
return (
- <th {...restProps}>
+ <th {...restProps} key={column.uuid}>
<Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
<div className="mk-popover-control">
- {column && column.type === 'custom' ?
+ {column && ['custom', 'colspan'].includes(column.type) ?
<Icon className="plus" title="娣诲姞" type="plus" onClick={() => this.props.addElement(column)} /> : null
}
<Icon className="edit" title="缂栬緫" type="edit" onClick={() => this.props.editColumn(column)} />
@@ -153,7 +155,7 @@
return (
<td style={{...style, minWidth: column.Width || 100}} className={className}>
{column.field}
- {column.marks && column.marks.length > 0 ? <Icon className="profile" type="ant-design"/> : null}
+ {column.marks && column.marks.length ? <Icon className="profile" type="ant-design"/> : null}
</td>
)
} else {
@@ -175,6 +177,7 @@
state = {
dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
data: [{uuid: Utils.getuuid()}],
+ refresh: false, // 寮哄埗鍒锋柊
columns: [],
fields: [],
lineMarks: []
@@ -225,29 +228,21 @@
})
}
+ loopCol = (columns, col) => {
+ return columns.map(column => {
+ if (column.type === 'colspan') {
+ column.subcols = this.loopCol(column.subcols, col)
+ }
+ if (column.uuid === col.uuid) {
+ return col
+ }
+ return column
+ })
+ }
+
updateCol = (col, action) => {
let _columns = fromJS(this.state.columns).toJS()
-
- if (col.isSub) {
- _columns = _columns.map(column => {
- if (column.type === 'colspan') {
- column.subcols = column.subcols.map(item => {
- if (item.uuid === col.uuid) {
- return col
- }
- return item
- })
- }
- return column
- })
- } else {
- _columns = _columns.map(column => {
- if (column.uuid === col.uuid) {
- return col
- }
- return column
- })
- }
+ _columns = this.loopCol(_columns, col)
this.setState({
columns: _columns,
@@ -333,20 +328,18 @@
this.setState({card: null})
}
+ loopDelCol = (columns, col) => {
+ return columns.filter(column => {
+ if (column.type === 'colspan') {
+ column.subcols = this.loopDelCol(column.subcols, col)
+ }
+ return column.uuid !== col.uuid
+ })
+ }
+
deleteCol = (col) => {
let _columns = fromJS(this.state.columns).toJS()
-
- if (col.isSub) {
- _columns = _columns.map(column => {
- if (column.type !== 'colspan') return column
- if (column.subcols && column.subcols.length > 0) {
- column.subcols = column.subcols.filter(item => item.uuid !== col.uuid)
- }
- return column
- })
- } else {
- _columns = _columns.filter(column => column.uuid !== col.uuid)
- }
+ _columns = this.loopDelCol(_columns, col)
this.setState({
columns: _columns
@@ -387,6 +380,35 @@
document.body.removeChild(oInput)
}
+ handlecolumns = (columns, fields, config, isSub) => {
+ return columns.map((col, index) => {
+ return {
+ title: col.label,
+ dataIndex: col.uuid,
+ align: col.Align,
+ sorter: !isSub && col.IsSort === 'true',
+ onCell: () => ({
+ column: col,
+ width: col.Width,
+ config: config,
+ upComponent: this.updateCol
+ }),
+ onHeaderCell: () => ({
+ index: isSub ? undefined : index,
+ column: col,
+ fields: fields,
+ align: col.Align,
+ moveCol: this.moveCol,
+ updateCol: this.updateCol,
+ addElement: this.addElement,
+ editColumn: this.editColumn,
+ deleteCol: this.deleteCol,
+ }),
+ children: col.subcols && col.subcols.length ? this.handlecolumns(col.subcols, fields, config, true) : null,
+ }
+ })
+ }
+
render() {
const { config } = this.props
const { fields, card, lineMarks, dict } = this.state
@@ -399,51 +421,7 @@
}
}
- const columns = this.state.columns.map((col, index) => {
- return {
- title: col.label,
- dataIndex: col.field,
- align: col.Align,
- sorter: col.IsSort === 'true',
- onCell: () => ({
- column: col,
- width: col.Width,
- config: config,
- upComponent: this.updateCol
- }),
- children: col.subcols && col.subcols.length > 0 ? col.subcols.map(cell => ({
- align: col.Align,
- title: cell.label,
- key: cell.uuid,
- onCell: () => ({
- column: cell,
- width: cell.Width,
- config: config,
- upComponent: this.updateCol
- }),
- onHeaderCell: () => ({
- column: cell,
- fields: fields,
- align: cell.Align,
- updateCol: this.updateCol,
- addElement: this.addElement,
- editColumn: this.editColumn,
- deleteCol: this.deleteCol,
- })
- })) : null,
- onHeaderCell: () => ({
- index,
- column: col,
- fields: fields,
- align: col.Align,
- moveCol: this.moveCol,
- updateCol: this.updateCol,
- addElement: this.addElement,
- editColumn: this.editColumn,
- deleteCol: this.deleteCol,
- })
- }
- })
+ const columns = this.handlecolumns(this.state.columns, fields, config)
return (
<div className={`normal-table-columns ${config.setting.laypage} ${config.wrap.tableType}`}>
@@ -454,12 +432,12 @@
<DndProvider>
<Table
rowKey="uuid"
+ rowClassName="editable-row"
bordered={config.wrap.bordered !== 'false'}
components={components}
dataSource={this.state.data}
rowSelection={config.wrap.tableType ? { type: 'radio' } : null}
columns={columns}
- rowClassName="editable-row"
pagination={{
current: 1,
pageSize: 10,
--
Gitblit v1.8.0