king
2020-10-23 407c0f1765c7d085218a91ad8842784977383d05
src/templates/sharecomponent/actioncomponent/index.jsx
@@ -1,11 +1,13 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { fromJS } from 'immutable'
import { is, fromJS } from 'immutable'
import { Icon, Tooltip, Modal, notification, Button } from 'antd'
import moment from 'moment'
import Api from '@/api'
import options from '@/store/options.js'
import Utils from '@/utils/utils.js'
import DevUtils from '@/utils/devutils.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import { getActionForm } from '@/templates/zshare/formconfig'
@@ -22,13 +24,11 @@
const { confirm } = Modal
// **悲观者往往正确,乐观者往往成功
class ActionComponent extends Component {
  static propTpyes = {
    type: PropTypes.string,          // 菜单类型,主表或子表
    menu: PropTypes.object,          // 菜单信息(菜单id,菜单参数,菜单名称)
    config: PropTypes.object,        // 菜单配置信息
    menuformRef: PropTypes.any,      // 菜单基本信息表单对象
    pasteContent: PropTypes.object,  // 粘贴配置信息
    usefulFields: PropTypes.array,   // 自定义函数可用字段
    tabs: PropTypes.array,           // 所有标签
@@ -37,7 +37,7 @@
  }
  state = {
    dict: (!localStorage.getItem('lang') || localStorage.getItem('lang') === 'zh-CN') ? zhCN : enUS,
    dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    card: null,          // 编辑中元素
    formlist: null,      // 表单信息
    actionlist: null,    // 按钮组
@@ -64,6 +64,8 @@
    if (nextProps.pasteContent && nextProps.pasteContent.copyType === 'action') {
      this.setState({actionlist: [...actionlist, nextProps.pasteContent]})
      this.handleAction(nextProps.pasteContent)
    } else if (!is(fromJS(nextProps.config.action), fromJS(this.props.config.action)) && !is(fromJS(nextProps.config.action), fromJS(actionlist))) {
      this.setState({actionlist: fromJS(nextProps.config.action).toJS()})
    }
  }
@@ -77,26 +79,91 @@
      this.setState({actionlist: list})
      this.handleAction(card)
    } else {
      this.setState({actionlist: list})
      this.props.updateaction({...config, action: list})
      this.setState({actionlist: list}, () => {
        this.props.updateaction({...config, action: list})
      })
    }
  }
  /**
   * @description 搜索条件编辑,获取搜索条件表单信息
   * @description 按钮编辑,获取按钮表单信息
   */
  handleAction = (card) => {
    const { menu } = this.props
    let ableField = this.props.usefulFields.join(', ')
    let functip = <div>
      <p style={{marginBottom: '5px'}}>{this.state.dict['model.tooltip.func.innerface'].replace('@ableField', ableField)}</p>
      <p>{this.state.dict['model.tooltip.func.outface']}</p>
    </div>
    this.setState({
      visible: true,
      card: card,
      formlist: getActionForm(card, functip, this.props.config, this.props.usefulFields, this.props.type)
    })
    let menulist = []
    if (menu.fstMenuList) {
      menulist = menu.fstMenuList.map(item => {
        return {
          value: item.MenuID,
          label: item.text,
          isLeaf: false
        }
      })
    }
    if (menu.fstMenuList && card.linkmenu && card.linkmenu.length > 0) {
      let _param = {
        func: 'sPC_Get_FunMenu',
        ParentID: card.linkmenu[0],
        systemType: options.sysType,
        debug: 'Y'
      }
      Api.getSystemConfig(_param).then(result => {
        if (result.status) {
          menulist = menulist.map(item => {
            if (item.value === card.linkmenu[0]) {
              item.children = result.data.map(item => {
                let submenu = {
                  value: item.ParentID,
                  label: item.MenuNameP,
                  children: item.FunMenu.map(cell => {
                    return {
                      value: cell.MenuID,
                      label: cell.MenuName,
                      MenuID: cell.MenuID,
                      MenuName: cell.MenuName,
                      MenuNo: cell.MenuNo,
                      Ot: cell.Ot,
                      PageParam: cell.PageParam,
                      LinkUrl: cell.LinkUrl,
                      disabled: cell.MenuID === menu.MenuID
                    }
                  })
                }
                return submenu
              })
            }
            return item
          })
        } else {
          notification.warning({
            top: 92,
            message: result.message,
            duration: 5
          })
        }
        this.setState({
          visible: true,
          card: card,
          formlist: getActionForm(card, functip, this.props.config, this.props.usefulFields, this.props.type, menulist)
        })
      })
    } else {
      this.setState({
        visible: true,
        card: card,
        formlist: getActionForm(card, functip, this.props.config, this.props.usefulFields, this.props.type, menulist)
      })
    }
  }
  /**
@@ -131,14 +198,9 @@
   * 4、下拉菜单数据源语法验证
   */
  handleSubmit = () => {
    const { config, menuformRef } = this.props
    const { config, menu } = this.props
    const { card } = this.state
    let _actionlist = fromJS(this.state.actionlist).toJS()
    let menu = fromJS(this.props.menu).toJS() // 菜单信息,存在表单对象时,从菜单中更新
    if (menuformRef) {
      menu = {...menu, MenuName: menuformRef.props.form.getFieldValue('MenuName'), MenuNo: menuformRef.props.form.getFieldValue('MenuNo')}
    }
    this.actionFormRef.handleConfirm().then(btn => {
      _actionlist = _actionlist.filter(item => !item.origin || item.uuid === btn.uuid)
@@ -338,7 +400,7 @@
            Align: 'center',
            IsSort: 'false',
            uuid: Utils.getuuid(),
            label: this.state.dict['header.form.column.action'],
            label: this.state.dict['model.form.column.action'],
            type: 'action',
            style: 'button',
            show: 'horizontal',
@@ -350,9 +412,9 @@
          actionlist: _actionlist,
          copying: false,
          visible: false
        }, () => {
          this.props.updateaction({...config, action: _actionlist, gridBtn: _gridBtn}, copyActionId)
        })
        this.props.updateaction({...config, action: _actionlist, gridBtn: _gridBtn}, copyActionId)
      })
    })
  }
