From d3272e82652361e5e9bd045925222ef042b6731f Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 18 十一月 2020 18:15:15 +0800
Subject: [PATCH] 2020-11-18
---
src/templates/zshare/editTable/index.jsx | 55 ++++++++++++++++++++++++++++++++++---------------------
1 files changed, 34 insertions(+), 21 deletions(-)
diff --git a/src/templates/zshare/editTable/index.jsx b/src/templates/zshare/editTable/index.jsx
index d67614e..7597a13 100644
--- a/src/templates/zshare/editTable/index.jsx
+++ b/src/templates/zshare/editTable/index.jsx
@@ -1,14 +1,14 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
-import { Table, Input, InputNumber, Popconfirm, Form, Icon, Select } from 'antd'
+import { Table, Input, InputNumber, Popconfirm, Form, Icon, Select, Radio, Cascader } from 'antd'
import ColorSketch from '@/mob/colorsketch'
-// import Utils from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import './index.scss'
+let eTDict = localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS
const EditableContext = React.createContext()
class EditableCell extends Component {
@@ -20,9 +20,21 @@
} else if (inputType === 'color') {
return <ColorSketch />
} else if (inputType === 'select') {
- return <Select>
- {options.map((item, i) => (<Select.Option key={i} value={item.field || item.value}> {item.label || item.text} </Select.Option>))}
- </Select>
+ return (
+ <Select>
+ {options.map((item, i) => (<Select.Option key={i} value={item.field || item.value}> {item.label || item.text} </Select.Option>))}
+ </Select>
+ )
+ } else if (inputType === 'cascader') {
+ return (
+ <Cascader options={options} placeholder=""/>
+ )
+ } else if (inputType === 'radio') {
+ return (
+ <Radio.Group>
+ {options.map((item, i) => (<Radio key={i} value={item.field || item.value}> {item.label || item.text} </Radio>))}
+ </Radio.Group>
+ )
} else {
return <Input onPressEnter={() => this.getValue(form)} />
}
@@ -40,7 +52,7 @@
renderCell = (form) => {
const { getFieldDecorator } = form
- const { editing, dataIndex, title, record, children, className, required } = this.props
+ const { editing, dataIndex, title, record, children, className, required, inputType } = this.props
return (
<td className={className}>
@@ -50,7 +62,7 @@
rules: [
{
required: required,
- message: `Please Input ${title}!`,
+ message: ['number', 'text', 'input'].includes(inputType) ? `${eTDict['form.required.input']} ${title}!` : `${eTDict['form.required.select']} ${title}!`,
}
],
initialValue: record[dataIndex],
@@ -70,6 +82,9 @@
class EditTable extends Component {
static propTpyes = {
+ actions: PropTypes.any, // 鎿嶄綔椤�
+ data: PropTypes.any, // 鏁版嵁鍒楄〃
+ columns: PropTypes.array, // 鏄剧ず鍒�
onChange: PropTypes.func // 鏁版嵁鍙樺寲
}
@@ -80,41 +95,40 @@
}
UNSAFE_componentWillMount () {
- const { data } = this.props
+ const { data, actions } = this.props
let columns = fromJS(this.props.columns).toJS()
- let dict = localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS
columns.push({
- title: dict['model.operation'],
+ title: eTDict['model.operation'],
dataIndex: 'operation',
width: '140px',
render: (text, record) => {
const { editingKey } = this.state
const editable = this.isEditing(record)
return editable ? (
- <span>
+ <span style={{textAlign: 'center', display: 'block'}}>
<EditableContext.Consumer>
{form => (
<span onClick={() => this.save(form, record.uuid)} style={{ marginRight: 8 , color: '#1890ff', cursor: 'pointer'}}>
- {dict['model.save']}
+ {eTDict['model.save']}
</span>
)}
</EditableContext.Consumer>
- <span style={{ color: '#1890ff', cursor: 'pointer'}} onClick={() => this.cancel(record.uuid)}>{dict['model.cancel']}</span>
+ <span style={{ color: '#1890ff', cursor: 'pointer'}} onClick={() => this.cancel(record.uuid)}>{eTDict['model.cancel']}</span>
</span>
) : (
<div className={'operation-btn' + (editingKey !== '' ? ' disabled' : '')}>
- <span className="primary" onClick={() => {editingKey === '' && this.edit(record.uuid)}}><Icon type="edit" /></span>
- <span className="primary" onClick={() => {editingKey === '' && this.handleUpDown(record.uuid, 'up')}}><Icon type="arrow-up" /></span>
- <span className="danger" onClick={() => {editingKey === '' && this.handleUpDown(record.uuid, 'down')}}><Icon type="arrow-down" /></span>
- {editingKey === '' ? <Popconfirm
+ {!actions || actions.includes('edit') ? <span className="primary" onClick={() => {editingKey === '' && this.edit(record.uuid)}}><Icon type="edit" /></span> : null}
+ {!actions || actions.includes('up') ? <span className="primary" onClick={() => {editingKey === '' && this.handleUpDown(record.uuid, 'up')}}><Icon type="arrow-up" /></span> : null}
+ {!actions || actions.includes('down') ? <span className="danger" onClick={() => {editingKey === '' && this.handleUpDown(record.uuid, 'down')}}><Icon type="arrow-down" /></span> : null}
+ {(!actions || actions.includes('del')) && editingKey === '' ? <Popconfirm
overlayClassName="popover-confirm"
- title={dict['model.query.delete']}
+ title={eTDict['model.query.delete']}
onConfirm={() => this.handleDelete(record.uuid)
}>
<span className="danger"><Icon type="delete" /></span>
</Popconfirm> : null}
- {editingKey !== '' ? <span className="danger"><Icon type="delete" /></span> : null}
+ {(!actions || actions.includes('del')) && editingKey !== '' ? <span className="danger"><Icon type="delete" /></span> : null}
</div>
)
}
@@ -122,8 +136,7 @@
this.setState({
data: data || [],
- columns,
- dict
+ columns
})
}
--
Gitblit v1.8.0