| | |
| | | chartId: Utils.getuuid(), // 图表Id |
| | | sync: false, // 是否统一请求数据 |
| | | plot: null, // 图表设置 |
| | | data: {}, // 数据 |
| | | chart: null |
| | | } |
| | | |
| | | data = {} |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { config, data, initdata } = this.props |
| | | let _config = fromJS(config).toJS() |
| | | |
| | | let _data = null |
| | | let _sync = _config.setting.sync === 'true' |
| | | |
| | | let BID = '' |
| | |
| | | } |
| | | |
| | | if (_sync && data) { |
| | | _data = data[config.dataName] || [] |
| | | this.data = data[config.dataName] || [] |
| | | _sync = false |
| | | } else if (_sync && initdata) { |
| | | _data = initdata || [] |
| | | this.data = initdata || [] |
| | | _sync = false |
| | | } |
| | | |
| | | if (_config.subtype === 'ratioboard') { |
| | | _data = _data || [] |
| | | } else { |
| | | if (_data && Array.isArray(_data)) { |
| | | _data = _data[0] || {} |
| | | } else { |
| | | _data = {} |
| | | if (_config.subtype !== 'ratioboard') { |
| | | if (Array.isArray(this.data)) { |
| | | this.data = this.data[0] || {} |
| | | } |
| | | this.data.value = this.data[config.plot.valueField] || 0 |
| | | } |
| | | |
| | | _config.plot.height = Utils.getHeight(_config.plot.height) |
| | |
| | | |
| | | this.setState({ |
| | | config: _config, |
| | | data: _data, |
| | | BID: BID || '', |
| | | arr_field: _config.columns.map(col => col.field).join(','), |
| | | plot: _config.plot, |
| | |
| | | setTimeout(() => { |
| | | this.loadData() |
| | | }, _config.setting.delay || 0) |
| | | } else if (config.setting.sync === 'true') { |
| | | this.handleData() |
| | | } |
| | | }) |
| | | |
| | | if (config.setting.sync === 'true' && !_sync) { |
| | | this.handleData() |
| | | } |
| | | } |
| | | |
| | | /** |
| | |
| | | if (sync && !is(fromJS(this.props.data), fromJS(nextProps.data))) { |
| | | let _data = null |
| | | |
| | | if (config.subtype === 'ratioboard') { |
| | | _data = [] |
| | | if (nextProps.data && nextProps.data[config.dataName]) { |
| | | _data = nextProps.data[config.dataName] || [] |
| | | } |
| | | } else { |
| | | _data = {} |
| | | if (nextProps.data && nextProps.data[config.dataName]) { |
| | | _data = nextProps.data[config.dataName] || {} |
| | | } |
| | | if (_data.hasOwnProperty(config.plot.valueField)) { |
| | | _data.value = _data[config.plot.valueField] |
| | | if (nextProps.data && nextProps.data[config.dataName]) { |
| | | _data = nextProps.data[config.dataName] |
| | | if (config.subtype !== 'ratioboard') { |
| | | if (Array.isArray(_data)) { |
| | | _data = _data[0] || {} |
| | | } |
| | | _data.value = _data[config.plot.valueField] || 0 |
| | | } |
| | | } |
| | | |
| | | this.setState({sync: false, data: _data}, () => { |
| | | if (_data && !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() |
| | |
| | | } |
| | | |
| | | componentDidMount () { |
| | | const { config } = this.state |
| | | const { config, sync } = this.state |
| | | |
| | | MKEmitter.addListener('reloadData', this.reloadData) |
| | | MKEmitter.addListener('resetSelectLine', this.resetParentParam) |
| | |
| | | this.timer = new TimerTask() |
| | | this.timer.init(config.uuid, config.timer, config.timerRepeats, () => { |
| | | this.loadData(true) |
| | | }) |
| | | } |
| | | |
| | | if (config.$cache && (config.setting.sync !== 'true' || sync)) { |
| | | Api.getLCacheConfig(config.uuid).then(res => { |
| | | if (!res) return |
| | | |
| | | let _data = null |
| | | if (config.subtype === 'ratioboard') { |
| | | _data = res |
| | | } else { |
| | | _data = res[0] |
| | | _data.value = _data[config.plot.valueField] || 0 |
| | | } |
| | | |
| | | if (!is(fromJS(this.data), fromJS(_data))) { |
| | | this.data = _data |
| | | this.handleData() |
| | | } |
| | | }) |
| | | } |
| | | } |
| | |
| | | if (_element) { |
| | | _element.innerHTML = '' |
| | | } |
| | | this.viewrender() |
| | | |
| | | setTimeout(() => { |
| | | this.viewrender() |
| | | }, 100) |
| | | } |
| | | |
| | | async loadData (hastimer) { |
| | |
| | | const { config, arr_field, BID } = this.state |
| | | |
| | | if (config.setting.supModule && !BID) { // BID 不存在时,不做查询 |
| | | this.setState({ |
| | | data: {} |
| | | }, () => { |
| | | let _data = null |
| | | if (config.subtype === 'ratioboard') { |
| | | _data = [] |
| | | } else { |
| | | _data = {value: 0} |
| | | } |
| | | |
| | | if (!is(fromJS(this.data), fromJS(_data))) { |
| | | this.data = _data |
| | | this.handleData() |
| | | }) |
| | | } |
| | | return |
| | | } |
| | | |
| | |
| | | |
| | | let result = await Api.genericInterface(param) |
| | | if (result.status) { |
| | | let data = null |
| | | if (config.subtype === 'ratioboard') { |
| | | data = result.data || [] |
| | | } else { |
| | | data = {} |
| | | if (result.data && result.data[0] && result.data[0].hasOwnProperty(config.plot.valueField)) { |
| | | data.value = result.data[0][config.plot.valueField] |
| | | } |
| | | if (config.$cache) { |
| | | Api.writeCacheConfig(config.uuid, result.data || '') |
| | | } |
| | | let reset = true |
| | | |
| | | if (hastimer && is(fromJS(data), fromJS(this.state.data))) { |
| | | reset = false |
| | | let _data = null |
| | | if (config.subtype === 'ratioboard') { |
| | | _data = result.data || [] |
| | | } else { |
| | | _data = result.data && result.data[0] ? result.data && result.data[0] : {} |
| | | _data.value = _data.value[config.plot.valueField] || 0 |
| | | } |
| | | |
| | | if (!is(fromJS(this.data), fromJS(_data))) { |
| | | this.data = _data |
| | | this.handleData() |
| | | } |
| | | |
| | | this.setState({ |
| | | data, |
| | | loading: false |
| | | }, () => { |
| | | if (!reset) return |
| | | this.handleData() |
| | | }) |
| | | } else { |
| | | this.setState({ |
| | |
| | | } |
| | | |
| | | getratiodata = () => { |
| | | const { data, plot } = this.state |
| | | const { plot } = this.state |
| | | |
| | | let colors = {} |
| | | if (plot.colors && plot.colors.length > 0) { |
| | |
| | | }) |
| | | } |
| | | |
| | | return data.map(item => { |
| | | return this.data.map(item => { |
| | | let val = +item[plot.valueField] |
| | | let type = item[plot.labelField] || '' |
| | | if (isNaN(val)) { |
| | |
| | | * @description 仪表盘渲染 |
| | | */ |
| | | dashboardrender = () => { |
| | | const { plot, chartId, data } = this.state |
| | | const { plot, chartId } = this.state |
| | | |
| | | let _data = fromJS(data).toJS() |
| | | let _data = fromJS(this.data).toJS() |
| | | _data.value = +_data.value |
| | | |
| | | if (_data.hasOwnProperty('value')) { |
| | | if (_data.value === '' || _data.value === null) { |
| | | delete _data.value |
| | | } else { |
| | | _data.value = +_data.value |
| | | |
| | | if (isNaN(_data.value)) { |
| | | delete _data.value |
| | | } else if (_data.value > plot.maxValue) { |
| | | _data.value = plot.maxValue |
| | | } |
| | | } |
| | | if (isNaN(_data.value)) { |
| | | _data.value = 0 |
| | | } else if (_data.value > plot.maxValue) { |
| | | _data.value = plot.maxValue |
| | | } |
| | | |
| | | const chart = new Chart({ |
| | |
| | | }) |
| | | } |
| | | |
| | | if (data.hasOwnProperty('value')) { |
| | | let val = data.value |
| | | let val = +this.data.value |
| | | |
| | | if (!isNaN(val)) { |
| | | if (plot.percent !== 'false' && plot.maxValue) { |
| | | val = +(val / plot.maxValue * 100).toFixed(2) + ' %' |
| | | } |