From 31ec63f0419895876cbaba99637a884a32d33d0d Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 01 九月 2021 10:31:45 +0800
Subject: [PATCH] 2021-09-01
---
src/templates/zshare/editTable/index.jsx | 84 ++++++++++++++++++++++++++++++------------
1 files changed, 60 insertions(+), 24 deletions(-)
diff --git a/src/templates/zshare/editTable/index.jsx b/src/templates/zshare/editTable/index.jsx
index 85acc60..2d487c4 100644
--- a/src/templates/zshare/editTable/index.jsx
+++ b/src/templates/zshare/editTable/index.jsx
@@ -14,6 +14,7 @@
let eTDict = sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS
const EditableContext = React.createContext()
+const { confirm } = Modal
let dragingIndex = -1
const { Paragraph } = Typography
@@ -171,6 +172,7 @@
UNSAFE_componentWillMount () {
const { data, actions } = this.props
let columns = fromJS(this.props.columns).toJS()
+ let operation = null
if (actions && (actions.includes('edit') || actions.includes('copy') || actions.includes('del'))) {
let _operation = null
@@ -181,15 +183,14 @@
return item.dataIndex !== 'operation'
})
- let operation = {
+ operation = {
title: (<div>
{eTDict['model.operation']}
- {actions.includes('copy') ? (
- <span className="copy-control">
- <Icon type="copy" onClick={() => this.copy()} />
- <Icon type="snippets" onClick={this.paste} />
- </span>
- ) : null}
+ <span className="copy-control">
+ {actions.includes('copy') ? <Icon type="copy" title="澶嶅埗" onClick={() => this.copy()} /> : null}
+ {actions.includes('copy') ? <Icon type="snippets" title="绮樿创" onClick={this.paste} /> : null}
+ {actions.includes('clear') ? <Icon type="delete" title="娓呯┖" onClick={this.clear} /> : null}
+ </span>
</div>),
dataIndex: 'operation',
width: '140px',
@@ -233,7 +234,7 @@
this.setState({
data: data || [],
- oricolumns: fromJS(this.props.columns).toJS(),
+ operation,
columns
})
}
@@ -241,19 +242,26 @@
UNSAFE_componentWillReceiveProps (nextProps) {
if (!is(fromJS(this.state.data), fromJS(nextProps.data))) {
this.setState({data: nextProps.data, editingKey: ''})
- } else if (!is(fromJS(this.state.oricolumns), fromJS(nextProps.columns))) {
- let cols = {}
- nextProps.columns.forEach(col => {cols[col.dataIndex] = col})
-
- this.setState({
- oricolumns: fromJS(nextProps.columns).toJS(),
- columns: this.state.columns.map(col => {
- if (cols[col.dataIndex]) {
- return cols[col.dataIndex]
- }
- return col
+ } else if (!is(fromJS(this.props.columns), fromJS(nextProps.columns))) {
+ if (nextProps.columns.length === this.props.columns.length) {
+ let cols = {}
+ nextProps.columns.forEach(col => {cols[col.dataIndex] = col})
+
+ this.setState({
+ columns: this.state.columns.map(col => {
+ if (cols[col.dataIndex]) {
+ return cols[col.dataIndex]
+ }
+ return col
+ })
})
- })
+ } else {
+ let columns = fromJS(nextProps.columns).toJS()
+ if (this.state.operation) {
+ columns.push(this.state.operation)
+ }
+ this.setState({columns})
+ }
}
}
@@ -261,6 +269,21 @@
cancel = () => {
this.setState({ editingKey: '' })
+ }
+
+ clear = () => {
+ const _this = this
+
+ confirm({
+ title: '纭畾娓呯┖鍒楄〃鍚楋紵',
+ content: '',
+ onOk() {
+ _this.setState({ data: [], editingKey: '' }, () => {
+ _this.props.onChange([])
+ })
+ },
+ onCancel() {}
+ })
}
copy = (item) => {
@@ -284,7 +307,7 @@
try {
msg = window.btoa(window.encodeURIComponent(JSON.stringify(msg)))
- } catch {
+ } catch (e) {
console.warn('Stringify Failure')
msg = ''
}
@@ -354,7 +377,7 @@
if (!unique) return
- data.unshift(cell)
+ data.push(cell)
})
this.setState({ data, editingKey: '', visible: false }, () => {
@@ -494,7 +517,7 @@
moveprops.moveRow = this.moveRow
}
- const columns = this.state.columns.map(col => {
+ let columns = this.state.columns.map(col => {
if (col.copy) {
col.render = (text) => (<Paragraph copyable>{text}</Paragraph>)
}
@@ -517,6 +540,19 @@
}
})
+ columns.unshift({
+ title: '搴忓彿',
+ dataIndex: '$index',
+ className: 'mk-index',
+ width: '60px',
+ })
+
+ const data = this.state.data.map((item, index) => {
+ item.$index = index + 1
+
+ return item
+ })
+
return (
<EditableContext.Provider value={this.props.form}>
<div className="modal-edit-table">
@@ -525,7 +561,7 @@
bordered
rowKey="uuid"
components={components}
- dataSource={this.state.data}
+ dataSource={data}
columns={columns}
rowClassName="editable-row"
pagination={false}
--
Gitblit v1.8.0