| | |
| | | |
| | | class antvG6Chart extends Component { |
| | | static propTpyes = { |
| | | data: PropTypes.array, // 统一查询数据 |
| | | config: PropTypes.object, // 组件配置信息 |
| | | mainSearch: PropTypes.any, // 外层搜索条件 |
| | | config: PropTypes.object |
| | | } |
| | | |
| | | state = { |
| | |
| | | BID: '', |
| | | BData: '', |
| | | plot: null, |
| | | sync: false, |
| | | arr_field : '', |
| | | chartId: Utils.getuuid(), |
| | | empty: true |
| | | } |
| | | |
| | | data = [] |
| | | mkgraph = null |
| | | selectedId = '' |
| | | loaded = false |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { config, data, initdata } = this.props |
| | | const { config } = this.props |
| | | |
| | | let _config = fromJS(config).toJS() |
| | | |
| | | let _sync = _config.setting.sync === 'true' |
| | | |
| | | let BID = '' |
| | | let BData = '' |
| | | |
| | |
| | | BID = BData.$BID || '' |
| | | } |
| | | |
| | | if (_sync && data) { |
| | | this.data = data[config.dataName] || [] |
| | | _sync = false |
| | | } else if (_sync && initdata) { |
| | | this.data = initdata || [] |
| | | _sync = false |
| | | if (_config.setting.sync === 'true') { |
| | | _config.setting.onload = 'false' |
| | | |
| | | if (window.GLOB.SyncData.has(_config.dataName)) { |
| | | this.data = window.GLOB.SyncData.get(_config.dataName) || [] |
| | | |
| | | if (_config.$cache) { |
| | | Api.writeCacheConfig(_config.uuid, fromJS(this.data).toJS(), BID) |
| | | } |
| | | |
| | | _config.setting.sync = 'false' |
| | | |
| | | this.loaded = true |
| | | |
| | | window.GLOB.SyncData.delete(_config.dataName) |
| | | } |
| | | } |
| | | |
| | | _config.plot.height = Utils.getHeight(_config.plot.height) |
| | |
| | | config: _config, |
| | | BID: BID || '', |
| | | BData: BData || '', |
| | | arr_field: _config.columns.map(col => col.field).join(','), |
| | | plot: _config.plot, |
| | | sync: _sync |
| | | }, () => { |
| | | if (config.setting.sync !== 'true' && config.setting.onload === 'true') { |
| | | setTimeout(() => { |
| | | this.loadData() |
| | | }, _config.setting.delay || 0) |
| | | } |
| | | plot: _config.plot |
| | | }) |
| | | |
| | | if (this.data.length > 0) { |
| | | this.handleData() |
| | | } |
| | | |
| | | let that = this |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | /** |
| | | * @description 图表数据更新,刷新内容 |
| | | */ |
| | | UNSAFE_componentWillReceiveProps (nextProps) { |
| | | const { sync, config } = this.state |
| | | |
| | | if (sync && !is(fromJS(this.props.data), fromJS(nextProps.data))) { |
| | | let _data = [] |
| | | |
| | | if (nextProps.data && nextProps.data[config.dataName]) { |
| | | _data = nextProps.data[config.dataName] |
| | | } |
| | | |
| | | if (!is(fromJS(this.data), fromJS(_data))) { |
| | | this.data = _data |
| | | this.handleData() |
| | | } |
| | | |
| | | this.setState({sync: false}) |
| | | } else if (config.setting.useMSearch && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { |
| | | this.setState({}, () => { |
| | | this.loadData() |
| | | }) |
| | | } |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentDidMount () { |
| | | const { config, sync } = this.state |
| | | const { config } = this.state |
| | | MKEmitter.addListener('reloadData', this.reloadData) |
| | | MKEmitter.addListener('resetSelectLine', this.resetParentParam) |
| | | |
| | | if (config.$cache && (config.setting.sync !== 'true' || sync)) { |
| | | Api.getLCacheConfig(config.uuid).then(res => { |
| | | if (!res || this.data.length > 0) return |
| | | |
| | | if (!is(fromJS(this.data), fromJS(res))) { |
| | | this.data = res |
| | | this.handleData() |
| | | } |
| | | }) |
| | | if (config.setting.useMSearch) { |
| | | MKEmitter.addListener('searchRefresh', this.searchRefresh) |
| | | } |
| | | |
| | | if (config.setting.sync === 'true') { |
| | | MKEmitter.addListener('transferSyncData', this.transferSyncData) |
| | | } |
| | | |
| | | this.initExec() |
| | | } |
| | | |
| | | /** |
| | |
| | | return |
| | | } |
| | | MKEmitter.removeListener('reloadData', this.reloadData) |
| | | MKEmitter.removeListener('searchRefresh', this.searchRefresh) |
| | | MKEmitter.removeListener('resetSelectLine', this.resetParentParam) |
| | | MKEmitter.removeListener('transferSyncData', this.transferSyncData) |
| | | } |
| | | |
| | | initExec = () => { |
| | | const { config, BID } = this.state |
| | | |
| | | if (config.$cache) { |
| | | if (config.$time) { |
| | | if (!this.loaded) { |
| | | Api.getLCacheConfig(config.uuid, config.$time, BID).then(res => { |
| | | if (!res.valid && config.setting.onload === 'true') { |
| | | setTimeout(() => { |
| | | this.loadData('init') |
| | | }, config.setting.delay || 0) |
| | | } |
| | | |
| | | if (!res.data || this.loaded) return |
| | | |
| | | this.data = res.data |
| | | this.handleData() |
| | | }) |
| | | } else { |
| | | this.handleData() |
| | | } |
| | | } else { |
| | | if (!this.loaded) { |
| | | Api.getLCacheConfig(config.uuid, 0, BID).then(res => { |
| | | if (!res.data || this.loaded) return |
| | | |
| | | this.data = res.data |
| | | this.handleData() |
| | | }) |
| | | } |
| | | |
| | | if (config.setting.onload === 'true') { |
| | | setTimeout(() => { |
| | | this.loadData('init') |
| | | }, config.setting.delay || 0) |
| | | } else if (this.loaded) { |
| | | this.handleData() |
| | | } |
| | | } |
| | | } else if (config.setting.onload === 'true') { |
| | | setTimeout(() => { |
| | | this.loadData() |
| | | }, config.setting.delay || 0) |
| | | } else if (this.loaded) { |
| | | this.handleData() |
| | | } |
| | | } |
| | | |
| | | transferSyncData = (syncId) => { |
| | | const { config, BID } = this.state |
| | | |
| | | if (config.$syncId !== syncId) return |
| | | |
| | | let _data = window.GLOB.SyncData.get(config.dataName) || [] |
| | | |
| | | if (config.$cache) { |
| | | Api.writeCacheConfig(config.uuid, fromJS(_data).toJS(), BID) |
| | | } |
| | | |
| | | if (!is(fromJS(this.data), fromJS(_data))) { |
| | | this.data = _data |
| | | this.handleData() |
| | | } |
| | | |
| | | this.loaded = true |
| | | |
| | | window.GLOB.SyncData.delete(config.dataName) |
| | | |
| | | MKEmitter.removeListener('transferSyncData', this.transferSyncData) |
| | | } |
| | | |
| | | searchRefresh = (searchId) => { |
| | | const { config } = this.state |
| | | |
| | | if (config.$searchId !== searchId) return |
| | | |
| | | this.setState({}, () => { |
| | | this.loadData() |
| | | }) |
| | | } |
| | | |
| | | reloadData = (menuId) => { |
| | |
| | | } |
| | | } |
| | | |
| | | async loadData () { |
| | | const { mainSearch } = this.props |
| | | const { config, arr_field, BID } = this.state |
| | | async loadData (type) { |
| | | const { config, BID } = this.state |
| | | |
| | | if (config.setting.supModule && !BID) { // BID 不存在时,不做查询 |
| | | if (!is(fromJS(this.data), fromJS([]))) { |
| | | this.data = [] |
| | | this.handleData() |
| | | } |
| | | this.loaded = true |
| | | return |
| | | } |
| | | |
| | | let searches = config.setting.useMSearch && mainSearch ? mainSearch : [] |
| | | let searches = [] |
| | | if (config.setting.useMSearch) { // 主表搜索条件 |
| | | searches = window.GLOB.SearchBox.get(config.$searchId) || [] |
| | | } |
| | | |
| | | 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 = config.setting.order || '' |
| | | let param = UtilsDM.getQueryDataParams(config.setting, arr_field, searches, _orderBy, '', '', BID) |
| | | let param = UtilsDM.getQueryDataParams(config.setting, searches, _orderBy, '', '', BID) |
| | | |
| | | let result = await Api.genericInterface(param) |
| | | if (result.status) { |
| | | if (config.$cache && config.setting.onload !== 'false') { |
| | | Api.writeCacheConfig(config.uuid, result.data || '') |
| | | if (config.$cache && type === 'init') { |
| | | Api.writeCacheConfig(config.uuid, result.data || [], BID) |
| | | } |
| | | |
| | | this.loaded = true |
| | | |
| | | this.setState({ |
| | | loading: false |
| | |
| | | this.data = result.data || [] |
| | | this.handleData() |
| | | } |
| | | 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 { |
| | | this.setState({ |
| | | loading: false |
| | | }) |
| | | |
| | | 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, |
| | |
| | | |
| | | _options.push(_item) |
| | | }) |
| | | |
| | | root = this.getTree(root, _options) |
| | | |
| | | root.nodeNumber = 0 |
| | | root = this.getTree(root, _options, root) |
| | | root.children = root.children || [] |
| | | |
| | | if (root.selectedItem) { |
| | | let option = {...root.selectedItem} |
| | | setTimeout(() => { |
| | | MKEmitter.emit('resetSelectLine', config.uuid, option.id, option) |
| | | }, 20) |
| | | delete root.selectedItem |
| | | } else { |
| | | this.selectedId = '' |
| | | } |
| | | |
| | | if (plot.subtype === 'mindmap') { |
| | | root.type = 'dice-mind-map-root' |
| | |
| | | return root |
| | | } |
| | | |
| | | getTree = (parent, options) => { |
| | | getTree = (parent, options, root) => { |
| | | parent.children = [] |
| | | // 添加菜单的子元素 |
| | | options = options.filter(option => { |
| | | if (option.$parentId === parent.id) { |
| | | delete option.$parentId |
| | | |
| | | if (this.selectedId && option.id === this.selectedId) { |
| | | root.selectedItem = {...option} |
| | | option.selected = true |
| | | } |
| | | |
| | | parent.children.push(option) |
| | | |
| | | root.nodeNumber++ |
| | | |
| | | return false |
| | | } |
| | | return true |
| | |
| | | parent.children = null |
| | | } else { |
| | | parent.children = parent.children.map(item => { |
| | | item = this.getTree(item, options) |
| | | item = this.getTree(item, options, root) |
| | | |
| | | return item |
| | | }) |
| | |
| | | } |
| | | |
| | | handleData = () => { |
| | | let _element = document.getElementById(this.state.chartId) |
| | | if (_element) { |
| | | _element.innerHTML = '' |
| | | } |
| | | const { config } = this.state |
| | | |
| | | setTimeout(() => { |
| | | MKEmitter.emit('resetSelectLine', config.uuid, '', '') |
| | | |
| | | if (this.mkgraph) { |
| | | this.mkgraph.clear() |
| | | this.resetrender() |
| | | } else { |
| | | this.viewrender() |
| | | }, 100) |
| | | } |
| | | } |
| | | |
| | | viewrender = () => { |
| | | const { plot } = this.state |
| | | |
| | | this.selectedId = '' |
| | | if (this.data.length === 0) { |
| | | this.setState({empty: true}) |
| | | } else { |
| | |
| | | this.indentrender() |
| | | } else if (plot.subtype === 'kapmap') { |
| | | this.kapmaprender() |
| | | } |
| | | } |
| | | } |
| | | |
| | | resetrender = () => { |
| | | const { plot } = this.state |
| | | |
| | | if (this.data.length === 0) { |
| | | this.setState({empty: true}) |
| | | this.selectedId = '' |
| | | } else { |
| | | this.setState({empty: false}) |
| | | |
| | | const data = this.getdata() |
| | | if (plot.subtype === 'mindmap') { |
| | | this.mkgraph.data(data) |
| | | |
| | | this.mkgraph.render() |
| | | |
| | | const width = this.wrap.scrollWidth - 30 |
| | | |
| | | if (plot.collapsed === 'true' && plot.dirField) { |
| | | this.mkgraph.zoomTo(1, { x: width / 2, y: plot.height / 2 }) |
| | | } else if (plot.collapsed === 'true' || data.nodeNumber < 5) { |
| | | this.mkgraph.zoomTo(1, { x: 0, y: plot.height / 2 }) |
| | | } |
| | | } else if (plot.subtype === 'indentTree') { |
| | | this.mkgraph.data(dataIndTransform(data)) |
| | | |
| | | this.mkgraph.render() |
| | | } else if (plot.subtype === 'kapmap') { |
| | | this.mkgraph.data(data) |
| | | this.mkgraph.render() |
| | | this.mkgraph.fitView() |
| | | |
| | | if (plot.collapsed === 'true' || data.nodeNumber < 5) { |
| | | this.mkgraph.zoomTo(1, { x: 0, y: plot.height / 2 }) |
| | | } |
| | | } |
| | | } |
| | | } |
| | |
| | | graph.render() |
| | | graph.fitView() |
| | | |
| | | if (plot.collapsed === 'true') { |
| | | if (plot.collapsed === 'true' || data.nodeNumber < 5) { |
| | | graph.zoomTo(1, { x: 0, y: plot.height / 2 }) |
| | | } |
| | | |
| | | this.mkgraph = graph |
| | | } |
| | | |
| | | indentrender = () => { |
| | |
| | | tree.data(dataIndTransform(data)) |
| | | |
| | | tree.render() |
| | | |
| | | this.mkgraph = tree |
| | | } |
| | | |
| | | /** |
| | |
| | | |
| | | if (plot.collapsed === 'true' && plot.dirField) { |
| | | tree.zoomTo(1, { x: width / 2, y: plot.height / 2 }) |
| | | } else if (plot.collapsed === 'true') { |
| | | } else if (plot.collapsed === 'true' || data.nodeNumber < 5) { |
| | | tree.zoomTo(1, { x: 0, y: plot.height / 2 }) |
| | | } |
| | | |
| | | this.mkgraph = tree |
| | | } |
| | | |
| | | handleClick = (data = null) => { |
| | | const { plot, config } = this.state |
| | | |
| | | if (plot.click && !data) return |
| | | |
| | | if (plot.click === 'menus') { |
| | | if (!data) return |
| | | |
| | | let menu = null |
| | | |
| | | if (plot.menus && plot.menus.length > 0) { |
| | |
| | | |
| | | MKEmitter.emit('modifyTabs', newtab, true) |
| | | } else if (plot.click === 'menu') { |
| | | if (!data) return |
| | | |
| | | let menuId = plot.menu.slice(-1)[0] |
| | | let newtab = window.GLOB.mkThdMenus.filter(m => m.MenuID === menuId)[0] |
| | | |
| | |
| | | |
| | | MKEmitter.emit('modifyTabs', newtab, true) |
| | | } else { |
| | | MKEmitter.emit('resetSelectLine', config.uuid, (data ? data.$$uuid : ''), data) |
| | | if (data) { |
| | | this.selectedId = data.$$uuid || '' |
| | | MKEmitter.emit('resetSelectLine', config.uuid, data.$$uuid || '', data) |
| | | } else { |
| | | this.selectedId = '' |
| | | MKEmitter.emit('resetSelectLine', config.uuid, '', '') |
| | | } |
| | | } |
| | | } |
| | | |