king
2021-05-08 6afdec0062dacbded57e166230eb22cc55ced0c1
src/tabviews/custom/components/share/normalTable/index.jsx
@@ -15,7 +15,11 @@
const { Paragraph } = Typography
const CardCellComponent = asyncComponent(() => import('@/tabviews/custom/components/card/cardcellList'))
const PicRadio = {
  '4:3': '75%', '3:2': '66.67%', '16:9': '56.25%', '2:1': '50%', '3:1': '33.33%', '4:1': '25%',
  '5:1': '20%', '6:1': '16.67%', '7:1': '14.29%', '8:1': '12.5%', '9:1': '11.11%',
  '10:1': '10%', '3:4': '133.33%', '2:3': '150%', '9:16': '177.78%'
}
class BodyRow extends React.Component {
  shouldComponentUpdate (nextProps, nextState) {
    return !is(fromJS(this.props.data), fromJS(nextProps.data)) || !is(fromJS(this.props.className), fromJS(nextProps.className))
@@ -170,7 +174,7 @@
  }
  render() {
    let { col, config, record, className, style, triggerLink, updateStatus, ...resProps } = this.props
    let { col, config, record, className, style, triggerLink, ...resProps } = this.props
    if (!col) return (<td {...resProps} className={className} style={style}/>)
    
@@ -187,7 +191,7 @@
          content = `${content.substr(0, 4)}-${content.substr(5, 2)}-${content.substr(8, 2)} ${content.substr(11, 2)}:${content.substr(14, 2)}:${content.substr(17, 2)}`
        }
  
        content = col.prefix + content + col.postfix
        content = (col.prefix || '') + content + (col.postfix || '')
      }
      if (col.marks) {
@@ -201,11 +205,11 @@
      if (col.rowspan === 'true') {
        resProps.rowSpan = record['$$' + col.field]
      }
      if (col.linkThdMenu || col.linkurl) {
        content = (
          <div>
            <div className="link-menu" onDoubleClick={(e) => this.triggerLink(e, col, record)}></div>
            <div className="link-menu" onDoubleClick={(e) => triggerLink(e, col, record)}></div>
            {content}
          </div>
        )
@@ -248,10 +252,14 @@
        content = md5(content)
      }
      if (col.rowspan === 'true') {
        resProps.rowSpan = record['$$' + col.field]
      }
      if (col.linkThdMenu || col.linkurl) {
        content = (
          <div>
            <div className="link-menu" onDoubleClick={(e) => this.triggerLink(e, col, record)}></div>
            <div className="link-menu" onDoubleClick={(e) => triggerLink(e, col, record)}></div>
            {content}
          </div>
        )
@@ -268,12 +276,8 @@
      let cols = 24 / (col.picSort || 1)
      let paddingTop = '100%'
      if (col.lenWidRadio === '16:9') {
        paddingTop = '56.25%'
      } else if (col.lenWidRadio === '3:2') {
        paddingTop = '66.67%'
      } else if (col.lenWidRadio === '4:3') {
        paddingTop = '75%'
      if (PicRadio[col.lenWidRadio]) {
        paddingTop = PicRadio[col.lenWidRadio]
      }
      resProps.children = (
@@ -347,12 +351,12 @@
    } else if (col.type === 'custom') {
      style.padding = '0px'
      resProps.children = (
        <CardCellComponent data={record} cards={config} elements={col.elements} updateStatus={this.props.updateStatus}/>
        <CardCellComponent data={record} cards={config} elements={col.elements}/>
      )
    } else if (col.type === 'action') {
      style.padding = '0px 5px'
      resProps.children = (
        <CardCellComponent data={record} cards={config} elements={col.elements} updateStatus={this.props.updateStatus}/>
        <CardCellComponent data={record} cards={config} elements={col.elements}/>
      )
    }
@@ -376,18 +380,19 @@
    loading: PropTypes.bool,         // 表格加载中
    refreshdata: PropTypes.func,     // 表格中排序列、页码的变化时刷新
    chgSelectData: PropTypes.func,   // 数据切换
    refreshbyaction: PropTypes.func, // 按钮执行完成后刷新
  }
  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    tableId: '',          // 表格ID
    selectedRowKeys: [],  // 表格中选中行
    pageIndex: 1,         // 初始页面索引
    pageSize: 10,         // 每页数据条数
    columns: null,        // 显示列
    activeIndex: null,    // 标记当前选中行
    rowspans: null,       // 行合并字段信息
    pickup: false
    pickup: false,        // 收起未选择项
    orderfields: {}       // 排序id与field转换
  }
  UNSAFE_componentWillMount () {
@@ -395,6 +400,7 @@
    let radio = 5          // 虚化比例
    let _format = false    // 是否虚化处理
    let rowspans = []
    let orderfields = {}
    if (window.GLOB.dataFormat && menuType !== 'HS' && memberLevel) {
      _format = true
@@ -417,14 +423,21 @@
          if (item.rowspan === 'true') {
            rowspans.push(item.field)
          }
          if (_format && !Math.floor(Math.random() * radio)) {
          if (item.type === 'index') {
            item.field = '$Index'
            item.type = 'text'
          } else if (_format && !Math.floor(Math.random() * radio)) {
            item.blur = true
          }
  
          if (item.marks && item.marks.length === 0) {
            item.marks = ''
          }
          if (item.field) {
            orderfields[item.uuid] = item.field
          }
          cell = {
            align: item.Align,
            dataIndex: item.uuid,
@@ -435,8 +448,7 @@
              record,
              col: item,
              config: item.type === 'custom' || item.type === 'action' ? {setting, columns: fields} : null,
              triggerLink: this.triggerLink,
              updateStatus: this.updateStatus
              triggerLink: this.triggerLink
            })
          }
        }
@@ -451,9 +463,27 @@
      rowspans = null
    }
    let tableId = (() => {
      let uuid = []
      let _options = 'abcdefghigklmnopqrstuv'
      for (let i = 0; i < 19; i++) {
        uuid.push(_options.substr(Math.floor(Math.random() * 0x20), 1))
      }
      return uuid.join('')
    }) ()
    if (setting.borderColor) { // 边框颜色
      let style = `#${tableId} table, #${tableId} tr, #${tableId} th, #${tableId} td {border-color: ${setting.borderColor}}`
      let ele = document.createElement('style')
      ele.innerHTML = style
      document.getElementsByTagName('head')[0].appendChild(ele)
    }
    this.setState({
      columns: _columns,
      rowspans
      rowspans,
      tableId,
      orderfields
    })
  }
