From e4666c46c685ec7eabff25af9890d54c0ff2952b Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 16 六月 2023 17:55:56 +0800 Subject: [PATCH] 2023-06-16 --- src/tabviews/custom/components/table/edit-table/index.jsx | 453 ++++++++++++++++++++++++++------------------------------ 1 files changed, 210 insertions(+), 243 deletions(-) diff --git a/src/tabviews/custom/components/table/edit-table/index.jsx b/src/tabviews/custom/components/table/edit-table/index.jsx index 13e6ea1..f21a620 100644 --- a/src/tabviews/custom/components/table/edit-table/index.jsx +++ b/src/tabviews/custom/components/table/edit-table/index.jsx @@ -1,8 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import { connect } from 'react-redux' import { is, fromJS } from 'immutable' -import { notification } from 'antd' +import { notification, Modal } from 'antd' import Api from '@/api' import Utils from '@/utils/utils.js' @@ -19,20 +18,17 @@ class EditableTable extends Component { static propTpyes = { - BID: PropTypes.any, // 鐖剁骇Id config: PropTypes.object, // 缁勪欢閰嶇疆淇℃伅 mainSearch: PropTypes.any, // 澶栧眰鎼滅储鏉′欢 - menuType: PropTypes.any, // 鑿滃崟绫诲瀷 } state = { BID: '', // 涓婄骇ID BData: '', // 涓婄骇缁勪欢琛屾暟鎹� config: {}, // 椤甸潰閰嶇疆淇℃伅锛屽寘鎷寜閽�佹悳绱€�佹樉绀哄垪銆佹爣绛剧瓑 - searchlist: null, // 鎼滅储鏉′欢 actions: null, // 鎸夐挳闆� columns: null, // 鏄剧ず鍒� - arr_field: '', // 浣跨敤 sPC_Get_TableData 鏃剁殑鏌ヨ瀛楁闆� + arr_field: '', // 鏌ヨ瀛楁闆� setting: null, // 椤甸潰鍏ㄥ眬璁剧疆锛氭暟鎹簮銆佹寜閽強鏄剧ず鍒楀浐瀹氥�佷富閿瓑 data: [], // 鍒楄〃鏁版嵁闆� selectedData: [], // 宸查�夎〃鏍兼暟鎹� @@ -41,9 +37,7 @@ pageIndex: 1, // 椤电爜 pageSize: 10, // 姣忛〉鏁版嵁鏉℃暟 orderBy: '', // 鎺掑簭 - search: '', // 鎼滅储鏉′欢鏁扮粍锛屼娇鐢ㄦ椂闇�鍒嗗満鏅鐞� - statFValue: [], // 鍚堣鍊� - lock: false + search: '' // 鎼滅储鏉′欢鏁扮粍锛屼娇鐢ㄦ椂闇�鍒嗗満鏅鐞� } /** @@ -51,92 +45,120 @@ * 1銆� initdata 涓烘墦鍗版椂浣跨敤鐨勬暟鎹泦 */ UNSAFE_componentWillMount () { - const { BID, BData } = this.props let _config = fromJS(this.props.config).toJS() - let _cols = new Map() - let setting = {..._config.setting, ..._config.wrap, style: {}} + let setting = {..._config.setting, ..._config.wrap} setting.tableId = Utils.getuuid() + + let BID = '' + let BData = '' + + if (_config.setting.supModule) { + BData = window.GLOB.CacheData.get(_config.setting.supModule) + } else { + BData = window.GLOB.CacheData.get(_config.$pageId) + } + if (BData) { + BID = BData.$BID || '' + } _config.submit.style = _config.submit.style || {} _config.submit.wrapStyle = {} - _config.submit.hasAction = _config.action.length > 0 - if (!_config.submit.hasAction) { - if (_config.submit.style.marginTop) { - _config.submit.wrapStyle.paddingTop = _config.submit.style.marginTop - } - if (_config.submit.style.marginBottom) { - _config.submit.wrapStyle.paddingBottom = _config.submit.style.marginBottom - } - } else { - _config.submit.wrapStyle.paddingTop = '15px' - } + setting.hasAction = _config.action.length > 0 - if (setting.height) { - setting.operType = 'btnMode' - } - - _config.columns.forEach(item => { - if (item.type !== 'number') return - _cols.set(item.field, item) + _config.action.forEach(btn => { + if (btn.funcType === 'addline') { + setting.addable = true + } + btn.$tableId = setting.tableId + if (!btn.controlField) { + btn.controlField = '$lock' + btn.controlVals = [] + } }) let _columns = [] - let signAdd = false - _config.cols.forEach(column => { - if (column.Hide === 'true') return - if (column.type === 'index') { - column.field = '$Index' - column.type = 'text' - } + setting.initId = '' + let triMap = new Map() + setting.hasSubmit = false - if (setting.addable === 'true' && setting.operType === 'buoyMode' && column.type !== 'action' && !signAdd) { - column.addable = true - signAdd = true - } + let getColumns = (cols) => { + return cols.filter(item => { + if (item.Hide === 'true') return false - if (column.marks && column.marks.length === 0) { - column.marks = '' - } + item.tableId = setting.tableId - column.tableId = setting.tableId + if (item.type === 'colspan') { + item.subcols = getColumns(item.subcols) - if (column.type === 'text' && column.editable === 'true' && column.editType === 'select') { - column.options = column.options || [] - column.options = column.options.filter(cell => { - cell.value = cell.Value - cell.label = cell.Text - - return !cell.Hide - }) - } - - if (column.type === 'custom') { - column.elements = column.elements.map(item => { - if (item.eleType === 'number' && item.field && _cols.has(item.field) && typeof(item.decimal) !== 'number') { - item.decimal = _cols.get(item.field).decimal || 0 + if (item.subcols.length === 0) { + return false } + } else if (item.type === 'custom') { + item.elements.forEach(btn => { + if (btn.eleType !== 'button') return + if (btn.funcType === 'addline') { + setting.addable = true + } + btn.$tableId = setting.tableId + if (!btn.controlField) { + btn.controlField = '$lock' + btn.controlVals = [] + } + }) + } else { + if (item.type === 'index') { + item.field = '$Index' + item.type = 'text' + } + + if (item.marks && item.marks.length === 0) { + item.marks = '' + } + + if (item.editable === 'true') { + setting.hasSubmit = true + if (!setting.initId) { + setting.initId = item.uuid + } + if (item.type === 'text' && (item.editType === 'switch' || item.editType === 'select')) { + triMap.set(item.uuid, item.editType) + } + if (item.type === 'text' && item.editType === 'select') { + item.options = item.options || [] + item.options = item.options.filter(cell => { + cell.value = cell.Value + cell.label = cell.Text + + return !cell.Hide + }) + } + } + } + + return true + }) + } + + _columns = getColumns(_config.cols) + + if (triMap.size > 0) { + let setColumns = (cols) => { + return cols.map(item => { + if (item.type === 'colspan') { + item.subcols = setColumns(item.subcols) + } else if (item.editable === 'true' && triMap.has(item.enter)) { + item.triType = 'click' + } + return item }) - } else if (column.type === 'action') { - column.operations = column.elements } + + _columns = setColumns(_columns) - _columns.push(column) - }) - - if (setting.delable !== 'false' && setting.operType === 'buoyMode') { - if (_columns[_columns.length - 1] && _columns[_columns.length - 1].type !== 'action') { - _columns[_columns.length - 1].delable = true - } else if (_columns[_columns.length - 2] && _columns[_columns.length - 2].type !== 'action') { - _columns[_columns.length - 2].delable = true + if (setting.initId && triMap.has(setting.initId)) { + setting.triType = 'click' } - } - - if (setting.color) { - setting.style.color = setting.color - } - if (setting.fontSize) { - setting.style.fontSize = setting.fontSize } if (!_config.lineMarks || _config.lineMarks.length === 0) { @@ -150,7 +172,6 @@ title: _config.wrap.title, config: _config, setting: setting, - searchlist: _config.search, actions: _config.action, columns: _columns, arr_field: _config.columns.map(col => col.field).join(','), @@ -159,7 +180,6 @@ if (_config.setting.onload === 'true') { setTimeout(() => { this.loadmaindata() - this.getStatFieldsValue() }, _config.setting.delay || 0) } }) @@ -180,7 +200,7 @@ selectedData: [], total: 0 }) - reset && MKEmitter.emit('resetTable', config.uuid, repage) // 鍒楄〃閲嶇疆 + reset && MKEmitter.emit('resetTable', config.uuid, 'true') // 鍒楄〃閲嶇疆 return } @@ -204,7 +224,7 @@ }) let _orderBy = orderBy || setting.order - let param = UtilsDM.getQueryDataParams(setting, arr_field, searches, _orderBy, pageIndex, pageSize, BID, this.props.menuType) + let param = UtilsDM.getQueryDataParams(setting, arr_field, searches, _orderBy, pageIndex, pageSize, BID) let result = await Api.genericInterface(param) if (result.status) { @@ -222,6 +242,15 @@ item.$Index = start + index + '' item.$type = 'upt' item.$origin = true + + if (config.absFields) { + config.absFields.forEach(f => { + if (!isNaN(item[f])) { + item[f] = Math.abs(item[f]) + } + }) + } + return item }) @@ -237,18 +266,25 @@ this.setState({ loading: false }) - notification.error({ - top: 92, - message: result.message, - duration: 10 - }) + + if (result.ErrCode === 'N') { + Modal.error({ + title: result.message, + }) + } else { + notification.error({ + top: 92, + message: result.message, + duration: 10 + }) + } } } /** * @description 鑾峰彇鍗曡鏁版嵁 */ - async loadmainLinedata (id, line) { + async loadmainLinedata (id) { const { mainSearch } = this.props const { setting, config, arr_field, search, orderBy, BID, pageIndex, pageSize, BData } = this.state @@ -267,48 +303,54 @@ }) let _orderBy = orderBy || setting.order - let param = UtilsDM.getQueryDataParams(setting, arr_field, searches, _orderBy, pageIndex, pageSize, BID, this.props.menuType, id) + let param = UtilsDM.getQueryDataParams(setting, arr_field, searches, _orderBy, pageIndex, pageSize, BID, id) let result = await Api.genericInterface(param) if (result.status) { + if (!result.data || !result.data[0]) { + this.setState({ + loading: false + }) + + return + } + let data = fromJS(this.state.data).toJS() let selectedData = fromJS(this.state.selectedData).toJS() - let _data = result.data[0] || {} + let _data = result.data[0] _data.$$uuid = _data[setting.primaryKey] || '' _data.$$BID = BID || '' _data.$$BData = BData || '' _data.$type = 'upt' _data.$origin = true - try { - data = data.map(item => { - if (item.$$uuid === _data.$$uuid) { - _data.key = item.key - _data.$Index = item.$Index - return _data - } else { - return item + if (config.absFields) { + config.absFields.forEach(f => { + if (!isNaN(_data[f])) { + _data[f] = Math.abs(_data[f]) } }) - selectedData = selectedData.map(item => { - if (_data.$$uuid === item.$$uuid) { - return _data - } - return item - }) - } catch (e) { - console.warn('鏁版嵁鏌ヨ閿欒') } - if (line) { - if (line.$type === 'del' && !result.data[0]) { - data = data.filter(m => m.$$uuid === line.$$uuid) + data = data.map(item => { + if (item.$$uuid === _data.$$uuid) { + _data.key = item.key + _data.$Index = item.$Index + return _data + } else { + return item } - MKEmitter.emit('transferData', config.uuid, _data, 'line') - } else { - MKEmitter.emit('resetSelectLine', config.uuid, _data.$$uuid || '', _data) - } + }) + selectedData = selectedData.map(item => { + if (_data.$$uuid === item.$$uuid) { + return _data + } + return item + }) + + MKEmitter.emit('transferData', config.uuid, _data, 'line') + MKEmitter.emit('resetSelectLine', config.uuid, _data.$$uuid, _data) this.setState({ data, @@ -328,96 +370,16 @@ } /** - * @description 鑾峰彇鍚堣瀛楁鍊� - */ - getStatFieldsValue = () => { - const { mainSearch } = this.props - const { setting, config, search, BID, orderBy } = this.state - - if (setting.supModule && !BID) { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� - this.setState({ - statFValue: [] - }) - return - } - - if (config.statFields.length === 0 || setting.interType !== 'system' || !setting.dataresource) return - - let searches = fromJS(search).toJS() - if (config.setting.useMSearch && mainSearch && mainSearch.length > 0) { // 涓昏〃鎼滅储鏉′欢 - let keys = searches.map(item => item.key.toLowerCase()) - mainSearch.forEach(item => { - if (!keys.includes(item.key.toLowerCase())) { - searches.push(item) - } - }) - } - let requireFields = searches.filter(item => item.required && item.value === '') - if (requireFields.length > 0) { - return - } - - let _orderBy = orderBy || setting.order - let param = UtilsDM.getStatQueryDataParams(setting, config.statFields, searches, _orderBy, BID, this.props.menuType) - - Api.genericInterface(param).then(res => { - if (res.status) { - let _data = res.data[0] - let values = [] - - if (_data) { - config.statFields.forEach(item => { - if (_data[item.field] || _data[item.field] === 0) { - let val = +_data[item.field] - if (isNaN(val)) { - val = 0 - } - val = val.toFixed(item.decimal) - values.push({label: item.label, value: val}) - } - }) - } - this.setState({ - statFValue: values - }) - } else { - this.setState({ - statFValue: [] - }) - notification.error({ - top: 92, - message: res.message, - duration: 10 - }) - } - }) - } - - /** * @description 鎼滅储鏉′欢鏀瑰彉鏃讹紝閲嶇疆琛ㄦ牸鏁版嵁 * 鍚湁鍒濆涓嶅姞杞界殑椤甸潰锛屼慨鏀硅缃� */ refreshbysearch = (searches) => { - const { setting } = this.state - - if (setting.onload === 'false') { - this.setState({ - pageIndex: 1, - search: searches, - setting: {...setting, onload: 'true'} - }, () => { - this.loadmaindata() - this.getStatFieldsValue() - }) - } else { - this.setState({ - pageIndex: 1, - search: searches - }, () => { - this.loadmaindata(true, 'true') - this.getStatFieldsValue() - }) - } + this.setState({ + pageIndex: 1, + search: searches + }, () => { + this.loadmaindata(true, 'true') + }) } /** @@ -450,18 +412,16 @@ pageIndex: 1 }, () => { this.loadmaindata(true, 'true') - this.getStatFieldsValue() }) } else { this.loadmaindata(true, 'false') - this.getStatFieldsValue() } } /** * @description 瀵煎嚭Excel鏃讹紝鑾峰彇椤甸潰鎼滅储鎺掑簭绛夊弬鏁� */ - queryModuleParam = (menuId, btnId) => { + queryModuleParam = (menuId, callback) => { const { mainSearch } = this.props const { arr_field, config, orderBy, search, setting} = this.state @@ -477,7 +437,7 @@ }) } - MKEmitter.emit('returnModuleParam', config.uuid, btnId, { + callback({ arr_field: arr_field, orderBy: orderBy || setting.order, search: searches, @@ -485,7 +445,7 @@ }) } - reloadData = (menuId, id, item) => { + reloadData = (menuId, id) => { const { config } = this.state if (config.uuid !== menuId) return @@ -493,7 +453,7 @@ if (!id) { this.reloadtable() } else { - this.loadmainLinedata(id, item) + this.loadmainLinedata(id) } } @@ -507,8 +467,9 @@ BID: id, BData: data }, () => { - this.loadmaindata(true, 'true') - this.getStatFieldsValue() + setTimeout(() => { + this.loadmaindata(true, 'true') + }, setting.delay || 0) }) } } @@ -524,26 +485,16 @@ if (config.uuid !== menuId) return - let supModule = config.setting.supModule - - btn.syncComponentId && MKEmitter.emit('reloadData', btn.syncComponentId) - - if (!btn.syncComponentId || btn.syncComponentId !== supModule) { - if (position === 'line') { - if (lines && lines.length === 1) { - this.loadmainLinedata(lines[0].$$uuid) - } else { - this.reloadtable(btn) - } - } else if (position === 'mainline' || position === 'popclose') { // 鍒锋柊婧愮粍浠舵椂锛岄檮甯﹀埛鏂颁笂绾ц涓庡綋鍓嶇粍浠� - if (supModule && BID) { - MKEmitter.emit('reloadData', supModule, BID) - } else { - this.reloadtable(btn) - } + if (position === 'line') { + if (lines && lines.length === 1) { + this.loadmainLinedata(lines[0].$$uuid) } else { this.reloadtable(btn) } + } else if ((position === 'mainline' || position === 'popclose') && config.setting.supModule && BID) { // 鍒锋柊婧愮粍浠舵椂锛岄檮甯﹀埛鏂颁笂绾ц涓庡綋鍓嶇粍浠� + MKEmitter.emit('reloadData', config.setting.supModule, BID) + } else { + this.reloadtable(btn) } if (position === 'popclose') { // 鎵ц鍚姩寮圭獥鐨勬寜閽墍閫夋嫨鐨勫埛鏂伴」 @@ -551,10 +502,32 @@ } } + refreshLineData = (menuId, btn, uuid, count) => { + const { config } = this.state + + if (config.uuid !== menuId) return + + let _data = fromJS(this.state.data).toJS().forEach(item => { + if (item.$$uuid === uuid) { + item[btn.field] = count + } + }) + let _selectedData = fromJS(this.state.selectedData).toJS().forEach(item => { + if (item.$$uuid === uuid) { + item[btn.field] = count + } + }) + + this.setState({ + data: _data, + selectedData: _selectedData + }) + } + UNSAFE_componentWillReceiveProps(nextProps) { const { config } = this.state - if (config.setting.syncRefresh && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { + if (config.setting.useMSearch && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { this.setState({pageIndex: 1}, () => { this.reloadtable() }) @@ -569,6 +542,7 @@ MKEmitter.addListener('reloadData', this.reloadData) MKEmitter.addListener('resetSelectLine', this.resetParentParam) MKEmitter.addListener('queryModuleParam', this.queryModuleParam) + MKEmitter.addListener('refreshLineData', this.refreshLineData) MKEmitter.addListener('refreshByButtonResult', this.refreshByButtonResult) } @@ -582,27 +556,32 @@ MKEmitter.removeListener('reloadData', this.reloadData) MKEmitter.removeListener('resetSelectLine', this.resetParentParam) MKEmitter.removeListener('queryModuleParam', this.queryModuleParam) + MKEmitter.removeListener('refreshLineData', this.refreshLineData) MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult) } render() { - const { BID, setting, searchlist, actions, config, columns, BData, selectedData, lock } = this.state + const { BID, setting, actions, config, columns, BData, data, selectedData } = this.state + + let style = {...config.style} + if (config.wrap.empty === 'hidden' && data.length === 0) { + style.display = 'none' + } return ( - <div className="custom-edit-table" id={'anchor' + config.uuid} style={config.style}> + <div className={'custom-edit-table' + (setting.hasSubmit ? '' : ' withnot-submit')} id={'anchor' + config.uuid} style={style}> <NormalHeader config={config}/> - {searchlist && searchlist.length ? - <MainSearch BID={BID} setting={config.wrap} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null + {config.search && config.search.length ? + <MainSearch BID={BID} config={config} refreshdata={this.refreshbysearch}/> : null } - <MainAction + {actions.length > 0 ? <MainAction BID={BID} setting={setting} actions={actions} BData={BData} - lock={lock} columns={config.columns} selectedData={selectedData} - /> + /> : null} <MainTable BID={BID} setting={setting} @@ -615,22 +594,10 @@ loading={this.state.loading} refreshdata={this.refreshbytable} chgSelectData={(selects) => this.setState({selectedData: selects})} - changeLock={(lock) => this.setState({lock: lock})} - statFValue={this.state.statFValue} /> </div> ) } } -const mapStateToProps = (state) => { - return { - menuType: state.editLevel - } -} - -const mapDispatchToProps = () => { - return {} -} - -export default connect(mapStateToProps, mapDispatchToProps)(EditableTable) \ No newline at end of file +export default EditableTable \ No newline at end of file -- Gitblit v1.8.0