From aa41be24e83653077d85860cb70882551912af24 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 28 十月 2022 12:53:25 +0800 Subject: [PATCH] 2022-10-28 --- src/tabviews/custom/components/timeline/normal-timeline/index.jsx | 219 ++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 186 insertions(+), 33 deletions(-) diff --git a/src/tabviews/custom/components/timeline/normal-timeline/index.jsx b/src/tabviews/custom/components/timeline/normal-timeline/index.jsx index d49100c..8e6e58e 100644 --- a/src/tabviews/custom/components/timeline/normal-timeline/index.jsx +++ b/src/tabviews/custom/components/timeline/normal-timeline/index.jsx @@ -1,13 +1,14 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Spin, notification, Timeline, Empty } from 'antd' +import { Spin, notification, Timeline, Empty, Modal } from 'antd' import Api from '@/api' import MkIcon from '@/components/mk-icon' import asyncComponent from '@/utils/asyncComponent' import UtilsDM from '@/utils/utils-datamanage.js' import MKEmitter from '@/utils/events.js' +import TimerTask from '@/utils/timer-task.js' import './index.scss' const CardCellComponent = asyncComponent(() => import('@/tabviews/custom/components/card/cardcellList')) @@ -15,11 +16,9 @@ class NormalTimeline extends Component { static propTpyes = { - BID: PropTypes.any, // 鐖剁骇Id data: PropTypes.array, // 缁熶竴鏌ヨ鏁版嵁 config: PropTypes.object, // 缁勪欢閰嶇疆淇℃伅 mainSearch: PropTypes.any, // 澶栧眰鎼滅储鏉′欢 - menuType: PropTypes.any, // 鑿滃崟绫诲瀷 } state = { @@ -29,7 +28,8 @@ sync: false, // 鏄惁缁熶竴璇锋眰鏁版嵁 data: null, // 鏁版嵁 BData: '', - card: null + card: null, + description: false } /** @@ -37,13 +37,25 @@ * 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 card = 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.setting.sync === 'true' && data) { _data = data[_config.dataName] || [] @@ -58,6 +70,7 @@ item.key = index item.$$uuid = item[_config.setting.primaryKey] || '' item.$$BID = BID || '' + item.$$BData = BData || '' item.$Index = index + 1 + '' return item }) @@ -67,13 +80,14 @@ _config.wrap.contentHeight = _config.wrap.title ? 'calc(100% - 45px)' : '100%' _config.columns.forEach(item => { + if (item.type !== 'number') return _cols.set(item.field, item) }) card = _config.subcards[0] card.elements = card.elements.map(item => { - if (item.field && _cols.has(item.field)) { - item.col = _cols.get(item.field) + if (item.eleType === 'number' && item.field && _cols.has(item.field) && typeof(item.decimal) !== 'number') { + item.decimal = _cols.get(item.field).decimal || 0 } return item }) @@ -88,16 +102,27 @@ arr_field: _config.columns.map(col => col.field).join(','), }, () => { if (_config.setting.sync !== 'true' && _config.setting.onload === 'true') { - this.loadData() + setTimeout(() => { + this.loadData() + }, _config.setting.delay || 0) } }) } 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.timer) { + this.timer = new TimerTask() + this.timer.init(config.uuid, config.timer, config.timerRepeats, () => { + this.loadData(true) + }) + } } shouldComponentUpdate (nextProps, nextState) { @@ -112,6 +137,8 @@ MKEmitter.removeListener('resetSelectLine', this.resetParentParam) MKEmitter.removeListener('queryModuleParam', this.queryModuleParam) MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult) + + this.timer && this.timer.stop() } /** @@ -154,16 +181,13 @@ if (config.uuid !== menuId) return - this.loadData(btn) // 鏁版嵁鍒锋柊 - - if (btn.syncComponentId && btn.syncComponentId !== config.uuid && btn.syncComponentId !== config.setting.supModule) { - MKEmitter.emit('reloadData', btn.syncComponentId) // 鍚岀骇鏍囩鍒锋柊 + if ((position === 'mainline' || position === 'popclose') && config.setting.supModule && BID) { // 鍒锋柊婧愮粍浠舵椂锛岄檮甯﹀埛鏂颁笂绾ц涓庡綋鍓嶇粍浠� + MKEmitter.emit('reloadData', config.setting.supModule, BID) + } else { + this.loadData() } - if (position === 'mainline' && config.setting.supModule) { // 涓昏〃琛屽埛鏂� - MKEmitter.emit('reloadData', config.setting.supModule, (BID || 'empty')) - } else if (position === 'popclose') { // 鏍囩鍏抽棴鍒锋柊 - config.setting.supModule && MKEmitter.emit('reloadData', config.setting.supModule, (BID || 'empty')) + if (position === 'popclose') { // 鎵ц鍚姩寮圭獥鐨勬寜閽墍閫夋嫨鐨勫埛鏂伴」 btn.$tabId && MKEmitter.emit('refreshPopButton', btn.$tabId) } } @@ -190,7 +214,7 @@ /** * @description 瀵煎嚭Excel鏃讹紝鑾峰彇椤甸潰鎼滅储鎺掑簭绛夊弬鏁� */ - queryModuleParam = (menuId, btnId) => { + queryModuleParam = (menuId, callback) => { const { mainSearch } = this.props const { arr_field, config } = this.state @@ -206,7 +230,7 @@ }) } - MKEmitter.emit('returnModuleParam', config.uuid, btnId, { + callback({ arr_field: arr_field, orderBy: config.setting.order || '', search: searches, @@ -214,14 +238,19 @@ }) } - async loadData () { - const { mainSearch, menuType } = this.props + async loadData (hastimer) { + const { mainSearch } = this.props const { config, arr_field, BID, BData } = this.state - + if (config.setting.supModule && !BID) { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� this.setState({ data: [], }) + return + } + + if (config.setting.interType === 'inner' && config.setting.innerFunc === 'z_mk_express') { + this.getExpress() return } @@ -240,12 +269,14 @@ return } - this.setState({ - loading: true - }) + if (!hastimer) { + this.setState({ + loading: true + }) + } let _orderBy = config.setting.order || '' - let param = UtilsDM.getQueryDataParams(config.setting, arr_field, searches, _orderBy, 1, config.setting.pageSize, BID, menuType) + let param = UtilsDM.getQueryDataParams(config.setting, arr_field, searches, _orderBy, 1, config.setting.pageSize, BID) let result = await Api.genericInterface(param) if (result.status) { @@ -264,12 +295,75 @@ 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 + }) + } + } + } + + getExpress = () => { + const { BData } = this.state + + let code = '' + let order = '' + if (BData) { + Object.keys(BData).forEach(key => { + if (key.toLowerCase() === 'expresscode') { + code = BData[key] + } else if (key.toLowerCase() === 'expressno') { + order = BData[key] + } }) } + + if (!code || !order) { + notification.warning({ + top: 92, + message: '鏈幏鍙栧埌蹇��' + (!code ? '鍏徃缂栫爜銆�' : '鍗曞彿銆�'), + duration: 5 + }) + return + } + + this.setState({ + loading: true + }) + Api.wxNginxRequest(`express/${code}/${order}`, 'get').then(res => { + if (!res || typeof(res) !== 'string') { + notification.error({ + top: 92, + message: '鏈幏鍙栧埌蹇�掍俊鎭�', + duration: 10 + }) + } else if (/鏌ヨ鏃犵粨鏋�/.test(res)) { + this.setState({description: res, data: [], loading: false}) + } else { + let data = res.split(/\n/).filter(Boolean) + + data = data.map((item, i) => { + return { + $Index: i, + date: item.substr(0, 19), + content: item.substr(20) + } + }) + + this.setState({ + data: data, + loading: false + }) + } + }) } getnodes = (data) => { @@ -303,11 +397,67 @@ </Timeline.Item>) } + getMknodes = (data) => { + const { config, card } = this.state + + let color = config.wrap.color + let dot = '' + let linebg = {} + if (config.wrap.node && card.nodes && card.nodes.length > 0) { + let sign = data[config.wrap.node] + card.nodes.some(item => { + if (sign === item.sign) { + color = item.color + + if (item.icon) { + dot = <MkIcon type={item.icon}/> + } + + if (item.linecolor) { + linebg = {borderColor: item.linecolor} + } + return true + } + return false + }) + } + + if (config.wrap.mode === 'down') { + return (<div className="mk-time-line-item" key={data.$Index}> + <div className="mk-timeline-item-content"> + <div className="card-item-box" style={card.style}> + <CardCellComponent data={data} cards={config} cardCell={card} elements={card.elements}/> + </div> + </div> + <div className="mk-timeline-item-head"> + <div className="mk-timeline-item-tail" style={linebg}></div> + <div className={'mk-dot ' + (dot ? 'mk-dot-icon' : '')} style={{background: color}}> + {dot} + </div> + </div> + </div>) + } else { + return (<div className="mk-time-line-item" key={data.$Index}> + <div className="mk-timeline-item-head"> + <div className="mk-timeline-item-tail" style={linebg}></div> + <div className={'mk-dot ' + (dot ? 'mk-dot-icon' : '')} style={{background: color}}> + {dot} + </div> + </div> + <div className="mk-timeline-item-content"> + <div className="card-item-box" style={card.style}> + <CardCellComponent data={data} cards={config} cardCell={card} elements={card.elements}/> + </div> + </div> + </div>) + } + } + render() { - const { config, loading, data } = this.state + const { config, loading, data, description } = this.state return ( - <div className="normal-timeline-box" style={{...config.style}}> + <div className="normal-timeline-box" id={'anchor' + config.uuid} style={{...config.style}}> {loading ? <div className="loading-mask"> {data ? <div className="ant-spin-blur"></div> : null} @@ -315,11 +465,14 @@ </div> : null } <NormalHeader config={config} /> - {data && data.length > 0 ? <Timeline mode={config.wrap.mode} reverse={config.wrap.reverse === 'true'} className={'card-row-list ' + (config.wrap.line || '')} style={{height: config.wrap.contentHeight}}> + {config.wrap.direction !== 'horizontal' && data && data.length > 0 ? <Timeline mode={config.wrap.mode} className={'card-row-list ' + (config.wrap.line || '')} style={{height: config.wrap.contentHeight}}> {data.map(item => this.getnodes(item))} </Timeline> : null} + {config.wrap.direction === 'horizontal' && data && data.length > 0 ? <div className={'mk-time-line-wrap card-row-list ' + (config.wrap.line || '')} style={{height: config.wrap.contentHeight}}> + {data.map(item => this.getMknodes(item))} + </div> : null} {data && data.length === 0 ? <div className="card-row-list" style={{height: config.wrap.contentHeight}}> - <Empty description={false}/> + <Empty description={description}/> </div> : null} </div> ) -- Gitblit v1.8.0