king
2021-09-01 31ec63f0419895876cbaba99637a884a32d33d0d
src/menu/components/share/actioncomponent/index.jsx
@@ -1,26 +1,26 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import {connect} from 'react-redux'
import { is, fromJS } from 'immutable'
import { Modal, notification, Button } from 'antd'
import Utils from '@/utils/utils.js'
import DevUtils from '@/utils/devutils.js'
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 './formconfig'
import asyncSpinComponent from '@/utils/asyncSpinComponent'
import MKEmitter from '@/utils/events.js'
import ActionForm from './actionform'
import VerifyCard from '@/templates/zshare/verifycard'
import MenuUtils from '@/utils/utils-custom.js'
import CreateFunc from '@/templates/zshare/createfunc'
import VerifyPrint from '@/templates/sharecomponent/actioncomponent/verifyprint'
import VerifyExcelIn from '@/templates/sharecomponent/actioncomponent/verifyexcelin'
import VerifyExcelOut from '@/templates/sharecomponent/actioncomponent/verifyexcelout'
import DragElement from './dragaction'
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 VerifyExcelOut = asyncSpinComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyexcelout'))
class ActionComponent extends Component {
  static propTpyes = {
@@ -31,7 +31,8 @@
  }
  state = {
    dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    appType: sessionStorage.getItem('appType'),
    card: null,          // 编辑中元素
    formlist: null,      // 表单信息
    actionlist: null,    // 按钮组
@@ -43,8 +44,20 @@
   * @description 搜索条件初始化
   */
  UNSAFE_componentWillMount () {
    const { config } = this.props
    let actionlist = fromJS(config.action).toJS() || []
    this.setState({
      actionlist: fromJS(this.props.config.action).toJS()
      actionlist: actionlist.map(item => {
        if (item.btnstyle) { // 兼容
          item.style = item.style || {}
          item.style = {...item.style, ...item.btnstyle}
          delete item.btnstyle
        }
        return item
      })
    })
  }
@@ -58,7 +71,6 @@
   */
  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))) {
      this.setState({actionlist: fromJS(nextProps.config.action).toJS()})
    }
