2020-04-20

king

2020-04-20 6b680ace26dc95031a1b7a3e33f8785c112f787d

 src/templates/subtableconfig/index.jsx

@@ -4,7 +4,7 @@
import { is, fromJS } from 'immutable'
import { DndProvider } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
import { Button, Card, Modal, Collapse, notification, Spin, Select, List, Icon, Empty, Switch, Tooltip } from 'antd'
import { Button, Card, Modal, Collapse, notification, Spin, Select, List, Icon, Empty, Switch, Tooltip, message } from 'antd'
import moment from 'moment'

import Api from '@/api'
@@ -20,7 +20,6 @@
import SearchForm from '@/templates/zshare/searchform'
import ColumnForm from '@/templates/zshare/columnform'
import DragElement from '@/templates/zshare/dragelement'
import PasteForm from '@/templates/zshare/pasteform'
import ColspanForm from '@/templates/zshare/colspanform'
import GridBtnForm from '@/templates/zshare/gridbtnform'
import EditCard from '@/templates/zshare/editcard'
@@ -29,7 +28,7 @@
import VerifyCardExcelIn from '@/templates/zshare/verifycardexcelin'
import VerifyCardExcelOut from '@/templates/zshare/verifycardexcelout'
import MenuForm from '@/templates/zshare/menuform'
import TransferForm from '@/components/transferform'
import EditComponent from '@/templates/zshare/editcomponent'
import SourceElement from '@/templates/zshare/dragelement/source'
import CreateFunc from '@/templates/zshare/createfunc'
import CreateInterface from '@/templates/zshare/createinterface'
@@ -83,8 +82,6 @@
    tabviews: [],            // 所有标签页
    profileVisible: false,   // 验证信息模态框
    optionLibs: null,        // 自定义下拉选项库
    thawBtnVisible: false,   // 解冻按钮弹窗
    thawbtnlist: null,       // 解冻按钮列表
    thawButtons: [],         // 已选择要解冻的按钮
    activeKey: '0',          // 默认展开基本信息
    sqlVerifing: false       // sql验证
