| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import {connect} from 'react-redux' |
| | | import { is, fromJS } from 'immutable' |
| | | import { notification, Collapse } from 'antd' |
| | | import { notification, Collapse, Modal } from 'antd' |
| | | |
| | | import Api from '@/api' |
| | | import Utils from '@/utils/utils.js' |
| | | import UtilsDM from '@/utils/utils-datamanage.js' |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import MKEmitter from '@/utils/events.js' |
| | | import TimerTask from '@/utils/timer-task.js' |
| | | import './index.scss' |
| | | |
| | | // 通用组件 |
| | |
| | | |
| | | class NormalTable extends Component { |
| | | static propTpyes = { |
| | | BID: PropTypes.any, // 父级Id |
| | | data: PropTypes.array, // 统一查询数据 |
| | | config: PropTypes.object, // 组件配置信息 |
| | | mainSearch: PropTypes.any, // 外层搜索条件 |
| | | menuType: PropTypes.any, // 菜单类型 |
| | | } |
| | | |
| | | state = { |
| | |
| | | config: {}, // 页面配置信息,包括按钮、搜索、显示列、标签等 |
| | | actions: null, // 按钮集 |
| | | columns: null, // 显示列 |
| | | arr_field: '', // 使用 sPC_Get_TableData 时的查询字段集 |
| | | arr_field: '', // 查询字段集 |
| | | setting: null, // 页面全局设置:数据源、按钮及显示列固定、主键等 |
| | | data: [], // 列表数据集 |
| | | selectedData: [], // 已选表格数据 |
| | |
| | | statFValue: [] // 合计值 |
| | | } |
| | | |
| | | loaded = false |
| | | |
| | | /** |
| | | * @description 初始化处理 |
| | | * 1、 initdata 为打印时使用的数据集 |
| | | */ |
| | | UNSAFE_componentWillMount () { |
| | | const { data, initdata, BID, BData } = this.props |
| | | const { data, initdata } = this.props |
| | | let _config = fromJS(this.props.config).toJS() |
| | | let _cols = new Map() |
| | | let _data = null |
| | | let _sync = _config.setting.sync === 'true' |
| | | |
| | | 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 || '' |
| | | } |
| | | |
| | | if (_config.wrap.controlField) { |
| | | if (_config.wrap.controlVal) { |
| | |
| | | |
| | | let setting = {..._config.setting, ..._config.wrap} |
| | | |
| | | if (setting.selected !== 'always' && setting.selected !== 'init') { |
| | | if (setting.selected !== 'always' && setting.selected !== 'init' && setting.selected !== 'sign') { |
| | | setting.selected = 'false' |
| | | } else { |
| | | setting.orisel = true |
| | | } |
| | | |
| | | if (_config.setting.sync === 'true' && data) { |
| | | if (_sync && data) { |
| | | _data = data[_config.dataName] || [] |
| | | _sync = false |
| | | } else if (_config.setting.sync === 'true' && initdata) { |
| | | } else if (_sync && initdata) { |
| | | _data = initdata || [] |
| | | _sync = false |
| | | } |
| | | |
| | | if (_data) { |
| | | this.loaded = true |
| | | _data = _data.map((item, index) => { |
| | | item.key = index |
| | | item.$$uuid = item[_config.setting.primaryKey] || '' |
| | |
| | | item.$$BID = BID || '' |
| | | item.$$BData = BData || '' |
| | | item.$Index = index + 1 + '' |
| | | |
| | | if (_config.absFields) { |
| | | _config.absFields.forEach(f => { |
| | | if (!isNaN(item[f])) { |
| | | item[f] = Math.abs(item[f]) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | if (setting.controlField) { |
| | | if (setting.controlVal.includes(item[setting.controlField])) { |
| | |
| | | |
| | | if (setting.selected !== 'false' && _data && _data.length > 0) { |
| | | setTimeout(() => { |
| | | MKEmitter.emit('mkCheckTopLine', _config.uuid) |
| | | MKEmitter.emit('mkCheckTopLine', _config.uuid, '', setting.selected) |
| | | }, 200) |
| | | if (setting.selected === 'init') { |
| | | setting.selected = 'false' |
| | |
| | | } |
| | | } |
| | | |
| | | _config.columns.forEach(item => { |
| | | if (item.type !== 'number') return |
| | | _cols.set(item.field, item) |
| | | }) |
| | | |
| | | _config.cols.forEach(column => { |
| | | 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 |
| | | } |
| | | return item |
| | | }) |
| | | } else if (column.type === 'action') { |
| | | if (column.type === 'action') { |
| | | column.operations = column.elements |
| | | } |
| | | }) |
| | |
| | | * @param { Boolean } reset 表格是否重置 |
| | | * @param { String } repage 表格是否重置页码 |
| | | */ |
| | | async loadmaindata (reset, repage, id) { |
| | | async loadmaindata (reset, repage, id, type) { |
| | | const { mainSearch } = this.props |
| | | const { setting, config, arr_field, search, orderBy, BID, pageIndex, pageSize, BData } = this.state |
| | | |
| | |
| | | }) |
| | | |
| | | MKEmitter.emit('resetSelectLine', config.uuid, '', '') // 广播数据切换 |
| | | reset && MKEmitter.emit('resetTable', config.uuid, repage) // 列表重置 |
| | | reset && MKEmitter.emit('resetTable', config.uuid, 'true') // 列表重置 |
| | | if (setting.$hasSyncModule) { |
| | | MKEmitter.emit('syncBalconyData', config.uuid, [], false) |
| | | } |
| | | |
| | | this.loaded = true |
| | | return |
| | | } |
| | | |
| | |
| | | return |
| | | } |
| | | |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | if (type !== 'timer') { |
| | | this.setState({ |
| | | loading: true |
| | | }) |
| | | } |
| | | |
| | | 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) { |
| | | this.loaded = true |
| | | if (config.$cache && pageIndex === 1) { |
| | | Api.writeCacheConfig(config.uuid, result.data || '') |
| | | } |
| | | |
| | | if (repage === 'false' && result.data && result.data.length === 0 && result.total > 0 && pageIndex > 1) { |
| | | let _pageIndex = Math.ceil(result.total / pageSize) |
| | | |
| | | if (_pageIndex < pageIndex) { |
| | | MKEmitter.emit('resetTable', config.uuid, 'repage', _pageIndex) |
| | | this.setState({ |
| | | pageIndex: _pageIndex, |
| | | data: [], |
| | | selectedData: [], |
| | | total: result.total |
| | | }, () => { |
| | | this.loadmaindata() |
| | | }) |
| | | return |
| | | } |
| | | } |
| | | |
| | | if ((setting.selected !== 'false' || (setting.orisel && id)) && result.data && result.data.length > 0) { |
| | | setTimeout(() => { |
| | | MKEmitter.emit('mkCheckTopLine', config.uuid, id) |
| | | MKEmitter.emit('mkCheckTopLine', config.uuid, id, setting.selected) |
| | | }, 200) |
| | | if (setting.selected === 'init') { |
| | | this.setState({setting: {...setting, selected: 'false'}}) |
| | |
| | | item.$$BData = BData || '' |
| | | item.$Index = start + index + '' |
| | | |
| | | if (config.absFields) { |
| | | config.absFields.forEach(f => { |
| | | if (!isNaN(item[f])) { |
| | | item[f] = Math.abs(item[f]) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | if (setting.controlField) { |
| | | if (setting.controlVal.includes(item[setting.controlField])) { |
| | | item.$disabled = true |
| | |
| | | this.setState({ |
| | | loading: false |
| | | }) |
| | | notification.error({ |
| | | top: 92, |
| | | message: result.message, |
| | | duration: 10 |
| | | }) |
| | | this.timer && this.timer.stop() |
| | | |
| | | if (result.ErrCode === 'N') { |
| | | Modal.error({ |
| | | title: result.message, |
| | | }) |
| | | } else { |
| | | notification.error({ |
| | | top: 92, |
| | | message: result.message, |
| | | duration: 10 |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | |
| | |
| | | }) |
| | | |
| | | 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) { |
| | |
| | | _data.$$uuid = _data[setting.primaryKey] || '' |
| | | _data.$$BID = BID || '' |
| | | _data.$$BData = BData || '' |
| | | |
| | | if (config.absFields) { |
| | | config.absFields.forEach(f => { |
| | | if (!isNaN(_data[f])) { |
| | | _data[f] = Math.abs(_data[f]) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | try { |
| | | data = data.map(item => { |
| | | if (item.$$uuid === _data.$$uuid) { |
| | |
| | | } |
| | | |
| | | let _orderBy = orderBy || setting.order |
| | | let param = UtilsDM.getStatQueryDataParams(setting, config.statFields, searches, _orderBy, BID, this.props.menuType) |
| | | let param = UtilsDM.getStatQueryDataParams(setting, config.statFields, searches, _orderBy, BID) |
| | | |
| | | Api.genericInterface(param).then(res => { |
| | | if (res.status) { |
| | |
| | | /** |
| | | * @description 导出Excel时,获取页面搜索排序等参数 |
| | | */ |
| | | queryModuleParam = (menuId, btnId) => { |
| | | queryModuleParam = (menuId, callback) => { |
| | | const { mainSearch } = this.props |
| | | const { arr_field, config, orderBy, search, setting} = this.state |
| | | |
| | |
| | | }) |
| | | } |
| | | |
| | | MKEmitter.emit('returnModuleParam', config.uuid, btnId, { |
| | | callback({ |
| | | arr_field: arr_field, |
| | | orderBy: orderBy || setting.order, |
| | | search: searches, |
| | |
| | | const { setting } = this.state |
| | | |
| | | if (!setting.supModule || setting.supModule !== MenuID) return |
| | | |
| | | if (id !== this.state.BID || id !== '') { |
| | | this.setState({ |
| | | pageIndex: 1, |
| | |
| | | item.$$BData = BData || '' |
| | | item.$Index = index + 1 + '' |
| | | |
| | | if (config.absFields) { |
| | | config.absFields.forEach(f => { |
| | | if (!isNaN(item[f])) { |
| | | item[f] = Math.abs(item[f]) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | if (setting.controlField) { |
| | | if (setting.controlVal.includes(item[setting.controlField])) { |
| | | item.$disabled = true |
| | |
| | | |
| | | if (setting.selected !== 'false' && _data && _data.length > 0) { |
| | | setTimeout(() => { |
| | | MKEmitter.emit('mkCheckTopLine', config.uuid) |
| | | MKEmitter.emit('mkCheckTopLine', config.uuid, '', setting.selected) |
| | | }, 200) |
| | | if (setting.selected === 'init') { |
| | | this.setState({setting: {...setting, selected: 'false'}}) |
| | |
| | | } |
| | | } |
| | | |
| | | this.loaded = true |
| | | |
| | | this.setState({sync: false, data: _data}) |
| | | } else if (config.setting.syncRefresh && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { |
| | | } else if (config.setting.useMSearch && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { |
| | | this.setState({pageIndex: 1}, () => { |
| | | this.reloadtable() |
| | | }) |
| | |
| | | } |
| | | |
| | | componentDidMount () { |
| | | const { config, setting } = this.state |
| | | |
| | | MKEmitter.addListener('reloadData', this.reloadData) |
| | | MKEmitter.addListener('resetSelectLine', this.resetParentParam) |
| | | MKEmitter.addListener('queryModuleParam', this.queryModuleParam) |
| | | MKEmitter.addListener('refreshByButtonResult', this.refreshByButtonResult) |
| | | |
| | | if (config.timer) { |
| | | this.timer = new TimerTask() |
| | | this.timer.init(config.uuid, config.timer, config.timerRepeats, () => { |
| | | this.setState({ |
| | | pageIndex: 1 |
| | | }, () => { |
| | | this.loadmaindata(true, 'true', '', 'timer') |
| | | this.getStatFieldsValue() |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | if (config.$cache && !this.loaded) { |
| | | Api.getLCacheConfig(config.uuid).then(res => { |
| | | if (!res || this.loaded) return |
| | | |
| | | this.setState({data: res.map((item, index) => { |
| | | item.key = index |
| | | item.$$uuid = item[config.setting.primaryKey] || '' |
| | | item.$$key = '' + item.key + item.$$uuid |
| | | item.$Index = index + 1 + '' |
| | | |
| | | if (config.absFields) { |
| | | config.absFields.forEach(f => { |
| | | if (!isNaN(item[f])) { |
| | | item[f] = Math.abs(item[f]) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | if (setting.controlField) { |
| | | if (setting.controlVal.includes(item[setting.controlField])) { |
| | | item.$disabled = true |
| | | } |
| | | } |
| | | |
| | | return item |
| | | })}) |
| | | }) |
| | | } |
| | | } |
| | | |
| | | /** |
| | |
| | | MKEmitter.removeListener('resetSelectLine', this.resetParentParam) |
| | | MKEmitter.removeListener('queryModuleParam', this.queryModuleParam) |
| | | MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult) |
| | | |
| | | this.timer && this.timer.stop() |
| | | } |
| | | |
| | | render() { |
| | |
| | | {config.wrap.collapse === 'true' ? <Collapse bordered={false} defaultActiveKey="1" expandIconPosition="right"> |
| | | <Panel forceRender={true} header={<NormalHeader config={config}/>} key="1"> |
| | | {config.search && config.search.length ? |
| | | <MainSearch BID={BID} config={config} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null |
| | | <MainSearch BID={BID} config={config} refreshdata={this.refreshbysearch}/> : null |
| | | } |
| | | <MainAction |
| | | {actions.length > 0 ? <MainAction |
| | | BID={BID} |
| | | setting={setting} |
| | | actions={actions} |
| | | BData={BData} |
| | | columns={config.columns} |
| | | selectedData={selectedData} |
| | | /> |
| | | <div className={'main-table-box ' + (!actions || actions.length === 0 ? 'no-action' : '')}> |
| | | /> : <div className="mk-action-space" style={{height: '25px'}}></div>} |
| | | <div className="main-table-box"> |
| | | <MainTable |
| | | setting={setting} |
| | | columns={columns} |
| | |
| | | </Collapse> : <> |
| | | <NormalHeader config={config}/> |
| | | {config.search && config.search.length ? |
| | | <MainSearch BID={BID} config={config} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null |
| | | <MainSearch BID={BID} config={config} refreshdata={this.refreshbysearch}/> : null |
| | | } |
| | | <MainAction |
| | | {actions.length > 0 ? <MainAction |
| | | BID={BID} |
| | | setting={setting} |
| | | actions={actions} |
| | | BData={BData} |
| | | columns={config.columns} |
| | | selectedData={selectedData} |
| | | /> |
| | | /> : <div className="mk-action-space" style={{height: '25px'}}></div>} |
| | | <div className={'main-table-box ' + (!actions || actions.length === 0 ? 'no-action' : '')}> |
| | | <MainTable |
| | | setting={setting} |
| | |
| | | } |
| | | } |
| | | |
| | | const mapStateToProps = (state) => { |
| | | return { |
| | | menuType: state.editLevel |
| | | } |
| | | } |
| | | |
| | | const mapDispatchToProps = () => { |
| | | return {} |
| | | } |
| | | |
| | | export default connect(mapStateToProps, mapDispatchToProps)(NormalTable) |
| | | export default NormalTable |