king
2023-05-09 7b0dbecd1d6155d26ec67be0a47a16264c738c85
src/templates/sharecomponent/actioncomponent/index.jsx
@@ -1,26 +1,27 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
import { Icon, Tooltip, Modal, notification, Button } from 'antd'
import { Modal, notification, Button } from 'antd'
import moment from 'moment'
import Api from '@/api'
import Utils, { FuncUtils } from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import { getActionForm } from '@/templates/zshare/formconfig'
import asyncSpinComponent from '@/utils/asyncSpinComponent'
import ActionForm from './actionform'
import CreateFunc from '@/templates/zshare/createfunc'
import CreateInterface from '@/templates/zshare/createinterface'
import { updateForm } from '@/utils/utils-update.js'
import DragElement from './dragaction'
import MKEmitter from '@/utils/events.js'
import './index.scss'
const { confirm } = Modal
const VerifyCard = asyncSpinComponent(() => import('@/templates/zshare/verifycard'))
const VerifyPrint = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyprint'))
const VerifyExcelIn = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyexcelin'))
const VerifyMegvii = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifymegvii'))
const VerifyExcelOut = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyexcelout'))
class ActionComponent extends Component {
@@ -34,14 +35,14 @@
  }
  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    card: null,          // 编辑中元素
    formlist: null,      // 表单信息
    actionlist: null,    // 按钮组
    copying: false,      // 按钮复制中
    visible: false,      // 模态框控制
    printTemps: [],      // 单据打印模板
    profVisible: false   // 验证信息模态框
    profVisible: false,  // 验证信息模态框
    record: null
  }
  /**
@@ -53,24 +54,29 @@
    })
  }
  /**
   * @description 监听到按钮复制时,触发按钮编辑
   */
  UNSAFE_componentWillReceiveProps (nextProps) {
    const { actionlist } = this.state
    if (!is(fromJS(nextProps.config.action), fromJS(this.props.config.action)) && !is(fromJS(nextProps.config.action), fromJS(actionlist))) {
      let len = nextProps.config.action.length
      let item = nextProps.config.action[len - 1]
      if (item && item.focus) {
        this.handleAction(item)
      }
      this.setState({actionlist: fromJS(nextProps.config.action).toJS()})
    }
  }
  componentDidMount () {
    this.getBillPrintTemp()
    // MKEmitter.addListener('revert', this.revert)
    MKEmitter.addListener('pasteButton', this.pasteButton)
  }
  // revert = () => {
  //   this.setState({
  //     actionlist: fromJS(this.props.config.action).toJS()
  //   })
  // }
  pasteButton = (MenuId, btn) => {
    const { config } = this.props
    const { actionlist } = this.state
    if (MenuId !== config.uuid) return
    this.setState({
      actionlist: [...actionlist, btn],
    }, () => {
      this.handleAction(btn)
    })
  }
  getBillPrintTemp = () => {
@@ -143,23 +149,17 @@
    if (usefulFields) {
      try {
        usefulFields = JSON.parse(usefulFields)
      } catch {
      } catch (e) {
        usefulFields = []
      }
    } else {
      usefulFields = []
    }
    let ableField = usefulFields.join(', ')
    let functip = <div>
      <p style={{marginBottom: '5px'}}>{this.state.dict['model.tooltip.func.innerface'].replace('@ableField', ableField)}</p>
    </div>
    let menulist = []
    if (menu.fstMenuList) {
      let trees = fromJS(menu.fstMenuList).toJS()
      menulist = trees.map(fst => {
        fst.value = fst.MenuID
        fst.label = fst.MenuName
@@ -183,7 +183,7 @@
    this.setState({
      visible: true,
      card: card,
      formlist: getActionForm(card, functip, this.props.config, usefulFields, this.props.type, menulist, this.state.printTemps)
      formlist: getActionForm(card, this.props.config, usefulFields, this.props.type, menulist, this.state.printTemps, this.props.tabs)
    })
  }
@@ -279,7 +279,8 @@
        return Api.getSystemConfig({
          func: 'sPC_Get_LongParam',
          MenuID: card.originCard.uuid
          MenuID: card.originCard.uuid,
          appkey: card.originCard.appkey || ''
        })
      }).then(result => { // 复制按钮配置信息,保存至新添加按钮
        if (result === 'save' || result === 'subtab') return result
@@ -307,7 +308,7 @@
              _LongParam.setting.title = btn.label
              _LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(_LongParam)))
              _temp = 'Modal'
            } catch {
            } catch (e) {
              console.warn('Stringify Failure')
              _temp = ''
            }
@@ -327,7 +328,7 @@
              })
              _LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(_LongParam)))
              _temp = 'FormTab'
            } catch {
            } catch (e) {
              console.warn('Stringify Failure')
              _temp = ''
            }
