| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Table, Typography, Switch, Modal, Input, InputNumber, Tooltip, Button, notification, message, Select } from 'antd' |
| | | import { ExclamationCircleOutlined, EditOutlined, PlusOutlined, PlusCircleOutlined, DeleteOutlined } from '@ant-design/icons' |
| | | import { Table, Typography, Modal, Input, InputNumber, Button, notification, message, Select } from 'antd' |
| | | import { EditOutlined } from '@ant-design/icons' |
| | | import moment from 'moment' |
| | | |
| | | import Api from '@/api' |
| | |
| | | import './index.scss' |
| | | |
| | | const { Paragraph } = Typography |
| | | const { confirm } = Modal |
| | | const CardCellComponent = asyncComponent(() => import('@/tabviews/custom/components/card/cardcellList')) |
| | | |
| | | class BodyRow extends React.Component { |
| | |
| | | class BodyCell extends React.Component { |
| | | state = { |
| | | editing: false, |
| | | err: null |
| | | err: null, |
| | | value: '' |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.props.record), fromJS(nextProps.record)) || |
| | | nextState.editing !== this.state.editing || |
| | | nextState.err !== this.state.err |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('tdFocus', this.tdFocus) |
| | | return !is(fromJS(this.props.record), fromJS(nextProps.record)) || !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | /** |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('tdFocus', this.tdFocus) |
| | | } |
| | | |
| | | tdFocus = (id) => { |
| | | const { col, record } = this.props |
| | | |
| | | if (id !== col.uuid + record.$$uuid) return |
| | | this.focus() |
| | | } |
| | | |
| | | enterPress = () => { |
| | |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | | } else if (col.enter !== '$noAct') { |
| | | MKEmitter.emit('tdFocus', col.enter + record.$$uuid) |
| | | let node = document.getElementById(col.enter + record.$$uuid) |
| | | node && node.click() |
| | | } |
| | | }, 50) |
| | | |
| | |
| | | |
| | | focus = () => { |
| | | const { col, record } = this.props |
| | | |
| | | if (col.ctrlField && col.ctrlValue.includes(record[col.ctrlField])) return |
| | | |
| | | if (col.editType === 'switch' || col.editType === 'select') { |
| | | this.setState({editing: true}, () => { |
| | |
| | | } else if (col.required === 'true' && !val) { |
| | | err = '请填写' + col.label |
| | | } |
| | | |
| | | this.setState({value: val, err}) |
| | | } |
| | | |
| | |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | | } else if (col.enter !== '$noAct') { |
| | | MKEmitter.emit('tdFocus', col.enter + record.$$uuid) |
| | | let node = document.getElementById(col.enter + record.$$uuid) |
| | | node && node.click() |
| | | } |
| | | }, 50) |
| | | |
| | |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | | } else if (col.enter !== '$noAct') { |
| | | MKEmitter.emit('tdFocus', col.enter + record.$$uuid) |
| | | let node = document.getElementById(col.enter + record.$$uuid) |
| | | node && node.click() |
| | | } |
| | | }, 50) |
| | | |
| | |
| | | const { editing, value, err } = this.state |
| | | |
| | | if (!col) return (<td {...resProps} className={className} style={style}/>) |
| | | |
| | | let disabled = false |
| | | if (col.ctrlField) { |
| | | disabled = col.ctrlValue.includes(record[col.ctrlField]) |
| | | } |
| | | |
| | | let children = null |
| | | if (col.type === 'text') { |
| | |
| | | } |
| | | } |
| | | |
| | | if (col.editable === 'true') { |
| | | if (col.editable === 'true' && !disabled) { |
| | | if (editing) { |
| | | if (!col.editType || col.editType === 'text') { |
| | | return (<td className="editing_table_cell"> |
| | | <Input id={col.uuid + record.$$uuid} defaultValue={value} onChange={(e) => this.onChange(e.target.value)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> |
| | | {err ? <Tooltip title={err}><ExclamationCircleOutlined /></Tooltip> : null} |
| | | <Input className={err ? 'has-error' : ''} title={err} id={col.uuid + record.$$uuid} defaultValue={value} onChange={(e) => this.onChange(e.target.value)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> |
| | | </td>) |
| | | } else if (col.editType === 'switch') { |
| | | let _value = '' |
| | |
| | | } |
| | | } else { |
| | | return (<td className={className + ' pointer'} style={style}> |
| | | {col.addable ? <PlusCircleOutlined onClick={() => MKEmitter.emit('addRecord', col.tableId, {...record})} className="mk-editable mk-plus"/> : null} |
| | | <div className="mk-mask" onClick={this.focus}></div>{content} |
| | | {col.delable ? <DeleteOutlined onClick={() => MKEmitter.emit('delRecord', col.tableId, {...record})} className="mk-editable mk-del"/> : null} |
| | | <div className="mk-mask" id={col.uuid + record.$$uuid} onClick={this.focus}></div>{content} |
| | | </td>) |
| | | } |
| | | } else { |
| | |
| | | try { |
| | | content = parseFloat(record[col.field]) |
| | | if (isNaN(content)) { |
| | | content = '' |
| | | } |
| | | if (col.noValue === 'hide' && content === 0) { |
| | | content = '' |
| | | } |
| | | } catch (e) { |
| | |
| | | } |
| | | } |
| | | |
| | | if (col.editable === 'true') { |
| | | if (col.editable === 'true' && !disabled) { |
| | | if (editing) { |
| | | let val = value |
| | | if (col.noValue === 'hide' && value === 0) { |
| | | val = '' |
| | | } |
| | | return (<td className="editing_table_cell"> |
| | | <InputNumber id={col.uuid + record.$$uuid} defaultValue={value} onChange={(val) => this.onChange(val)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> |
| | | {err ? <Tooltip title={err}><ExclamationCircleOutlined /></Tooltip> : null} |
| | | <InputNumber className={err ? 'has-error' : ''} title={err} id={col.uuid + record.$$uuid} defaultValue={val} onChange={(val) => this.onChange(val)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> |
| | | </td>) |
| | | } else { |
| | | return (<td className={className + ' pointer'} style={style}> |
| | | {col.addable ? <PlusCircleOutlined onClick={() => MKEmitter.emit('addRecord', col.tableId, {...record})} className="mk-editable mk-plus"/> : null} |
| | | <div className="mk-mask" onClick={this.focus}></div>{content} |
| | | {col.delable ? <DeleteOutlined onClick={() => MKEmitter.emit('delRecord', col.tableId, {...record})} className="mk-editable mk-del"/> : null} |
| | | <div className="mk-mask" id={col.uuid + record.$$uuid} onClick={this.focus}></div>{content} |
| | | </td>) |
| | | } |
| | | } else { |
| | |
| | | |
| | | content = content === undefined ? '' : content |
| | | |
| | | if (col.noValue === 'hide' && content === 0) { |
| | | content = '' |
| | | } |
| | | |
| | | if (content !== '') { |
| | | content = `${col.prefix || ''}${content}${col.postfix || ''}` |
| | | |
| | | if (col.eval === 'false') { |
| | | content = content.replace(/\n/ig, '<br/>').replace(/\s/ig, ' ') |
| | | content = <span dangerouslySetInnerHTML={{__html: content}}></span> |
| | | } |
| | | content = content.replace(/\n/ig, '<br/>').replace(/\s/ig, ' ') |
| | | content = <span dangerouslySetInnerHTML={{__html: content}}></span> |
| | | } |
| | | |
| | | if (col.marks) { |
| | |
| | | children = ( |
| | | <CardCellComponent data={record} cards={config} elements={col.elements}/> |
| | | ) |
| | | } else if (col.type === 'operation') { |
| | | style.padding = '0px 5px' |
| | | children = ( |
| | | <Button type="link" style={{color: 'rgb(255, 77, 79)', backgroundColor: 'transparent'}} onClick={() => MKEmitter.emit('delRecord', col.tableId, {...record})}>删除</Button> |
| | | ) |
| | | } |
| | | |
| | | return (<td className={className} style={style}>{col.addable ? <PlusCircleOutlined onClick={() => MKEmitter.emit('addRecord', col.tableId, {...record})} className="mk-editable mk-plus"/> : null}{children}{col.delable ? <DeleteOutlined onClick={() => MKEmitter.emit('delRecord', col.tableId, {...record})} className="mk-editable mk-del"/> : null}</td>) |
| | | // return (<td className={className} style={style}>{children}</td>) |
| | | return (<td className={className} style={style}>{children}</td>) |
| | | } |
| | | } |
| | | |
| | | class BodyAllCell extends React.Component { |
| | | state = { |
| | | err: null |
| | | err: null, |
| | | value: '' |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.props.record), fromJS(nextProps.record)) || |
| | | nextState.err !== this.state.err |
| | | return !is(fromJS(this.props.record), fromJS(nextProps.record)) || !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | MKEmitter.addListener('tdFocus', this.tdFocus) |
| | | UNSAFE_componentWillMount() { |
| | | const { col } = this.props |
| | | |
| | | if (col && col.editable === 'true') { |
| | | this.setState({value: this.props.record[col.field]}) |
| | | } |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps(nextProps) { |
| | | const { col } = this.props |
| | | const { value } = this.state |
| | | |
| | | if (col && col.editable === 'true' && nextProps.record[col.field] !== value) { |
| | | this.setState({value: nextProps.record[col.field]}) |
| | | } |
| | | } |
| | | |
| | | /** |
| | |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('tdFocus', this.tdFocus) |
| | | } |
| | | |
| | | tdFocus = (id) => { |
| | | const { col, record } = this.props |
| | | |
| | | if (id !== col.uuid + record.$$uuid) return |
| | | this.focus() |
| | | } |
| | | |
| | | enterPress = () => { |
| | | const { col, record } = this.props |
| | | |
| | | this.onBlur() |
| | | |
| | | setTimeout(() => { |
| | | if (col.enter === '$next') { |
| | |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | | } else if (col.enter !== '$noAct') { |
| | | MKEmitter.emit('tdFocus', col.enter + record.$$uuid) |
| | | let node = document.getElementById(col.enter + record.$$uuid) |
| | | |
| | | if (node) { |
| | | if (col.triType === 'click') { |
| | | node.click() |
| | | } else { |
| | | node.select && node.select() |
| | | } |
| | | } |
| | | } |
| | | }, 50) |
| | | } |
| | | |
| | | focus = () => { |
| | | const { col, record } = this.props |
| | | |
| | | if (col.editType === 'switch' || col.editType === 'select') { |
| | | let node = document.getElementById(col.uuid + record.$$uuid) |
| | | node && node.click() |
| | | } else { |
| | | let err = null |
| | | let val = record[col.field] !== undefined ? record[col.field] : '' |
| | | |
| | | if (col.type === 'number') { |
| | | val = +val |
| | | if (isNaN(val)) { |
| | | val = 0 |
| | | } |
| | | if (typeof(col.max) === 'number' && val > col.max) { |
| | | err = col.label + '最大为' + col.max |
| | | } else if (typeof(col.min) === 'number' && val < col.min) { |
| | | err = col.label + '最小为' + col.min |
| | | } |
| | | } else if (col.required === 'true' && !val) { |
| | | err = '请填写' + col.label |
| | | } |
| | | |
| | | this.setState({err}, () => { |
| | | let node = document.getElementById(col.uuid + record.$$uuid) |
| | | node && node.select() |
| | | }) |
| | | } |
| | | } |
| | | |
| | | onChange = (val) => { |
| | | const { col } = this.props |
| | | |
| | | if (col.noValue === 'hide' && val === null) { |
| | | this.setState({value: 0}) |
| | | } else { |
| | | this.setState({value: val}) |
| | | } |
| | | } |
| | | |
| | | onBlur = () => { |
| | | const { col, record } = this.props |
| | | const { value } = this.state |
| | | |
| | | let err = null |
| | | let val = value |
| | | |
| | | if (col.type === 'number') { |
| | | val = +val |
| | |
| | | } else if (col.required === 'true' && !val) { |
| | | err = '请填写' + col.label |
| | | } |
| | | |
| | | this.setState({err}) |
| | | MKEmitter.emit('changeRecord', col.tableId, {...record, [col.field]: val}) |
| | | |
| | | if (value !== record[col.field]) { |
| | | MKEmitter.emit('changeRecord', col.tableId, {...record, [col.field]: val}) |
| | | } |
| | | } |
| | | |
| | | onSwitchChange = (val, label) => { |
| | |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | | } else if (col.enter !== '$noAct') { |
| | | MKEmitter.emit('tdFocus', col.enter + record.$$uuid) |
| | | let node = document.getElementById(col.enter + record.$$uuid) |
| | | if (node) { |
| | | if (col.triType === 'click') { |
| | | node.click() |
| | | } else { |
| | | node.select && node.select() |
| | | } |
| | | } |
| | | } |
| | | }, 50) |
| | | |
| | |
| | | } else if (col.enter === '$sub') { |
| | | MKEmitter.emit('subLine', col, record) |
| | | } else if (col.enter !== '$noAct') { |
| | | MKEmitter.emit('tdFocus', col.enter + record.$$uuid) |
| | | let node = document.getElementById(col.enter + record.$$uuid) |
| | | if (node) { |
| | | if (col.triType === 'click') { |
| | | node.click() |
| | | } else { |
| | | node.select && node.select() |
| | | } |
| | | } |
| | | } |
| | | }, 50) |
| | | |
| | |
| | | } |
| | | |
| | | render() { |
| | | let { col, config, record, style, className } = this.props |
| | | let { col, config, record, style, className, ...resProps } = this.props |
| | | const { err } = this.state |
| | | |
| | | if (!col) return (<td {...resProps} className={className} style={style}/>) |
| | | |
| | | let disabled = false |
| | | if (col.ctrlField) { |
| | | disabled = col.ctrlValue.includes(record[col.ctrlField]) |
| | | } |
| | | |
| | | let children = null |
| | | if (col.type === 'text') { |
| | | if (col.editable === 'true') { |
| | | if (col.editable === 'true' && !disabled) { |
| | | let _value = '' |
| | | if (col.editField) { |
| | | _value = record[col.editField] !== undefined ? record[col.editField] : '' |
| | |
| | | |
| | | if (!col.editType || col.editType === 'text') { |
| | | children = (<> |
| | | <Input id={col.uuid + record.$$uuid} defaultValue={_value} onChange={(e) => this.onChange(e.target.value)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> |
| | | {err ? <Tooltip title={err}><ExclamationCircleOutlined /></Tooltip> : null} |
| | | <Input className={err ? 'has-error' : ''} title={err} id={col.uuid + record.$$uuid} defaultValue={_value} onChange={(e) => this.onChange(e.target.value)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> |
| | | </>) |
| | | } else if (col.editType === 'switch') { |
| | | children = ( |
| | |
| | | children = content |
| | | } |
| | | } else if (col.type === 'number') { |
| | | if (col.editable === 'true') { |
| | | if (col.editable === 'true' && !disabled) { |
| | | let _value = record[col.field] !== undefined ? record[col.field] : '' |
| | | |
| | | if (col.noValue === 'hide' && _value === 0) { |
| | | _value = '' |
| | | } |
| | | |
| | | children = (<> |
| | | <InputNumber id={col.uuid + record.$$uuid} defaultValue={_value} onChange={(val) => this.onChange(val)} onPressEnter={this.enterPress}/> |
| | | {err ? <Tooltip title={err}><ExclamationCircleOutlined /></Tooltip> : null} |
| | | <InputNumber className={err ? 'has-error' : ''} title={err} id={col.uuid + record.$$uuid} defaultValue={_value} onChange={(val) => this.onChange(val)} onPressEnter={this.enterPress} onBlur={this.onBlur}/> |
| | | </>) |
| | | } else { |
| | | let content = '' |
| | | try { |
| | | content = parseFloat(record[col.field]) |
| | | if (isNaN(content)) { |
| | | content = '' |
| | | } |
| | | if (col.noValue === 'hide' && content === 0) { |
| | | content = '' |
| | | } |
| | | } catch (e) { |
| | |
| | | |
| | | content = content === undefined ? '' : content |
| | | |
| | | if (col.noValue === 'hide' && content === 0) { |
| | | content = '' |
| | | } |
| | | |
| | | if (content !== '') { |
| | | content = `${col.prefix || ''}${content}${col.postfix || ''}` |
| | | |
| | | if (col.eval === 'false') { |
| | | content = content.replace(/\n/ig, '<br/>').replace(/\s/ig, ' ') |
| | | content = <span dangerouslySetInnerHTML={{__html: content}}></span> |
| | | } |
| | | content = content.replace(/\n/ig, '<br/>').replace(/\s/ig, ' ') |
| | | content = <span dangerouslySetInnerHTML={{__html: content}}></span> |
| | | } |
| | | |
| | | if (col.marks) { |
| | |
| | | children = ( |
| | | <CardCellComponent data={record} cards={config} elements={col.elements}/> |
| | | ) |
| | | } else if (col.type === 'operation') { |
| | | style.padding = '0px 5px' |
| | | } else if (col.type === 'action') { |
| | | style.padding = '0px' |
| | | if (col.style) { |
| | | style = {...style, ...col.style} |
| | | } |
| | | children = ( |
| | | <Button type="link" style={{color: 'rgb(255, 77, 79)', backgroundColor: 'transparent'}} onClick={() => MKEmitter.emit('delRecord', col.tableId, {...record})}>删除</Button> |
| | | <CardCellComponent data={record} cards={config} elements={col.elements}/> |
| | | ) |
| | | } |
| | | |
| | | return (<td className={'editing_all_table_cell ' + className} style={style}>{col.addable ? <PlusCircleOutlined onClick={() => MKEmitter.emit('addRecord', col.tableId, {...record})} className="mk-editable mk-plus"/> : null}{children}{col.delable ? <DeleteOutlined onClick={() => MKEmitter.emit('delRecord', col.tableId, {...record})} className="mk-editable mk-del"/> : null}</td>) |
| | | return (<td className={'editing_all_table_cell ' + className} style={style}>{children}</td>) |
| | | } |
| | | } |
| | | |
| | | class NormalTable extends Component { |
| | | static propTpyes = { |
| | | statFValue: PropTypes.any, // 合计字段数据 |
| | | MenuID: PropTypes.string, // 菜单Id |
| | | setting: PropTypes.object, // 表格全局设置:tableType(表格是否可选、单选、多选)、actionfixed(按钮固定) |
| | | columns: PropTypes.array, // 表格列 |
| | |
| | | total: PropTypes.any, // 总数 |
| | | loading: PropTypes.bool, // 表格加载中 |
| | | refreshdata: PropTypes.func, // 表格中排序列、页码的变化时刷新 |
| | | changeLock: PropTypes.func, |
| | | chgSelectData: PropTypes.func, |
| | | } |
| | | |
| | | state = { |
| | | dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | data: [], |
| | | edData: [], |
| | | edColumns: [], |
| | | selectedRowKeys: [], // 表格中选中行 |
| | | tableId: '', // 表格ID |
| | | pageIndex: 1, // 初始页面索引 |
| | | pageSize: 10, // 每页数据条数 |
| | | columns: null, // 显示列 |
| | | fields: [], |
| | | pickup: false, // 收起未选择项 |
| | | forms: [], |
| | | orderfields: {}, // 排序id与field转换 |
| | | loading: false, |
| | | editable: false, |
| | | pageOptions: [] |
| | | pageOptions: [], |
| | | deForms: null |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { setting, fields, columns } = this.props |
| | | const { setting, fields, columns, BID } = this.props |
| | | let orderfields = {} |
| | | let initEditLine = null |
| | | let edColumns = [] |
| | | |
| | | let _columns = [] |
| | | let deForms = [] |
| | | columns.forEach(item => { |
| | | if (!initEditLine && item.editable === 'true') { |
| | | initEditLine = item |
| | | } |
| | | let _forms = {} |
| | | let hasBid = false |
| | | |
| | | if (item.type === 'text' && item.editable === 'true' && item.editType === 'select' && item.resourceType === '1') { |
| | | let _option = Utils.getSelectQueryOptions(item) |
| | | let getColumns = (cols) => { |
| | | return cols.map(item => { |
| | | let cell = null |
| | | |
| | | if (item.type === 'colspan') { |
| | | cell = { title: item.label, align: item.Align } |
| | | cell.children = getColumns(item.subcols) |
| | | } else { |
| | | if (item.editable === 'true') { |
| | | _forms[item.field] = item |
| | | |
| | | if (window.GLOB.debugger === true || window.debugger === true) { |
| | | console.info(_option.sql) |
| | | if (item.ctrlField) { |
| | | item.ctrlValue = item.ctrlValue.split(',') |
| | | } |
| | | |
| | | if (item.type === 'text' && item.editType === 'select' && item.resourceType === '1') { |
| | | let _option = Utils.getSelectQueryOptions(item) |
| | | |
| | | if (/@BID@/ig.test(_option.sql)) { |
| | | hasBid = true |
| | | } |
| | | |
| | | item.base_sql = _option.sql |
| | | item.arr_field = _option.field |
| | | |
| | | deForms.push(item) |
| | | } |
| | | } |
| | | |
| | | if (item.field) { |
| | | orderfields[item.uuid] = item.field |
| | | } |
| | | |
| | | cell = { |
| | | align: item.Align, |
| | | dataIndex: item.uuid, |
| | | title: item.editable === 'true' ? <span>{item.label}<EditOutlined className="system-color mk-edit-sign"/></span> : item.label, |
| | | sorter: !!(item.field && item.IsSort === 'true'), |
| | | width: item.Width || 120, |
| | | $type: item.type, |
| | | onCell: record => ({ |
| | | record, |
| | | col: item, |
| | | config: item.type === 'custom' || item.type === 'action' ? {setting, columns: fields} : null, |
| | | }) |
| | | } |
| | | } |
| | | |
| | | item.base_sql = window.btoa(window.encodeURIComponent(_option.sql)) |
| | | item.arr_field = _option.field |
| | | |
| | | deForms.push(item) |
| | | } |
| | | |
| | | if (item.field) { |
| | | orderfields[item.uuid] = item.field |
| | | } |
| | | |
| | | let _item = { |
| | | align: item.Align, |
| | | dataIndex: item.uuid, |
| | | title: item.label, |
| | | sorter: item.field && item.IsSort === 'true', |
| | | width: item.Width || 120, |
| | | onCell: record => ({ |
| | | record, |
| | | col: item, |
| | | config: item.type === 'custom' || item.type === 'action' ? {setting, columns: fields} : null, |
| | | }) |
| | | } |
| | | |
| | | if (item.type !== 'action') { |
| | | let _copy = fromJS(_item).toJS() |
| | | _copy.sorter = false |
| | | |
| | | if (item.editable === 'true') { |
| | | _copy.title = <span>{item.label}<EditOutlined className="system-color mk-edit-sign"/></span> |
| | | } |
| | | edColumns.push(_copy) |
| | | } |
| | | _columns.push(_item) |
| | | }) |
| | | |
| | | if (setting.delable !== 'false' && setting.operType !== 'buoyMode') { |
| | | edColumns.push({ |
| | | align: 'center', |
| | | dataIndex: 'mkoperation', |
| | | title: '操作', |
| | | sorter: false, |
| | | width: 100, |
| | | onCell: record => ({ |
| | | record, |
| | | col: {type: 'operation', tableId: setting.tableId}, |
| | | }) |
| | | |
| | | return cell |
| | | }) |
| | | } |
| | | |
| | | // if (setting.borderColor) { // 边框颜色 |
| | | // let style = `#${setting.tableId} table, #${setting.tableId} tr, #${setting.tableId} th, #${setting.tableId} td {border-color: ${setting.borderColor}}` |
| | | // let ele = document.createElement('style') |
| | | // ele.innerHTML = style |
| | | // document.getElementsByTagName('head')[0].appendChild(ele) |
| | | // } |
| | | _columns = getColumns(columns) |
| | | |
| | | let forms = [] |
| | | fields.forEach(item => { |
| | | if (item.field === setting.primaryKey) return |
| | | |
| | | if (_forms[item.field]) { |
| | | forms.push({..._forms[item.field], datatype: item.datatype}) |
| | | } else { |
| | | forms.push(item) |
| | | } |
| | | }) |
| | | |
| | | let size = (setting.pageSize || 10) + '' |
| | | let pageOptions = ['10', '25', '50', '100', '500', '1000'] |
| | |
| | | } |
| | | |
| | | this.setState({ |
| | | forms, |
| | | pageSize: setting.pageSize || 10, |
| | | pageOptions, |
| | | columns: _columns, |
| | | edColumns, |
| | | tableId: setting.tableId, |
| | | orderfields, |
| | | initEditLine, |
| | | editable: setting.editable === 'true' |
| | | orderfields |
| | | }, () => { |
| | | if (deForms.length > 0) { |
| | | this.improveActionForm(deForms) |
| | | if (hasBid && setting.supModule && !BID) { |
| | | this.setState({ deForms }) |
| | | } else { |
| | | this.improveActionForm(deForms, BID) |
| | | } |
| | | } |
| | | |
| | | const element = document.getElementById(setting.tableId) |
| | |
| | | return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps(nextProps) { |
| | | const { BID } = this.props |
| | | const { deForms } = this.state |
| | | |
| | | if (deForms && nextProps.BID !== BID) { |
| | | this.improveActionForm(deForms, nextProps.BID) |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | const { fields, setting } = this.props |
| | | |
| | | this.setState({ |
| | | fields: fields.filter(item => item.field !== setting.primaryKey), |
| | | }) |
| | | |
| | | MKEmitter.addListener('subLine', this.subLine) |
| | | MKEmitter.addListener('nextLine', this.nextLine) |
| | | MKEmitter.addListener('addRecord', this.addLine) |
| | | MKEmitter.addListener('addRecord', this.addRecord) |
| | | MKEmitter.addListener('delRecord', this.delRecord) |
| | | MKEmitter.addListener('resetTable', this.resetTable) |
| | | MKEmitter.addListener('transferData', this.transferData) |
| | |
| | | } |
| | | MKEmitter.removeListener('subLine', this.subLine) |
| | | MKEmitter.removeListener('nextLine', this.nextLine) |
| | | MKEmitter.removeListener('addRecord', this.addLine) |
| | | MKEmitter.removeListener('addRecord', this.addRecord) |
| | | MKEmitter.removeListener('delRecord', this.delRecord) |
| | | MKEmitter.removeListener('resetTable', this.resetTable) |
| | | MKEmitter.removeListener('transferData', this.transferData) |
| | |
| | | } |
| | | |
| | | transferData = (menuid, data, type) => { |
| | | if (menuid !== this.props.MenuID) return |
| | | const { MenuID, setting } = this.props |
| | | |
| | | if (menuid !== MenuID) return |
| | | |
| | | if (type !== 'line') { |
| | | this.setState({data: data || []}) |
| | | this.setState({edData: data}) |
| | | |
| | | if (this.state.editable && !this.state.pickup) { |
| | | if (setting.addable && data.length === 0) { |
| | | setTimeout(() => { |
| | | this.pickupChange() |
| | | }, 200) |
| | | this.plusLine(true) |
| | | }, 10) |
| | | } |
| | | } else if (type === 'line' && data.$$uuid) { |
| | | let _data = this.state.data.map(item => { |
| | | if (item.$$uuid === data.$$uuid) { |
| | | return data |
| | | } else { |
| | | return item |
| | | } |
| | | }) |
| | | } else if (type === 'line') { |
| | | let _edData = this.state.edData.map(item => { |
| | | if (item.$$uuid === data.$$uuid) { |
| | | return data |
| | |
| | | } |
| | | }) |
| | | |
| | | this.setState({edData: _edData, data: _data}) |
| | | this.setState({edData: _edData}) |
| | | } |
| | | this.setState({editable: false}) |
| | | } |
| | | |
| | | improveActionForm = (deForms) => { |
| | | const { BID, setting } = this.props |
| | | improveActionForm = (deForms, BID) => { |
| | | const { setting } = this.props |
| | | |
| | | let deffers = [] |
| | | let mainItems = [] // 云端或单点数据 |
| | | let localItems = [] // 本地数据 |
| | | let cache = setting.cache !== 'false' |
| | | let debug = window.GLOB.debugger === true || window.debugger === true |
| | | let _sql = `Declare @mk_departmentcode nvarchar(512),@mk_organization nvarchar(512),@mk_user_type nvarchar(20) select @mk_departmentcode='${sessionStorage.getItem('departmentcode') || ''}',@mk_organization='${sessionStorage.getItem('organization') || ''}',@mk_user_type='${sessionStorage.getItem('mk_user_type') || ''}'\n` |
| | | let _sso = _sql |
| | | |
| | | deForms.forEach(item => { |
| | | if (item.database === 'sso') { |
| | | mainItems.push(`select '${item.uuid}' as obj_name,'${item.arr_field}' as arr_field,'${item.base_sql}' as LText`) |
| | | let sql = _sso + item.base_sql |
| | | _sso = '' |
| | | |
| | | sql = sql.replace(/@BID@/ig, `'${BID}'`) |
| | | |
| | | if (debug) { |
| | | console.info(sql) |
| | | } |
| | | mainItems.push(`select '${item.uuid}' as obj_name,'${item.arr_field}' as arr_field,'${window.btoa(window.encodeURIComponent(sql))}' as LText`) |
| | | } else { |
| | | localItems.push(`select '${item.uuid}' as obj_name,'${item.arr_field}' as arr_field,'${item.base_sql}' as LText`) |
| | | let sql = _sql + item.base_sql |
| | | _sql = '' |
| | | |
| | | sql = sql.replace(/@BID@/ig, `'${BID}'`) |
| | | |
| | | if (debug) { |
| | | console.info(sql) |
| | | } |
| | | localItems.push(`select '${item.uuid}' as obj_name,'${item.arr_field}' as arr_field,'${window.btoa(window.encodeURIComponent(sql))}' as LText`) |
| | | } |
| | | }) |
| | | |
| | |
| | | } |
| | | |
| | | resetFormList = (result) => { |
| | | const { columns } = this.props |
| | | const { edColumns } = this.state |
| | | const { columns } = this.state |
| | | |
| | | let _edColumns = [] |
| | | |
| | | let reCols = {} |
| | | columns.forEach(item => { |
| | | this.props.columns.forEach(item => { |
| | | if (item.resourceType === '1' && result[item.uuid] && result[item.uuid].length > 0) { |
| | | let options = [] |
| | | let _map = new Map() |
| | |
| | | } |
| | | }) |
| | | |
| | | _edColumns = edColumns.map(item => { |
| | | _edColumns = columns.map(item => { |
| | | if (reCols[item.dataIndex]) { |
| | | item.onCell = record => ({ |
| | | record, |
| | |
| | | return item |
| | | }) |
| | | |
| | | if (this.state.pickup) { |
| | | this.setState({ |
| | | pickup: false |
| | | }, () => { |
| | | this.setState({pickup: true, edColumns: _edColumns}) |
| | | }) |
| | | } else { |
| | | this.setState({edColumns: _edColumns}) |
| | | } |
| | | this.setState({columns: []}, () => { |
| | | this.setState({columns: _edColumns}) |
| | | }) |
| | | } |
| | | |
| | | nextLine = (col, uuid) => { |
| | | const { setting } = this.props |
| | | const { edData, initEditLine, tableId } = this.state |
| | | const { edData, tableId } = this.state |
| | | |
| | | if (col.tableId !== tableId) return |
| | | |
| | | let index = edData.findIndex(item => item.$$uuid === uuid) |
| | | let next = edData[index + 1] || null |
| | | |
| | | if (next && initEditLine) { |
| | | MKEmitter.emit('tdFocus', initEditLine.uuid + next.$$uuid) |
| | | } else if (setting.addable === 'true') { |
| | | |
| | | if (next) { |
| | | let node = document.getElementById(setting.initId + next.$$uuid) |
| | | if (node) { |
| | | if (setting.editType === 'multi') { |
| | | if (setting.triType === 'click') { |
| | | node.click() |
| | | } else { |
| | | node.select && node.select() |
| | | } |
| | | } else { |
| | | node.click() |
| | | } |
| | | } |
| | | } else if (setting.addable) { |
| | | setTimeout(() => { |
| | | this.plusLine() |
| | | }, 10) |
| | |
| | | } |
| | | |
| | | subLine = (col, record) => { |
| | | const { tableId, fields, edData } = this.state |
| | | const { tableId, edData } = this.state |
| | | |
| | | if (col && col.tableId !== tableId) return |
| | | |
| | | if (edData.filter(item => !item.$origin).length > 1) { |
| | | setTimeout(() => { |
| | | this.submit(edData) |
| | | }, 10) |
| | | return |
| | | } |
| | | |
| | | setTimeout(() => { |
| | | let item = fromJS(record).toJS() |
| | | let line = [] |
| | | fields.forEach(col => { |
| | | if (col.editable !== 'true' || item.$deleted) { |
| | | if (col.type === 'number') { |
| | | item[col.field] = +item[col.field] |
| | | if (isNaN(item[col.field])) { |
| | | item[col.field] = 0 |
| | | } |
| | | } else { |
| | | item[col.field] = item[col.field] !== undefined ? (item[col.field] + '') : '' |
| | | } |
| | | return |
| | | } |
| | | if (col.type === 'text') { |
| | | let val = item[col.field] !== undefined ? (item[col.field] + '') : '' |
| | | if (col.required === 'true' && !val) { |
| | | line.push(`${col.label}不可为空`) |
| | | } |
| | | item[col.field] = val |
| | | } else if (col.type === 'number') { |
| | | let val = item[col.field] |
| | | if (!val && val !== 0) { |
| | | line.push(`${col.label}不可为空`) |
| | | return |
| | | } |
| | | val = +val |
| | | if (isNaN(val)) { |
| | | line.push(`${col.label}数据格式错误`) |
| | | return |
| | | } |
| | | |
| | | val = +val.toFixed(col.decimal || 0) |
| | | |
| | | if (typeof(col.max) === 'number' && val > col.max) { |
| | | line.push(`${col.label}不可大于${col.max}`) |
| | | } else if (typeof(col.min) === 'number' && val < col.min) { |
| | | line.push(`${col.label}不可小于${col.min}`) |
| | | } |
| | | |
| | | item[col.field] = val |
| | | } |
| | | }) |
| | | |
| | | let err = line.join(',') |
| | | |
| | | if (err) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: err, |
| | | duration: 5 |
| | | }) |
| | | } else { |
| | | this.submit([item], 'simple') |
| | | let _data = edData.map(item => { |
| | | if (item.$$uuid === record.$$uuid) { |
| | | item.$origin = false |
| | | } |
| | | }, 10) |
| | | return item |
| | | }) |
| | | |
| | | this.setState({edData: _data}, () => { |
| | | this.submit() |
| | | }) |
| | | } |
| | | |
| | | plusLine = () => { |
| | | const { edData, fields, initEditLine } = this.state |
| | | plusLine = (auto) => { |
| | | const { setting } = this.props |
| | | const { edData, forms } = this.state |
| | | |
| | | let item = {...edData[edData.length - 1]} |
| | | let item = edData.length > 0 ? {...edData[edData.length - 1]} : {} |
| | | |
| | | item.$$uuid = Utils.getguid() |
| | | item.$type = 'add' |
| | | item.$forbid = true |
| | | item.$Index = '' |
| | | |
| | | fields.forEach(col => { |
| | | forms.forEach(col => { |
| | | if (col.initval !== '$copy') { |
| | | item[col.field] = col.initval |
| | | } |
| | |
| | | }) |
| | | |
| | | this.setState({edData: [...edData, item]}, () => { |
| | | MKEmitter.emit('tdFocus', initEditLine.uuid + item.$$uuid) |
| | | let node = document.getElementById(setting.initId + item.$$uuid) |
| | | if (node && !auto) { |
| | | if (setting.editType === 'multi') { |
| | | if (setting.triType === 'click') { |
| | | node.click() |
| | | } else { |
| | | node.select && node.select() |
| | | } |
| | | } else { |
| | | node.click() |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | |
| | |
| | | const { tableId, edData } = this.state |
| | | |
| | | if (id !== tableId) return |
| | | |
| | | let _data = [] |
| | | |
| | | |
| | | if (record.$type === 'add') { |
| | | _data = edData.filter(item => item.$$uuid !== record.$$uuid) |
| | | let _data = edData.filter(item => item.$$uuid !== record.$$uuid) |
| | | this.setState({edData: _data}) |
| | | } else { |
| | | _data = edData.map(item => { |
| | | let _data = edData.map(item => { |
| | | if (item.$$uuid === record.$$uuid) { |
| | | record.$deleted = true |
| | | record.$origin = false |
| | |
| | | } |
| | | }) |
| | | |
| | | if (setting.commit === 'simple' && record.$deleted) { |
| | | this.subLine(null, record) |
| | | } |
| | | this.setState({edData: _data}, () => { |
| | | if (setting.commit === 'simple' && record.$deleted) { |
| | | this.submit() |
| | | } |
| | | }) |
| | | } |
| | | |
| | | this.setState({edData: _data}) |
| | | } |
| | | |
| | | changeRecord = (id, record) => { |
| | | const { setting } = this.props |
| | | const { tableId } = this.state |
| | | |
| | | if (id !== tableId) return |
| | | |
| | | let lock = record.$lock |
| | | |
| | | let _data = this.state.edData.map(item => { |
| | | if (item.$$uuid === record.$$uuid) { |
| | | record.$origin = false |
| | | record.$lock = true |
| | | |
| | | delete record.$forbid |
| | | |
| | | return record |
| | | } else { |
| | | return item |
| | | } |
| | | }) |
| | | |
| | | this.setState({edData: _data}) |
| | | this.setState({edData: _data}, () => { |
| | | if (setting.tableType && setting.hasAction && !lock && this.state.selectedRowKeys.includes(record.$$uuid)) { |
| | | this.selectdata(this.state.selectedRowKeys) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | addLine = (id, record) => { |
| | | addRecord = (id, record) => { |
| | | const { BID } = this.props |
| | | const { edData, fields, tableId } = this.state |
| | | const { edData, forms, tableId } = this.state |
| | | |
| | | if (id) { |
| | | if (id !== tableId) return |
| | | let _edData = fromJS(edData).toJS() |
| | | let index = _edData.findIndex(item => record.$$uuid === item.$$uuid) |
| | | if (id !== tableId) return |
| | | |
| | | let item = {} |
| | | let _edData = fromJS(edData).toJS() |
| | | let item = {} |
| | | let index = null |
| | | let copy = edData.length > 0 ? {...edData[edData.length - 1]} : null |
| | | |
| | | item.$$uuid = Utils.getguid() |
| | | item.$type = 'add' |
| | | item.$Index = '' |
| | | item.$$BID = BID || '' |
| | | |
| | | fields.forEach(col => { |
| | | if (col.initval !== '$copy') { |
| | | item[col.field] = col.initval |
| | | } |
| | | if (col.type === 'number') { |
| | | item[col.field] = +item[col.field] |
| | | if (isNaN(item[col.field])) { |
| | | item[col.field] = 0 |
| | | } |
| | | } |
| | | |
| | | if (item[col.field] === undefined) { |
| | | item[col.field] = '' |
| | | } |
| | | }) |
| | | if (record) { |
| | | index = _edData.findIndex(item => record.$$uuid === item.$$uuid) |
| | | index = index === -1 ? null : index |
| | | |
| | | _edData.splice(index, 0, item) |
| | | |
| | | this.setState({edData: _edData}) |
| | | } else { |
| | | let item = {} |
| | | if (edData.length > 0) { |
| | | item = {...edData[edData.length - 1]} |
| | | item.$$uuid = Utils.getguid() |
| | | item.$type = 'add' |
| | | item.$Index = '' |
| | | } else { |
| | | item.$$uuid = Utils.getguid() |
| | | item.$type = 'add' |
| | | item.$Index = '' |
| | | item.$$BID = BID || '' |
| | | } |
| | | |
| | | fields.forEach(col => { |
| | | if (col.initval !== '$copy') { |
| | | item[col.field] = col.initval |
| | | } |
| | | if (col.type === 'number') { |
| | | item[col.field] = +item[col.field] |
| | | if (isNaN(item[col.field])) { |
| | | item[col.field] = 0 |
| | | } |
| | | } |
| | | |
| | | if (item[col.field] === undefined) { |
| | | item[col.field] = '' |
| | | } |
| | | }) |
| | | |
| | | this.setState({edData: [...edData, item]}) |
| | | copy = {...record} |
| | | } |
| | | |
| | | if (copy) { |
| | | item = {...copy} |
| | | } |
| | | |
| | | item.$$uuid = Utils.getguid() |
| | | item.$type = 'add' |
| | | item.$Index = '' |
| | | item.$forbid = true |
| | | item.$$BID = BID || '' |
| | | |
| | | forms.forEach(col => { |
| | | if (col.initval !== '$copy') { |
| | | item[col.field] = col.initval |
| | | } |
| | | if (col.type === 'number') { |
| | | item[col.field] = +item[col.field] |
| | | if (isNaN(item[col.field])) { |
| | | item[col.field] = 0 |
| | | } |
| | | } |
| | | |
| | | if (item[col.field] === undefined) { |
| | | item[col.field] = '' |
| | | } |
| | | }) |
| | | |
| | | if (index === null) { |
| | | _edData.push(item) |
| | | } else { |
| | | _edData.splice(index, 0, item) |
| | | } |
| | | |
| | | this.setState({edData: _edData}) |
| | | } |
| | | |
| | | checkData = () => { |
| | | const { edData, fields } = this.state |
| | | const { setting } = this.props |
| | | const { edData, forms } = this.state |
| | | |
| | | if (edData.length === 0) { |
| | | notification.warning({ |
| | |
| | | message: '提交数据不可为空!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | return null |
| | | } |
| | | |
| | | let data = fromJS(edData).toJS() |
| | | |
| | | data = data.filter(item => !item.$forbid) |
| | | if (setting.commit === 'change' || setting.commit === 'simple') { |
| | | data = data.filter(item => !item.$origin) |
| | | } |
| | | |
| | | if (data.length === 0) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '数据未修改,不可提交!', |
| | | duration: 5 |
| | | }) |
| | | return null |
| | | } |
| | | |
| | | let err = '' |
| | | let Index = 1 |
| | | let data = fromJS(edData).toJS().map(item => { |
| | | data = data.map(item => { |
| | | let line = [] |
| | | fields.forEach(col => { |
| | | forms.forEach(col => { |
| | | if (col.editable !== 'true' || item.$deleted) { |
| | | if (col.type === 'number') { |
| | | item[col.field] = +item[col.field] |
| | |
| | | item[col.field] = val |
| | | } else if (col.type === 'number') { |
| | | let val = item[col.field] |
| | | if (!val && val !== 0) { |
| | | if (col.noValue === 'hide' && !val) { |
| | | val = 0 |
| | | } else if (!val && val !== 0) { |
| | | line.push(`${col.label}不可为空`) |
| | | return |
| | | } |
| | |
| | | message: err, |
| | | duration: 5 |
| | | }) |
| | | } else { |
| | | this.submit(data) |
| | | |
| | | return null |
| | | } |
| | | |
| | | return data |
| | | } |
| | | |
| | | submit = (data, type) => { |
| | | submit = () => { |
| | | const { submit, BID, setting } = this.props |
| | | const { fields } = this.state |
| | | const { forms } = this.state |
| | | |
| | | if (type !== 'simple' && (setting.commit === 'change' || setting.commit === 'simple')) { |
| | | data = data.filter(item => !item.$origin) |
| | | } |
| | | |
| | | if (data.length === 0) { |
| | | if (setting.supModule && !BID) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '数据未修改,不可提交!', |
| | | message: '需要上级主键值!', |
| | | duration: 5 |
| | | }) |
| | | |
| | | return |
| | | } |
| | | |
| | | let result = getEditTableSql(submit, data, fields) |
| | | let data = this.checkData() |
| | | |
| | | if (!data) return |
| | | |
| | | let result = getEditTableSql(submit, data, forms) |
| | | |
| | | let param = { |
| | | excel_in: result.lines, |
| | |
| | | |
| | | Api.genericInterface(param).then((res) => { |
| | | if (res.status) { |
| | | if (type === 'simple') { |
| | | this.updataLine(data[0]) |
| | | this.execSuccess(res, type) |
| | | } else { |
| | | this.execSuccess(res) |
| | | } |
| | | this.execSuccess(res) |
| | | } else { |
| | | this.execError(res) |
| | | } |
| | |
| | | |
| | | Api.genericInterface(param).then((res) => { |
| | | if (res.status) { |
| | | if (type === 'simple') { |
| | | this.updataLine(data[0]) |
| | | this.execSuccess(res, type) |
| | | } else { |
| | | this.execSuccess(res) |
| | | } |
| | | this.execSuccess(res) |
| | | } else { |
| | | this.execError(res) |
| | | } |
| | |
| | | MKEmitter.emit('reloadData', this.props.MenuID, item.$$uuid, item) |
| | | } |
| | | |
| | | execSuccess = (res, type) => { |
| | | execSuccess = (res) => { |
| | | const { submit } = this.props |
| | | |
| | | if (res && res.ErrCode === 'S') { // 执行成功 |
| | |
| | | loading: false |
| | | }) |
| | | |
| | | if (type === 'simple') return |
| | | |
| | | if (submit.closetab === 'true') { |
| | | MKEmitter.emit('popclose') |
| | | } |
| | | |
| | | if (submit.execSuccess !== 'never') { |
| | | this.repick() |
| | | MKEmitter.emit('refreshByButtonResult', submit.$menuId, submit.execSuccess, submit) |
| | | } |
| | | } |
| | |
| | | }) |
| | | |
| | | if (submit.execError !== 'never') { |
| | | this.repick() |
| | | MKEmitter.emit('refreshByButtonResult', submit.$menuId, submit.execError, submit) |
| | | } |
| | | } |
| | | |
| | | repick = () => { |
| | | const { setting } = this.props |
| | | const { data } = this.state |
| | | |
| | | if (setting.submittal === 'true') { |
| | | this.setState({editable: true}) |
| | | } |
| | | |
| | | this.props.changeLock(false) |
| | | this.setState({ |
| | | data: [], |
| | | edData: [], |
| | | pickup: false, |
| | | }, () => { |
| | | this.setState({ |
| | | data: data, |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * |
| | | * @description 选中行 |
| | | */ |
| | | onSelectChange = selectedRowKeys => { |
| | | this.setState({ selectedRowKeys }) |
| | |
| | | /** |
| | | * @description 点击整行,触发切换, 判断是否可选,单选或多选,进行对应操作 |
| | | */ |
| | | changeRow = (index) => { |
| | | changeRow = (id) => { |
| | | const { setting } = this.props |
| | | |
| | | if (!setting.tableType || this.state.pickup) return |
| | | if (!setting.tableType) return |
| | | |
| | | let newkeys = fromJS(this.state.selectedRowKeys).toJS() |
| | | |
| | | let activeId = '' |
| | | if (setting.tableType === 'radio') { |
| | | activeId = index |
| | | newkeys = [index] |
| | | activeId = id |
| | | newkeys = [id] |
| | | this.setState({ selectedRowKeys: newkeys }) |
| | | } else { |
| | | if (newkeys.includes(index)) { |
| | | newkeys = newkeys.filter(item => item !== index) |
| | | if (newkeys.includes(id)) { |
| | | newkeys = newkeys.filter(item => item !== id) |
| | | |
| | | if (newkeys.length > 0) { |
| | | activeId = newkeys.slice(-1)[0] |
| | | } |
| | | } else { |
| | | activeId = index |
| | | newkeys.push(index) |
| | | activeId = id |
| | | newkeys.push(id) |
| | | } |
| | | |
| | | this.setState({ selectedRowKeys: newkeys }) |
| | |
| | | |
| | | changedata = (id) => { |
| | | const { MenuID } = this.props |
| | | const { data } = this.state |
| | | const { edData } = this.state |
| | | |
| | | let _data = '' |
| | | |
| | | if (id) { |
| | | _data = data.filter(item => item.$$uuid === id)[0] || '' |
| | | _data = edData.filter(item => item.$$uuid === id)[0] || '' |
| | | } |
| | | |
| | | MKEmitter.emit('resetSelectLine', MenuID, id, _data) |
| | | } |
| | | |
| | | selectdata = (keys) => { |
| | | const { data } = this.state |
| | | const { edData } = this.state |
| | | |
| | | let _data = data.filter(item => keys.includes(item.$$uuid)) |
| | | let _data = edData.filter(item => keys.includes(item.$$uuid)) |
| | | |
| | | this.props.chgSelectData(_data) |
| | | } |
| | |
| | | } |
| | | } |
| | | |
| | | pickupChange = () => { |
| | | const { submit, MenuID, setting } = this.props |
| | | const { data } = this.state |
| | | |
| | | let pickup = !this.state.pickup |
| | | |
| | | if (!submit.sheet) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '提交按钮尚未设置,不可编辑!', |
| | | duration: 5 |
| | | }) |
| | | return |
| | | } |
| | | |
| | | if (!pickup && this.state.edData.filter(item => !item.$origin).length > 0) { |
| | | const _this = this |
| | | confirm({ |
| | | title: '数据已修改,确定放弃保存吗?', |
| | | onOk() { |
| | | _this.setState({ |
| | | data: [], |
| | | edData: [], |
| | | pickup |
| | | }, () => { |
| | | _this.setState({ |
| | | data: data, |
| | | edData: pickup ? fromJS(data).toJS() : [] |
| | | }) |
| | | }) |
| | | }, |
| | | onCancel() {} |
| | | }) |
| | | } else { |
| | | pickup && MKEmitter.emit('resetSelectLine', MenuID, '', '') |
| | | pickup && this.props.chgSelectData([]) |
| | | let keys = this.state.selectedRowKeys |
| | | this.setState({ |
| | | data: [], |
| | | edData: [], |
| | | selectedRowKeys: [], |
| | | pickup, |
| | | loading: false, |
| | | editable: false |
| | | }, () => { |
| | | if (pickup && setting.tableType === 'checkbox' && keys.length > 0) { |
| | | this.setState({ |
| | | data: data, |
| | | edData: fromJS(data).toJS().filter(item => { |
| | | item.$origin = false |
| | | |
| | | return keys.includes(item.$$uuid) |
| | | }) |
| | | }) |
| | | } else { |
| | | this.setState({ |
| | | data: data, |
| | | edData: pickup ? fromJS(data).toJS() : [] |
| | | }) |
| | | } |
| | | }) |
| | | |
| | | } |
| | | this.props.changeLock(pickup) |
| | | } |
| | | |
| | | render() { |
| | | const { setting, statFValue, lineMarks, submit } = this.props |
| | | const { pickup, tableId, data, edData, columns, edColumns, loading, pageOptions, selectedRowKeys } = this.state |
| | | const { setting, lineMarks, submit } = this.props |
| | | const { tableId, edData, columns, loading, pageOptions, selectedRowKeys } = this.state |
| | | |
| | | const components = { |
| | | body: { |
| | | row: BodyRow, |
| | | cell: setting.editType !== 'multi' || !pickup ? BodyCell : BodyAllCell |
| | | cell: setting.editType !== 'multi' ? BodyCell : BodyAllCell |
| | | } |
| | | } |
| | | |
| | | // 数据收起时,过滤已选数据 |
| | | let _data = data |
| | | let _columns = columns |
| | | |
| | | if (pickup) { |
| | | _data = edData |
| | | _data = _data.filter(item => !item.$deleted) |
| | | _columns = edColumns |
| | | } |
| | | let _data = edData.filter(item => !item.$deleted) |
| | | |
| | | // 设置表格选择属性:单选、多选、不可选 |
| | | let rowSelection = null |
| | | if (setting.tableType && !pickup) { |
| | | if (setting.tableType) { |
| | | rowSelection = { |
| | | selectedRowKeys, |
| | | type: (setting.tableType === 'radio') ? 'radio' : 'checkbox', |
| | |
| | | } |
| | | |
| | | let _pagination = false |
| | | if (!pickup && setting.laypage !== 'false' && setting.laypage !== false) { |
| | | if (setting.laypage) { |
| | | _pagination = { |
| | | current: this.state.pageIndex, |
| | | pageSize: this.state.pageSize, |
| | | pageSizeOptions: pageOptions, |
| | | showSizeChanger: true, |
| | | total: this.props.total || 0, |
| | | showTotal: (total, range) => `${range[0]}-${range[1]} ${this.state.dict['main.pagination.of']} ${total} ${this.state.dict['main.pagination.items']}` |
| | | showTotal: (total, range) => `${range[0]}-${range[1]} 共 ${total} 条` |
| | | } |
| | | } |
| | | |
| | | let _footer = '' |
| | | |
| | | if (!pickup && statFValue && statFValue.length > 0) { |
| | | _footer = statFValue.map(f => `${f.label}(合计):${f.value}`).join(';') |
| | | } |
| | | |
| | | let height = setting.height || false |
| | | if (height && height <= 100) { |
| | | height = height + 'vh' |
| | | } |
| | | |
| | | return ( |
| | | <> |
| | | {submit.hasAction && pickup ? <div className="edit-custom-table-leftbtn-wrap"> |
| | | <Button style={submit.style} onClick={() => setTimeout(() => {this.checkData()}, 10)} loading={loading} className="submit-table" type="link">提交</Button> |
| | | </div> : null} |
| | | <div className="edit-custom-table-btn-wrap" style={submit.wrapStyle}> |
| | | {!submit.hasAction && pickup ? <Button style={submit.style} onClick={() => setTimeout(() => {this.checkData()}, 10)} loading={loading} className="submit-table" type="link">提交</Button> : null} |
| | | <Switch title="编辑" className="main-pickup" checkedChildren="开" unCheckedChildren="关" disabled={loading || this.props.loading} checked={pickup} onChange={this.pickupChange} /> |
| | | <Button style={submit.style} onClick={() => setTimeout(() => {this.submit()}, 10)} loading={loading} className="submit-table" type="link">提交</Button> |
| | | </div> |
| | | <div className={`edit-custom-table ${pickup ? 'editable' : ''} ${setting.tableHeader || ''} ${setting.operType || ''} ${height ? 'fixed-height' : ''} ${setting.mode || ''} table-vertical-${setting.vertical || ''}`} id={tableId}> |
| | | <div className={`edit-custom-table ${setting.tableHeader || ''} ${height ? 'fixed-height' : ''} ${setting.mode || ''} table-vertical-${setting.vertical || ''} mk-edit-${setting.editType || 'simple'}`} id={tableId}> |
| | | <Table |
| | | rowKey="$$uuid" |
| | | components={components} |
| | | // style={setting.style} |
| | | size={setting.size || 'middle'} |
| | | bordered={setting.bordered !== 'false'} |
| | | rowSelection={rowSelection} |
| | | columns={_columns} |
| | | columns={columns} |
| | | dataSource={_data} |
| | | loading={this.props.loading} |
| | | scroll={{ x: '100%', y: height }} |
| | | onRow={(record, index) => { |
| | | return { |
| | | lineMarks, |
| | | title: setting.tipField ? record[setting.tipField] : '', |
| | | data: record, |
| | | onClick: () => {this.changeRow(record.$$uuid)}, |
| | | } |
| | |
| | | pagination={_pagination} |
| | | /> |
| | | {_footer ? <div className={'normal-table-footer ' + (_pagination ? 'pagination' : '')}>{_footer}</div> : null} |
| | | {pickup && setting.addable === 'true' ? <Button className="mk-add-line" onClick={() => this.addLine()} disabled={this.props.loading} type="link"><PlusOutlined /></Button> : null} |
| | | {pickup && _data.length > 10 ? <Button style={submit.style} onClick={() => setTimeout(() => {this.checkData()}, 10)} loading={loading} className="submit-footer-table" type="link">提交</Button> : null} |
| | | {_data.length > 10 ? <Button style={submit.style} onClick={() => setTimeout(() => {this.submit()}, 10)} loading={loading} className="submit-footer-table" type="link">提交</Button> : null} |
| | | </div> |
| | | </> |
| | | ) |