2020-11-25

king

2020-11-25 42fae277ae5ebe794fc070bf38482a919eb661fc

 src/templates/zshare/editcomponent/index.jsx

@@ -1,10 +1,15 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { fromJS } from 'immutable'
import { Menu, Dropdown, Icon, Modal, Spin, notification } from 'antd'

import Api from '@/api'
import Utils from '@/utils/utils.js'
import PasteForm from '@/templates/zshare/pasteform'
import TransferForm from '@/components/transferform'
import ReplaceForm from '@/templates/zshare/replaceform'
import TransferForm from '@/templates/zshare/basetransferform'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import './index.scss'

class editComponent extends Component {
@@ -12,14 +17,16 @@
    type: PropTypes.string,
    MenuID: PropTypes.any,
    config: PropTypes.object,
    thawButtons: PropTypes.array,
    thawButtons: PropTypes.any,
    refresh: PropTypes.func
  }

  state = {
    dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    thawVisible: false,
    thawbtnlist: null,
    pasteVisible: false
    pasteVisible: false,
    replaceVisible: false
  }

  handleMenuClick = e => {
@@ -27,6 +34,8 @@
      this.handleThaw()
    } else if (e.key === 'paste') {
      this.setState({pasteVisible: true})
    } else if (e.key === 'replace') {
      this.setState({replaceVisible: true})
    }
  }

