2020-12-10

king

2020-12-10 84804b405cb88f659d055b16eb3bd00b813ccb4a

 src/tabviews/custom/components/share/normalTable/index.jsx

@@ -3,14 +3,18 @@
import md5 from 'md5'
import { connect } from 'react-redux'
import { is, fromJS } from 'immutable'
import { Table, Typography, Icon, Col } from 'antd'
import { Table, Typography, Icon, Col, Switch } from 'antd'

import { modifyTabview } from '@/store/action'
import asyncComponent from '@/utils/asyncComponent'
import MKEmitter from '@/utils/events.js'
import zhCN from '@/locales/zh-CN/main.js'
import enUS from '@/locales/en-US/main.js'
import '@/assets/css/table.scss'
import './index.scss'

const { Paragraph } = Typography
const CardCellComponent = asyncComponent(() => import('@/tabviews/custom/components/card/cardcellList'))

class BodyRow extends React.Component {
  shouldComponentUpdate (nextProps, nextState) {
@@ -166,7 +170,7 @@
  }

  render() {
    let { col, record, className, style, triggerLink, ...resProps } = this.props
    let { col, config, record, className, style, triggerLink, updateStatus, ...resProps } = this.props

    if (!col) return (<td {...resProps} className={className} style={style}/>)
    
@@ -340,6 +344,10 @@
          {content && _href ? <a href={_href} target="_blank" rel="noopener noreferrer">{content}</a> : null }
        </div>
      )
    } else if (col.type === 'custom' || col.type === 'action') {
      resProps.children = (
        <CardCellComponent data={record} cards={config} elements={col.elements} updateStatus={this.props.updateStatus}/>
      )
    }

    if (resProps.rowSpan === 0) return null
@@ -349,42 +357,35 @@

class NormalTable extends Component {
  static propTpyes = {
    tableId: PropTypes.string,       // 列表Id
    statFValue: PropTypes.any,       // 合计字段数据
    pageSize: PropTypes.any,         // 每页数据
    MenuName: PropTypes.any,         // 菜单名称
    dict: PropTypes.object,          // 字典项
    MenuID: PropTypes.string,        // 菜单Id
    setting: PropTypes.object,       // 表格全局设置：tableType（表格是否可选、单选、多选）、columnfixed（列固定）、actionfixed（按钮固定）
    pickup: PropTypes.any,           // 数据收起
    columns: PropTypes.array,        // 表格列
    lineMarks: PropTypes.array,      // 行标记
    fields: PropTypes.array,         // 组件字段集
    BID: PropTypes.any,              // 主表Id
    ContainerId: PropTypes.any,      // 标签页外层Id
    BData: PropTypes.any,            // 主表数据
    data: PropTypes.any,             // 表格数据
    total: PropTypes.any,            // 总数
    loading: PropTypes.bool,         // 表格加载中
    refreshdata: PropTypes.func,     // 表格中排序列、页码的变化时刷新
    handleTableId: PropTypes.func,   // 数据切换
    chgSelectData: PropTypes.func,   // 数据切换
    refreshbyaction: PropTypes.func, // 按钮执行完成后刷新
  }

  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    selectedRowKeys: [],  // 表格中选中行
    pageIndex: 1,         // 初始页面索引
    pageSize: 10,         // 每页数据条数
    columns: null,        // 显示列
    imgShow: false,       // 图片放大模态框
    imgSrc: '',           // 图片路径
    activeIndex: null,    // 标记当前选中行
    rowspans: null        // 行合并字段信息
    rowspans: null,       // 行合并字段信息
    pickup: false
  }

  UNSAFE_componentWillMount () {
    const { menuType, memberLevel, pageSize } = this.props
    const { menuType, memberLevel, setting, fields } = this.props
    let columns = fromJS(this.props.columns).toJS()
    let _columns = []
    let radio = 5          // 虚化比例
@@ -428,8 +429,10 @@
            width: col.Width || 120,
            onCell: record => ({
              record,
              col: item,
              triggerLink: this.triggerLink
              col,
              config: col.type === 'custom' ? {setting, columns: fields} : null,
              triggerLink: this.triggerLink,
              updateStatus: this.updateStatus
            })
          })
        })
@@ -454,7 +457,9 @@
          onCell: record => ({
            record,
            col: item,
            triggerLink: this.triggerLink
            config: item.type === 'custom' || item.type === 'action' ? {setting, columns: fields} : null,
            triggerLink: this.triggerLink,
            updateStatus: this.updateStatus
          })
        }
      }