@@ -434,7 +496,7 @@
      btnParam.LText = btnParam.LText.join(' union all ')
      btnParam.LText = Utils.formatOptions(btnParam.LText)
      btnParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + '.000'
      btnParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
      btnParam.secretkey = Utils.encrypt(btnParam.LText, btnParam.timestamp)
      _LongParam = window.btoa(window.encodeURIComponent(JSON.stringify(_tab)))
@@ -543,17 +605,11 @@
    confirm({
      content: dict['model.confirm'] + dict['model.delete'] + ` - ${card.label} ?`,
      okText: dict['model.confirm'],
      cancelText: this.state.dict['header.cancel'],
      onOk() {
        let _actionlist = fromJS(_this.state.actionlist).toJS()
        _actionlist = _actionlist.filter(item => item.uuid !== card.uuid)
        _this.setState({
          actionlist: _actionlist
        })
        let _hasGridbtn = _actionlist.filter(act => act.position === 'grid').length > 0
        let _gridBtn = config.gridBtn ? fromJS(config.gridBtn).toJS() : null
@@ -565,7 +621,7 @@
            Align: 'center',
            IsSort: 'false',
            uuid: Utils.getuuid(),
            label: this.state.dict['header.form.column.action'],
            label: this.state.dict['model.form.column.action'],
            type: 'action',
            style: 'button',
            show: 'horizontal',
@@ -578,7 +634,11 @@
          card: card
        }
        _this.props.updateaction({...config, action: _actionlist, gridBtn: _gridBtn}, '', delcard)
        _this.setState({
          actionlist: _actionlist
        }, () => {
          _this.props.updateaction({...config, action: _actionlist, gridBtn: _gridBtn}, '', delcard)
        })
      },
      onCancel() {}
    })
