king
2022-04-26 5046d0d13dc6a8563b8e54e31913bc44cfa1072f
src/tabviews/zshare/normalTable/index.jsx
@@ -3,10 +3,11 @@
import md5 from 'md5'
import { connect } from 'react-redux'
import { is, fromJS } from 'immutable'
import { Table, Affix, Typography, Icon } from 'antd'
import { Table, Affix, Typography } from 'antd'
import asyncComponent from '@/utils/asyncComponent'
import MKEmitter from '@/utils/events.js'
import MkIcon from '@/components/mk-icon'
import '@/assets/css/table.scss'
import './index.scss'
@@ -19,11 +20,12 @@
class BodyRow extends React.Component {
  shouldComponentUpdate (nextProps) {
    return this.props.className !== nextProps.className
    return !is(fromJS(this.props.record), fromJS(nextProps.record)) || this.props.className !== nextProps.className
  }
  render() {
    return <tr {...this.props}/>
    const { record, ...resProps } = this.props
    return <tr {...resProps}/>
  }
}
@@ -44,7 +46,6 @@
    total: PropTypes.any,            // 总数
    loading: PropTypes.bool,         // 表格加载中
    refreshdata: PropTypes.func,     // 表格中排序列、页码的变化时刷新
    handleTableId: PropTypes.func,   // 数据切换
    chgSelectData: PropTypes.func,   // 数据切换
  }
