2020-10-13

king

2020-10-13 8f6b3d26bde4e22773cc53386dfbae669a7472ed

 src/tabviews/custom/components/card/data-card/index.jsx

@@ -9,6 +9,8 @@
import UtilsDM from '@/utils/utils-datamanage.js'
import zhCN from '@/locales/zh-CN/main.js'
import enUS from '@/locales/en-US/main.js'
import preImg from '@/assets/img/prev.png'
import nextImg from '@/assets/img/next.png'
import './index.scss'

const CardItem = asyncComponent(() => import('../cardItem'))
@@ -26,9 +28,11 @@
  state = {
    dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, // 字典
    config: null,              // 图表配置信息
    pageIndex: 1,
    empty: false,
    loading: false,            // 数据加载状态
    data: null                 // 数据
    data: null,                // 数据
    total: null
  }

  UNSAFE_componentWillMount () {
@@ -63,7 +67,7 @@

  async loadData () {
    const { mainSearch, BID, menuType, dataManager } = this.props
    const { config, arr_field } = this.state
    const { config, arr_field, pageIndex } = this.state
    
    let searches = []
    if (mainSearch && mainSearch.length > 0) { // 主表搜索条件
@@ -75,12 +79,13 @@
    })

    let _orderBy = config.setting.order || ''
    let param = UtilsDM.getQueryDataParams(config.setting, arr_field, searches, _orderBy, 1, config.setting.pageSize, BID, menuType, dataManager)
    let param = UtilsDM.getQueryDataParams(config.setting, arr_field, searches, _orderBy, pageIndex, config.setting.pageSize, BID, menuType, dataManager)

    let result = await Api.genericInterface(param)
    if (result.status) {
      this.setState({
        data: result.data,
        total: result.total,
        loading: false
      })
    } else {
@@ -95,8 +100,38 @@
    }
  }

  prevPage = () => {
    const { pageIndex } = this.state

    if (pageIndex === 1) return

    this.setState({
      pageIndex: pageIndex - 1
    }, () => {
      this.loadData()
    })
  }
  nextPage = () => {
    const { config, pageIndex, total } = this.state
    let _total = config.setting.pageSize * pageIndex

    if (_total >= total) return

    this.setState({
      pageIndex: pageIndex + 1
    }, () => {
      this.loadData()
    })
  }

  render() {
    const { config, empty, loading, data } = this.state
    const { config, empty, loading, data, pageIndex, total } = this.state

    let _total = config.setting.pageSize * pageIndex
    let pageable = config.pageable && config.setting.laypage
    if ((pageIndex === 1 && total <= _total) || !data) {
      pageable = false
    }

    return (
      <div className="custom-card-box" style={config.style}>
@@ -106,9 +141,13 @@
            <Spin />
          </div> : null
        }
        {data && data.length > 0 ? data.map((item, index) => (
          <CardItem key={index} card={config.subcards[0]} cards={config} data={item} />
        )) : null}
        {pageable ? <div className={'prev-page ' + (pageIndex === 1 ? 'disabled' : '')} onClick={this.prevPage}><div><div><img src={preImg} alt=""/></div></div></div> : null}
        {data && data.length > 0 ? <div className="card-row-list">
          {data.map((item, index) => (
            <CardItem key={index} card={config.subcards[0]} cards={config} data={item} />
          ))}
        </div> : null}
        {pageable ? <div className={'prev-page ' + (total <= _total ? 'disabled' : '')} onClick={this.nextPage}><div><div><img src={nextImg} alt=""/></div></div></div> : null}
        {empty ? <Empty description={false}/> : null}
      </div>
    )