2020-06-12

king

2020-06-12 89e7167a83e0d8409ca87698e4c08651a37cc26e

 src/tabviews/subtable/index.jsx

@@ -2,7 +2,7 @@
import PropTypes from 'prop-types'
import {connect} from 'react-redux'
import { is, fromJS } from 'immutable'
import { notification, Spin, Modal, Button, Switch, Col, Icon, Tabs} from 'antd'
import { notification, Spin, Switch, Col, Icon, Tabs} from 'antd'
import moment from 'moment'

import Api from '@/api'
@@ -12,7 +12,6 @@
import options from '@/store/options.js'
import { modifyTabview } from '@/store/action'

import SubTable from '@/tabviews/zshare/normalTable'
import SubSearch from '@/tabviews/zshare/topSearch'
import asyncComponent from '@/utils/asyncComponent'
import asyncSpinComponent from '@/utils/asyncSpinComponent'
@@ -22,13 +21,12 @@

const { TabPane } = Tabs
const SubAction = asyncComponent(() => import('@/tabviews/zshare/actionList'))
const CardComponent = asyncComponent(() => import('@/tabviews/zshare/cardcomponent'))
const SubTable = asyncSpinComponent(() => import('@/tabviews/zshare/normalTable'))
const CardComponent = asyncSpinComponent(() => import('@/tabviews/zshare/cardcomponent'))
const ChartComponent = asyncSpinComponent(() => import('@/tabviews/zshare/chartcomponent'))
const SubTabTable = asyncSpinComponent(() => import('@/tabviews/subtabtable'))

class SubTabViewTable extends Component {
  static propTpyes = {
    menuType: PropTypes.any,         // 菜单类型，普通菜单或HS
    Tab: PropTypes.object,           // 标签信息
    BID: PropTypes.string,           // 上级数据ID
    BData: PropTypes.any,            // 上级数据
@@ -56,15 +54,14 @@
    arr_field: '',        // 使用 sPC_Get_TableData 时的查询字段集
    setting: null,        // 页面全局设置：数据源、按钮及显示列固定、主键等
    data: null,           // 列表数据集
    selectedData: [],     // 已选表格数据
    resetTable: false,    // 表格重置，值在true与false之间切换，切换时表格重置
    total: 0,             // 总数
    loading: false,       // 列表数据加载中
    pageIndex: 1,         // 页码
    pageSize: 10,         // 每页数据条数
    orderBy: '',          // 排序
    search: '',           // 搜索条件数组，使用时需分场景处理
    popAction: false,     // 弹框页面，按钮信息
    popData: null,        // 弹框页面，所选的表格数据
    visible: false,       // 弹框显示隐藏控制
    pickup: false,        // 子表数据隐藏显示切换
    triggerBtn: null,     // 按钮触发
    chartId: ''           // 展开图表ID
@@ -75,8 +72,13 @@
   */
  UNSAFE_componentWillReceiveProps(nextProps) {
    if (this.state.config && this.props.Tab.supMenu && !is(fromJS(this.props.BID), fromJS(nextProps.BID))) {
      this.refs.subTable && this.refs.subTable.resetTable()
      this.loadmaindata(nextProps.BID, 'refresh')
      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)) {
      this.reloadtable()
    } else if (nextProps.triggerBtn && !is(fromJS(this.props.triggerBtn), fromJS(nextProps.triggerBtn)) && nextProps.triggerBtn.parentId === this.props.Tab.uuid) {
@@ -299,10 +301,8 @@
      })

      if (config.gridBtn && config.gridBtn.display && _operations.length > 0) {
        _columns.push({
          ...config.gridBtn,
          operations: _operations
        })
        config.gridBtn.operations = _operations
        _columns.push(config.gridBtn)
      }