@@ -55,7 +56,8 @@
    columns: null,        // 显示列
    lineMarks: null,      // 行标记
    activeIndex: null,    // 标记当前选中行
    rowspans: null        // 行合并字段信息
    rowspans: null,       // 行合并字段信息
    pageOptions: []
  }
  UNSAFE_componentWillMount () {
@@ -113,8 +115,17 @@
        }
      }
  
      columns.forEach((item, index) => {
        if (item.hidden === true || item.Hide === 'true') return
      columns.forEach(item => {
        if (item.hidden === true || item.Hide === 'true') {
          if (item.marks) { // 提取行标记
            item.marks.forEach(mark => {
              if (mark.signType !== 'line') return
              lineMarks.push(mark)
            })
          }
          return
        }
        let cell = null
  
        if (item.type === 'colspan') {
@@ -214,15 +225,28 @@
          }
        }
        
        _columns.push(cell)
        if (item.type === 'action' && item.position === 'left') {
          _columns.unshift(cell)
        } else {
          _columns.push(cell)
        }
      })
  
      if (rowspans.length === 0) {
        rowspans = null
      }
    }
    let size = (setting.pageSize || 10) + ''
    let pageOptions = ['10', '25', '50', '100', '500', '1000']
    if (!pageOptions.includes(size)) {
      pageOptions.push(size)
      pageOptions = pageOptions.sort((a, b) => a - b)
    }
    this.setState({
      pageOptions,
      columns: _columns,
      pageSize: pageSize ? pageSize : 10,
      lineMarks,
@@ -236,6 +260,9 @@
  componentDidMount () {
    MKEmitter.addListener('resetTable', this.resetTable)
    MKEmitter.addListener('autoQueryData', this.autoQueryData)
    MKEmitter.addListener('autoSelectData', this.autoSelectData)
    MKEmitter.addListener('mkTableCheckTopLine', this.mkTableCheckTopLine)
  }
  /**
@@ -246,6 +273,64 @@
      return
    }
    MKEmitter.removeListener('resetTable', this.resetTable)
    MKEmitter.removeListener('autoQueryData', this.autoQueryData)
    MKEmitter.removeListener('autoSelectData', this.autoSelectData)
    MKEmitter.removeListener('mkTableCheckTopLine', this.mkTableCheckTopLine)
  }
  mkTableCheckTopLine = (menuid, id) => {
    const {MenuID, data} = this.props
    if (menuid !== MenuID || data.length === 0) return
    let index = 0
    if (id) {
      index = data.findIndex(item => item.$$uuid === id)
      if (index === -1) {
        index = 0
      }
    }
    this.changeRow(data[index], index)
  }
  autoSelectData = (id, index) => {
    if (id !== this.props.MenuID) return
    const { pageSize, pageIndex } = this.state
    let i = index - (pageIndex - 1) * pageSize - 1
    if (this.props.data[i]) {
      this.changeRow(this.props.data[i], i)
      MKEmitter.emit('autoTransSelectData', this.props.MenuID, this.props.data[i])
    } else {
      MKEmitter.emit('autoMaticOver', this.props.MenuID)
    }
  }
  autoQueryData = (id, index) => {
    if (id !== this.props.MenuID) return
    const { total } = this.props
    const { pageSize } = this.state
    if (index !== 1 && (!total || index > total)) {
      MKEmitter.emit('autoMaticOver', this.props.MenuID)
      return
    }
    console.clear()
    let pageIndex = Math.ceil(index / pageSize)
    this.setState({
      pageIndex: pageIndex,
      selectedRowKeys: [],
      activeIndex: null
    })
    this.props.refreshdata({pageIndex})
  }
  // 字段透视
@@ -271,7 +356,7 @@
      if (['linkage_navigation', 'linkage', 'menu_board'].includes(window.GLOB.navBar)) {
        MKEmitter.emit('modifyTabs', tabmenu, 'replace')
      } else {
        MKEmitter.emit('modifyTabs', tabmenu, 'plus')
        MKEmitter.emit('modifyTabs', tabmenu, 'plus', true)
      }
    } else if (item.linkurl) {
      let src = item.linkurl
@@ -365,7 +450,7 @@
        if (mark.position === 'front') {
          position = 'front'
        }
        icon = <Icon className={'font ' + className} type={mark.icon} />
        icon = <MkIcon className={'font ' + className} type={mark.icon} />
        className = ''
      }
@@ -417,7 +502,7 @@
        content = md5(content)
      }
      if (item.linkThdMenu || item.linkurl) {
      if (!record.$disabled && (item.linkThdMenu || item.linkurl)) {
        if (item.rowspan === 'true') {
          return {
            children: (
@@ -516,7 +601,7 @@
        content = md5(content)
      }
      if (item.linkThdMenu || item.linkurl) {
      if (!record.$disabled && (item.linkThdMenu || item.linkurl)) {
        if (item.rowspan === 'true') {
          return {
            children: (
@@ -636,6 +721,10 @@
        _href += '?' + _param
      }
      if (_href && /^https/.test(window.location.protocol)) { // https转换
        _href = _href.replace(/^http:/ig, 'https:')
      }
      if (item.blur) {
        content = md5(content)
      }
@@ -657,6 +746,8 @@
                  key={btn.uuid}
                  btn={btn}
                  BID={record.$$BID}
                  disabled={record.$disabled}
                  lineId={record.$$key || ''}
                  selectedData={[record]}
                  BData={this.props.BData}
                  setting={this.props.setting}
@@ -670,6 +761,8 @@
                  key={btn.uuid}
                  btn={btn}
                  BID={record.$$BID}
                  disabled={record.$disabled}
                  lineId={record.$$key || ''}
                  selectedData={[record]}
                  BData={this.props.BData}
                  setting={this.props.setting}
@@ -680,7 +773,10 @@
                <TabButton
                  key={btn.uuid}
                  btn={btn}
                  disabled={record.$disabled}
                  lineId={record.$$key || ''}
                  selectedData={[record]}
                  BData={this.props.BData}
                  MenuID={this.props.MenuID}
                  setting={this.props.setting}
                />
@@ -690,7 +786,10 @@
                <NewPageButton
                  key={btn.uuid}
                  btn={btn}
                  disabled={record.$disabled}
                  lineId={record.$$key || ''}
                  selectedData={[record]}
                  BData={this.props.BData}
                  setting={this.props.setting}
                />
              )
@@ -819,6 +918,10 @@
            }
            _href += '?' + _param
          }
          if (_href && /^https/.test(window.location.protocol)) { // https转换
            _href = _href.replace(/^http:/ig, 'https:')
          }
          if (item.blur) {
@@ -955,7 +1058,7 @@
    this.setState({ selectedRowKeys, activeIndex: _activeIndex })
    let selects = this.props.data.filter((item, _index) => selectedRowKeys.includes(_index))
    let selects = this.props.data.filter((item, _index) => selectedRowKeys.includes(_index) && !item.$disabled)
    this.props.chgSelectData(selects)
  }
@@ -965,6 +1068,7 @@
   */
  changeRow = (record, index) => {
    if (!this.props.setting.tableType || this.props.pickup) return
    if (record.$disabled) return
    
    let newkeys = fromJS(this.state.selectedRowKeys).toJS()
@@ -1005,7 +1109,9 @@
  }
  changedata = (index) => {
    const { data, setting } = this.props
    const { data, setting, tableId, ContainerId } = this.props
    if (!tableId || !ContainerId) return
    let _id = ''
    let _data = ''
@@ -1015,13 +1121,13 @@
      _data = data[index] || ''
    }
    this.props.handleTableId(this.props.tableId, _id, _data)
    MKEmitter.emit('changeTableLine', ContainerId, tableId, _id, _data)
  }
  resetTable = (id, repage) => {
    const { MenuID, tableId } = this.props
    const { tableId } = this.props
    if (id !== (MenuID + tableId)) return
    if (id !== tableId) return
    if (repage === 'false') {
      this.setState({
@@ -1095,13 +1201,14 @@
    const { setting } = this.props
    if (!setting.doubleClick) return
    if (record.$disabled) return
    MKEmitter.emit('triggerBtnId', setting.doubleClick, [record])
  }
  render() {
    const { setting, pickup, statFValue } = this.props
    const { selectedRowKeys, lineMarks, activeIndex } = this.state
    const { selectedRowKeys, lineMarks, activeIndex, pageOptions } = this.state
    let components = {
      body: {}
@@ -1150,7 +1257,7 @@
      _pagination = {
        current: this.state.pageIndex,
        pageSize: this.state.pageSize,
        pageSizeOptions: ['10', '25', '50', '100', '500', '1000'],
        pageSizeOptions: pageOptions,
        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']}`
@@ -1170,6 +1277,11 @@
    }
    if (setting.fontSize) {
      style.fontSize = setting.fontSize
    }
    let loading = this.props.loading
    if (setting.mask === 'hidden') {
      loading = false
    }
    return (
@@ -1200,7 +1312,9 @@
          dataSource={_data}
          rowClassName={(record) => {
            let className = ''
            if ((setting.tableType === 'checkbox' || setting.tableType === 'radio') && record.key === activeIndex) {
            if (record.$disabled) {
              className = 'mk-disabled '
            } else if ((setting.tableType === 'checkbox' || setting.tableType === 'radio') && record.key === activeIndex) {
              className = 'mk-row-active '
            }
@@ -1251,12 +1365,20 @@
            return className
          }}
          loading={this.props.loading}
          loading={loading}
          scroll={{ x: '100%', y: height }}
          onRow={(record, index) => {
            return {
              onClick: () => {this.changeRow(record, index)},
              onDoubleClick: () => {this.doubleClickLine(record)}
            if (setting.tableMode === 'fast') {
              return {
                record,
                onClick: () => {this.changeRow(record, index)},
                onDoubleClick: () => {this.doubleClickLine(record)}
              }
            } else {
              return {
                onClick: () => {this.changeRow(record, index)},
                onDoubleClick: () => {this.doubleClickLine(record)}
              }
            }
          }}
          onChange={this.changeTable}