| | |
| | | import { notification, 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' |
| | |
| | | |
| | | class MkBaseTable extends Component { |
| | | static propTpyes = { |
| | | data: PropTypes.array, // 统一查询数据 |
| | | config: PropTypes.object, // 组件配置信息 |
| | | mainSearch: PropTypes.any, // 外层搜索条件 |
| | | } |
| | | |
| | | state = { |
| | |
| | | config: {}, // 页面配置信息,包括按钮、搜索、显示列、标签等 |
| | | actions: null, // 按钮集 |
| | | columns: null, // 显示列 |
| | | arr_field: '', // 查询字段集 |
| | | setting: null, // 页面全局设置:数据源、按钮及显示列固定、主键等 |
| | | data: [], // 列表数据集 |
| | | selectedData: [], // 已选表格数据 |
| | |
| | | setting: setting, |
| | | actions: _config.action, |
| | | columns: _config.cols, |
| | | arr_field: _config.columns.map(col => col.field).join(','), |
| | | search: Utils.initMainSearch(_config.search) // 搜索条件初始化(含有时间格式,需要转化) |
| | | search: _config.$searches |
| | | }, () => { |
| | | if (_config.setting.onload === 'true') { |
| | | setTimeout(() => { |
| | |
| | | * @param { String } repage 表格是否重置页码 |
| | | */ |
| | | async loadmaindata (reset, repage, id) { |
| | | const { mainSearch } = this.props |
| | | const { setting, config, arr_field, search, orderBy, BID, pageIndex, pageSize, BData } = this.state |
| | | const { setting, config, search, orderBy, BID, pageIndex, pageSize, BData } = this.state |
| | | |
| | | if (setting.supModule && !BID) { // BID 不存在时,不做查询 |
| | | this.setState({ |
| | |
| | | } |
| | | |
| | | let searches = fromJS(search).toJS() |
| | | if (config.setting.useMSearch && mainSearch && mainSearch.length > 0) { // 主表搜索条件 |
| | | let keys = searches.map(item => item.key.toLowerCase()) |
| | | if (config.setting.useMSearch) { // 主表搜索条件 |
| | | let mainSearch = window.GLOB.SearchBox.get(config.$searchId) || [] |
| | | let keys = config.$s_keys || [] |
| | | mainSearch.forEach(item => { |
| | | if (!keys.includes(item.key.toLowerCase())) { |
| | | if (keys.includes(item.key.toLowerCase())) return |
| | | |
| | | searches.push(item) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | let requireFields = searches.filter(item => item.required && item.value === '') |
| | | if (requireFields.length > 0) { |
| | | if (config.$s_req && searches.filter(item => item.required && item.value === '').length > 0) { |
| | | return |
| | | } |
| | | |
| | |
| | | }) |
| | | |
| | | let _orderBy = orderBy || setting.order |
| | | let param = UtilsDM.getQueryDataParams(setting, arr_field, searches, _orderBy, pageIndex, pageSize, BID) |
| | | let param = UtilsDM.getQueryDataParams(setting, searches, _orderBy, pageIndex, pageSize, BID) |
| | | |
| | | let result = await Api.genericInterface(param) |
| | | if (result.status) { |
| | |
| | | start = pageSize * (pageIndex - 1) + 1 |
| | | } |
| | | |
| | | this.setState({ |
| | | data: result.data.map((item, index) => { |
| | | let data = result.data.map((item, index) => { |
| | | item.key = index |
| | | item.$$uuid = item[setting.primaryKey] || '' |
| | | item.$$key = '' + item.key + item.$$uuid |
| | |
| | | } |
| | | |
| | | return item |
| | | }), |
| | | }) |
| | | |
| | | let total = result.total || 0 |
| | | if (config.setting.custompage && data.length) { |
| | | total = data[data.length - 1].mk_total || 0 |
| | | } |
| | | |
| | | this.setState({ |
| | | data: data, |
| | | selectedData: [], |
| | | total: result.total, |
| | | total: total, |
| | | loading: false |
| | | }) |
| | | |
| | |
| | | MKEmitter.emit('autoGetData', config.MenuID) |
| | | } else { |
| | | MKEmitter.emit('autoMaticOver', config.MenuID) |
| | | } |
| | | } |
| | | |
| | | if (result.message) { |
| | | if (result.ErrCode === 'Y') { |
| | | Modal.success({ |
| | | title: result.message |
| | | }) |
| | | } else if (result.ErrCode === 'S') { |
| | | notification.success({ |
| | | top: 92, |
| | | message: result.message, |
| | | duration: 2 |
| | | }) |
| | | } |
| | | } |
| | | } else { |
| | |
| | | MKEmitter.emit('autoMaticError', config.MenuID) |
| | | } |
| | | |
| | | if (!result.message) return |
| | | if (result.ErrCode === 'N') { |
| | | Modal.error({ |
| | | title: result.message, |
| | | }) |
| | | } else { |
| | | } else if (result.ErrCode !== '-2') { |
| | | notification.error({ |
| | | top: 92, |
| | | message: result.message, |
| | |
| | | * @description 获取单行数据 |
| | | */ |
| | | async loadmainLinedata (id) { |
| | | const { mainSearch } = this.props |
| | | const { setting, config, arr_field, search, orderBy, BID, pageIndex, pageSize, BData } = this.state |
| | | const { setting, config, search, orderBy, BID, pageIndex, pageSize, BData } = this.state |
| | | |
| | | if (config.forbidLine) { |
| | | this.reloadtable() |
| | | return |
| | | } |
| | | |
| | | let searches = fromJS(search).toJS() |
| | | if (config.setting.useMSearch && mainSearch && mainSearch.length > 0) { // 主表搜索条件 |
| | | let keys = searches.map(item => item.key.toLowerCase()) |
| | | if (config.setting.useMSearch) { // 主表搜索条件 |
| | | let mainSearch = window.GLOB.SearchBox.get(config.$searchId) || [] |
| | | let keys = config.$s_keys || [] |
| | | mainSearch.forEach(item => { |
| | | if (!keys.includes(item.key.toLowerCase())) { |
| | | if (keys.includes(item.key.toLowerCase())) return |
| | | |
| | | searches.push(item) |
| | | } |
| | | }) |
| | | } |
| | | |
| | |
| | | }) |
| | | |
| | | let _orderBy = orderBy || setting.order |
| | | let param = UtilsDM.getQueryDataParams(setting, arr_field, searches, _orderBy, pageIndex, pageSize, BID, id) |
| | | let param = UtilsDM.getQueryDataParams(setting, searches, _orderBy, pageIndex, pageSize, BID, id) |
| | | |
| | | let result = await Api.genericInterface(param) |
| | | if (result.status) { |
| | | let data = fromJS(this.state.data).toJS() |
| | | let selectedData = fromJS(this.state.selectedData).toJS() |
| | | |
| | | if (result.data && result.data[0]) { |
| | | let _data = result.data[0] || {} |
| | | _data.$$uuid = _data[setting.primaryKey] || '' |
| | |
| | | }) |
| | | } |
| | | |
| | | try { |
| | | data = data.map(item => { |
| | | if (item.$$uuid === _data.$$uuid) { |
| | | _data.key = item.key |
| | |
| | | return item |
| | | } |
| | | }) |
| | | |
| | | if (!_data.$Index) { |
| | | this.setState({ |
| | | loading: false |
| | | }) |
| | | return |
| | | } |
| | | |
| | | selectedData = selectedData.map(item => { |
| | | if (_data.$$uuid === item.$$uuid) { |
| | | return _data |
| | | } |
| | | return item |
| | | }) |
| | | } catch (e) { |
| | | console.warn('数据查询错误') |
| | | } |
| | | |
| | | if (selectedData.length && _data.$$uuid === selectedData[selectedData.length - 1].$$uuid) { |
| | | MKEmitter.emit('resetSelectLine', config.uuid, _data.$$uuid || '', _data) |
| | | } |
| | | |
| | |
| | | selectedData, |
| | | loading: false |
| | | }) |
| | | } else { |
| | | let index = data.findIndex(item => item.$$uuid === id) |
| | | |
| | | if (index === -1) { |
| | | this.setState({ |
| | | loading: false |
| | | }) |
| | | return |
| | | } |
| | | |
| | | data = data.filter(item => item.$$uuid !== id) |
| | | data = data.map((item, i) => { |
| | | item.key = i |
| | | item.$$key = '' + item.key + item.$$uuid |
| | | |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | data: data, |
| | | loading: false |
| | | }) |
| | | |
| | | setTimeout(() => { |
| | | MKEmitter.emit('resetTable', config.uuid, 'delete', index) |
| | | }, 20) |
| | | } |
| | | } else { |
| | | this.setState({ |
| | | loading: false |
| | |
| | | * @description 获取合计字段值 |
| | | */ |
| | | getStatFieldsValue = () => { |
| | | const { mainSearch } = this.props |
| | | const { setting, config, search, BID, orderBy } = this.state |
| | | |
| | | if (setting.supModule && !BID) { // BID 不存在时,不做查询 |
| | |
| | | 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()) |
| | | if (config.setting.useMSearch) { // 主表搜索条件 |
| | | let mainSearch = window.GLOB.SearchBox.get(config.$searchId) || [] |
| | | let keys = config.$s_keys || [] |
| | | mainSearch.forEach(item => { |
| | | if (!keys.includes(item.key.toLowerCase())) { |
| | | if (keys.includes(item.key.toLowerCase())) return |
| | | |
| | | searches.push(item) |
| | | } |
| | | }) |
| | | } |
| | | let requireFields = searches.filter(item => item.required && item.value === '') |
| | | if (requireFields.length > 0) { |
| | | |
| | | if (config.$s_req && searches.filter(item => item.required && item.value === '').length > 0) { |
| | | return |
| | | } |
| | | |
| | |
| | | * 含有初始不加载的页面,修改设置 |
| | | */ |
| | | refreshbysearch = (searches) => { |
| | | const { config} = this.state |
| | | |
| | | this.setState({ |
| | | pageIndex: 1, |
| | | search: searches |
| | |
| | | this.loadmaindata(true, 'true') |
| | | this.getStatFieldsValue() |
| | | }) |
| | | |
| | | if (config.$main) { |
| | | window.GLOB.SearchBox.set(config.$searchId, searches) |
| | | MKEmitter.emit('searchRefresh', config.$searchId) |
| | | } |
| | | } |
| | | |
| | | /** |
| | |
| | | * @description 导出Excel时,获取页面搜索排序等参数 |
| | | */ |
| | | queryModuleParam = (menuId, callback) => { |
| | | const { mainSearch } = this.props |
| | | const { arr_field, config, orderBy, search, setting} = this.state |
| | | const { config, orderBy, search, setting } = this.state |
| | | |
| | | if (config.uuid !== menuId) return |
| | | |
| | | let searches = search ? fromJS(search).toJS() : [] |
| | | if (config.setting.useMSearch && mainSearch && mainSearch.length > 0) { // 主表搜索条件 |
| | | let keys = searches.map(item => item.key.toLowerCase()) |
| | | if (config.setting.useMSearch) { // 主表搜索条件 |
| | | let mainSearch = window.GLOB.SearchBox.get(config.$searchId) || [] |
| | | let keys = config.$s_keys || [] |
| | | mainSearch.forEach(item => { |
| | | if (!keys.includes(item.key.toLowerCase())) { |
| | | if (keys.includes(item.key.toLowerCase())) return |
| | | |
| | | searches.push(item) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | callback({ |
| | | arr_field: arr_field, |
| | | orderBy: orderBy || setting.order, |
| | | search: searches, |
| | | menuName: config.name |
| | | search: searches |
| | | }) |
| | | } |
| | | |
| | |
| | | } else { |
| | | this.reloadtable(btn, id) |
| | | } |
| | | |
| | | if (position === 'popclose') { // 执行启动弹窗的按钮所选择的刷新项 |
| | | btn.$tabId && MKEmitter.emit('refreshPopButton', btn.$tabId) |
| | | } |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps(nextProps) { |
| | | searchRefresh = (searchId) => { |
| | | const { config } = this.state |
| | | |
| | | if (config.setting.useMSearch && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { |
| | | if (config.$searchId !== searchId) return |
| | | |
| | | this.setState({pageIndex: 1}, () => { |
| | | this.reloadtable() |
| | | }) |
| | | } |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | |
| | | } |
| | | |
| | | componentDidMount () { |
| | | const { config } = this.state |
| | | |
| | | MKEmitter.addListener('reloadData', this.reloadData) |
| | | MKEmitter.addListener('resetSelectLine', this.resetParentParam) |
| | | MKEmitter.addListener('queryModuleParam', this.queryModuleParam) |
| | | MKEmitter.addListener('refreshByButtonResult', this.refreshByButtonResult) |
| | | |
| | | if (config.setting.useMSearch) { |
| | | MKEmitter.addListener('searchRefresh', this.searchRefresh) |
| | | } |
| | | } |
| | | |
| | | /** |
| | |
| | | return |
| | | } |
| | | MKEmitter.removeListener('reloadData', this.reloadData) |
| | | MKEmitter.removeListener('searchRefresh', this.searchRefresh) |
| | | MKEmitter.removeListener('resetSelectLine', this.resetParentParam) |
| | | MKEmitter.removeListener('queryModuleParam', this.queryModuleParam) |
| | | MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult) |