@@ -603,7 +663,6 @@
    
    this.verifyRef.handleConfirm().then(res => {
      let _actionlist = fromJS(this.state.actionlist).toJS()
      _actionlist = _actionlist.filter(item => !item.origin || item.uuid === card.uuid)
      _actionlist = _actionlist.map(item => {
@@ -617,8 +676,9 @@
      this.setState({
        actionlist: _actionlist,
        profVisible: false
      }, () => {
        this.props.updateaction({...config, action: _actionlist})
      })
      this.props.updateaction({...config, action: _actionlist})
    })
  }
@@ -626,50 +686,19 @@
   * @description 创建按钮存储过程
   */
  creatFunc = () => {
    const { config, menuformRef } = this.props
    const { menu } = this.props
    let _config = fromJS(this.props.config).toJS()
    let menu = fromJS(this.props.menu).toJS() // 菜单信息,存在表单对象时,从菜单中更新
    if (menuformRef) {
      menu = {...menu, MenuName: menuformRef.props.form.getFieldValue('MenuName'), MenuNo: menuformRef.props.form.getFieldValue('MenuNo')}
    }
    this.actionFormRef.handleConfirm().then(res => {
      let btn = res         // 按钮信息
      let newLText = ''     // 创建存储过程sql
      let DelText = ''      // 删除存储过程sql
      let _actionlist = fromJS(this.state.actionlist).toJS()
      _actionlist = _actionlist.filter(item => !item.origin || item.uuid === btn.uuid)
      let labelrepet = false
      _actionlist = _actionlist.map(item => {
        if (item.uuid !== btn.uuid && item.label === btn.label) {
          labelrepet = true
        }
        if (item.uuid === btn.uuid) {
          return btn
        } else {
          return item
        }
      })
      if (labelrepet) {
        notification.warning({
          top: 92,
          message: this.state.dict['model.name.exist'] + ' !',
          duration: 5
        })
        return
      }
      // 创建存储过程,必须填写内部函数名
      if (!btn.innerFunc) {
      if (btn.intertype !== 'inner') {
        notification.warning({
          top: 92,
          message: '请填写内部函数!',
          message: '使用内部函数时,才可以创建存储过程!',
          duration: 5
        })
        return
@@ -709,8 +738,8 @@
                fields: fields,
                menuNo: menu.MenuNo
              }
              newLText = Utils.formatOptions(Utils.getfunc(_param, btn, menu, _config))
              DelText = Utils.formatOptions(Utils.dropfunc(btn.innerFunc))
              newLText = Utils.formatOptions(DevUtils.getfunc(_param, btn, menu, _config))
              DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
              resolve(true)
            } else {
              notification.warning({
@@ -727,8 +756,8 @@
              funcName: btn.innerFunc,
              menuNo: menu.MenuNo
            }
            newLText = Utils.formatOptions(Utils.getexcelInfunc(_param, btn, menu))
            DelText = Utils.formatOptions(Utils.dropfunc(btn.innerFunc))
            newLText = Utils.formatOptions(DevUtils.getexcelInfunc(_param, btn, menu))
            DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
            resolve(true)
          } else {
            notification.warning({
@@ -743,8 +772,8 @@
            innerFunc: btn.innerFunc
          }
          newLText = Utils.formatOptions(Utils.getTableFunc(_param, menu, _config)) // 创建存储过程sql
          DelText = Utils.formatOptions(Utils.dropfunc(btn.innerFunc))
          newLText = Utils.formatOptions(DevUtils.getTableFunc(_param, menu, _config)) // 创建存储过程sql
          DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
          resolve(true)
        } else {
@@ -754,42 +783,14 @@
            fields: '',
            menuNo: menu.MenuNo
          }
          newLText = Utils.formatOptions(Utils.getfunc(_param, btn, menu, _config))
          DelText = Utils.formatOptions(Utils.dropfunc(btn.innerFunc))
          newLText = Utils.formatOptions(DevUtils.getfunc(_param, btn, menu, _config))
          DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
          resolve(true)
        }
      }).then(res => {
        if (!res) return
        this.refs.btnCreatFunc.exec(btn.innerFunc, newLText, DelText).then(result => {
          if (result !== 'success') return
          // 判断是否存在操作列
          let _hasGridbtn = _actionlist.filter(act => act.position === 'grid').length > 0
          let _gridBtn = config.gridBtn ? fromJS(config.gridBtn).toJS() : null
          if (_gridBtn) {
            _gridBtn.display = _hasGridbtn
          } else {
            _gridBtn = {
              display: _hasGridbtn,
              Align: 'center',
              IsSort: 'false',
              uuid: Utils.getuuid(),
              label: this.state.dict['header.form.column.action'],
              type: 'action',
              style: 'button',
              show: 'horizontal',
              Width: 120
            }
          }
          this.setState({
            actionlist: _actionlist
          })
          this.props.updateaction({...config, action: _actionlist, gridBtn: _gridBtn})
        })
        this.refs.btnCreatFunc.exec(btn.innerFunc, newLText, DelText)
      })
    })
  }