@@ -93,14 +102,14 @@
   */
  thawBtnSubmit = () => {
    const { thawButtons } = this.props
    const { thawbtnlist } = this.state
    const { thawbtnlist, dict } = this.state
    let config = JSON.parse(JSON.stringify(this.props.config))

    // 三级菜单解除冻结
    if (this.refs.trawmenu.state.targetKeys.length === 0) {
      notification.warning({
        top: 92,
        message: this.props.dict['form.required.select'] + this.props.dict['header.form.thawbutton'],
        message: dict['form.required.select'] + dict['header.form.thawbutton'],
        duration: 5
      })
    } else {
@@ -124,29 +133,50 @@
  }

  pasteSubmit = () => {
    const { config } = this.props
    const { config, type } = this.props

    this.pasteFormRef.handleConfirm().then(res => {
      if (res.copyType === 'action') {
        if (this.props.type === 'subtable' && !['pop', 'prompt', 'exec', 'excelIn', 'excelOut', 'popview'].includes(res.OpenType)) {
          notification.warning({
            top: 92,
            message: '不支持此打开方式！',
            duration: 5
          })
          return
        }
      if (['maintable', 'subtable'].includes(type) && res.copyType === 'action') {
        res.uuid = Utils.getuuid()
        
        this.setState({
          pasteVisible: false
        }, () => {
          this.props.refresh({
            type: 'paste',
            copyType: 'action',
            content: res
          })
        })
      } else if (res.copyType === 'columns') {
        if (config.columns && config.columns.length > 0) {
      } else if (['maintable', 'subtable', 'calendar'].includes(type) && (res.copyType === 'search' || res.copyType === 'form')) {
        res.uuid = Utils.getuuid()

        // search： text select multiselect link date dateweek datemonth daterange group
        // form： text number select multiselect link switch checkbox radio checkcard
        //       fileupload date datemonth datetime textarea hint color funcvar
        if (res.copyType === 'form') {
          if (['number', 'switch', 'textarea', 'checkcard', 'fileupload', 'hint', 'color', 'funcvar'].includes(res.type)) {
            res.type = 'text'
          } else if (res.type === 'radio') {
            res.type = 'select'
          } else if (res.type === 'checkbox') {
            res.type = 'multiselect'
          } else if (res.type === 'datetime') {
            res.type = 'date'
          }
        }
        res.copyType = 'search'

        this.setState({
          pasteVisible: false
        }, () => {
          this.props.refresh({
            type: 'paste',
            content: res
          })
        })
      } else if (['maintable', 'subtable'].includes(type) && res.copyType === 'columns') {
        let _columns = config.columns.filter(col => !col.origin)
        if (_columns.length > 0) {
          notification.warning({
            top: 92,
            message: '显示列已存在！',
@@ -160,8 +190,66 @@
        }, () => {
          this.props.refresh({
            type: 'paste',
            copyType: 'columns',
            config: {...config, columns: res.columns}
            content: res
          })
        })
      } else if (['form'].includes(type) && (res.copyType === 'form' || res.copyType === 'search')) {
        let _config = fromJS(config).toJS()
        let fields = []
        let labels = []
        
        res.uuid = Utils.getuuid()

        // search： text select multiselect link date dateweek datemonth daterange group
        // form： text number select multiselect link switch checkbox radio checkcard
        //       fileupload date datemonth datetime textarea hint color funcvar
        if (res.copyType === 'search') {
          if (res.type === 'dateweek' || res.type === 'daterange' || res.type === 'group') {
            res.type = 'date'
          }
        }
        res.copyType = 'form'

        if (_config.groups.length > 0) {
          _config.groups.forEach(group => {
            group.sublist.forEach(item => {
              fields.push(item.field)
              labels.push(item.label)
            })
            if (group.default) {
              group.sublist.push(res)
            }
          })
        } else {
          _config.fields.forEach(item => {
            fields.push(item.field)
            labels.push(item.label)
          })
          _config.fields.push(res)
        }

        if (fields.includes(res.field)) {
          notification.warning({
            top: 92,
            message: '字段已存在！',
            duration: 10
          })
          return
        } else if (labels.includes(res.label)) {
          notification.warning({
            top: 92,
            message: '名称已存在！',
            duration: 10
          })
          return
        }
        
        this.setState({
          pasteVisible: false
        }, () => {
          this.props.refresh({
            type: 'paste',
            content: _config
          })
        })
      } else {
@@ -174,12 +262,26 @@
    })
  }

  replaceSubmit = () => {
    this.replaceFormRef.handleConfirm().then(res => {
      this.props.refresh({
        type: 'replace',
        ...res
      })
      this.setState({
        replaceVisible: false
      })
    })
  }

  render() {
    const { type } = this.props
    const { dict } = this.state
    const menu = (
      <Menu onClick={this.handleMenuClick}>
        <Menu.Item key="thaw"><Icon type="unlock" />{this.props.dict['header.form.thawbutton']}</Menu.Item>
        <Menu.Item key="paste"><Icon type="snippets" />{this.props.dict['header.form.paste']}</Menu.Item>
        <Menu.Item key="replace"><Icon type="retweet" />替换</Menu.Item>
        {['maintable', 'subtable'].includes(type) ? <Menu.Item key="thaw"><Icon type="unlock" />{dict['header.form.thawbutton']}</Menu.Item> : null}
        {['maintable', 'subtable', 'form', 'calendar'].includes(type) ? <Menu.Item key="paste"><Icon type="snippets" />{dict['header.form.paste']}</Menu.Item> : null}
        {/* <Menu.Item key="replace"><Icon type="retweet" />替换</Menu.Item> */}
      </Menu>
    )

@@ -187,14 +289,12 @@
      <div style={{display: 'inline-block'}}>
        <Dropdown overlay={menu} overlayClassName="edit-component-box">
          <span style={{color: '#1890ff', display: 'inline-block', height: 25}}>
            编辑 <Icon type="down" />
            {dict['model.edit']} <Icon type="down" />
          </span>
        </Dropdown>
        {/* 解冻按钮模态框 */}
        <Modal
          title={this.props.dict['header.form.thawbutton']}
          okText={this.props.dict['header.confirm']}
          cancelText={this.props.dict['header.cancel']}
          title={dict['header.form.thawbutton']}
          visible={this.state.thawVisible}
          onOk={this.thawBtnSubmit}
          onCancel={() => {this.setState({thawVisible: false, thawbtnlist: null})}}
@@ -205,7 +305,7 @@
        </Modal>
        {/* 按钮配置信息粘贴复制 */}
        <Modal
          title={this.props.dict['header.form.paste']}
          title={dict['header.form.paste']}
          visible={this.state.pasteVisible}
          width={600}
          maskClosable={false}
@@ -214,10 +314,26 @@
          destroyOnClose
        >
          <PasteForm
            dict={this.props.dict}
            dict={dict}
            wrappedComponentRef={(inst) => this.pasteFormRef = inst}
          />
        </Modal>
        {/* 替换 */}
        <Modal
          title={'替换'}
          visible={this.state.replaceVisible}
          width={600}
          maskClosable={false}
          onOk={this.replaceSubmit}
          onCancel={() => {this.setState({replaceVisible: false})}}
          destroyOnClose
        >
          <ReplaceForm
            dict={dict}
            inputSubmit={this.replaceSubmit}
            wrappedComponentRef={(inst) => this.replaceFormRef = inst}
          />
        </Modal>
      </div>
    )
  }