From a9b02f6862522b54d0824152017bf2acfec2af7b Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期四, 21 三月 2024 10:29:50 +0800 Subject: [PATCH] 2024-03-21 --- src/tabviews/custom/components/card/data-card/index.jsx | 127 ++++++++++++++++++++++++++++++++---------- 1 files changed, 97 insertions(+), 30 deletions(-) diff --git a/src/tabviews/custom/components/card/data-card/index.jsx b/src/tabviews/custom/components/card/data-card/index.jsx index 3258dde..9bc199c 100644 --- a/src/tabviews/custom/components/card/data-card/index.jsx +++ b/src/tabviews/custom/components/card/data-card/index.jsx @@ -1,7 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Spin, Empty, notification, message, Row, Col, Pagination, Modal } from 'antd' +import { Spin, Empty, notification, message, Row, Col, Pagination, Modal, Switch } from 'antd' import { DownOutlined } from '@ant-design/icons' import Api from '@/api' @@ -37,13 +37,14 @@ selectedData: [], loading: false, card: null, - data: null, - total: null, + data: [], + total: 0, precards: [], nextcards: [], selected: 'false', supNodes: [], - supComs: null + supComs: null, + pickup: false } loaded = false @@ -133,7 +134,13 @@ _config.wrap.scale = _config.wrap.scale === 'true' ? 'scale' : '' _config.wrap.layout = (_config.wrap.layout || 'grid') + '-layout float-' + (_config.wrap.cardFloat || 'left') - _config.wrap.wrapClass = `${_config.wrap.selStyle} ${_config.wrap.cardType || ''} ${_config.wrap.scale}` + _config.wrap.wrapClass = `${_config.wrap.selStyle} ${_config.wrap.cardType || ''} ${_config.wrap.scale} ${config.wrap.hover === 'true' ? 'mk-hover' : ''}` + + if (_config.wrap.shifting === 'true') { + _config.wrap.shifting = 'shifting' + } else { + _config.wrap.shifting = '' + } let pageOptions = ['10', '25', '50', '100', '500', '1000'] @@ -147,9 +154,13 @@ pageOptions.push(size) pageOptions = pageOptions.sort((a, b) => a - b) } + + if (_config.wrap.maxPageSize) { + pageOptions = pageOptions.filter(item => item <= _config.wrap.maxPageSize) + } } - let _data = null + let _data = [] if (_config.setting.sync === 'true') { _config.setting.onload = 'false' @@ -229,6 +240,8 @@ } this.initExec() + + this.autoExec() } shouldComponentUpdate (nextProps, nextState) { @@ -323,6 +336,25 @@ } } + autoExec = (times) => { + const { config } = this.state + + if (!config.wrap.autoExec) return + + let btn = document.getElementById('button' + config.wrap.autoExec) + + this.autoTimer && clearTimeout(this.autoTimer) + + if (btn) { + MKEmitter.emit('triggerBtnId', config.wrap.autoExec, []) + } else if (!times || times < 20) { + times = times ? times + 1 : 1 + this.autoTimer = setTimeout(() => { + this.autoExec(times) + }, 1000) + } + } + transferSyncData = (syncId) => { const { config } = this.state @@ -397,9 +429,9 @@ }, i * 10) }) } else { - if (position === 'line') { + if (position === 'line' || position === 'line_grid') { if (lines && lines.length === 1) { - this.loadLinedata(lines[0].$$uuid) + this.loadLinedata(lines[0].$$uuid, position) } else { this.loadData(id) } @@ -416,9 +448,9 @@ } else { let supModule = config.setting.supModule - if (position === 'line') { + if (position === 'line' || position === 'line_grid') { if (lines && lines.length === 1) { - this.loadLinedata(lines[0].$$uuid) + this.loadLinedata(lines[0].$$uuid, position) } else { this.loadData(id) } @@ -470,7 +502,7 @@ checkTopLine = (id) => { const { config, data, selected } = this.state - if (!data || data.length === 0) { + if (data.length === 0) { this.setState({ activeKey: '', selectKeys: [], @@ -592,7 +624,7 @@ const { config, data, selectedData } = this.state if (config.wrap.cardType !== 'checkbox') return - if (!data || data.length === 0) return + if (data.length === 0) return if (selectedData.length === 0 || selectedData.length < data.length) { let index = '' @@ -673,7 +705,9 @@ if (!config.setting.supModule || config.setting.supModule !== MenuID) return if (id !== this.state.BID || id !== '') { this.setState({ BID: id, BData: data, pageIndex: 1 }, () => { - this.loadData() + if (!config.checkBid) { + this.loadData() + } }) } } @@ -709,6 +743,7 @@ if (config.setting.supModule && !BID && config.wrap.supKey !== 'false') { // BID 涓嶅瓨鍦ㄦ椂锛屼笉鍋氭煡璇� this.loaded = true + this.requestId = '' this.setState({ activeKey: '', @@ -755,8 +790,12 @@ let _orderBy = orderBy || config.setting.order || '' let param = UtilsDM.getQueryDataParams(config.setting, searches, _orderBy, pageIndex, pageSize, BID) - let result = await Api.genericInterface(param) + this.requestId = config.uuid + new Date().getTime() + + let result = await Api.genericInterface(param, '', '', this.requestId) if (result.status) { + if (result.$requestId && this.requestId !== result.$requestId) return + let start = 1 if (config.setting.laypage) { start = pageSize * (pageIndex - 1) + 1 @@ -822,6 +861,7 @@ selectedData: [], data: data, total: total, + pickup: false, loading: false }) @@ -868,8 +908,17 @@ /** * @description 鑾峰彇鍗曡鏁版嵁 */ - async loadLinedata (id) { + async loadLinedata (id, position) { const { config, pageIndex, pageSize, search, BID, BData, orderBy } = this.state + + if (config.forbidLine) { + this.setState({ + pageIndex: 1 + }, () => { + this.loadData() + }) + return + } let searches = fromJS(search).toJS() if (config.setting.useMSearch) { // 涓昏〃鎼滅储鏉′欢 @@ -891,6 +940,11 @@ let result = await Api.genericInterface(param) if (result.status) { + if (position === 'line_grid' && (!result.data || !result.data[0])) { + this.loadData() + return + } + let data = fromJS(this.state.data).toJS() let selectedData = fromJS(this.state.selectedData).toJS() let selectKeys = fromJS(this.state.selectKeys).toJS() @@ -1116,14 +1170,22 @@ }) } - render() { - const { config, precards, nextcards, loading, data, pageIndex, pageSize, total, card, activeKey, BID, BData, selectedData, selectKeys } = this.state + pickupChange = () => { + this.setState({ + pickup: !this.state.pickup + }) + } - if (config.wrap.empty === 'hidden' && (!data || data.length === 0)) return null + render() { + const { config, precards, nextcards, loading, pageIndex, pageSize, total, card, activeKey, BID, BData, selectedData, selectKeys, pickup } = this.state + + let data = this.state.data + + if (config.wrap.empty === 'hidden' && data.length === 0) return null let _total = 0 let switchable = false - if (config.wrap.pagestyle === 'switch' && total > pageSize && data) { + if (config.wrap.pagestyle === 'switch' && total > pageSize) { _total = pageSize * pageIndex switchable = true } @@ -1133,7 +1195,7 @@ if (config.$extend) { extendData = {$$BID: BID, $$BData: BData, $$selectedData: selectedData, $$type: 'extendCard'} - if (data && data[0]) { + if (data[0]) { if (selectedData[0]) { extendData = {...extendData, ...selectedData[0]} } else { @@ -1149,11 +1211,15 @@ } } + if (pickup) { + data = data.filter(item => selectKeys.includes(item.key)) + } + return ( - <div className="custom-data-card-box" id={'anchor' + config.uuid} style={config.style}> + <div className={'custom-data-card-box ' + config.wrap.shifting} id={'anchor' + config.uuid} style={config.style}> {loading ? <div className="loading-mask"> - {data ? <div className="ant-spin-blur"></div> : null} + {data.length ? <div className="ant-spin-blur"></div> : null} <Spin /> </div> : null } @@ -1168,6 +1234,7 @@ selectedData={selectedData} /> : null } + {config.wrap.pickup === 'true' && this.state.data.length > 0 ? <div className="pickup-wrap"><Switch title="鏀惰捣" checkedChildren="寮�" unCheckedChildren="鍏�" checked={pickup} onChange={this.pickupChange} /></div> : null} <div className={`data-zoom ${config.wrap.wrapClass}`}> {switchable ? <div className={'prev-page ' + (pageIndex === 1 ? 'disabled' : '')} onClick={this.prevPage}><div><div><img src={preImg} alt=""/></div></div></div> : null} <Row className={'card-row-list ' + config.wrap.layout}> @@ -1180,24 +1247,24 @@ </CardItem>} </Col> ))} - {data && data.map((item, index) => { + {data.map((item, index) => { let className = 'mk-card ' if (config.wrap.parity === 'true') { if (index % 2 === 1) { - className += 'mk-parity-bg ' + className += 'mk-even-line ' } } if (item.$disabled) { className = 'mk-disabled' - } else if (activeKey === index) { + } else if (activeKey === item.key) { className += 'active' - } else if (selectKeys.indexOf(index) > -1) { + } else if (selectKeys.indexOf(item.key) > -1) { className += 'selected' } return ( <Col className={className} key={index} style={card.wStyle} span={card.setting.width}> - <CardItem card={card} cards={config} data={item} onClick={() => {this.changeCard(index, item)}}> + <CardItem card={card} cards={config} data={item} onClick={() => {this.changeCard(item.key, item)}}> <span className="circle-select"></span> </CardItem> </Col> @@ -1215,9 +1282,9 @@ </Row> {switchable ? <div className={'prev-page ' + (total <= _total ? 'disabled' : '')} onClick={this.nextPage}><div><div><img src={nextImg} alt=""/></div></div></div> : null} </div> - {config.$empty && (!data || data.length === 0) ? <Empty description={false}/> : null} - {config.wrap.pagestyle === 'page' && data ? <Pagination size="small" total={total} showTotal={(t, range) => total > 0 ? `${range[0]}-${range[1]} 鍏� ${total} 鏉 : `鍏� ${total} 鏉} pageSize={pageSize} showSizeChanger={true} pageSizeOptions={this.state.pageOptions} onChange={this.changePageIndex} onShowSizeChange={this.pageSizeChange} current={pageIndex}/> : null} - {config.wrap.pagestyle === 'more' && data && data.length > 0 ? <div className={'mk-more' + (pageSize * pageIndex >= total ? ' disabled' : '')} onClick={this.loadMore}>鏌ョ湅鏇村<DownOutlined/></div> : null} + {config.$empty && data.length === 0 ? <Empty description={false}/> : null} + {config.wrap.pagestyle === 'page' ? <Pagination size="small" total={total} showTotal={(t, range) => total > 0 ? `${range[0]}-${range[1]} 鍏� ${total} 鏉 : `鍏� ${total} 鏉} pageSize={pageSize} showSizeChanger={true} pageSizeOptions={this.state.pageOptions} onChange={this.changePageIndex} onShowSizeChange={this.pageSizeChange} current={pageIndex}/> : null} + {config.wrap.pagestyle === 'more' && data.length > 0 ? <div className={'mk-more' + (pageSize * pageIndex >= total ? ' disabled' : '')} onClick={this.loadMore}>鏌ョ湅鏇村<DownOutlined/></div> : null} </div> ) } -- Gitblit v1.8.0