      let valid = true // 搜索条件必填验证
@@ -327,6 +327,8 @@
          return pre.sort - next.sort
        })
      }

      config.setting.tabType = 'sub'

      this.setState({
        loadingview: false,
@@ -703,11 +705,11 @@
   * 含有初始不加载的页面，修改设置
   */
  refreshbysearch = (searches) => {
    this.refs.subTable && this.refs.subTable.resetTable()

    this.setState({
      pageIndex: 1,
      search: searches
      search: searches,
      resetTable: !this.state.resetTable,
      selectedData: [],
    }, () => {
      this.loadmaindata()
    })
@@ -726,6 +728,7 @@
    }

    this.setState({
      selectedData: [],
      pageIndex: pagination.current,
      pageSize: pagination.pageSize,
      orderBy: (sorter.field && sorter.order) ? `${sorter.field} ${sorter.order}` : ''
@@ -738,9 +741,10 @@
   * @description 表格刷新
   */
  reloadtable = () => {
    this.refs.subTable && this.refs.subTable.resetTable()
    this.setState({
      pageIndex: 1
      pageIndex: 1,
      selectedData: [],
      resetTable: !this.state.resetTable
    }, () => {
      this.loadmaindata()
    })
@@ -750,24 +754,9 @@
   * @description 页面刷新，重新获取配置
   */
  reloadview = () => {
    this.setState({
      loadingview: true,
      viewlost: false,
      lostmsg: '',
      config: null,
      searchlist: null,
      actions: null,
      columns: null,
      arr_field: '',
      setting: null,
      data: null,
      total: 0,
      loading: false,
      pageIndex: 1,
      pageSize: 10,
      orderBy: '',
      search: '',
      triggerBtn: null
    this.setState({ loadingview: true, viewlost: false, lostmsg: '', config: null, searchlist: null, actions: null,
      columns: null, arr_field: '', setting: null, data: null, total: 0, loading: false, pageIndex: 1, pageSize: 10,
      orderBy: '', search: '', triggerBtn: null
    }, () => {
      this.loadconfig()
    })
@@ -776,35 +765,22 @@
  /**
   * @description 按钮操作完成后（成功或失败），页面刷新，重置页码及选择项
   */
  refreshbyaction = (btn, type) => {
  refreshbyaction = (position) => {
    const { Tab } = this.props

    if (btn.execSuccess === 'grid' && type === 'success') {
    if (position === 'grid') {
      this.reloadtable()
    } else if (btn.execError === 'grid' && type === 'error') {
      this.reloadtable()
    } else if (btn.execSuccess === 'view' && type === 'success') {
    } else if (position === 'view') {
      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')
    } else if (btn.popClose === 'equaltab' && type === 'pop') {
      this.reloadtable()
      this.props.handleMainTable('equaltab')
    } else if (btn.execSuccess === 'maingrid' && type === 'success') {
    } else if (position === 'maingrid') {
      if (Tab.isTreeNode) {
        this.reloadtable()
      }
      this.props.handleMainTable('maingrid')
    } else if (btn.execSuccess === 'equaltab' && type === 'success') {
    } else if (position === 'equaltab') {
      this.reloadtable()
      this.props.handleMainTable('equaltab')
    }else if (btn.execSuccess === 'mainline' && type === 'success') {
    } else if (position === 'mainline') {
      this.reloadtable()
      this.props.handleMainTable('mainline')
    }
@@ -831,14 +807,10 @@
  }

  /**
   * @description 获取表格选择项
   * @description 表格选择项切换
   */
  gettableselected = () => {
    let data = []
    this.refs.subTable && this.refs.subTable.state.selectedRowKeys.forEach(item => {
      data.push(this.refs.subTable.props.data[item])
    })
    return data
  changeSelectedData = (selectedData) => {
    this.setState({selectedData})
  }

  /**
@@ -863,17 +835,6 @@
  }

  /**
   * @description 触发按钮弹窗（标签页）
   */
  triggerPopview = (btn, data) => {
    this.setState({
      popAction: btn,
      popData: data[0] ? data[0] : null,
      visible: true
    })
  }

  /**
   * @description 数据展开合并切换
   */
  pickupChange = () => {
@@ -882,41 +843,6 @@
    this.setState({
      pickup: !pickup
    })
  }

  linkTrigger = (menu) => {
    const { tabviews, SupMenuID } = this.props
    
    menu.selected = true

    let index = 0
    let isexit = false
    let tabs = tabviews.map((tab, i) => {
      tab.selected = false

      if (tab.MenuID === SupMenuID) {
        index = i
      } else if (tab.MenuID === menu.MenuID) {
        tab.param = menu.param
        tab.selected = true
        isexit = true
      }

      return tab
    })

    if (!isexit) {
      tabs.splice(index + 1, 0, menu)
    }

    this.props.modifyTabview(tabs)
  }

  popclose = () => {
    this.setState({
      visible: false
    })
    this.refreshbyaction(this.state.popAction, 'pop')
  }

  /**
@@ -945,7 +871,7 @@
  }

  render() {
    const { config, setting, searchlist, pageSize, actions, columns, loadingview, viewlost, pickup, triggerBtn, chartId } = this.state
    const { config, setting, searchlist, pageSize, actions, columns, loadingview, viewlost, pickup, triggerBtn, chartId, selectedData } = this.state

    return (
      <div className="subtable" id={'subtable' + this.props.MenuID}>
@@ -972,22 +898,19 @@
                  {config.charts.length > 1 ? <p className="chart-table chart-title">{item.title}</p> : null}
                  <div className="sub-action">
                    <SubAction
                      type="sub"
                      menuType={this.props.menuType}
                      triggerBtn={triggerBtn}
                      setting={setting}
                      actions={actions}
                      Tab={this.props.Tab}
                      BID={this.props.BID}
                      triggerBtn={triggerBtn}
                      BData={this.props.BData}
                      dict={this.state.dict}
                      MenuID={this.props.MenuID}
                      selectedData={selectedData}
                      logcolumns={this.state.logcolumns}
                      refreshdata={this.refreshbyaction}
                      ContainerId={this.props.ContainerId}
                      triggerPopview={this.triggerPopview}
                      operations={config.gridBtn.operations || []}
                      getexceloutparam={this.getexceloutparam}
                      gettableselected={this.gettableselected}
                    />
                  </div>
                  <div className="subtable-box">
@@ -995,8 +918,6 @@
                      <Switch title="收起" className="subtable-pickup" checkedChildren="开" unCheckedChildren="关" defaultChecked={pickup} onChange={this.pickupChange} /> : null
                    }
                    <SubTable
                      ref="subTable"
                      menuType={this.props.menuType}
                      tableId={this.props.Tab.uuid}
                      pickup={pickup}
                      config={config}
@@ -1007,13 +928,12 @@
                      data={this.state.data}
                      total={this.state.total}
                      MenuID={this.props.MenuID}
                      memberLevel={this.props.memberLevel}
                      loading={this.state.loading}
                      pagination={setting.laypage !== 'false'}
                      refreshdata={this.refreshbytable}
                      buttonTrigger={this.buttonTrigger}
                      linkTrigger={this.linkTrigger}
                      handleTableId={this.handleTableId}
                      resetTable={this.state.resetTable}
                      chgSelectData={this.changeSelectedData}
                    />
                  </div>
                </Col>
@@ -1024,34 +944,17 @@
                  <CardComponent
                    plot={item}
                    config={config}
                    Tab={this.props.Tab}
                    BID={this.props.BID}
                    BData={this.props.BData}
                    data={this.state.data}
                    MenuID={this.props.MenuID}
                    loading={this.state.loading}
                    tableId={this.props.Tab.uuid}
                    buttonTrigger={this.buttonTrigger}
                    logcolumns={this.state.logcolumns}
                    refreshdata={this.refreshbyaction}
                    handleTableId={this.handleTableId}
                  />
                  <div style={{display: 'none'}}>
                    <SubAction
                      type="sub"
                      menuType={this.props.menuType}
                      triggerBtn={triggerBtn}
                      setting={setting}
                      actions={actions}
                      Tab={this.props.Tab}
                      BID={this.props.BID}
                      BData={this.props.BData}
                      dict={this.state.dict}
                      MenuID={this.props.MenuID}
                      dataManager={this.props.dataManager}
                      permRoles={this.props.permRoles}
                      logcolumns={this.state.logcolumns}
                      refreshdata={this.refreshbyaction}
                      ContainerId={this.props.ContainerId}
                      triggerPopview={this.triggerPopview}
                      getexceloutparam={this.getexceloutparam}
                      gettableselected={this.gettableselected}
                    />
                  </div>
                </Col>
              )
            } else {
@@ -1068,28 +971,6 @@
            }
          })}
        </div> : null }
        <Modal
          className="popview-modal"
          title={this.state.popAction.label}
          width={'80vw'}
          maskClosable={false}
          visible={this.state.visible}
          onCancel={this.popclose}
          footer={[
            <Button key="close" onClick={this.popclose}>{this.state.dict['main.close']}</Button>
          ]}
          destroyOnClose
        >
          {<SubTabTable
            BID={this.state.popData ? this.state.popData[setting.primaryKey] : this.props.BID}
            menuType={this.props.menuType}
            BData={this.state.popData || this.props.BData}
            SupMenuID={this.props.MenuID}
            ContainerId={this.props.ContainerId}
            MenuID={this.state.popAction.linkTab}
            refreshSupView={this.reloadtable}
          />}
        </Modal>
        {viewlost ? <NotFount msg={this.state.lostmsg} /> : null}
      </div>
    )
@@ -1099,11 +980,11 @@
const mapStateToProps = (state) => {
  return {
    tabviews: state.tabviews,
    menuType: state.editLevel,
    permAction: state.permAction,
    permRoles: state.permRoles,
    permMenus: state.permMenus,
    dataManager: state.dataManager,
    memberLevel: state.memberLevel
  }
}