From b9a0e8541f0959db5d848f7b893c8838851ce411 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期四, 09 四月 2020 13:29:49 +0800
Subject: [PATCH] 2020-04-09
---
src/templates/zshare/modaleditable/index.jsx | 121 ++++++++++++++++++++++++++++++++++++----
1 files changed, 108 insertions(+), 13 deletions(-)
diff --git a/src/templates/zshare/modaleditable/index.jsx b/src/templates/zshare/modaleditable/index.jsx
index 2784030..d2104a8 100644
--- a/src/templates/zshare/modaleditable/index.jsx
+++ b/src/templates/zshare/modaleditable/index.jsx
@@ -1,6 +1,7 @@
import React, {Component} from 'react'
import { is, fromJS } from 'immutable'
-import { Table, Input, Button, Popconfirm, Form, Icon } from 'antd'
+import { Table, Input, Button, Popconfirm, Form, Icon, Radio } from 'antd'
+import { formRule } from '@/utils/option.js'
import Utils from '@/utils/utils.js'
import './index.scss'
@@ -31,8 +32,13 @@
}
save = e => {
- const { record, handleSave } = this.props
+ const { record, handleSave, datatype } = this.props
this.form.validateFields((error, values) => {
+ if (datatype === 'number') {
+ Object.keys(values).forEach(key => {
+ values[key] = parseFloat(values[key])
+ })
+ }
handleSave({ ...record, ...values })
if (error && error[e.currentTarget.id]) {
return
@@ -43,8 +49,16 @@
renderCell = form => {
this.form = form
- const { children, dataIndex, record } = this.props
+ const { children, dataIndex, record, datatype } = this.props
const { editing } = this.state
+
+ let rules = []
+ if (datatype === 'number') {
+ rules.push({
+ pattern: /^(-?\d+)(\.\d+)?$/,
+ message: formRule.input.numbermsg
+ })
+ }
return editing ? (
<Form.Item style={{ margin: 0 }}>
@@ -54,6 +68,7 @@
required: dataIndex === 'Value' || dataIndex === 'Text',
message: 'NOT NULL.',
},
+ ...rules
],
initialValue: record[dataIndex]
})(<Input ref={node => (this.input = node)} autoComplete="off" onPressEnter={this.save} onBlur={this.save} />)}
@@ -97,6 +112,7 @@
let _width = '40%'
let fields = []
+ let dataItem = props.data ? props.data[0] : ''
if (props.type === 'link') {
_width = '27%'
@@ -107,23 +123,28 @@
title: field.label,
dataIndex: field.field,
width: _width,
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem[field.field]) === 'number' ? 'number' : 'string'
}
})
}
+
+
let columns = [
{
title: 'Value',
dataIndex: 'Value',
width: _width,
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem.Value) === 'number' ? 'number' : 'string'
},
{
title: 'Text',
dataIndex: 'Text',
width: _width,
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem.Text) === 'number' ? 'number' : 'string'
},
...fields,
{
@@ -153,17 +174,79 @@
title: 'ParentID',
dataIndex: 'ParentID',
width: '27%',
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem.ParentID) === 'number' ? 'number' : 'string'
})
}
this.state = {
- columns: columns,
+ columns: columns.map(col => {
+ if (col.dataIndex !== 'operation') {
+ col = {...col, ...this.getColumnSearchProps(col)}
+ }
+ return col
+ }),
dataSource: props.data,
count: props.data.length,
type: props.type,
linkSubFields: props.linkSubFields
}
+ }
+
+ getColumnSearchProps = column => ({
+ filterDropdown: () => (
+ <div style={{ padding: 8 }}>
+ <Radio.Group onChange={(e) => this.changeDatatype(column, e)} value={column.datatype}>
+ <Radio style={{display: 'block', height: '30px', lineHeight: '30px'}} value="string">
+ String
+ </Radio>
+ <Radio style={{display: 'block', height: '30px', lineHeight: '30px'}} value="number">
+ Number
+ </Radio>
+ </Radio.Group>
+ </div>
+ ),
+ filterIcon: () => (
+ <Icon type="swap" style={{ color: column.datatype === 'number' ? '#1890ff' : undefined}} />
+ )
+ })
+
+ changeDatatype = (column, e) => {
+ const { columns, dataSource } = this.state
+ let value = e.target.value
+
+ this.setState({
+ dataSource: dataSource.map(item => {
+ let val = item[column.dataIndex]
+ if (value === 'number') {
+ try {
+ val = parseFloat(val)
+ if (isNaN(val)) {
+ val = ''
+ }
+ } catch {
+ val = ''
+ }
+ } else {
+ val = '' + val
+ }
+
+ item[column.dataIndex] = val
+
+ return item
+ }),
+ columns: columns.map(col => {
+ if (col.dataIndex === column.dataIndex) {
+ col.datatype = value
+ }
+
+ if (col.dataIndex !== 'operation') {
+ col = {...col, ...this.getColumnSearchProps(col)}
+ }
+
+ return col
+ })
+ })
}
handleUpDown = (record, direction) => {
@@ -237,6 +320,8 @@
})
}
+ let dataItem = dataSource ? dataSource[0] : ''
+
if (type === 'link') {
_width = '27%'
} else if (type === 'select') {
@@ -246,7 +331,8 @@
title: field.label,
dataIndex: field.field,
width: _width,
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem[field.field]) === 'number' ? 'number' : 'string'
}
})
}
@@ -256,13 +342,15 @@
title: 'Value',
dataIndex: 'Value',
width: _width,
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem.Value) === 'number' ? 'number' : 'string'
},
{
title: 'Text',
dataIndex: 'Text',
width: _width,
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem.Text) === 'number' ? 'number' : 'string'
},
...fields,
{
@@ -292,12 +380,18 @@
title: 'ParentID',
dataIndex: 'ParentID',
width: '27%',
- editable: true
+ editable: true,
+ datatype: dataItem && typeof(dataItem.ParentID) === 'number' ? 'number' : 'string'
})
}
this.setState({
- columns: columns,
+ columns: columns.map(col => {
+ if (col.dataIndex !== 'operation') {
+ col = {...col, ...this.getColumnSearchProps(col)}
+ }
+ return col
+ }),
dataSource: dataSource,
type: type
})
@@ -344,6 +438,7 @@
editable: col.editable,
dataIndex: col.dataIndex,
title: col.title,
+ datatype: col.datatype,
handleSave: this.handleSave,
})
}
--
Gitblit v1.8.0