@@ -798,15 +799,9 @@
   * @description 创建按钮接口(写入)
   */
  btnCreatInterface = () => {
    const { config, type, menuformRef } = this.props
    let menu = fromJS(this.props.menu).toJS() // 菜单信息,存在表单对象时,从菜单中更新
    if (menuformRef) {
      menu = {...menu, MenuName: menuformRef.props.form.getFieldValue('MenuName'), MenuNo: menuformRef.props.form.getFieldValue('MenuNo')}
    }
    const { config, type, menu } = this.props
    this.actionFormRef.handleConfirm().then(result => {
      let _menu = {
        type: type,
        MenuID: menu.MenuID,
@@ -833,17 +828,25 @@
    }
  }
  shouldComponentUpdate (nextProps, nextState) {
    return !is(fromJS(this.props), fromJS(nextProps)) || !is(fromJS(this.state), fromJS(nextState))
  }
  /**
   * @description 组件销毁,清除state更新
   */
  componentWillUnmount () {
    this.setState = () => {
      return
    }
  }
  render() {
    const { config } = this.props
    const { actionlist, visible, card, dict, copying, profVisible } = this.state
    let hasbtncrtinter = false
    if (card && !card.copyType && config.setting.interType === 'inner' && !config.setting.innerFunc && config.setting.dataresource) {
      hasbtncrtinter = true
    }
    return (
      <div className="model-table-action-list">
      <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>
@@ -861,13 +864,13 @@
        <Modal
          title={dict['model.action'] + '-' + (card && card.copyType === 'action' ? dict['model.copy'] : dict['model.edit'])}
          visible={visible}
          width={750}
          width={800}
          maskClosable={false}
          onCancel={this.editModalCancel}
          footer={[
            hasbtncrtinter ? <CreateInterface key="interface" dict={dict} ref="btnCreatInterface" trigger={this.btnCreatInterface}/> : null,
            card && !card.copyType ? <CreateFunc key="create" dict={dict} ref="btnCreatFunc" trigger={this.creatFunc}/> : null,
            <Button key="cancel" onClick={this.editModalCancel}>{dict['header.cancel']}</Button>,
            <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>
          ]}
          destroyOnClose
@@ -890,14 +893,13 @@
          width={'75vw'}
          maskClosable={false}
          style={{minWidth: '900px', maxWidth: '1200px'}}
          okText={dict['header.submit']}
          okText={dict['model.submit']}
          onOk={this.verifySubmit}
          onCancel={() => { this.setState({ profVisible: false }) }}
          destroyOnClose
        >
          {card && !card.execMode && card.OpenType !== 'excelIn' && card.OpenType !== 'excelOut' ?
            <VerifyCard
              floor={this.props.type}
              card={card}
              dict={dict}
              config={config}
@@ -925,6 +927,7 @@
            <VerifyExcelOut
              card={card}
              dict={dict}
              config={config}
              wrappedComponentRef={(inst) => this.verifyRef = inst}
            /> : null
          }