2020-04-09

king

2020-04-09 b9a0e8541f0959db5d848f7b893c8838851ce411

 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,
        })
      }