@@ -86,7 +98,7 @@
    if (comIds[0] !== config.uuid || comIds[1] !== 'actionlist') return
    let _card = fromJS(card).toJS()
    _card.btnstyle = style
    _card.style = style
    let _actionlist = actionlist.map(cell => {
      if (cell.uuid === _card.uuid) return _card
@@ -103,8 +115,8 @@
  changeBtnStyle = (element) => {
    const { config } = this.props
    let _style = element.btnstyle ? fromJS(element.btnstyle).toJS() : {}
    let options = ['font', 'border', 'background', 'margin']
    let _style = element.style ? fromJS(element.style).toJS() : {}
    let options = ['font', 'border', 'background', 'margin', 'padding']
    this.setState({
      card: element
@@ -138,68 +150,17 @@
    }
  }
  getModules = (components, selfId) => {
    let modules = components.map(item => {
      if (item.uuid === selfId) {
        return {
          children: null
        }
      } else if (item.format) {
        return {
          value: item.uuid,
          label: item.name
        }
      } else if (item.type === 'tabs') {
        let _item = {
          value: item.uuid,
          label: item.name,
          children: item.subtabs.map(f_tab => {
            let subItem = {
              value: f_tab.uuid,
              label: f_tab.label,
              children: this.getModules(f_tab.components, selfId)
            }
            if (!subItem.children || subItem.children.length === 0) {
              return {children: null}
            }
            return subItem
          })
        }
        _item.children = _item.children.filter(t => t.children !== null)
        if (_item.children.length === 0) {
          return {children: null}
        }
        return _item
      } else {
        return {
          children: null
        }
      }
    })
    modules = modules.filter(mod => mod.children !== null)
    if (modules.length === 0) {
      return null
    }
    return modules
  }
  /**
   * @description 按钮编辑,获取按钮表单信息
   */
  handleAction = (card) => {
    const { menu, config } = this.props
    const { config } = this.props
    let usefulFields = sessionStorage.getItem('permFuncField')
    if (usefulFields) {
      try {
        usefulFields = JSON.parse(usefulFields)
      } catch {
      } catch (e) {
        usefulFields = []
      }
    } else {
@@ -209,26 +170,25 @@
    let ableField = 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>
    let menulist = sessionStorage.getItem('fstMenuList')
    if (menulist) {
      try {
        menulist = JSON.parse(menulist)
      } catch {
      } catch (e) {
        menulist = []
      }
    } else {
      menulist = []
    }
    
    let modules = this.getModules(menu.components, config.uuid)
    let modules = MenuUtils.getSubModules(window.GLOB.customMenu.components, config.uuid)
    this.setState({
      visible: true,
      card: card,
      formlist: getActionForm(card, functip, config.setting, usefulFields, this.props.type, menulist, modules)
      formlist: getActionForm(card, functip, config, usefulFields, this.props.type, menulist, modules)
    })
  }
@@ -274,15 +234,15 @@
        }
        if (item.uuid === btn.uuid) {
          btn.btnstyle = item.btnstyle || {}
          btn.style = item.style || {}
          if (btn.class !== item.class || btn.show !== item.show || !btn.btnstyle.color) {
          if (btn.class !== item.class || btn.show !== item.show || !btn.style.color) {
            if (btn.show === 'link' || btn.show === 'icon') {
              btn.btnstyle.color = color[btn.class]
              btn.btnstyle.background = 'transparent'
              btn.style.color = color[btn.class]
              btn.style.backgroundColor = 'transparent'
            } else {
              btn.btnstyle.color = '#ffffff'
              btn.btnstyle.background = color[btn.class]
              btn.style.color = '#ffffff'
              btn.style.backgroundColor = color[btn.class]
            }
          }
          return btn
@@ -294,7 +254,7 @@
      if (labelrepet) {
        notification.warning({
          top: 92,
          message: this.state.dict['model.name.exist'] + ' !',
          message: '名称已存在!',
          duration: 5
        })
        return
@@ -314,7 +274,7 @@
   */
  deleteElement = (card) => {
    const { config } = this.props
    const { dict } = this.state
    const { dict, appType } = this.state
    let _this = this
    confirm({
@@ -324,20 +284,21 @@
        _actionlist = _actionlist.filter(item => item.uuid !== card.uuid)
        let delButtons = sessionStorage.getItem('delButtons')
        try {
          delButtons = JSON.parse(delButtons)
          delButtons.push(card.uuid)
        } catch {
          delButtons = [card.uuid]
        let btnlog = config.btnlog || []
        if (card.OpenType === 'popview' || card.verify || card.modal) {
          btnlog.push(card)
        }
        sessionStorage.setItem('delButtons', JSON.stringify(delButtons))
        _this.setState({
          actionlist: _actionlist
        }, () => {
          _this.props.updateaction({...config, action: _actionlist})
          _this.props.updateaction({...config, action: _actionlist, btnlog})
        })
        if (card.origin || appType === 'mob') return
        if (appType === 'pc' && card.OpenType !== 'popview') return
        MKEmitter.emit('delButtons', [card.uuid])
      },
      onCancel() {}
    })
@@ -385,7 +346,7 @@
   * @description 创建按钮存储过程
   */
  creatFunc = () => {
    const { menu } = this.props
    const menu = window.GLOB.customMenu
    let _config = fromJS(this.props.config).toJS()
    this.actionFormRef.handleConfirm().then(res => {
@@ -404,37 +365,28 @@
      }
      if (btn.OpenType === 'pop') {
        let fields = []
        if (btn.groups.length > 0) {
          btn.groups.forEach(group => {
            fields = [...fields, ...group.sublist]
          })
        } else {
          fields = btn.fields
        }
        let _param = {
          funcName: btn.innerFunc,
          name: _config.setting.tableName || '',
          fields: fields,
          fields: btn.modal ? btn.modal.fields : [],
          menuNo: menu.MenuNo
        }
        newLText = Utils.formatOptions(DevUtils.getfunc(_param, btn, menu, _config))
        DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
        newLText = Utils.formatOptions(FuncUtils.getfunc(_param, btn, menu, _config))
        DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc))
      } else if (btn.OpenType === 'excelIn') {
        let _param = {
          funcName: btn.innerFunc,
          menuNo: menu.MenuNo
        }
        newLText = Utils.formatOptions(DevUtils.getexcelInfunc(_param, btn, menu))
        DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
        newLText = Utils.formatOptions(FuncUtils.getexcelInfunc(_param, btn, menu))
        DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc))
      } else if (btn.OpenType === 'excelOut') {
        let _param = {
          innerFunc: btn.innerFunc
        }
        newLText = Utils.formatOptions(DevUtils.getTableFunc(_param, menu, _config)) // 创建存储过程sql
        DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
        newLText = Utils.formatOptions(FuncUtils.getTableFunc(_param, menu, _config)) // 创建存储过程sql
        DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc))
      } else {
        let _param = {
          funcName: btn.innerFunc,
@@ -442,8 +394,8 @@
          fields: '',
          menuNo: menu.MenuNo
        }
        newLText = Utils.formatOptions(DevUtils.getfunc(_param, btn, menu, _config))
        DelText = Utils.formatOptions(DevUtils.dropfunc(btn.innerFunc))
        newLText = Utils.formatOptions(FuncUtils.getfunc(_param, btn, menu, _config))
        DelText = Utils.formatOptions(FuncUtils.dropfunc(btn.innerFunc))
      }
      this.refs.btnCreatFunc.exec(btn.innerFunc, newLText, DelText)
@@ -454,14 +406,16 @@
   * @description 按钮双击触发子配置
   */
  btnDoubleClick = (element) => {
    if (element.OpenType === 'pop' || element.OpenType === 'popview') {
    if (sessionStorage.getItem('style-control') && sessionStorage.getItem('style-control') === 'true') return
    if (element.OpenType === 'pop' || element.OpenType === 'popview' || element.execMode === 'pop') {
      this.props.setSubConfig(element)
    } else if (element.OpenType === 'innerpage' && element.pageTemplate === 'page') {
      MKEmitter.emit('changeEditMenu', {MenuID: element.uuid, copyMenuId: element.copyMenuId})
    } else if (element.OpenType === 'innerpage' && element.pageTemplate === 'linkpage') {
      MKEmitter.emit('changeEditMenu', {MenuID: element.linkmenu})
    } else {
      notification.warning({
        top: 92,
        message: '此按钮无子配置项!',
        duration: 5
      })
      this.handleAction(element)
    }
  }
@@ -514,7 +468,7 @@
        <Modal
          title={dict['model.action'] + '-' + (card && card.copyType === 'action' ? dict['model.copy'] : dict['model.edit'])}
          visible={visible}
          width={800}
          width={850}
          maskClosable={false}
          onCancel={this.editModalCancel}
          footer={[
@@ -540,7 +494,6 @@
          visible={profVisible}
          width={'75vw'}
          maskClosable={false}
          style={{minWidth: '900px', maxWidth: '1200px'}}
          okText={dict['model.submit']}
          onOk={this.verifySubmit}
          onCancel={() => { this.setState({ profVisible: false }) }}
@@ -585,14 +538,4 @@
  }
}
const mapStateToProps = (state) => {
  return {
    menu: state.customMenu
  }
}
const mapDispatchToProps = () => {
  return {}
}
export default connect(mapStateToProps, mapDispatchToProps)(ActionComponent)
export default ActionComponent