king
2021-01-15 76a4300654a18d228838c3f27455dc8e7a8cd616
src/tabviews/commontable/index.jsx
@@ -2,10 +2,9 @@
import PropTypes from 'prop-types'
import {connect} from 'react-redux'
import { is, fromJS } from 'immutable'
import { notification, Spin, Tabs, Icon, Switch, Modal, Button, message, Tree, Typography, Row, Col } from 'antd'
import { notification, Spin, Tabs, Icon, Switch, Row, Col } from 'antd'
import Api from '@/api'
import options from '@/store/options.js'
import zhCN from '@/locales/zh-CN/main.js'
import enUS from '@/locales/en-US/main.js'
import Utils from '@/utils/utils.js'
@@ -25,10 +24,9 @@
const SubTable = asyncSpinComponent(() => import('@/tabviews/subtable'))
const CardComponent = asyncSpinComponent(() => import('@/tabviews/zshare/cardcomponent'))
const ChartComponent = asyncSpinComponent(() => import('@/tabviews/zshare/chartcomponent'))
const PagemsgComponent = asyncComponent(() => import('@/tabviews/zshare/pageMessage'))
const { TabPane } = Tabs
const { TreeNode } = Tree
const { Paragraph } = Typography
class NormalTable extends Component {
  static propTpyes = {
@@ -46,13 +44,13 @@
    viewlost: false,      // 页面丢失:1、未获取到配置-页面丢失;2、页面未启用
    lostmsg: '',          // 页面丢失时的提示信息
    config: {},           // 页面配置信息,包括按钮、搜索、显示列、标签等
    userConfig: null,     // 用户自定义设置
    shortcuts: null,      // 快捷键
    searchlist: null,     // 搜索条件
    actions: null,        // 按钮集
    columns: null,        // 显示列
    arr_field: '',        // 使用 sPC_Get_TableData 时的查询字段集
    setting: null,        // 页面全局设置:数据源、按钮及显示列固定、主键等
    data: null,           // 列表数据集
    data: [],             // 列表数据集
    selectedData: [],     // 已选表格数据
    total: 0,             // 总数
    loading: false,       // 列表数据加载中
@@ -62,13 +60,10 @@
    search: '',           // 搜索条件数组,使用时需分场景处理
    BIDs: {},             // 上级表id
    pickup: false,        // 主表数据隐藏显示切换
    treevisible: false,   // 菜单结构树弹框显示隐藏控制
    tabActive: null,      // 标签页展开控制
    chartId: '',          // 展开图表ID
    statFields: [],       // 合计字段
    statFValue: [],       // 合计值
    absFields: [],        // 绝对值字段
    debug: sessionStorage.getItem('debug') === 'true'
  }
  /**
@@ -85,11 +80,12 @@
    if (result.status) {
      let config = ''
      let userConfig = null
      let _curUserConfig = ''
      let shortcuts = []
      try { // 配置信息解析
        config = JSON.parse(window.decodeURIComponent(window.atob(result.LongParam)))
        config.MenuID = this.props.MenuID
        config.MenuName = MenuName
      } catch (e) {
        console.warn('Parse Failure')
        config = ''
@@ -98,11 +94,36 @@
      // HS不使用自定义设置
      if (result.LongParamUser && this.props.menuType !== 'HS') {
        try { // 配置信息解析
          userConfig = JSON.parse(window.decodeURIComponent(window.atob(result.LongParamUser)))
          _curUserConfig = userConfig[this.props.MenuID]
          let userConfig = JSON.parse(window.decodeURIComponent(window.atob(result.LongParamUser)))
          if (userConfig && !userConfig.version) {
            Object.keys(userConfig).forEach(key => {
              let component = userConfig[key]
              if (!component.action) return
              Object.keys(component.action).forEach(uuid => {
                let item = {uuid: uuid, parentId: key, shortcut: component.action[uuid].shortcut}
                let printer = component.action[uuid].printer
                if (item.shortcut) {
                  item.$shortcut = item.shortcut.join('+')
                  shortcuts.push(item)
                }
                if (printer) {
                  item.printer = printer.defaultPrinter || ''
                  item.printerList = printer.printerList || ''
                  window.GLOB.UserCacheMap.set(key + uuid, item)
                }
              })
            })
          } else if (userConfig) {
            shortcuts = userConfig.action
            userConfig.printers.forEach(item => {
              window.GLOB.UserCacheMap.set(item.parentId + item.uuid, item)
            })
          }
        } catch (e) {
          console.warn('Parse Failure')
          userConfig = null
        }
      }
@@ -221,36 +242,6 @@
        }
      }
      if (_curUserConfig) {
        config.easyCode = _curUserConfig.easyCode || config.easyCode || ''
        config.action = config.action.map(item => {
          if (_curUserConfig.action[item.uuid]) {
            delete _curUserConfig.action[item.uuid].label
            item = {...item, ..._curUserConfig.action[item.uuid]}
          }
          if (item.OpenType === 'funcbutton' && item.funcType === 'print' && item.verify && item.printer) {
            item.verify.defaultPrinter = item.printer.defaultPrinter || ''
            if (item.verify.printerTypeList && item.printer.printerList) {
              item.verify.printerTypeList = item.verify.printerTypeList.map(cell => {
                cell.printer = item.printer.printerList[cell.Value] || ''
                return cell
              })
            }
          }
          return item
        })
      }
      let _tabActive = {} // 筛选展开的tab页
      config.tabgroups.forEach(group => {
        _tabActive[group.uuid] = group.sublist[0].uuid
      })
      let _arrField = []     // 字段集
      let _columns = []      // 显示列
      let _hideCol = []      // 隐藏及合并列中字段的uuid集
@@ -264,6 +255,22 @@
      config.action.forEach(item => {
        item.logLabel = MenuName + '-' + item.label // 用于sPC_TableData_InUpDe记录操作按钮
        item.$menuId = this.props.MenuID
        if (item.OpenType === 'funcbutton' && item.funcType === 'print' && item.verify) { // 打印机设置
          let _item = window.GLOB.UserCacheMap.get(this.props.MenuID + item.uuid)
          if (_item) {
            item.printer = _item.printer || ''
            item.verify.defaultPrinter = _item.printer || ''
            if (item.verify.printerTypeList && _item.printerList) {
              item.verify.printerTypeList = item.verify.printerTypeList.map(cell => {
                cell.printer = _item.printerList[cell.Value] || ''
                return cell
              })
            }
          }
        }
        
        if (item.position === 'toolbar') {
          _actions.push(item)
@@ -316,8 +323,10 @@
              subcols.push(colMap.get(sub))
            }
          })
          _col.subcols = subcols
          _columns.push(_col)
          if (subcols.length > 0) {
            _col.subcols = subcols
            _columns.push(_col)
          }
        } else {
          _columns.push(col)
        }
@@ -338,29 +347,13 @@
        return _item
      })
      if (_curUserConfig) {
        _columns = _columns.map(item => {
          if (_curUserConfig.columns[item.uuid]) {
            delete _curUserConfig.columns[item.uuid].label
            item = {...item, ..._curUserConfig.columns[item.uuid]}
          }
          return item
        })
        _columns.sort((pre, next) => {
          return pre.sort - next.sort
        })
      }
      this.setState({
        loadingview: false,
        absFields,
        chartId,
        config,
        statFields,
        userConfig,
        tabActive: _tabActive,
        shortcuts,
        setting: config.setting,
        searchlist: config.search,
        actions: _actions,
@@ -389,8 +382,12 @@
  }
  setShortcut = () => {
    const { actions, userConfig, config } = this.state
    if (!userConfig) return
    const { shortcuts } = this.state
    if (!shortcuts || shortcuts.length === 0) {
      document.onkeydown = () => {}
      return
    }
    document.onkeydown = (event) => {
      let e = event || window.event
@@ -405,56 +402,21 @@
        preKey = 'alt'
      }
      if (!preKey) return
      if (!preKey || !keyCode) return
      let triggerId = ''
      let _shortcut = `${preKey}+${keyCode}`
      actions.some(item => {
        if (Array.isArray(item.shortcut) && preKey === item.shortcut[0] && keyCode === item.shortcut[1]) {
          e.preventDefault()
          triggerId = item.uuid
      shortcuts.some(item => {
        if (item.$shortcut === _shortcut) {
          MKEmitter.emit('triggerBtnId', item.uuid)
          let element = item.parentId && item.parentId !== this.props.MenuID ? document.getElementById(item.parentId) : '' // 标签切换
          if (element && element.click) {
            element.click()
          }
          return true
        }
        return false
      })
      if (triggerId) {
        MKEmitter.emit('triggerBtnId', triggerId)
        return
      }
      Object.keys(userConfig).some(key => {
        if (key === this.props.MenuID || !userConfig[key].action) return false
        let _actions = userConfig[key].action
        Object.keys(_actions).some(btnkey => {
          let item = _actions[btnkey]
          if (Array.isArray(item.shortcut) && preKey === item.shortcut[0] && keyCode === item.shortcut[1]) {
            e.preventDefault()
            triggerId = btnkey
            let _groupId = ''
            let _ActiveTabId = ''
            config.tabgroups.forEach(group => {
              let _tab = group.sublist.filter(tab => tab.uuid === key)[0]
              if (!_tab) return
              _groupId = group.uuid
              _ActiveTabId = _tab.uuid
            })
            if (_ActiveTabId && this.state.tabActive[_groupId] === _ActiveTabId) {
              MKEmitter.emit('triggerBtnId', triggerId)
              return true
            }
          }
          return false
        })
        if (triggerId) return true
        return false
      })
    }
@@ -513,6 +475,9 @@
          }
          item.key = index
          item.$$uuid = item[setting.primaryKey] || ''
          item.$$BID = BID || ''
          return item
        }),
        total: result.total,
@@ -567,6 +532,9 @@
          data = data.map(item => {
            if (item[setting.primaryKey] === _data[setting.primaryKey]) {
              _data.key = item.key
              _data.$$uuid = _data[setting.primaryKey] || ''
              _data.$$BID = BID || ''
              return _data
            } else {
              return item
@@ -719,20 +687,11 @@
   */
  reloadview = () => {
    this.setState({ loadingview: true, viewlost: false, config: {}, setting: null,
      data: null, total: 0, loading: false, pageIndex: 1,
      data: null, total: 0, loading: false, pageIndex: 1, shortcuts: null,
      pageSize: 10, orderBy: '', search: '', BIDs: {}, pickup: false
    }, () => {
      this.loadconfig()
    })
  }
  /**
   * @description 按钮操作完成后(成功或失败),页面刷新,重置页码及选择项
   */
  refreshbyaction = (position, btn) => {
    if (position === 'grid' || position === 'view') {
      this.reloadtable(btn)
    }
  }
  /**
@@ -784,65 +743,6 @@
    })
  }
  handleviewconfig = (e) => {
    e.stopPropagation()
    const { MenuNo } = this.props
    const { config } = this.state
    if (config && config.funcs && config.funcs.length > 0) {
      this.setState({
        treevisible: true
      })
    } else {
      let oInput = document.createElement('input')
      oInput.value = MenuNo || ''
      document.body.appendChild(oInput)
      oInput.select()
      document.execCommand('Copy')
      document.body.removeChild(oInput)
      message.success(this.state.dict['main.copy.success'])
    }
  }
  getTreeNode = (data) => {
    let _type = {
      view: '页面',
      btn: '按钮',
      tab: '标签'
    }
    return data.map(item => {
      let _title = _type[item.subtype]
      let _others = []
      _others.push(
        (item.menuNo ? item.menuNo + '(菜单参数)' : ''),
        (item.tableName ? item.tableName + '(表名) ' : ''),
        (item.innerFunc ? item.innerFunc + '(内部函数) ' : ''),
        (item.outerFunc ? item.outerFunc + '(外部函数)' : '')
      )
      _others = _others.filter(Boolean)
      _others = _others.join('、')
      if (item.label) {
        _title = _title + '(' + item.label + ')'
      }
      if (_others) {
        _title = _title + ': ' + _others
      }
      if (item.subfuncs && item.subfuncs.length > 0) {
        return (
          <TreeNode title={_title} key={item.uuid} dataRef={item} selectable={false}>
            {this.getTreeNode(item.subfuncs)}
          </TreeNode>
        )
      }
      return <TreeNode key={item.uuid} title={_title} isLeaf selectable={false} />
    })
  }
  /**
   * @description 图表视图切换
   */
@@ -884,6 +784,20 @@
    this.setShortcut()
  }
  /**
   * @description 按钮执行完成后页面刷新
   * @param {*} menuId     // 菜单Id
   * @param {*} position   // 刷新位置
   * @param {*} btn        // 执行的按钮
   */
  refreshByButtonResult = (menuId, position, btn) => {
    const { MenuID } = this.props
    if (MenuID !== menuId) return
    this.reloadtable(btn)
  }
  UNSAFE_componentWillMount () {
    // 组件加载时,获取菜单数据
    this.loadconfig()
@@ -915,6 +829,7 @@
    MKEmitter.addListener('reloadMenuView', this.reloadMenuView)
    MKEmitter.addListener('resetActiveMenu', this.resetActiveMenu)
    MKEmitter.addListener('getexceloutparam', this.getexceloutparam)
    MKEmitter.addListener('refreshByButtonResult', this.refreshByButtonResult)
  }
  /**
@@ -929,19 +844,20 @@
    MKEmitter.removeListener('reloadMenuView', this.reloadMenuView)
    MKEmitter.removeListener('resetActiveMenu', this.resetActiveMenu)
    MKEmitter.removeListener('getexceloutparam', this.getexceloutparam)
    MKEmitter.removeListener('refreshByButtonResult', this.refreshByButtonResult)
  }
  render() {
    const { menuType, MenuName } = this.props
    const { debug, BID, setting, searchlist, pageSize, actions, columns, loadingview, viewlost, pickup, config, userConfig, tabActive, chartId, search, selectedData } = this.state
    const { menuType } = this.props
    const { BID, setting, searchlist, pageSize, actions, columns, loadingview, viewlost, pickup, config, chartId, search, selectedData, shortcuts } = this.state
    return (
      <div className="commontable" id={this.state.ContainerId}>
        {loadingview && <Spin size="large" />}
        {loadingview ? <Spin size="large" /> : null}
        {searchlist && searchlist.length ?
          <MainSearch BID={BID} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
        }
        {setting && setting.onload !== 'false' ? <Row className="chart-view" gutter={16}>
        {setting ? <Row className="chart-view" gutter={16}>
          {/* 视图组 */}
          {!config.expand ? <Tabs activeKey={chartId} onChange={this.changeChart}>
            {config.charts.map(item => (
@@ -965,26 +881,14 @@
                      MenuID={this.props.MenuID}
                      selectedData={selectedData}
                      ContainerId={this.state.ContainerId}
                      refreshdata={this.refreshbyaction}
                    />
                  </div>
                  <div className="main-table-box">
                    {this.props.menuType !== 'HS' ? <SettingComponent
                      config={config}
                      columns={columns}
                      MenuName={MenuName}
                      dict={this.state.dict}
                      MenuID={this.props.MenuID}
                      permAction={this.props.permAction}
                      userConfig={this.state.userConfig}
                      reloadview={this.reloadview}
                    /> : null}
                    {(setting.tableType === 'radio' || setting.tableType === 'checkbox') && this.state.data && this.state.data.length > 0 ?
                      <Switch title="收起" className="main-pickup" checkedChildren="开" unCheckedChildren="关" defaultChecked={pickup} onChange={this.pickupChange} /> : null
                    }
                    <MainTable
                      tableId="mainTable"
                      BID={BID}
                      pickup={pickup}
                      setting={setting}
                      columns={columns}
@@ -994,11 +898,10 @@
                      total={this.state.total}
                      MenuID={this.props.MenuID}
                      loading={this.state.loading}
                      refreshdata={this.refreshbytable}
                      statFValue={this.state.statFValue}
                      handleTableId={this.handleTableId}
                      ContainerId={this.state.ContainerId}
                      refreshbyaction={this.refreshbyaction}
                      refreshdata={this.refreshbytable}
                      handleTableId={this.handleTableId}
                      chgSelectData={this.changeSelectedData}
                    />
                  </div>
@@ -1017,7 +920,6 @@
                    MenuID={this.props.MenuID}
                    loading={this.state.loading}
                    ContainerId={this.state.ContainerId}
                    refreshdata={this.refreshbyaction}
                    handleTableId={this.handleTableId}
                  />
                </Col>
@@ -1037,60 +939,33 @@
            }
          })}
        </Row> : null }
        {setting && setting.onload !== 'false' &&
          config.tabgroups.map(group => (
            <Tabs key={group.uuid} onChange={(key) => this.setState({tabActive: {...tabActive, [group.uuid]: key}})}>
              {group.sublist.map(_tab => {
                return (
                  <TabPane tab={
                    <span>
                      {_tab.icon ? <Icon type={_tab.icon} /> : null}
                      {_tab.label}
                    </span>
                  } key={_tab.uuid}>
                    <SubTable
                      Tab={_tab}
                      MenuID={_tab.linkTab}
                      mainSearch={_tab.searchPass === 'true' ? search : null}
                      userConfig={userConfig ? userConfig[_tab.uuid] : null}
                      SupMenuID={this.props.MenuID}
                      ContainerId={this.state.ContainerId}
                      BID={this.state.BIDs[_tab.supMenu] || ''}
                      BData={this.state.BIDs[_tab.supMenu + 'data'] || ''}
                      handleTableId={this.handleTableId}
                    />
                  </TabPane>
                )
              })}
            </Tabs>)
          )
        {setting && config.tabgroups.map(group => (
          <Tabs key={group.uuid}>
            {group.sublist.map(_tab => {
              return (
                <TabPane tab={
                  <span id={_tab.uuid}>
                    {_tab.icon ? <Icon type={_tab.icon} /> : null}
                    {_tab.label}
                  </span>
                } key={_tab.uuid}>
                  <SubTable
                    Tab={_tab}
                    MenuID={_tab.linkTab}
                    mainSearch={_tab.searchPass === 'true' ? search : null}
                    SupMenuID={this.props.MenuID}
                    ContainerId={this.state.ContainerId}
                    BID={this.state.BIDs[_tab.supMenu] || ''}
                    BData={this.state.BIDs[_tab.supMenu + 'data'] || ''}
                    handleTableId={this.handleTableId}
                  />
                </TabPane>
              )
            })}
          </Tabs>))
        }
        {debug && options.sysType !== 'cloud' && menuType !== 'HS' ? <Button
          icon="copy"
          shape="circle"
          className="common-table-copy"
          onClick={this.handleviewconfig}
        /> : null}
        <Modal
          className="menu-tree-modal"
          title={'菜单结构树'}
          width={'650px'}
          maskClosable={false}
          visible={this.state.treevisible}
          onCancel={() => this.setState({treevisible: false})}
          footer={[
            <Button key="close" onClick={() => this.setState({treevisible: false})}>{this.state.dict['main.close']}</Button>
          ]}
          destroyOnClose
        >
          <div className="menu-header">
            <span>菜单名称:{this.props.MenuName}</span>
            <span>菜单参数:{<Paragraph copyable>{this.props.MenuNo}</Paragraph>}</span>
          </div>
          {this.state.treevisible ? <Tree defaultExpandAll showLine={true}>
            {this.getTreeNode(config.funcs)}
          </Tree> : null}
        </Modal>
        {menuType !== 'HS' ? <PagemsgComponent menu={{MenuName: this.props.MenuName, MenuNo: this.props.MenuNo}} config={config} dict={this.state.dict} /> : null}
        {menuType !== 'HS' && shortcuts ? <SettingComponent config={config} dict={this.state.dict} shortcuts={shortcuts} permAction={this.props.permAction}/> : null}
        {viewlost ? <NotFount msg={this.state.lostmsg} /> : null}
      </div>
    )