| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Spin, notification, Row, Col, Empty, Pagination, Modal } from 'antd' |
| | | import { Spin, Row, Col, Empty, Pagination } from 'antd' |
| | | import { DownOutlined } from '@ant-design/icons' |
| | | |
| | | import Api from '@/api' |
| | |
| | | import './index.scss' |
| | | |
| | | const CardCellComponent = asyncComponent(() => import('../cardcellList')) |
| | | const MainAction = asyncComponent(() => import('@/tabviews/zshare/actionList')) |
| | | const NormalHeader = asyncComponent(() => import('@/tabviews/custom/components/share/normalheader')) |
| | | |
| | | class TableCard extends Component { |
| | |
| | | } |
| | | |
| | | state = { |
| | | BID: '', // 上级ID |
| | | config: null, // 图表配置信息 |
| | | loading: false, // 数据加载状态 |
| | | search: null, // 搜索条件 |
| | | pageIndex: 1, // 页码 |
| | | total: 0, // 总数 |
| | | data: null, // 数据 |
| | | BID: '', |
| | | config: null, |
| | | loading: false, |
| | | search: null, |
| | | pageIndex: 1, |
| | | total: 0, |
| | | data: null, |
| | | precards: [], |
| | | BData: '' |
| | | } |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | let precards = [] |
| | | _config.subcards = _config.subcards.filter(item => { |
| | | if (item.setting.condition === 'title') { |
| | | precards.push(item) |
| | | return false |
| | | } |
| | | return true |
| | | }) |
| | | |
| | | this.setState({ |
| | | BID: BID || '', |
| | | BData: BData || '', |
| | | data: _data, |
| | | config: _config, |
| | | search: _config.$searches |
| | | search: _config.$searches, |
| | | precards |
| | | }) |
| | | } |
| | | |
| | |
| | | this.timer && this.timer.stop() |
| | | } |
| | | } |
| | | 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 |
| | | }) |
| | | } |
| | | } |
| | | |
| | | UtilsDM.querySuccess(result) |
| | | } else { |
| | | this.setState({ |
| | | loading: false |
| | | }) |
| | | this.timer && this.timer.stop() |
| | | |
| | | if (!result.message) return |
| | | if (result.ErrCode === 'N') { |
| | | Modal.error({ |
| | | title: result.message, |
| | | }) |
| | | } else if (result.ErrCode !== '-2') { |
| | | notification.error({ |
| | | top: 92, |
| | | message: result.message, |
| | | duration: 10 |
| | | }) |
| | | } |
| | | UtilsDM.queryFail(result) |
| | | } |
| | | } |
| | | |
| | |
| | | } |
| | | } |
| | | |
| | | getLines = (data) => { |
| | | getLines = (data, lindex) => { |
| | | const { config } = this.state |
| | | |
| | | let line = [] |
| | | |
| | | config.subcards.forEach((item, index) => { |
| | | let display = item.setting.condition !== 'true' |
| | | let className = '' |
| | | |
| | | if (!display && item.setting.controlField) { |
| | | let val = data[item.setting.controlField] |
| | |
| | | } else if (item.setting.controlType === '<' && val < item.setting.controlValue) { |
| | | display = true |
| | | } |
| | | |
| | | className = 'mk_line_' + val |
| | | } |
| | | |
| | | if (!display) return |
| | | |
| | | if (config.wrap.parity === 'true') { |
| | | if (lindex % 2 === 1) { |
| | | className += ' mk-even-line' |
| | | } |
| | | } |
| | | |
| | | line.push( |
| | | <Col key={index} span={24}> |
| | | <Col key={index} className={className} span={24}> |
| | | <div className="card-item-box" style={item.style} onClick={() => {this.openView(item, data)}}> |
| | | <CardCellComponent data={data} cards={config} cardCell={item} elements={item.elements}/> |
| | | </div> |
| | |
| | | } |
| | | |
| | | render() { |
| | | const { config, loading, data, BID, pageIndex, total } = this.state |
| | | const { config, loading, data, BID, pageIndex, total, BData, precards } = this.state |
| | | |
| | | if (config.wrap.empty === 'hidden' && (!data || data.length === 0)) return null |
| | | |
| | |
| | | </div> : null |
| | | } |
| | | <NormalHeader config={config} BID={BID} refresh={this.refreshSearch} /> |
| | | {data && data.length > 0 ? <Row className={'card-row-list' + (config.wrap.parity === 'true' ? ' mk-parity' : '')} style={{height: config.wrap.contentHeight}}> |
| | | {data.map(item => this.getLines(item))} |
| | | </Row> : null} |
| | | {data && data.length === 0 ? <div className="card-row-list" style={{height: config.wrap.contentHeight}}> |
| | | <Empty description={false}/> |
| | | </div> : null} |
| | | {config.action && config.action.length > 0 ? |
| | | <MainAction |
| | | BID={BID} |
| | | BData={BData} |
| | | setting={config.setting} |
| | | actions={config.action} |
| | | columns={config.columns} |
| | | selectedData={[]} |
| | | /> : null |
| | | } |
| | | <Row className={`card-row-list ${config.wrap.hover === 'true' ? 'mk-hover' : ''}`} style={{height: config.wrap.contentHeight}}> |
| | | {precards.map((item, index) => ( |
| | | <Col key={index} className="extend-card" span={24}> |
| | | <div className="card-item-box" style={item.style}> |
| | | <CardCellComponent data={data && data[0] ? data[0] : {}} cards={config} cardCell={item} elements={item.elements}/> |
| | | </div> |
| | | </Col> |
| | | ))} |
| | | {data && data.length > 0 ? data.map((item, index) => this.getLines(item, index)) : null} |
| | | {data && data.length === 0 ? <Empty description={false}/> : null} |
| | | </Row> |
| | | {config.wrap.pagestyle === 'page' ? <Pagination size="small" current={pageIndex} total={total} onChange={this.changePageIndex} /> : null} |
| | | {config.wrap.pagestyle === 'more' && data && data.length > 0 ? <div className={'mk-more' + (config.setting.pageSize * pageIndex >= total ? ' disabled' : '')} onClick={this.loadMore}>查看更多<DownOutlined/></div> : null} |
| | | </div> |