From 7b0dbecd1d6155d26ec67be0a47a16264c738c85 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期二, 09 五月 2023 14:48:10 +0800 Subject: [PATCH] 2023-05-09 --- src/tabviews/custom/components/table/edit-table/normalTable/index.jsx | 852 ++++++++++++++++++++++++-------------------------------- 1 files changed, 363 insertions(+), 489 deletions(-) diff --git a/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx b/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx index 997e630..94d02eb 100644 --- a/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx +++ b/src/tabviews/custom/components/table/edit-table/normalTable/index.jsx @@ -1,8 +1,8 @@ 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' @@ -17,7 +17,6 @@ import './index.scss' const { Paragraph } = Typography -const { confirm } = Modal const CardCellComponent = asyncComponent(() => import('@/tabviews/custom/components/card/cardcellList')) class BodyRow extends React.Component { @@ -99,17 +98,12 @@ 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)) } /** @@ -119,17 +113,6 @@ this.setState = () => { return } - MKEmitter.removeListener('tdFocus', this.tdFocus) - } - - tdFocus = (id) => { - const { col, record } = this.props - - if (id !== col.uuid + record.$$uuid) return - - if (col.ctrlField && col.ctrlValue.includes(record[col.ctrlField])) return - - this.focus() } enterPress = () => { @@ -143,7 +126,8 @@ } 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) @@ -154,6 +138,8 @@ 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}, () => { @@ -214,6 +200,7 @@ } else if (col.required === 'true' && !val) { err = '璇峰~鍐�' + col.label } + this.setState({value: val, err}) } @@ -228,7 +215,8 @@ } 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) @@ -272,7 +260,8 @@ } 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) @@ -337,8 +326,7 @@ 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 = '' @@ -374,9 +362,7 @@ } } 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 { @@ -387,6 +373,9 @@ try { content = parseFloat(record[col.field]) if (isNaN(content)) { + content = '' + } + if (col.noValue === 'hide' && content === 0) { content = '' } } catch (e) { @@ -431,15 +420,16 @@ 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 { @@ -477,6 +467,10 @@ } content = content === undefined ? '' : content + + if (col.noValue === 'hide' && content === 0) { + content = '' + } if (content !== '') { content = `${col.prefix || ''}${content}${col.postfix || ''}` @@ -518,30 +512,37 @@ 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]}) + } } /** @@ -551,18 +552,12 @@ 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') { @@ -570,46 +565,35 @@ } 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 @@ -624,8 +608,12 @@ } 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) => { @@ -637,7 +625,14 @@ } 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) @@ -679,7 +674,14 @@ } 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) @@ -687,8 +689,10 @@ } 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) { @@ -707,8 +711,7 @@ 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 = ( @@ -769,15 +772,22 @@ } else if (col.type === 'number') { 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) { @@ -854,6 +864,10 @@ content = content === undefined ? '' : content + if (col.noValue === 'hide' && content === 0) { + content = '' + } + if (content !== '') { content = `${col.prefix || ''}${content}${col.postfix || ''}` content = content.replace(/\n/ig, '<br/>').replace(/\s/ig, ' ') @@ -886,20 +900,22 @@ 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, // 琛ㄦ牸鍏ㄥ眬璁剧疆锛歵ableType锛堣〃鏍兼槸鍚﹀彲閫夈�佸崟閫夈�佸閫夛級銆乤ctionfixed锛堟寜閽浐瀹氾級 columns: PropTypes.array, // 琛ㄦ牸鍒� @@ -909,37 +925,32 @@ 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, // 鏄剧ず鍒� forms: [], - pickup: false, // 鏀惰捣鏈�夋嫨椤� orderfields: {}, // 鎺掑簭id涓巉ield杞崲 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 = [] let _forms = {} + let hasBid = false let getColumns = (cols) => { return cols.map(item => { @@ -951,26 +962,23 @@ } else { if (item.editable === 'true') { _forms[item.field] = item - if (!initEditLine) { - initEditLine = item - } if (item.ctrlField) { item.ctrlValue = item.ctrlValue.split(',') } - } - - if (item.type === 'text' && item.editable === 'true' && item.editType === 'select' && item.resourceType === '1') { - let _option = Utils.getSelectQueryOptions(item) - - if (window.GLOB.debugger === true || window.debugger === true) { - console.info(_option.sql) + + 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) } - - item.base_sql = window.btoa(window.encodeURIComponent(_option.sql)) - item.arr_field = _option.field - - deForms.push(item) } if (item.field) { @@ -980,7 +988,7 @@ cell = { align: item.Align, dataIndex: item.uuid, - title: item.label, + 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, @@ -995,6 +1003,7 @@ return cell }) } + _columns = getColumns(columns) let forms = [] @@ -1007,32 +1016,6 @@ forms.push(item) } }) - - _columns.forEach(item => { - if (item.$type === 'action') return - - 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) - }) - - 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}, - }) - }) - } let size = (setting.pageSize || 10) + '' let pageOptions = ['10', '25', '50', '100', '500', '1000'] @@ -1047,14 +1030,15 @@ 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) @@ -1069,10 +1053,19 @@ 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 () { 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) @@ -1088,7 +1081,7 @@ } 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) @@ -1096,24 +1089,19 @@ } 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 @@ -1122,24 +1110,42 @@ } }) - 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`) } }) @@ -1222,13 +1228,12 @@ } 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() @@ -1270,7 +1275,7 @@ } }) - _edColumns = edColumns.map(item => { + _edColumns = columns.map(item => { if (reCols[item.dataIndex]) { item.onCell = record => ({ record, @@ -1281,29 +1286,34 @@ 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) @@ -1315,83 +1325,31 @@ } subLine = (col, record) => { - const { tableId, forms, 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 = [] - forms.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, forms, 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 = '' forms.forEach(col => { @@ -1410,7 +1368,18 @@ }) 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() + } + } }) } @@ -1419,13 +1388,12 @@ 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 @@ -1436,101 +1404,97 @@ } }) - 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, 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 || '' - - 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 (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 || '' - } - - 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] = '' - } - }) - - 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 { setting } = this.props const { edData, forms } = this.state if (edData.length === 0) { @@ -1539,11 +1503,28 @@ 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 = [] forms.forEach(col => { if (col.editable !== 'true' || item.$deleted) { @@ -1565,7 +1546,9 @@ 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 } @@ -1603,27 +1586,30 @@ message: err, duration: 5 }) - } else { - this.submit(data) + + return null } + + return data } - submit = (data, type) => { + submit = () => { const { submit, BID, setting } = this.props 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 data = this.checkData() + + if (!data) return let result = getEditTableSql(submit, data, forms) @@ -1664,12 +1650,7 @@ 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) } @@ -1681,12 +1662,7 @@ 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) } @@ -1715,7 +1691,7 @@ MKEmitter.emit('reloadData', this.props.MenuID, item.$$uuid, item) } - execSuccess = (res, type) => { + execSuccess = (res) => { const { submit } = this.props if (res && res.ErrCode === 'S') { // 鎵ц鎴愬姛 @@ -1736,13 +1712,11 @@ 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) } } @@ -1776,33 +1750,12 @@ }) 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 }) @@ -1818,28 +1771,28 @@ /** * @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 }) @@ -1851,21 +1804,21 @@ 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) } @@ -1901,96 +1854,23 @@ } } - 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', @@ -1999,7 +1879,7 @@ } let _pagination = false - if (!pickup && setting.laypage !== 'false' && setting.laypage !== false) { + if (setting.laypage) { _pagination = { current: this.state.pageIndex, pageSize: this.state.pageSize, @@ -2012,36 +1892,31 @@ 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} - {setting.switchable !== 'false' ? <Switch title="缂栬緫" className="main-pickup" checkedChildren="寮�" unCheckedChildren="鍏�" disabled={loading || this.props.loading} checked={pickup} onChange={this.pickupChange} /> : null} + <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 || ''} mk-edit-${setting.editType || 'simple'}`} 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)}, } @@ -2050,8 +1925,7 @@ 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> </> ) -- Gitblit v1.8.0