@@ -376,7 +377,8 @@
        return Api.getSystemConfig({
          func: 'sPC_Get_LongParam',
          MenuID: card.originCard.linkTab
          MenuID: card.originCard.linkTab,
          appkey: card.originCard.appkey || ''
        })
      }).then(result => { // 标签复制
        if (result === 'save') return result
@@ -421,7 +423,7 @@
            Align: 'center',
            IsSort: 'false',
            uuid: Utils.getuuid(),
            label: this.state.dict['model.operation'],
            label: '操作',
            type: 'action',
            style: 'button',
            show: 'horizontal',
@@ -521,7 +523,7 @@
      btnParam.secretkey = Utils.encrypt(btnParam.LText, btnParam.timestamp)
      _LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(_tab)))
    } catch {
    } catch (e) {
      console.warn('Stringify Failure')
      _LongParam = ''
      _resolve('save')
@@ -621,11 +623,10 @@
   */
  deleteElement = (card) => {
    const { config } = this.props
    const { dict } = this.state
    let _this = this
    confirm({
      content: dict['model.confirm'] + dict['model.delete'] + ` - ${card.label} ?`,
      content: `确定删除 - ${card.label} ?`,
      onOk() {
        let _actionlist = fromJS(_this.state.actionlist).toJS()
@@ -642,7 +643,7 @@
            Align: 'center',
            IsSort: 'false',
            uuid: Utils.getuuid(),
            label: this.state.dict['model.operation'],
            label: '操作',
            type: 'action',
            style: 'button',
            show: 'horizontal',
@@ -744,19 +745,12 @@
            }
            if (_LongParam) {
              let fields = []
              if (_LongParam.groups.length > 0) {
                _LongParam.groups.forEach(group => {
                  fields = [...fields, ...group.sublist]
                })
              } else {
                fields = _LongParam.fields
              }
              _LongParam = updateForm(_LongParam)
              let _param = {
                funcName: btn.innerFunc,
                name: _config.setting.tableName || '',
                fields: fields,
                fields: _LongParam.fields,
                menuNo: menu.MenuNo
              }
              newLText = Utils.formatOptions(FuncUtils.getfunc(_param, btn, menu, _config))
@@ -789,11 +783,7 @@
            resolve(false)
          }
        } else if (btn.OpenType === 'excelOut') {
          let _param = {
            innerFunc: btn.innerFunc
          }
          newLText = Utils.formatOptions(FuncUtils.getTableFunc(_param, menu, _config)) // 创建存储过程sql
          newLText = Utils.formatOptions(FuncUtils.getTableFunc(btn.innerFunc, menu, _config)) // 创建存储过程sql
          DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc))
          resolve(true)
@@ -842,16 +832,12 @@
    if (!el.origin && (el.OpenType === 'pop' || el.execMode === 'pop' || el.OpenType === 'popview' || (el.OpenType === 'tab' && el.tabTemplate === 'FormTab'))) {
      this.props.setSubConfig(el)
    } else {
      notification.warning({
        top: 92,
        message: '此按钮无子配置项!',
        duration: 5
      })
      this.handleAction(el)
    }
  }
  shouldComponentUpdate (nextProps, nextState) {
    return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
    return !is(fromJS(this.state), fromJS(nextState))
  }
  /**
@@ -861,17 +847,56 @@
    this.setState = () => {
      return
    }
    // MKEmitter.removeListener('revert', this.revert)
    MKEmitter.removeListener('pasteButton', this.pasteButton)
  }
  getVerify = (card) => {
    const { config } = this.props
    if (!card) return null
    if (['pop', 'prompt', 'exec'].includes(card.OpenType)) {
      return <VerifyCard
        card={card}
        config={config}
        columns={config.columns}
        wrappedComponentRef={(inst) => this.verifyRef = inst}
      />
    } else if (card.OpenType === 'excelIn') {
      return <VerifyExcelIn
        card={card}
        columns={config.columns}
        wrappedComponentRef={(inst) => this.verifyRef = inst}
      />
    } else if (card.OpenType === 'excelOut') {
      return <VerifyExcelOut
        card={card}
        config={config}
        wrappedComponentRef={(inst) => this.verifyRef = inst}
      />
    } else if (card.OpenType === 'funcbutton' && card.funcType === 'print') {
      return <VerifyPrint
        card={card}
        columns={[]}
        // columns={config.columns}
        wrappedComponentRef={(inst) => this.verifyRef = inst}
      />
    } else if (card.OpenType === 'funcbutton' && card.funcType === 'megvii') {
      return <VerifyMegvii
        card={card}
        columns={config.columns}
        wrappedComponentRef={(inst) => this.verifyRef = inst}
      />
    }
  }
  render() {
    const { config } = this.props
    const { actionlist, visible, card, dict, copying, profVisible } = this.state
    const { actionlist, visible, card, copying, profVisible, record } = this.state
    return (
      <div className="model-table-action-list" style={config.charts.length > 1 ? {paddingTop: 25} : null}>
        <Tooltip placement="bottomLeft" overlayClassName="middle" title={dict['model.tooltip.action.guide']}>
          <Icon type="question-circle" />
        </Tooltip>
      <div className="model-table-action-list" style={config.charts && config.charts.length > 1 ? {paddingTop: 25} : null}>
        <DragElement
          list={actionlist}
          setting={this.props.config.setting}
@@ -880,80 +905,52 @@
          deleteMenu={this.deleteElement}
          profileMenu={this.profileAction}
          doubleClickCard={this.btnDoubleClick}
          placeholder={dict['header.form.action.placeholder']}
        />
        {/* 编辑按钮:复制、编辑 */}
        <Modal
          title={dict['model.action'] + '-' + (card && card.copyType === 'action' ? dict['model.copy'] : dict['model.edit'])}
          title={'按钮-' + (card && card.copyType === 'action' ? '复制' : '编辑')}
          wrapClassName="model-table-action-edit-modal"
          visible={visible}
          width={850}
          width={920}
          maskClosable={false}
          onCancel={this.editModalCancel}
          footer={[
            <CreateInterface key="interface" dict={dict} ref="btnCreatInterface" trigger={this.btnCreatInterface}/>,
            <CreateFunc key="create" dict={dict} ref="btnCreatFunc" trigger={this.creatFunc}/>,
            <Button key="cancel" onClick={this.editModalCancel}>{dict['model.cancel']}</Button>,
            <Button key="confirm" type="primary" loading={copying} onClick={this.handleSubmit}>{dict['model.confirm']}</Button>
            record && ['pop', 'exec', 'prompt'].includes(record.OpenType) && record.intertype === 'system' ? <CreateInterface key="interface" ref="btnCreatInterface" trigger={this.btnCreatInterface}/> : null,
            record && record.intertype === 'inner' ? <CreateFunc key="create" ref="btnCreatFunc" trigger={this.creatFunc}/> : null,
            <Button key="cancel" onClick={this.editModalCancel}>取消</Button>,
            <Button key="confirm" type="primary" loading={copying} onClick={this.handleSubmit}>确定</Button>
          ]}
          destroyOnClose
        >
          <ActionForm
            dict={dict}
            card={card}
            tabs={this.props.tabs}
            formlist={this.state.formlist}
            inputSubmit={this.handleSubmit}
            setting={config.setting}
            updRecord={(record) => this.setState({record: fromJS(record).toJS()})}
            wrappedComponentRef={(inst) => this.actionFormRef = inst}
          />
        </Modal>
        {/* 按钮使用系统存储过程时,验证信息模态框 */}
        <Modal
          wrapClassName="model-table-action-verify-modal"
          title={'验证信息'}
          wrapClassName="mk-pop-modal"
          visible={profVisible}
          width={'75vw'}
          width={'90vw'}
          maskClosable={false}
          style={{minWidth: '900px', maxWidth: '1200px'}}
          okText={dict['model.submit']}
          okText="提交"
          onOk={this.verifySubmit}
          onCancel={() => { this.setState({ profVisible: false }) }}
          onCancel={() => {
            if (this.verifyRef.handleCancel) {
              this.verifyRef.handleCancel().then(() => {
                this.setState({ profVisible: false })
              })
            } else {
              this.setState({ profVisible: false })
            }
          }}
          destroyOnClose
        >
          {card && !card.execMode && card.OpenType !== 'excelIn' && card.OpenType !== 'excelOut' ?
            <VerifyCard
              card={card}
              dict={dict}
              config={config}
              columns={config.columns}
              wrappedComponentRef={(inst) => this.verifyRef = inst}
            /> : null
          }
          {card && card.execMode ?
            <VerifyPrint
              card={card}
              dict={dict}
              columns={config.columns}
              wrappedComponentRef={(inst) => this.verifyRef = inst}
            /> : null
          }
          {card && card.OpenType === 'excelIn' ?
            <VerifyExcelIn
              card={card}
              dict={dict}
              columns={config.columns}
              wrappedComponentRef={(inst) => this.verifyRef = inst}
            /> : null
          }
          {card && card.OpenType === 'excelOut' ?
            <VerifyExcelOut
              card={card}
              dict={dict}
              config={config}
              wrappedComponentRef={(inst) => this.verifyRef = inst}
            /> : null
          }
          {this.getVerify(card)}
        </Modal>
      </div>
    )