2022-05-29

king

2022-05-29 f38b3321250222b81a797a538d9c3efa9f8a0ecb

 src/tabviews/verupmanage/subtabtable/index.jsx

@@ -10,13 +10,15 @@
import Utils from '@/utils/utils.js'
import options from '@/store/options.js'
import { buttonConfig, tabConfig } from '../config'
import MKEmitter from '@/utils/events.js'

import asyncComponent from '@/utils/asyncComponent'
import asyncSpinComponent from '@/utils/asyncSpinComponent'
import SubAction from '../actionList'
import SubSearch from '../topSearch'

import './index.scss'

const MainSearch = asyncComponent(() => import('@/tabviews/zshare/topSearch'))
const SubTable = asyncSpinComponent(() => import('@/tabviews/zshare/normalTable'))

class VerupSubTabViewTable extends Component {
@@ -27,7 +29,6 @@
    MenuID: PropTypes.string,        // 菜单Id
    SupMenuID: PropTypes.string,     // 上级菜单Id
    ContainerId: PropTypes.any,      // 三级菜单Container(html) ID
    handleTableId: PropTypes.func,   // 控制表格数据切换时，更新在主表中的id
    handleMainTable: PropTypes.func, // 刷新主表
    refreshtabs:PropTypes.any
  }
@@ -38,38 +39,29 @@
    searchlist: null,     // 搜索条件
    actions: null,        // 按钮集
    columns: null,        // 显示列
    logcolumns: null,     // 日志中显示的列信息 (增加至全部列，除去合并列)
    arr_field: '',        // 使用 sPC_Get_TableData 时的查询字段集
    setting: null,        // 页面全局设置：数据源、按钮及显示列固定、主键等
    data: null,           // 列表数据集
    selectedData: [],     // 已选表格数据
    resetTable: false,    // 表格重置，值在true与false之间切换，切换时表格重置
    total: 0,             // 总数
    loading: false,       // 列表数据加载中
    pageIndex: 1,         // 页码
    pageSize: 10,         // 每页数据条数
    pageSize: 100,         // 每页数据条数
    orderBy: '',          // 排序
    search: '',           // 搜索条件数组，使用时需分场景处理
    popAction: false,     // 弹框页面，按钮信息
    popData: false,       // 弹框页面，所选的表格数据
    visible: false,       // 弹框显示隐藏控制
    pickup: false,         // 子表数据隐藏显示切换
    BID: '',
    BData: ''
  }

  /**
   * @description 上级菜单id变化时，刷新数据
   */
  UNSAFE_componentWillReceiveProps(nextProps) {
    if (this.state.config && this.props.Tab.supMenu && !is(fromJS(this.props.BID), fromJS(nextProps.BID))) {
      this.setState({
        pageIndex: 1,
        selectedData: [],
        resetTable: !this.state.resetTable,
      }, () => {
        this.loadmaindata(nextProps.BID, 'refresh')
      })
    } else if (this.state.config && nextProps.refreshtabs && nextProps.refreshtabs.includes(this.props.Tab.uuid)) {

    if (this.state.config && nextProps.refreshtabs && nextProps.refreshtabs.includes(this.props.Tab.uuid)) {
      this.reloadtable()
    }
  }
@@ -78,13 +70,12 @@
   * @description 获取页面配置信息
   */
  async loadconfig () {
    const { Tab, BID } = this.props
    const { Tab, BID, BData } = this.props

    let config = tabConfig[this.props.MenuID]

    let _arrField = []     // 字段集
    let _columns = []      // 显示列
    let _logcolumns = []   // 日志显示列
    let _hideCol = []      // 隐藏及合并列中字段的uuid集
    let colMap = new Map()

@@ -92,13 +83,9 @@
    config.columns.forEach(col => {
      if (col.field) {
        _arrField.push(col.field)

        _logcolumns.push(col)
      }
      if (col.type === 'colspan' && col.sublist) { // 筛选隐藏列
        _hideCol = _hideCol.concat(col.sublist)
      } else if (col.Hide === 'true') {
        _hideCol.push(col.uuid)
      }
      colMap.set(col.uuid, col)
    })
@@ -107,16 +94,21 @@
    config.columns.forEach(col => {
      if (_hideCol.includes(col.uuid)) return

      if (col.type === 'colspan' && col.sublist) {
        let _col = JSON.parse(JSON.stringify(col))
        let subColumn = []
        _col.sublist.forEach(sub => {
      if (col.type === 'colspan') {
        if (col.unfold !== 'true') { // 不展开为旧版合并列
          col.type = 'old_colspan'
        }
        let _col = fromJS(col).toJS()
        let subcols = []
        _col.sublist && _col.sublist.forEach(sub => {
          if (colMap.has(sub)) {
            subColumn.push(colMap.get(sub))
            subcols.push(colMap.get(sub))
          }
        })
        _col.subColumn = subColumn
        _columns.push(_col)
        if (subcols.length > 0) {
          _col.subcols = subcols
          _columns.push(_col)
        }
      } else {
        _columns.push(col)
      }
@@ -127,6 +119,8 @@
    }

    this.setState({
      BID: BID || '',
      BData: BData || '',
      config: config,
      setting: config.setting,
      searchlist: config.search,
@@ -134,10 +128,10 @@
        if (buttonConfig[item.uuid]) {
          item = {...buttonConfig[item.uuid], ...item}
        }
        item.$toolbtn = true
        return item
      }),
      columns: _columns,
      logcolumns: _logcolumns,
      arr_field: _arrField.join(','),
      search: Utils.initMainSearch(config.search) // 搜索条件初始化（含有时间格式，需要转化）
    }, () => {
@@ -153,14 +147,12 @@
  /**
   * @description 子表数据加载
   */
  async loadmaindata (bid, type) {
    const { setting } = this.state
  async loadmaindata (type) {
    const { setting, BID } = this.state
    let param = ''
    let _BID = this.props.BID
    
    if (type === 'refresh') {
      _BID = bid
      if (!bid) { // 主表ID不存在时，不查询子表
      if (!BID) { // 主表ID不存在时，不查询子表
        this.setState({
          data: [],
          total: 0,
@@ -172,18 +164,18 @@
    }

    if (setting.interType === 'system') {
      param = this.getDefaultParam(_BID)
      param = this.getDefaultParam(BID)
    } else {
      param = this.getCustomParam(_BID)
      param = this.getCustomParam(BID)
    }

    this.handleTableId()

    let result = await Api.genericInterface(param)
    if (result.status) {
      this.setState({
        data: result.data.map((item, index) => {
          item.key = index
          item.$$uuid = item[setting.primaryKey] || ''
          item.$$BID = BID || ''
          return item
        }),
        total: result.total,
@@ -248,7 +240,8 @@
      func: 'sPC_Get_TableData',
      obj_name: 'data',
      arr_field: arr_field,
      BID: BID
      BID: BID,
      menuname: this.props.Tab.label || ''
    }

    let _orderBy = orderBy || setting.order
@@ -302,12 +295,12 @@
   * 含有初始不加载的页面，修改设置
   */
  refreshbysearch = (searches) => {
    MKEmitter.emit('resetTable', this.props.Tab.uuid) // 列表重置
    this.setState({
      loading: true,
      pageIndex: 1,
      selectedData: [],
      search: searches,
      resetTable: !this.state.resetTable
      search: searches
    }, () => {
      this.loadmaindata()
    })
@@ -340,11 +333,11 @@
   * @description 表格刷新
   */
  reloadtable = () => {
    MKEmitter.emit('resetTable', this.props.Tab.uuid) // 列表重置
    this.setState({
      loading: true,
      pageIndex: 1,
      selectedData: [],
      resetTable: !this.state.resetTable
      selectedData: []
    }, () => {
      this.loadmaindata()
    })
@@ -358,29 +351,6 @@
  }

  /**
   * @description 页面刷新，重新获取配置
   */
  reloadview = () => {
    this.setState({
      config: null,
      searchlist: null,
      actions: null,
      columns: null,
      arr_field: '',
      setting: null,
      data: null,
      total: 0,
      loading: false,
      pageIndex: 1,
      pageSize: 10,
      orderBy: '',
      search: ''
    }, () => {
      this.loadconfig()
    })
  }

  /**
   * @description 按钮操作完成后（成功或失败），页面刷新，重置页码及选择项
   */
  refreshbyaction = (btn, type) => {
@@ -388,24 +358,7 @@
      this.reloadtable()
    } else if (btn.execError === 'grid' && type === 'error') {
      this.reloadtable()
    } else if (btn.execSuccess === 'view' && type === 'success') {
      this.reloadview()
    } else if (btn.execError === 'view' && type === 'error') {
      this.reloadview()
    } else if (btn.popClose === 'grid' && type === 'pop') {
      this.reloadtable()
    } else if (btn.popClose === 'view' && type === 'pop') {
      this.reloadview()
    } else if (btn.popClose === 'maingrid' && type === 'pop') {
      this.props.handleMainTable('maingrid')
    }
  }

  /**
   * @description 表格Id变化
   */
  handleTableId = (type = this.props.Tab.uuid, id = '', data = '') => {
    this.props.handleTableId(type, id, data)
  }

  /**
@@ -419,13 +372,35 @@
    })
  }

  changeTableLine = (ContainerId, tableId, id, data) => {
    const { Tab } = this.props

    if (tableId !== Tab.supMenu) return

    this.setState({BData: data, BID: id})

    if (id !== this.state.BID) {
      MKEmitter.emit('resetTable', this.props.Tab.uuid) // 列表重置
      this.setState({
        pageIndex: 1,
        selectedData: []
      }, () => {
        this.loadmaindata('refresh')
      })
    }
  }

  UNSAFE_componentWillMount() {
    // 组件加载时，获取菜单数据
    this.loadconfig()
  }

  componentDidMount () {
    MKEmitter.addListener('changeTableLine', this.changeTableLine)
  }

  shouldComponentUpdate (nextProps, nextState) { // handleMainTable 函数判断时不相等
    return !is(fromJS({...this.props, handleMainTable: '', handleTableId: ''}), fromJS({...nextProps, handleMainTable: '', handleTableId: ''})) || !is(fromJS(this.state), fromJS(nextState))
    return !is(fromJS(this.state), fromJS(nextState))
  }

  /**
@@ -435,36 +410,32 @@
    this.setState = () => {
      return
    }
    MKEmitter.removeListener('changeTableLine', this.changeTableLine)
  }

  render() {
    const { config, setting, searchlist, actions, columns, pickup, selectedData } = this.state
    const { BID, BData, setting, searchlist, actions, columns, pickup, selectedData, pageSize } = this.state

    return (
      <div className="verup-subtable" id={'subtable' + this.props.MenuID}>
        {searchlist && searchlist.length > 0 ?
          <SubSearch
            dict={this.state.dict}
            searchlist={searchlist}
            refreshdata={this.refreshbysearch}
          /> : null
        {searchlist && searchlist.length ?
          <MainSearch searchlist={searchlist} menuType="HS" refreshdata={this.refreshbysearch}/> : null
        }
        {actions ?
          <div className="sub-action">
            <SubAction
              type="sub"
              BID={BID}
              BData={BData}
              setting={setting}
              actions={actions}
              columns={columns}
              Tab={this.props.Tab}
              BID={this.props.BID}
              BData={this.props.BData}
              dict={this.state.dict}
              selectedData={selectedData}
              MenuID={this.props.SupMenuID}
              logcolumns={this.state.logcolumns}
              refreshdata={this.refreshbyaction}
              ContainerId={this.props.ContainerId}
              getexceloutparam={this.getexceloutparam}
            />
          </div> : null
        }
@@ -476,9 +447,9 @@
            <SubTable
              tableId={this.props.Tab.uuid}
              pickup={pickup}
              config={config}
              setting={setting}
              columns={columns}
              pageSize={pageSize}
              dict={this.state.dict}
              data={this.state.data}
              total={this.state.total}
@@ -486,8 +457,6 @@
              loading={this.state.loading}
              refreshdata={this.refreshbytable}
              buttonTrigger={() => {}}
              handleTableId={this.handleTableId}
              resetTable={this.state.resetTable}
              chgSelectData={this.changeSelectedData}
            />
          </div> : null