@@ -2106,86 +2103,6 @@
  }

  /**
   * @description 解冻按钮
   */
  handleThaw = () => {
    const { config } = this.state

    this.setState({
      thawBtnVisible: true
    })

    Api.getSystemConfig({
      func: 'sPC_Get_FrozenMenu',
      ParentID: config.uuid,
      TYPE: 40
    }).then(res => {
      if (res.status) {
        let _list = []

        res.data.forEach(menu => {
          let _conf = ''

          if (menu.ParentParam) {
            try {
              _conf = JSON.parse(window.decodeURIComponent(window.atob(menu.ParentParam)))
            } catch (e) {
              console.warn('Parse Failure')
              _conf = ''
            }
          }

          if (_conf) {
            _list.push({
              key: menu.MenuID,
              title: menu.MenuName,
              btnParam: _conf
            })
          }
        })

        this.setState({
          thawbtnlist: _list
        })
      } else {
        notification.warning({
          top: 92,
          message: res.message,
          duration: 5
        })
      }
    })
  }

  /**
   * @description 解冻按钮提交
   */
  thawBtnSubmit = () => {
    const { thawButtons, config, thawbtnlist } = this.state
    // 三级菜单解除冻结
    if (this.refs.trawmenu.state.targetKeys.length === 0) {
      notification.warning({
        top: 92,
        message: this.state.dict['form.required.select'] + this.state.dict['header.form.thawbutton'],
        duration: 5
      })
    } else {

      thawbtnlist.forEach(item => {
        if (this.refs.trawmenu.state.targetKeys.includes(item.key)) {
          config.action.push(item.btnParam)
        }
      })

      this.setState({
        thawButtons: [...thawButtons, ...this.refs.trawmenu.state.targetKeys],
        config: config,
        thawBtnVisible: false
      })
    }
  }

  /**
   * @description 创建按钮接口（写入）
   */
  btnCreatInterface = () => {
@@ -2244,30 +2161,42 @@
    })
  }

  pasteSubmit = () => {
    this.pasteFormRef.handleConfirm().then(res => {
      if (res.copyType !== 'action') {
        notification.warning({
          top: 92,
          message: '配置信息格式错误！',
          duration: 5
        })
        return
      } else if (!['pop', 'prompt', 'exec', 'excelIn', 'excelOut', 'popview'].includes(res.OpenType)) {
        notification.warning({
          top: 92,
          message: '不支持此打开方式！',
          duration: 5
        })
        return
      }
  copycolumn = () => {
    const { config } = this.state

    let oInput = document.createElement('input')
    let val = {
      copyType: 'columns',
      columns: config.columns
    }

    oInput.value = window.btoa(window.encodeURIComponent(JSON.stringify(val)))
    document.body.appendChild(oInput)
    oInput.select()
    document.execCommand('Copy')
    oInput.className = 'oInput'
    oInput.style.display = 'none'

    message.success('复制成功。')

    document.body.removeChild(oInput)
  }

  updateConfig = (res) => {
    if (res.type === 'thaw') {
      this.setState({
        modaltype: ''
      }, () => {
        this.handleAction(res, 'copy')
        thawButtons: res.thawButtons,
        config: res.config
      })
    })
    } else if (res.type === 'paste') {
      if (res.copyType === 'action') {
        this.handleAction(res.content, 'copy')
      } else if (res.copyType === 'columns') {
        this.setState({
          config: res.config
        })
      }
    }
  }

  render () {
@@ -2359,9 +2288,6 @@
                      {this.state.dict['header.menu.action.configurable']}
                    </p> : null
                  }
                  <div className="thawbutton" title={this.state.dict['header.form.thawbutton']} onClick={this.handleThaw}>
                    <Icon type="unlock" />
                  </div>
                </div>
                {configAction.map((item, index) => {
                  return (
@@ -2395,6 +2321,7 @@
              </div>
            } bordered={false} extra={
              <div>
                <EditComponent dict={this.state.dict} type="subtable" config={this.state.config} thawButtons={this.state.thawButtons} refresh={this.updateConfig}/>
                <Switch className="big" checkedChildren="启" unCheckedChildren="停" checked={this.state.config.enabled} onChange={this.onEnabledChange} />
                <Button type="primary" onClick={this.submitConfig} loading={this.state.menuloading}>{this.state.dict['header.save']}</Button>
                <Button onClick={this.cancelConfig}>{this.state.dict['header.return']}</Button>
@@ -2414,13 +2341,24 @@
                  placeholder={this.state.dict['header.form.search.placeholder']}
                />
              </div>
              {/* <div className="action-list">
                <DragElement
                  type="action"
                  list={this.state.config.action}
                  setting={this.state.config.setting}
                  handleList={this.handleList}
                  handleMenu={this.handleAction}
                  copyElement={(val) => this.handleAction(val, 'copy')}
                  deleteMenu={this.deleteElement}
                  profileMenu={this.profileAction}
                  doubleClickCard={this.btnDoubleClick}
                  placeholder={this.state.dict['header.form.action.placeholder']}
                />
              </div> */}
              <div className="action-list">
                <Tooltip placement="bottomLeft" overlayClassName="middle" title="在左侧工具栏《按钮》中，选择对应类型的按钮拖至此处添加，如选择按钮类型为表单、新标签页等含有配置页面的按钮，可在左侧工具栏-按钮-可配置按钮处，点击按钮完成相关配置。注：当设置按钮显示位置为表格时，显示列会增加操作列。">
                  <Icon type="question-circle" />
                </Tooltip>
                <div className="copybutton" title={this.state.dict['header.form.paste']} onClick={() => {this.setState({modaltype: 'paste'})}}>
                  <Icon type="snippets" />
                </div>
                <DragElement
                  type="action"
                  list={this.state.config.action}
@@ -2438,6 +2376,7 @@
                <Tooltip placement="bottomLeft" overlayClassName="middle" title="在左侧工具栏《显示列》中，选择对应类型的显示列拖至此处添加；或点击《添加显示列》按钮批量添加，选择批量添加时，需提前选择使用表。注：添加合并列时，需设置可选列。">
                  <Icon type="question-circle" />
                </Tooltip>
                {config.columns && config.columns.length > 0 ? <Icon className="column-copy" title="copy" type="copy" onClick={this.copycolumn} /> : null}
                <Switch checkedChildren="开" unCheckedChildren="关" defaultChecked={this.state.showColumnName} onChange={this.onColumnNameChange} />
                <DragElement
                  type="columns"
@@ -2668,34 +2607,6 @@
          destroyOnClose
        >
          {this.state.dict['header.menu.config.placeholder']}
        </Modal>
        {/* 解冻按钮模态框 */}
        <Modal
          title={this.state.dict['header.form.thawbutton']}
          okText={this.state.dict['header.confirm']}
          cancelText={this.state.dict['header.cancel']}
          visible={this.state.thawBtnVisible}
          onOk={this.thawBtnSubmit}
          onCancel={() => {this.setState({thawBtnVisible: false, thawbtnlist: null})}}
          destroyOnClose
        >
          {!this.state.thawbtnlist && <Spin style={{marginLeft: 'calc(50% - 22px)', marginTop: '70px', marginBottom: '70px'}} size="large" />}
          {this.state.thawbtnlist && <TransferForm ref="trawmenu" menulist={this.state.thawbtnlist}/>}
        </Modal>
        {/* 按钮配置信息粘贴复制 */}
        <Modal
          title={this.state.dict['header.form.paste']}
          visible={modaltype === 'paste'}
          width={600}
          maskClosable={false}
          onOk={this.pasteSubmit}
          onCancel={() => {this.setState({modaltype: ''})}}
          destroyOnClose
        >
          <PasteForm
            dict={this.state.dict}
            wrappedComponentRef={(inst) => this.pasteFormRef = inst}
          />
        </Modal>
        {this.state.loading && <Spin size="large" />}
      </div>