@@ -475,69 +505,72 @@
    MKEmitter.removeListener('resetTable', this.resetTable)
  }
  updateStatus = (type, positon, btn) => {
    if (type === 'refresh') {
      this.props.refreshbyaction(positon, btn)
    }
  }
  // 字段透视
  triggerLink = (e, item, record) => {
    const { tabviews, MenuID } = this.props
    const { tabviews } = this.props
    e.stopPropagation()
    let __param = {
      $searchkey: item.field,
      $searchval: record[item.field] || '',
      $BID: record.$$uuid
    }
    if (item.linkfields && item.linkfields.length > 0) {
      item.linkfields.forEach(field => {
        __param[field] = record[field] || ''
      })
    }
    if (item.linkThdMenu) {
      let tabmenu = item.linkThdMenu
      tabmenu.param = {
        searchkey: item.field,
        searchval: record[item.field] || '',
        BID: record.$$uuid
      }
      tabmenu.param = __param
      tabmenu.selected = true
  
      let index = 0
      let isexit = false
      let tabs = tabviews.map((tab, i) => {
      let tabs = tabviews.filter((tab, i) => {
        tab.selected = false
        if (tab.MenuID === MenuID) {
          index = i
        } else if (tab.MenuID === tabmenu.MenuID) {
          tab.param = tabmenu.param
          tab.selected = true
          isexit = true
        }
        return tab
        return tab.MenuID !== tabmenu.MenuID
      })
  
      if (!isexit) {
        tabs.splice(index + 1, 0, tabmenu)
      if (tabviews.length > tabs.length) {
        this.props.modifyTabview(fromJS(tabs).toJS())
      }
  
      this.props.modifyTabview(tabs)
    } else {
      this.setState({}, () => {
        tabs.push(tabmenu)
        this.props.modifyTabview(tabs)
      })
    } else if (item.linkurl) {
      let src = item.linkurl
      if (item.linkurl.indexOf('paramsmain/') > -1) {
      if (src.indexOf('paramsmain/') > -1) {
        try {
          let _url = item.linkurl.split('paramsmain/')[0] + 'paramsmain/'
          let _param = JSON.parse(window.decodeURIComponent(window.atob(item.linkurl.split('paramsmain/')[1])))
          let dataparam = {
            searchkey: item.field,
            searchval: record[item.field] || '',
            BID: record.$$uuid
          }
          _param.UserID = sessionStorage.getItem('UserID')
          _param.LoginUID = sessionStorage.getItem('LoginUID')
          _param.User_Name = sessionStorage.getItem('User_Name')
          _param.param = dataparam
          _param.param = __param
          src = _url + window.btoa(window.encodeURIComponent(JSON.stringify(_param)))
        } catch {
          console.warn('菜单参数解析错误!')
        }
      } else {
        let con = '?'
        if (/\?/ig.test(src)) {
          con = '&'
        }
        if (item.linkfields && item.linkfields.length > 0) {
          item.linkfields.forEach(field => {
            if (field.toLowerCase() === 'id') return
            con += `${field}=${record[field] || ''}&`
          })
        }
        src = src + `${con}id=${record.$$uuid}&appkey=${window.GLOB.appkey}&userid=${sessionStorage.getItem('UserID')}&LoginUID=${sessionStorage.getItem('LoginUID') || ''}`
      }
      window.open(src)
@@ -556,7 +589,7 @@
      index = selectedRowKeys.slice(-1)[0]
    }
    if (setting.tableType === 'checkbox') {
    if (setting.tableType === 'checkbox' || setting.tableType === 'radio') {
      _activeIndex = index === '' ? null : index
    }
@@ -582,7 +615,7 @@
    if (setting.tableType === 'radio') {
      newkeys = [index]
      this.changedata(index)
      this.setState({ selectedRowKeys: newkeys })
      this.setState({ selectedRowKeys: newkeys, activeIndex: index })
    } else {
      let _index = ''
      if (newkeys.includes(index)) {
@@ -606,6 +639,8 @@
  }
  changeTable = (pagination, filters, sorter) => {
    const { orderfields } = this.state
    this.setState({
      pageIndex: pagination.current,
      pageSize: pagination.pageSize,
@@ -613,6 +648,9 @@
      activeIndex: null,
      pickup: false
    })
    sorter.field = orderfields[sorter.field] || ''
    this.props.refreshdata(pagination, filters, sorter)
  }
@@ -667,13 +705,13 @@
        let preItem = data[index - 1]
        rowspans.forEach((cell, i) => {
          if (i === 0) {
            if ((item[cell] || item[cell] === 0) && preItem[cell] === item[cell]) {
            if (preItem[cell] === item[cell]) {
              item['$' + cell] = preItem['$' + cell] + 1
            } else {
              item['$' + cell] = 1
            }
          } else {
            if ((item[cell] || item[cell] === 0) && preItem[cell] === item[cell]) {
            if (preItem[cell] === item[cell]) {
              item['$' + cell] = preItem['$' + cell] + 1
            } else {
              item['$' + cell] = 1
@@ -721,7 +759,7 @@
  render() {
    const { setting, statFValue, lineMarks, data } = this.props
    const { selectedRowKeys, activeIndex, pickup } = this.state
    const { selectedRowKeys, activeIndex, pickup, tableId } = this.state
    // 设置表格选择属性:单选、多选、不可选
    let rowSelection = null
@@ -768,13 +806,14 @@
    }
    return (
      <div className="normal-custom-table">
      <div className={`normal-custom-table ${setting.tableHeader || ''} ${setting.mode || ''}`} id={tableId}>
        {(setting.tableType === 'radio' || setting.tableType === 'checkbox') && data && data.length > 0 ?
          <Switch title="收起" className="main-pickup" checkedChildren="开" unCheckedChildren="关" defaultChecked={pickup} onChange={this.pickupChange} /> : null
          <Switch title="收起" className="main-pickup" checkedChildren="开" unCheckedChildren="关" checked={pickup} onChange={this.pickupChange} /> : null
        }
        <Table
          size="middle"
          components={components}
          style={setting.style}
          size={setting.size || 'middle'}
          bordered={setting.bordered !== 'false'}
          rowSelection={rowSelection}
          columns={this.state.columns}