@@ -468,7 +473,6 @@

    this.setState({
      columns: _columns,
      pageSize: pageSize ? pageSize : 10,
      rowspans
    })
  }
@@ -499,7 +503,7 @@

  // 字段透视
  triggerLink = (item, record) => {
    const { tabviews, MenuID, setting } = this.props
    const { tabviews, MenuID } = this.props

    if (item.linkThdMenu) {
      let tabmenu = item.linkThdMenu
@@ -507,7 +511,7 @@
      tabmenu.param = {
        searchkey: item.field,
        searchval: record[item.field] || '',
        BID: record[setting.primaryKey]
        BID: record.$$uuid
      }
  
      tabmenu.selected = true
@@ -543,7 +547,7 @@
          let dataparam = {
            searchkey: item.field,
            searchval: record[item.field] || '',
            BID: record[setting.primaryKey]
            BID: record.$$uuid
          }
          _param.UserID = sessionStorage.getItem('UserID')
          _param.LoginUID = sessionStorage.getItem('LoginUID')
@@ -588,9 +592,9 @@
   * @description 点击整行，触发切换， 判断是否可选，单选或多选，进行对应操作
   */
  changeRow = (record, index) => {
    const { setting, pickup } = this.props
    const { setting } = this.props

    if (!setting.tableType || pickup) return
    if (!setting.tableType || this.state.pickup) return
    
    let newkeys = fromJS(this.state.selectedRowKeys).toJS()

@@ -625,13 +629,14 @@
      pageIndex: pagination.current,
      pageSize: pagination.pageSize,
      selectedRowKeys: [],
      activeIndex: null
      activeIndex: null,
      pickup: false
    })
    this.props.refreshdata(pagination, filters, sorter)
  }

  changedata = (index) => {
    const { data, setting } = this.props
    const { MenuID, data, setting } = this.props

    let _id = ''
    let _data = ''
@@ -641,24 +646,26 @@
      _data = data[index] || ''
    }

    this.props.handleTableId(this.props.tableId, _id, _data)
    MKEmitter.emit('resetSelectLine', MenuID, _id, _data)
  }

  resetTable = (id, repage) => {
    const { MenuID, tableId } = this.props
    const { MenuID } = this.props

    if (id !== (MenuID + tableId)) return
    if (id !== MenuID) return

    if (repage === 'false') {
      this.setState({
        selectedRowKeys: [],
        activeIndex: null
        activeIndex: null,
        pickup: false
      })
    } else {
      this.setState({
        pageIndex: 1,
        selectedRowKeys: [],
        activeIndex: null
        activeIndex: null,
        pickup: false
      })
    }
  }
@@ -717,9 +724,15 @@
    return data
  }

  pickupChange = () => {
    this.setState({
      pickup: !this.state.pickup
    })
  }

  render() {
    const { setting, pickup, statFValue, lineMarks } = this.props
    const { selectedRowKeys, activeIndex } = this.state
    const { setting, statFValue, lineMarks, data } = this.props
    const { selectedRowKeys, activeIndex, pickup } = this.state

    // 设置表格选择属性：单选、多选、不可选
    let rowSelection = null
@@ -739,7 +752,7 @@
    }

    // 数据收起时，过滤已选数据
    let _data = this.props.data ? this.props.data : []
    let _data = data || []

    if (pickup) {
      _data = _data.filter((item, index) => selectedRowKeys.includes(index))
@@ -755,7 +768,7 @@
        pageSizeOptions: ['10', '25', '50', '100', '500', '1000'],
        showSizeChanger: true,
        total: this.props.total || 0,
        showTotal: (total, range) => `${range[0]}-${range[1]} ${this.props.dict['main.pagination.of']} ${total} ${this.props.dict['main.pagination.items']}`
        showTotal: (total, range) => `${range[0]}-${range[1]} ${this.state.dict['main.pagination.of']} ${total} ${this.state.dict['main.pagination.items']}`
      }
    }

@@ -767,6 +780,9 @@

    return (
      <div className="normal-custom-table">
        {(setting.tableType === 'radio' || setting.tableType === 'checkbox') && data && data.length > 0 ?
          <Switch title="收起" className="main-pickup" checkedChildren="开" unCheckedChildren="关" defaultChecked={pickup} onChange={this.pickupChange} /> : null
        }
        <Table
          size="middle"
          components={components}