From 913ea012f420311d18cc875934bae6b4ce3b2d13 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 16 一月 2023 14:44:28 +0800 Subject: [PATCH] 2023-01-16 --- src/menu/components/card/cardsimplecomponent/index.jsx | 56 +++--- src/tabviews/custom/components/chart/antv-scatter/index.jsx | 57 +++--- src/tabviews/custom/components/chart/antv-bar-line/index.jsx | 58 +++--- src/tabviews/custom/components/chart/antv-dashboard/index.jsx | 124 +++++++-------- src/tabviews/custom/components/chart/antv-G6/index.jsx | 51 +++--- src/tabviews/custom/components/chart/antv-pie/index.jsx | 56 +++--- src/tabviews/custom/components/chart/custom-chart/index.jsx | 59 ++++--- 7 files changed, 235 insertions(+), 226 deletions(-) diff --git a/src/menu/components/card/cardsimplecomponent/index.jsx b/src/menu/components/card/cardsimplecomponent/index.jsx index 1edd5d7..cf6e1d3 100644 --- a/src/menu/components/card/cardsimplecomponent/index.jsx +++ b/src/menu/components/card/cardsimplecomponent/index.jsx @@ -212,7 +212,7 @@ let _style = {...card.style} if (cards.type === 'carousel') { - _style.height = cards.style.height + _style.height = cards.wrap.height } let control = true @@ -223,34 +223,32 @@ _style = resetStyle(_style) return ( - <div className="ant-col ant-col-24"> - <div className="card-item" style={_style}> - <CardCellComponent cards={cards} cardCell={card} elements={card.elements} updateElement={this.updateCard}/> - <div className="card-control"> - <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ - <div className="mk-popover-control"> - <PlusOutlined className="plus" title="娣诲姞鍏冪礌" onClick={this.addElement}/> - <PlusSquareOutlined className="plus" title="娣诲姞鎸夐挳" onClick={this.addButton}/> - {cards.type !== 'timeline' ? <NormalForm title="鍗$墖璁剧疆" width={800} update={this.updateSetting} getForms={this.getSettingForms}> - <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/> - </NormalForm> : <NodesWrap card={card} updateMenus={this.updateNodes}/>} - {cards.type !== 'timeline' ? <CopyComponent type="cardcell" card={card}/> : null} - <PasteController options={['action', 'customCardElement']} updateConfig={this.paste} /> - <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle}/> - {control ? <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ - <div className="mk-popover-control"> - <ArrowLeftOutlined className="plus" title="鍓嶇Щ" onClick={() => this.props.move(card, 'left')} /> - <ArrowRightOutlined className="close" title="鍚庣Щ" onClick={() => this.props.move(card, 'right')} /> - </div> - } trigger="hover" getPopupContainer={() => document.getElementById(card.uuid + 'swap')}> - <SwapOutlined id={card.uuid + 'swap'}/> - </Popover> : null} - {control ? <DeleteOutlined className="close" title="鍒犻櫎鍗$墖" onClick={() => this.props.deleteElement(card)} /> : null} - </div> - } trigger="hover"> - <ToolOutlined/> - </Popover> - </div> + <div className="card-item" style={_style}> + <CardCellComponent cards={cards} cardCell={card} elements={card.elements} updateElement={this.updateCard}/> + <div className="card-control"> + <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ + <div className="mk-popover-control"> + <PlusOutlined className="plus" title="娣诲姞鍏冪礌" onClick={this.addElement}/> + <PlusSquareOutlined className="plus" title="娣诲姞鎸夐挳" onClick={this.addButton}/> + {cards.type !== 'timeline' ? <NormalForm title="鍗$墖璁剧疆" width={800} update={this.updateSetting} getForms={this.getSettingForms}> + <EditOutlined style={{color: '#1890ff'}} title="缂栬緫"/> + </NormalForm> : <NodesWrap card={card} updateMenus={this.updateNodes}/>} + {cards.type !== 'timeline' ? <CopyComponent type="cardcell" card={card}/> : null} + <PasteController options={['action', 'customCardElement']} updateConfig={this.paste} /> + <FontColorsOutlined className="style" title="璋冩暣鏍峰紡" onClick={this.changeStyle}/> + {control ? <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={ + <div className="mk-popover-control"> + <ArrowLeftOutlined className="plus" title="鍓嶇Щ" onClick={() => this.props.move(card, 'left')} /> + <ArrowRightOutlined className="close" title="鍚庣Щ" onClick={() => this.props.move(card, 'right')} /> + </div> + } trigger="hover" getPopupContainer={() => document.getElementById(card.uuid + 'swap')}> + <SwapOutlined id={card.uuid + 'swap'}/> + </Popover> : null} + {control ? <DeleteOutlined className="close" title="鍒犻櫎鍗$墖" onClick={() => this.props.deleteElement(card)} /> : null} + </div> + } trigger="hover"> + <ToolOutlined/> + </Popover> </div> </div> ) diff --git a/src/tabviews/custom/components/chart/antv-G6/index.jsx b/src/tabviews/custom/components/chart/antv-G6/index.jsx index 47db6f9..e856a3d 100644 --- a/src/tabviews/custom/components/chart/antv-G6/index.jsx +++ b/src/tabviews/custom/components/chart/antv-G6/index.jsx @@ -804,7 +804,6 @@ state = { config: null, - data: [], BID: '', BData: '', plot: null, @@ -814,11 +813,12 @@ empty: true } + 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 = '' @@ -834,10 +834,10 @@ } 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 } @@ -850,7 +850,6 @@ this.setState({ config: _config, - data: _data || [], BID: BID || '', BData: BData || '', arr_field: _config.columns.map(col => col.field).join(','), @@ -861,11 +860,12 @@ setTimeout(() => { this.loadData() }, _config.setting.delay || 0) - } else if (config.setting.sync === 'true' && _data) { - this.handleData() } }) + if (this.data.length > 0) { + this.handleData() + } let that = this @@ -1008,11 +1008,12 @@ _data = nextProps.data[config.dataName] } - this.setState({sync: false, data: _data}) - - if (!is(fromJS(this.state.data), fromJS(_data))) { + 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() @@ -1031,11 +1032,12 @@ if (config.$cache && (config.setting.sync !== 'true' || sync)) { Api.getLCacheConfig(config.uuid).then(res => { - if (!res) return + if (!res || this.data.length > 0) return - this.setState({data: res}) - - this.handleData() + if (!is(fromJS(this.data), fromJS(res))) { + this.data = res + this.handleData() + } }) } } @@ -1072,14 +1074,13 @@ async loadData () { const { mainSearch } = this.props - const { config, arr_field, BID, data } = this.state + const { config, arr_field, BID } = this.state if (config.setting.supModule && !BID) { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� - this.setState({ - data: [] - }, () => { + if (!is(fromJS(this.data), fromJS([]))) { + this.data = [] this.handleData() - }) + } return } @@ -1104,11 +1105,11 @@ } this.setState({ - data: result.data || [], loading: false }) - if (!is(fromJS(data), fromJS(result.data || []))) { + if (!is(fromJS(this.data), fromJS(result.data || []))) { + this.data = result.data || [] this.handleData() } } else { @@ -1131,7 +1132,7 @@ } getdata = () => { - const { plot, data, config, BData } = this.state + const { plot, config, BData } = this.state let root = { label: 'Root', @@ -1157,7 +1158,7 @@ let _options = [] let logMap = new Map() - data.forEach(item => { + this.data.forEach(item => { let pval = item[plot.parentField] let val = item[plot.valueField] let label = item[plot.labelField] || '' @@ -1284,9 +1285,9 @@ } viewrender = () => { - const { plot, data } = this.state + const { plot } = this.state - if (data.length === 0) { + if (this.data.length === 0) { this.setState({empty: true}) } else { this.setState({empty: false}) diff --git a/src/tabviews/custom/components/chart/antv-bar-line/index.jsx b/src/tabviews/custom/components/chart/antv-bar-line/index.jsx index 349f550..5bc343a 100644 --- a/src/tabviews/custom/components/chart/antv-bar-line/index.jsx +++ b/src/tabviews/custom/components/chart/antv-bar-line/index.jsx @@ -37,17 +37,17 @@ transfield: {}, // 瀛楁鍚嶇О缈昏瘧 sync: false, // 鏄惁缁熶竴璇锋眰鏁版嵁 plot: null, // 鍥捐〃璁剧疆 - data: [], // 鏁版嵁 search: null, // 鎼滅储鏉′欢 vFields: [], // 鏁板�煎瓧娈� vstFields: null, // 缁熻鏁版嵁鍊煎瓧娈典俊鎭� 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 = '' @@ -62,11 +62,11 @@ BID = BData.$BID || '' } - if (config.setting.sync === 'true' && data) { - _data = data[config.dataName] || [] + if (_sync && data) { + this.data = data[config.dataName] || [] _sync = false - } else if (config.setting.sync === 'true' && initdata) { - _data = initdata || [] + } else if (_sync && initdata) { + this.data = initdata || [] _sync = false } @@ -335,7 +335,6 @@ this.setState({ config: _config, - data: _data || [], BID: BID || '', vFields: vFields, vstFields: vstFields, @@ -349,17 +348,19 @@ setTimeout(() => { this.loadData() }, _config.setting.delay || 0) - } else if (config.setting.sync === 'true' && _data) { - this.handleData() } }) + + if (this.data.length > 0) { + this.handleData() + } } /** * @description 鍥捐〃鏁版嵁鏇存柊锛屽埛鏂板唴瀹� */ UNSAFE_componentWillReceiveProps (nextProps) { - const { sync, config, data } = this.state + const { sync, config } = this.state if (sync && !is(fromJS(this.props.data), fromJS(nextProps.data))) { let _data = [] @@ -367,11 +368,12 @@ _data = nextProps.data[config.dataName] || [] } - this.setState({sync: false, data: _data}) - - if (!is(fromJS(data), fromJS(_data))) { + 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() @@ -400,11 +402,12 @@ if (config.$cache && (config.setting.sync !== 'true' || sync)) { Api.getLCacheConfig(config.uuid).then(res => { - if (!res) return + if (!res || this.data.length > 0) return - this.setState({data: res}, () => { + if (!is(fromJS(this.data), fromJS(res))) { + this.data = res this.handleData() - }) + } }) } } @@ -500,11 +503,10 @@ const { config, arr_field, BID, search } = this.state if (config.setting.supModule && !BID) { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� - this.setState({ - data: [] - }, () => { + if (!is(fromJS(this.data), fromJS([]))) { + this.data = [] this.handleData() - }) + } return } @@ -539,11 +541,11 @@ } this.setState({ - data: result.data || [], loading: false }) - if (!is(fromJS(this.state.data), fromJS(result.data || []))) { + if (!is(fromJS(this.data), fromJS(result.data || []))) { + this.data = result.data || [] this.handleData() } } else { @@ -586,15 +588,15 @@ * 3銆佹煴鐘跺浘鏁版嵁琛ラ綈 */ getdata = () => { - const { data, plot, vFields, config } = this.state + const { plot, vFields, config } = this.state - if (data.length === 0) { + if (this.data.length === 0) { this.setState({empty: true}) return [] } let _data = [] - let _cdata = fromJS(data).toJS() + let _cdata = fromJS(this.data).toJS() if (plot.repeat === 'average') { let _mdata = new Map() @@ -728,7 +730,7 @@ * @description 缁熻鏁版嵁棰勫鐞� */ getStaticMsg = () => { - const { plot, vstFields, data } = this.state + const { plot, vstFields } = this.state let percent = false let decimal = vstFields ? vstFields.decimal : 0 @@ -737,13 +739,13 @@ percent = true } - if (data.length === 0) { + if (this.data.length === 0) { this.setState({empty: true}) return [] } let _data = [] - let _cdata = fromJS(data).toJS() + let _cdata = fromJS(this.data).toJS() if (plot.repeat === 'average') { let _mdata = new Map() diff --git a/src/tabviews/custom/components/chart/antv-dashboard/index.jsx b/src/tabviews/custom/components/chart/antv-dashboard/index.jsx index af28e52..c505abf 100644 --- a/src/tabviews/custom/components/chart/antv-dashboard/index.jsx +++ b/src/tabviews/custom/components/chart/antv-dashboard/index.jsx @@ -65,15 +65,15 @@ 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 = '' @@ -89,21 +89,18 @@ } 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) @@ -116,7 +113,6 @@ this.setState({ config: _config, - data: _data, BID: BID || '', arr_field: _config.columns.map(col => col.field).join(','), plot: _config.plot, @@ -126,10 +122,12 @@ setTimeout(() => { this.loadData() }, _config.setting.delay || 0) - } else if (config.setting.sync === 'true') { - this.handleData() } }) + + if (config.setting.sync === 'true' && !_sync) { + this.handleData() + } } /** @@ -141,26 +139,22 @@ 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 (!is(fromJS(this.state.data), fromJS(_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() @@ -193,12 +187,14 @@ if (config.subtype === 'ratioboard') { _data = res } else { - _data = {value: res[0][config.plot.valueField]} + _data = res[0] + _data.value = _data[config.plot.valueField] || 0 } - this.setState({data: _data}, () => { + if (!is(fromJS(this.data), fromJS(_data))) { + this.data = _data this.handleData() - }) + } }) } } @@ -251,11 +247,17 @@ 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 } @@ -281,24 +283,22 @@ Api.writeCacheConfig(config.uuid, result.data || '') } - let data = null + let _data = null if (config.subtype === 'ratioboard') { - data = result.data || [] + _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] - } + _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 (!is(fromJS(this.state.data), fromJS(data))) { - this.handleData() - } } else { this.setState({ loading: false @@ -329,7 +329,7 @@ } getratiodata = () => { - const { data, plot } = this.state + const { plot } = this.state let colors = {} if (plot.colors && plot.colors.length > 0) { @@ -338,7 +338,7 @@ }) } - return data.map(item => { + return this.data.map(item => { let val = +item[plot.valueField] let type = item[plot.labelField] || '' if (isNaN(val)) { @@ -448,22 +448,15 @@ * @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({ @@ -581,8 +574,9 @@ }) } - 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) + ' %' } diff --git a/src/tabviews/custom/components/chart/antv-pie/index.jsx b/src/tabviews/custom/components/chart/antv-pie/index.jsx index 02ba1cc..216be2f 100644 --- a/src/tabviews/custom/components/chart/antv-pie/index.jsx +++ b/src/tabviews/custom/components/chart/antv-pie/index.jsx @@ -32,16 +32,16 @@ title: '', // 缁勪欢鏍囬 sync: false, // 鏄惁缁熶竴璇锋眰鏁版嵁 plot: null, // 鍥捐〃璁剧疆 - data: [], // 鏁版嵁 search: null, // 鎼滅储鏉′欢 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 = '' @@ -56,11 +56,11 @@ BID = BData.$BID || '' } - if (config.setting.sync === 'true' && data) { - _data = data[config.dataName] || [] + if (_sync && data) { + this.data = data[config.dataName] || [] _sync = false - } else if (config.setting.sync === 'true' && initdata) { - _data = initdata || [] + } else if (_sync && initdata) { + this.data = initdata || [] _sync = false } @@ -83,7 +83,6 @@ this.setState({ config: _config, - data: _data || [], BID: BID || '', arr_field: _config.columns.map(col => col.field).join(','), plot: _config.plot, @@ -95,10 +94,12 @@ setTimeout(() => { this.loadData() }, _config.setting.delay || 0) - } else if (config.setting.sync === 'true' && _data) { - this.handleData() } }) + + if (this.data.length > 0) { + this.handleData() + } } /** @@ -113,11 +114,12 @@ _data = nextProps.data[config.dataName] || [] } - this.setState({sync: false, data: _data}) - - if (!is(fromJS(this.state.data), fromJS(_data))) { + 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() @@ -144,11 +146,12 @@ if (config.$cache && (config.setting.sync !== 'true' || sync)) { Api.getLCacheConfig(config.uuid).then(res => { - if (!res) return + if (!res || this.data.length > 0) return - this.setState({data: res}, () => { + if (!is(fromJS(this.data), fromJS(res))) { + this.data = res this.handleData() - }) + } }) } } @@ -211,11 +214,10 @@ const { config, arr_field, search, BID } = this.state if (config.setting.supModule && !BID) { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� - this.setState({ - data: [] - }, () => { + if (!is(fromJS(this.data), fromJS([]))) { + this.data = [] this.handleData() - }) + } return } @@ -250,11 +252,11 @@ } this.setState({ - data: result.data || [], loading: false }) - if (!is(fromJS(this.state.data), fromJS(result.data || []))) { + if (!is(fromJS(this.data), fromJS(result.data || []))) { + this.data = result.data || [] this.handleData() } } else { @@ -284,15 +286,15 @@ * 3銆佹煴鐘跺浘鏁版嵁琛ラ綈 */ getdata = () => { - const { data, plot } = this.state + const { plot } = this.state - if (!data) { + if (this.data.length === 0) { this.setState({empty: true}) return [] } let _data = [] - let _cdata = fromJS(data).toJS() + let _cdata = fromJS(this.data).toJS() if (plot.repeat === 'average') { let _mdata = new Map() @@ -377,15 +379,15 @@ } getnestdata = () => { - const { data, plot } = this.state + const { plot } = this.state - if (!data) { + if (this.data.length === 0) { this.setState({empty: true}) return [] } let _data = [] - let _cdata = fromJS(data).toJS() + let _cdata = fromJS(this.data).toJS() if (plot.repeat === 'average') { let _mdata = new Map() diff --git a/src/tabviews/custom/components/chart/antv-scatter/index.jsx b/src/tabviews/custom/components/chart/antv-scatter/index.jsx index a42499a..a36ef44 100644 --- a/src/tabviews/custom/components/chart/antv-scatter/index.jsx +++ b/src/tabviews/custom/components/chart/antv-scatter/index.jsx @@ -33,15 +33,15 @@ chartId: Utils.getuuid(), // 鍥捐〃Id sync: false, // 鏄惁缁熶竴璇锋眰鏁版嵁 plot: null, // 鍥捐〃璁剧疆 - data: [], // 鏁版嵁 search: null, // 鎼滅储鏉′欢 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 = '' @@ -56,11 +56,11 @@ BID = BData.$BID || '' } - if (config.setting.sync === 'true' && data) { - _data = data[config.dataName] || [] + if (_sync && data) { + this.data = data[config.dataName] || [] _sync = false - } else if (config.setting.sync === 'true' && initdata) { - _data = initdata || [] + } else if (_sync && initdata) { + this.data = initdata || [] _sync = false } @@ -74,9 +74,8 @@ this.setState({ config: _config, - data: _data || [], BID: BID || '', - empty: !_data, + empty: this.data.length === 0, arr_field: _config.columns.map(col => col.field).join(','), plot: _config.plot, sync: _sync, @@ -86,10 +85,12 @@ setTimeout(() => { this.loadData() }, _config.setting.delay || 0) - } else if (config.setting.sync === 'true' && _data) { - this.handleData() } }) + + if (this.data.length > 0) { + this.handleData() + } } /** @@ -104,11 +105,12 @@ _data = nextProps.data[config.dataName] || [] } - this.setState({sync: false, data: _data, empty: false}) - - if (!is(fromJS(this.state.data), fromJS(_data))) { + if (!is(fromJS(this.data), fromJS(_data))) { + this.data = _data this.handleData() } + + this.setState({sync: false, empty: _data.length === 0}) } else if (config.setting.useMSearch && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { this.setState({}, () => { this.loadData() @@ -137,11 +139,14 @@ if (config.$cache && (config.setting.sync !== 'true' || sync)) { Api.getLCacheConfig(config.uuid).then(res => { - if (!res) return + if (!res || this.data.length > 0) return - this.setState({data: res, empty: false}, () => { + if (!is(fromJS(this.data), fromJS(res))) { + this.data = res this.handleData() - }) + } + + this.setState({empty: false}) }) } } @@ -237,12 +242,12 @@ const { config, arr_field, BID, search } = this.state if (config.setting.supModule && !BID) { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� - this.setState({ - data: [], - empty: false, - }, () => { + this.setState({ empty: true }) + + if (!is(fromJS(this.data), fromJS([]))) { + this.data = [] this.handleData() - }) + } return } @@ -277,12 +282,12 @@ } this.setState({ - data: result.data || [], - empty: false, + empty: !result.data || result.data.length === 0, loading: false }) - if (!is(fromJS(this.state.data), fromJS(result.data || []))) { + if (!is(fromJS(this.data), fromJS(result.data || []))) { + this.data = result.data || [] this.handleData() } } else { @@ -323,14 +328,14 @@ * @description 鏁g偣鍥炬覆鏌� */ scatterrender = () => { - const { plot, data, chartId } = this.state + const { plot, chartId } = this.state const chart = new Chart({ container: chartId, autoFit: true, height: plot.height }) - chart.data(data); + chart.data(this.data); chart.scale({ [plot.Xaxis]: { nice: true }, [plot.Yaxis]: { nice: true }, diff --git a/src/tabviews/custom/components/chart/custom-chart/index.jsx b/src/tabviews/custom/components/chart/custom-chart/index.jsx index cf9f887..19713cf 100644 --- a/src/tabviews/custom/components/chart/custom-chart/index.jsx +++ b/src/tabviews/custom/components/chart/custom-chart/index.jsx @@ -28,14 +28,14 @@ loading: false, // 鏁版嵁鍔犺浇鐘舵�� sync: false, // 鏄惁缁熶竴璇锋眰鏁版嵁 plot: null, // 鍥捐〃璁剧疆 - data: [], // 鏁版嵁 search: 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 = '' @@ -50,11 +50,11 @@ BID = BData.$BID || '' } - if (config.setting.sync === 'true' && data) { - _data = data[config.dataName] || [] + if (_sync && data) { + this.data = data[config.dataName] || [] _sync = false - } else if (config.setting.sync === 'true' && initdata) { - _data = initdata || [] + } else if (_sync && initdata) { + this.data = initdata || [] _sync = false } @@ -63,8 +63,7 @@ this.setState({ config: _config, - data: _data || [], - empty: !_data || _data.length === 0, + empty: this.data.length === 0, BID: BID || '', arr_field: _config.columns.map(col => col.field).join(','), plot: _config.plot, @@ -75,10 +74,12 @@ setTimeout(() => { this.loadData() }, _config.setting.delay || 0) - } else if (config.setting.sync === 'true' && _data) { - this.handleData() } }) + + if (this.data.length > 0) { + this.handleData() + } } /** @@ -93,11 +94,12 @@ _data = nextProps.data[config.dataName] || [] } - this.setState({sync: false, data: _data, empty: _data.length === 0}) - - if (!is(fromJS(this.state.data), fromJS(_data))) { + if (!is(fromJS(this.data), fromJS(_data))) { + this.data = _data this.handleData() } + + this.setState({sync: false, empty: _data.length === 0}) } else if (config.setting.useMSearch && nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) { this.setState({}, () => { this.loadData() @@ -126,11 +128,13 @@ if (config.$cache && (config.setting.sync !== 'true' || sync)) { Api.getLCacheConfig(config.uuid).then(res => { - if (!res) return + if (!res || this.data.length > 0) return - this.setState({data: res, empty: false}, () => { + if (!is(fromJS(this.data), fromJS(res))) { + this.data = res this.handleData() - }) + } + this.setState({empty: false}) }) } } @@ -227,10 +231,13 @@ if (config.setting.supModule && !BID) { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� this.setState({ - data: [] - }, () => { - this.handleData() + empty: true }) + + if (!is(fromJS(this.data), fromJS([]))) { + this.data = [] + this.handleData() + } return } @@ -265,12 +272,12 @@ } this.setState({ - data: result.data, loading: false, - empty: result.data.length === 0 + empty: !result.data || result.data.length === 0 }) - if (!is(fromJS(this.state.data), fromJS(result.data || []))) { + if (!is(fromJS(this.data), fromJS(result.data || []))) { + this.data = result.data || [] this.handleData() } } else { @@ -305,7 +312,7 @@ * @description 鍥捐〃娓叉煋鍒嗙粍 */ viewrender = () => { - const { config, data } = this.state + const { config } = this.state if (!config.plot.script) return @@ -313,7 +320,7 @@ try { // eslint-disable-next-line let func = new Function('Chart', 'DataSet', 'wrap', 'data', 'config', config.plot.script) - func(Chart, DataSet, this.wrap, data, config) + func(Chart, DataSet, this.wrap, this.data, config) } catch (e) { console.warn(e) @@ -327,7 +334,7 @@ try { // eslint-disable-next-line let func = new Function('echarts', 'DataSet', 'wrap', 'data', 'config', config.plot.script) - func(echarts, DataSet, this.wrap, data, config) + func(echarts, DataSet, this.wrap, this.data, config) } catch (e) { console.warn(e) @@ -358,7 +365,7 @@ <Spin /> </div> : null } - <NormalHeader config={config} BID={BID} refresh={this.refreshSearch} /> + <NormalHeader config={config} BID={BID} refresh={this.refreshSearch}/> <div className="canvas-wrap" style={{height: (config.plot.height + 30) + 'px'}}> <div className={'canvas' + (empty ? ' empty' : '')} style={{height: config.plot.height + 'px'}} ref={ref => this.wrap = ref}></div> </div> -- Gitblit v1.8.0