2021-01-14

king

2021-01-14 3cbad93c94c39730e45600efeabdfebcd424c2cc

2021-01-14

 src/menu/components/card/cardcellcomponent/dragaction/index.jsx

@@ -38,14 +38,16 @@
    let copycard = fromJS(card).toJS()
    let _cards = fromJS(cards).toJS()

    copycard.uuid = Utils.getuuid()
    copycard.copyType = 'customCardElement'
    copycard.focus = true

    let _val = ''
    let _val = fromJS(copycard).toJS()

    copycard.uuid = Utils.getuuid()
    copycard.originCard = card

    try {
      _val = window.btoa(window.encodeURIComponent(JSON.stringify(copycard)))
      _val = window.btoa(window.encodeURIComponent(JSON.stringify(_val)))
    } catch {
      console.warn('Stringify Failure')
      _val = ''

 src/menu/components/card/data-card/index.jsx

@@ -18,6 +18,7 @@
const CardComponent = asyncComponent(() => import('../cardcomponent'))
const LogComponent = asyncIconComponent(() => import('@/menu/components/share/logcomponent'))
const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent'))
const UserComponent = asyncIconComponent(() => import('@/menu/components/share/usercomponent'))
const PasteComponent = asyncIconComponent(() => import('@/menu/components/share/pastecomponent'))
const NormalHeader = asyncComponent(() => import('@/menu/components/share/normalheader'))
const ActionComponent = asyncComponent(() => import('@/menu/components/share/actioncomponent'))
@@ -41,37 +42,6 @@
    const { card } = this.props

    if (card.isNew) {
      let subcards = null

      if (card.config) {
        subcards = JSON.parse(card.config)
        subcards = subcards.map(scard => {
          scard.uuid = Utils.getuuid()
          scard.elements = scard.elements.map(elem => {
            elem.uuid = Utils.getuuid()
            return elem
          })
          scard.backElements = scard.backElements.map(elem => {
            elem.uuid = Utils.getuuid()
            return elem
          })
          return scard
        })
      } else {
        subcards = [{
          uuid: Utils.getuuid(),
          setting: { width: 6, type: 'simple'},
          style: {
            borderWidth: '1px', borderColor: '#e8e8e8',
            paddingTop: '15px', paddingBottom: '15px', paddingLeft: '15px', paddingRight: '15px',
            marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px'
          },
          backStyle: {},
          elements: [],
          backElements: []
        }]
      }

      let _card = {
        uuid: card.uuid,
        type: card.type,
@@ -93,8 +63,54 @@
        scripts: [],
        action: [],
        btnlog: [],
        subcards: subcards
        subcards: [{
          uuid: Utils.getuuid(),
          setting: { width: 6, type: 'simple'},
          style: {
            borderWidth: '1px', borderColor: '#e8e8e8',
            paddingTop: '15px', paddingBottom: '15px', paddingLeft: '15px', paddingRight: '15px',
            marginLeft: '8px', marginRight: '8px', marginTop: '8px', marginBottom: '8px'
          },
          backStyle: {},
          elements: [],
          backElements: []
        }]
      }

      if (card.config) {
        let config = fromJS(card.config).toJS()

        _card.setting = config.setting
        _card.wrap = config.wrap
        _card.style = config.style
        _card.headerStyle = config.headerStyle

        _card.subcards = config.subcards.map(scard => {
          scard.uuid = Utils.getuuid()
          scard.elements = scard.elements.map(elem => {
            elem.uuid = Utils.getuuid()
            return elem
          })
          scard.backElements = scard.backElements.map(elem => {
            elem.uuid = Utils.getuuid()
            return elem
          })
          return scard
        })
        _card.columns = config.columns.map(col => {
          col.uuid = Utils.getuuid()
          return col
        })
        _card.scripts = config.scripts.map(col => {
          col.uuid = Utils.getuuid()
          return col
        })
        _card.action = config.action.map(col => {
          col.uuid = Utils.getuuid()
          return col
        })
      }

      this.setState({
        card: _card
      })
@@ -394,6 +410,7 @@
            <PasteComponent config={card} options={['action', 'search', 'form']} updateConfig={this.updateComponent} />
            <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" />
            <LogComponent btnlog={card.btnlog || []} handlelog={this.handleLog} />
            <UserComponent config={card}/>
            <Icon className="close" title="删除组件" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} />
            <SettingComponent config={card} updateConfig={this.updateComponent} />
          </div>

 src/menu/components/card/data-card/wrapsetting/index.jsx

@@ -55,7 +55,7 @@

    return (
      <div className="model-menu-setting-wrap">
        <Icon type="edit" onClick={() => this.editDataSource()} />
        <Icon type="edit" title="编辑" onClick={() => this.editDataSource()} />
        <Modal
          wrapClassName="popview-modal"
          title={config.type === 'table' ? '表格设置' : '卡片设置'}

 src/menu/components/chart/antv-bar/chartcompile/index.jsx

@@ -492,7 +492,7 @@

    return (
      <div className="line-chart-drawer-form">
        <Icon type="edit" onClick={this.showDrawer} />
        <Icon type="edit" title="编辑" onClick={this.showDrawer} />
        <Modal
          wrapClassName="popview-modal menu-chart-edit-modal"
          title="图表编辑"

 src/menu/components/chart/antv-pie/chartcompile/index.jsx

@@ -318,7 +318,7 @@

    return (
      <div className="line-chart-drawer-form">
        <Icon type="edit" onClick={this.showDrawer} />
        <Icon type="edit" title="编辑" onClick={this.showDrawer} />
        <Modal
          wrapClassName="popview-modal menu-chart-edit-modal"
          title="图表编辑"

 src/menu/components/chart/antv-pie/index.jsx

@@ -392,11 +392,6 @@
    let _card = {...card, style}

    this.updateComponent(_card)
    // this.setState({
    //   card: _card
    // })
    
    // this.props.updateConfig(_card)
  }

  handleLog = (type, logs, item) => {

 src/menu/components/group/groupsetting/index.jsx

@@ -54,7 +54,7 @@

    return (
      <div className="model-menu-setting-wrap">
        <Icon type="edit" onClick={() => this.editDataSource()} />
        <Icon type="edit" title="编辑" onClick={() => this.editDataSource()} />
        <Modal
          wrapClassName="popview-modal"
          title={'标签页配置'}

 src/menu/components/share/actioncomponent/dragaction/index.jsx

@@ -54,19 +54,19 @@

  const copyCard = id => {
    const { card } = findCard(id)

    let copycard = fromJS(card).toJS()

    copycard.uuid = Utils.getuuid()
    copycard.origin = false
    copycard.copyType = 'action'
    copycard.focus = true

    copycard.originCard = card

    let _val = fromJS(copycard).toJS()

    copycard.uuid = Utils.getuuid()
    copycard.originCard = card

    try {
      _val.uuid = Utils.getuuid()
      _val = window.btoa(window.encodeURIComponent(JSON.stringify(_val)))
    } catch {
      console.warn('Stringify Failure')

 src/menu/components/share/logcomponent/index.jsx

@@ -5,6 +5,7 @@

import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import MKEmitter from '@/utils/events.js'
import './index.scss'

const { confirm } = Modal
@@ -71,6 +72,7 @@
    const data = this.state.data.filter(d => d.uuid !== item.uuid)

    this.setState({data})
    MKEmitter.emit('thawButtons', item.uuid)
    this.props.handlelog('revert', data, item)
  }

@@ -99,7 +101,7 @@

    return (
      <div className="btn-log-wrap">
        <Icon type="rollback" onClick={this.trigger} />
        <Icon type="rollback" title="解除冻结" onClick={this.trigger} />
        <Modal
          wrapClassName="popview-modal"
          title="历史记录"

 src/menu/components/share/pastecomponent/index.jsx

@@ -4,6 +4,7 @@
import { Icon, Modal, notification } from 'antd'

import Utils from '@/utils/utils.js'
import MKEmitter from '@/utils/events.js'
import asyncComponent from '@/utils/asyncComponent'
import './index.scss'

@@ -23,8 +24,19 @@
    this.setState({visible: true})
  }

  resetconfig = (item) => {
    item.uuid = Utils.getuuid()
  resetconfig = (item, copyBtns) => {
    let _uuid = Utils.getuuid()

    if (item.OpenType === 'popview') {
      let _cell = fromJS(item).toJS()
      _cell.$originUuid = _cell.uuid
      _cell.uuid = _uuid
      copyBtns.set(_uuid, _cell)
    }

    if (item.uuid) {
      item.uuid = _uuid
    }

    if (item.copyType === 'cardcell') {
      item.setting = item.setting || {}
@@ -42,7 +54,7 @@
          return cell
        })
      }
    } else if (item.copyType === 'table') {
    } else if (item.copyType === 'cols') {
      let loopCol = (col) => {
        col.subcols = col.subcols.map(c => {
          c.uuid = Utils.getuuid()
@@ -54,11 +66,6 @@
              cell.uuid = Utils.getuuid()
              return cell
            })
          } else if (c.type === 'action' && c.elements) {
            c.elements = c.elements.map(cell => {
              cell.uuid = Utils.getuuid()
              return cell
            })
          }
          return c
        })
@@ -66,19 +73,30 @@
        return col
      }

      if (item.type === 'colspan' && item.subcols) {
        item = loopCol(item)
      } else if (item.type === 'custom' && item.elements) {
        item.elements = item.elements.map(cell => {
          cell.uuid = Utils.getuuid()
          return cell
        })
      } else if (item.type === 'action' && item.elements) {
        item.elements = item.elements.map(cell => {
          cell.uuid = Utils.getuuid()
          return cell
        })
      }
      item.cols = item.cols.map(_item => {
        _item.uuid = Utils.getuuid()
        if (_item.type === 'colspan' && _item.subcols) {
          _item = loopCol(_item)
        } else if (_item.type === 'custom' && _item.elements) {
          _item.elements = _item.elements.map(cell => {
            cell.uuid = Utils.getuuid()
            return cell
          })
        } else if (_item.type === 'action' && _item.elements) {
          _item.elements = _item.elements.map(cell => {
            let _uuid = Utils.getuuid()
            if (cell.OpenType === 'popview') {
              let _cell = fromJS(cell).toJS()
              _cell.$originUuid = _cell.uuid
              _cell.uuid = _uuid
              copyBtns.set(_uuid, _cell)
            }
            cell.uuid = _uuid
            return cell
          })
        }
        return _item
      })
    }

    return item
@@ -98,15 +116,22 @@

      let type = res.copyType
      let config = fromJS(this.props.config).toJS()
      let copyBtns = new Map()

      res = this.resetconfig(res)
      res = this.resetconfig(res, copyBtns)
      delete res.copyType

      copyBtns = [...copyBtns.values()]

      if (copyBtns.length > 0) {
        MKEmitter.emit('copyButtons', copyBtns)
      }

      if (type === 'action') {
        config.action = config.action || []
        config.action = config.action.filter(item => !item.origin)

        config.action.push(res)
        MKEmitter.emit('addButton', config.uuid, res)
      } else if (type === 'search' || type === 'form') {
        config.search = config.search || []
        config.search = config.search.filter(item => !item.origin)
@@ -137,6 +162,16 @@
        config.search.push(res)
      } else if (type === 'cardcell') {
        config.subcards.push(res)
      } else if (type === 'cols') {
        config.cols = config.cols.filter(col => !col.origin)

        let keys = config.cols.map(col => (col.field || '$empty'))

        res.cols.forEach(col => {
          if (!keys.includes(col.field)) {
            config.cols.push(col)
          }
        })
      }

      this.props.updateConfig(config)

 src/menu/components/share/usercomponent/index.jsx

New file
@@ -0,0 +1,117 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { is, fromJS } from 'immutable'
import { Icon, Modal, notification } from 'antd'
import html2canvas from 'html2canvas'

import Api from '@/api'
import Utils from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import UserForm from './settingform'
import MKEmitter from '@/utils/events.js'
import './index.scss'

class DataSource extends Component {
  static propTpyes = {
    btnlog: PropTypes.array,
    handlelog: PropTypes.func
  }

  state = {
    dict: localStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    visible: false,
    loading: false
  }

  shouldComponentUpdate (nextProps, nextState) {
    return !is(fromJS(this.state), fromJS(nextState))
  }

  trigger = () => {
    this.setState({
      visible: true,
      loading: false
    })
  }

  submit = () => {
    const { config } = this.props

    this.verifyRef.handleConfirm().then(res => {
      this.setState({loading: true})
      document.getElementsByClassName('menu-view')[0].classList.add('saving')

      html2canvas(document.getElementById(config.uuid)).then(canvas => {
        let img = canvas.toDataURL('image/png') // 获取生成的图片
        Api.fileuploadbase64(img, 'cloud').then(result => {
          if (result.status) {
            Api.getSystemConfig({
              func: 's_custom_components_adduptdel',
              c_id: config.uuid,
              images: Utils.getcloudurl(result.Images),
              c_name: res.name,
              long_param: window.btoa(window.encodeURIComponent(JSON.stringify(config))),
              del_type: ''
            }).then(response => {
              if (response.status) {
                this.setState({loading: false, visible: false})
                notification.success({
                  top: 92,
                  message: '保存成功',
                  duration: 2
                })
                document.getElementsByClassName('menu-view')[0].classList.remove('saving')
                MKEmitter.emit('updateCustomComponent')
              } else {
                this.setState({loading: false})
                notification.warning({
                  top: 92,
                  message: response.message,
                  duration: 5
                })
              }
            })
          } else {
            this.setState({loading: false})
            notification.warning({
              top: 92,
              message: result.ErrMesg,
              duration: 5
            })
          }
        })
      })
    })
  }

  cancel = () => {
    this.setState({ visible: false })
    document.getElementsByClassName('menu-view')[0].classList.remove('saving')
  }

  render () {
    const { visible, dict, loading } = this.state

    return (
      <div className="user-component-wrap">
        <Icon type="user" title="生成自定义组件" onClick={this.trigger} />
        <Modal
          wrapClassName="popview-modal"
          title="自定义组件"
          visible={visible}
          width={500}
          maskClosable={false}
          confirmLoading={loading}
          onOk={this.submit}
          onCancel={this.cancel}
          destroyOnClose
        >
          <UserForm dict={dict} inputSubmit={this.submit} wrappedComponentRef={(inst) => this.verifyRef = inst}/>
        </Modal>
      </div>
    )
  }
}

export default DataSource

 src/menu/components/share/usercomponent/index.scss

New file
@@ -0,0 +1,7 @@
.user-component-wrap {
  display: inline-block;

  >.anticon-user {
    color: purple;
  }
}

 src/menu/components/share/usercomponent/settingform/index.jsx

New file
@@ -0,0 +1,83 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { Form, Row, Col, Input, Tooltip, Icon } from 'antd'

import './index.scss'

class SettingForm extends Component {
  static propTpyes = {
    dict: PropTypes.object,       // 字典项
    inputSubmit: PropTypes.func   // 回车事件
  }

  state = {}

  UNSAFE_componentWillMount () {

  }

  handleConfirm = () => {
    // 表单提交时检查输入值是否正确
    return new Promise((resolve, reject) => {
      this.props.form.validateFieldsAndScroll((err, values) => {
        if (!err) {
          resolve(values)
        } else {
          reject(err)
        }
      })
    })
  }

  handleSubmit = (e) => {
    e.preventDefault()

    if (this.props.inputSubmit) {
      this.props.inputSubmit()
    }
  }

  render() {
    const { getFieldDecorator } = this.props.form

    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 8 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      }
    }

    return (
      <div className="model-menu-setting-form">
        <Form {...formItemLayout}>
          <Row gutter={24}>
            <Col span={22}>
              <Form.Item label={
                <Tooltip placement="topLeft" title="用于组件间的区分。">
                  <Icon type="question-circle" />
                  组件名称
                </Tooltip>
              }>
                {getFieldDecorator('name', {
                  initialValue: '',
                  rules: [
                    {
                      required: true,
                      message: this.props.dict['form.required.input'] + '组件名称!'
                    }
                  ]
                })(<Input placeholder={''} autoComplete="off" onPressEnter={this.handleSubmit}/>)}
              </Form.Item>
            </Col>
          </Row>
        </Form>
      </div>
    )
  }
}

export default Form.create()(SettingForm)

 src/menu/components/share/usercomponent/settingform/index.scss

New file
@@ -0,0 +1,8 @@
.model-menu-setting-form {
  position: relative;

  .anticon-question-circle {
    color: #c49f47;
    margin-right: 3px;
  }
}

 src/menu/components/table/normal-table/columns/index.jsx

@@ -395,8 +395,8 @@

    let oInput = document.createElement('input')
    let val = {
      copyType: 'columns',
      columns: columns
      copyType: 'cols',
      cols: columns.filter(col => !col.origin)
    }

    oInput.value = window.btoa(window.encodeURIComponent(JSON.stringify(val)))

 src/menu/components/table/normal-table/index.jsx

@@ -338,7 +338,7 @@
            <Icon className="plus" title="添加按钮" onClick={this.addButton} type="plus-square" />
            <WrapComponent config={card} updateConfig={this.updateComponent} />
            <CopyComponent type="normaltable" card={card}/>
            <PasteComponent config={card} options={['action', 'search', 'form']} updateConfig={this.updateComponent} />
            <PasteComponent config={card} options={['action', 'search', 'form', 'cols']} updateConfig={this.updateComponent} />
            <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" />
            <LogComponent btnlog={card.btnlog || []} handlelog={this.handleLog} />
            <Icon className="close" title="删除组件" type="delete" onClick={() => this.props.deletecomponent(card.uuid)} />

 src/menu/modelsource/dragsource/index.scss

@@ -3,10 +3,7 @@
  width: 100%;
  margin-bottom: 15px;
  height: auto;

  // background-size: cover;
  // background-position: top center;
  // background-repeat: no-repeat;
  min-height: 70px;

  .property {
    font-size: 14px;

 src/menu/modelsource/index.jsx

@@ -7,12 +7,18 @@

class ModelSource extends Component {
  state = {
    menuOptions: null
    menuOptions: null,
  }

  UNSAFE_componentWillMount () {
    const { MenuType } = this.props
    let options = fromJS(menuOptions).toJS()
    const { MenuType, components } = this.props
    let options = []
    
    if (components) {
      options = fromJS(components).toJS()
    } else {
      options = fromJS(menuOptions).toJS()
    }

    options = options.filter(item => !item.forbid || !item.forbid.includes(MenuType))


 src/menu/modelsource/option.jsx

@@ -18,8 +18,8 @@
  { type: 'menu', url: tabs, component: 'tabs', subtype: 'tabs', title: '标签页', width: 24, forbid: ['billPrint'] },
  { type: 'menu', url: group, component: 'group', subtype: 'normalgroup', title: '分组', width: 24, forbid: ['billPrint'] },
  { type: 'menu', url: Mainsearch, component: 'search', subtype: 'mainsearch', title: '搜索条件', width: 24, forbid: ['billPrint'] },
  { type: 'menu', url: card1, component: 'card', subtype: 'datacard', title: '数据卡', config: `[{"uuid":"160135809128212dm7i29fim9ksto9od","setting":{"width":6},"style":{"paddingTop":"15px","marginTop":"4px","paddingRight":"15px","marginRight":"8px","marginLeft":"8px","backgroundColor":"rgba(255, 255, 255, 1)","borderColor":"#e8e8e8","paddingLeft":"15px","marginBottom":"4px","borderWidth":"1px","paddingBottom":"10px"},"backStyle":{},"elements":[{"datatype":"static","width":12,"marks":null,"height":1,"value":"关单","style":{},"prefix":"","postfix":"","format":"","eleType":"text","uuid":"160231860159931untbea62sgokunc5s"},{"datatype":"static","width":12,"marks":null,"style":{"color":"rgba(250, 219, 20, 1)","textAlign":"right"},"btnstyle":{},"eleType":"icon","icon":"question-circle","field":"","uuid":"1602318768361nv8ql4t47sgcsn88b0u"},{"datatype":"static","width":24,"marks":null,"height":1,"innerHeight":36,"value":"100","style":{"fontSize":"24px","fontWeight":"500","color":"rgba(0, 0, 0, 1)"},"prefix":"","btnstyle":{},"postfix":"","format":"","eleType":"text","uuid":"1602318817884v70gtgb65ubnm8mbcvv"},{"color":"#1890ff","width":24,"marks":null,"maxValue":100,"style":{"color":"rgba(250, 140, 22, 1)","paddingTop":"20px","paddingBottom":"10px"},"btnstyle":{},"eleType":"slider","field":"int1","uuid":"16023188871233rkktuvpp1h077igrsu"},{"eleType":"splitline","width":24,"color":"#e8e8e8","uuid":"1602320017038n31bk9o831ggug0tu0b","marks":null,"style":{"marginTop":"10px","marginBottom":"10px"},"btnstyle":{}},{"datatype":"static","width":12,"marks":null,"height":1,"value":"100","style":{"marginTop":"6px"},"prefix":"关单","btnstyle":{},"postfix":"","format":"","eleType":"text","uuid":"1602320061243drd7lf3agvn04kgr175"}],"backElements":[]}]` },
  { type: 'menu', url: card2, component: 'card', subtype: 'propcard', title: '属性卡', config: `[{"uuid":"1603681387259qaqf1127f72esmtchge","setting":{"width":6,"type":"simple"},"style":{"paddingTop":"15px","marginTop":"8px","paddingRight":"15px","marginRight":"8px","marginLeft":"8px","borderColor":"#e8e8e8","paddingLeft":"15px","marginBottom":"8px","borderWidth":"1px","paddingBottom":"15px"},"backStyle":{},"elements":[{"datatype":"static","width":12,"marks":null,"height":1,"value":"超时工单","style":{"color":"rgba(67, 67, 67, 0.51)"},"prefix":"","postfix":"","format":"","eleType":"text","uuid":"1603681402945qnkgm7q8cng65evn5ev"},{"eleType":"icon","datatype":"static","width":12,"icon":"question-circle","tooltip":"超时工单","uuid":"1603681473384i2crkbtofg4pu76k06a","marks":null,"style":{"textAlign":"right","color":"rgba(250, 219, 20, 1)"}},{"datatype":"static","width":24,"marks":null,"height":1,"innerHeight":36,"value":"100","style":{"fontSize":"24px","color":"rgba(0, 0, 0, 1)"},"prefix":"","postfix":"","format":"","eleType":"number","uuid":"1603681539870d704ufqf98kc6t7537t"},{"color":"rgba(250, 219, 20, 1)","datatype":"static","width":24,"marks":null,"maxValue":100,"value":50,"style":{"paddingTop":"10px","paddingBottom":"10px"},"eleType":"slider","uuid":"1603683067556mvupau0odvrtv45u7o8"},{"eleType":"splitline","width":24,"color":"#e8e8e8","uuid":"1603683117981t9k55k8an430fuppmci","marks":null,"style":{"paddingTop":"5px","paddingBottom":"5px"}},{"datatype":"static","width":12,"marks":null,"height":1,"value":"100","style":{"color":"rgba(0, 0, 0, 0.65)","marginTop":"10px"},"prefix":"超时工单  ","postfix":"","format":"","eleType":"text","uuid":"1603683136553uvsmkfohkft9idbfkhu"}],"backElements":[]}]` },
  { type: 'menu', url: card1, component: 'card', subtype: 'datacard', title: '数据卡', config: '' },
  { type: 'menu', url: card2, component: 'card', subtype: 'propcard', title: '属性卡', config: '' },
  { type: 'menu', url: NormalTable, component: 'table', subtype: 'normaltable', title: '常用表', width: 24 },
  { type: 'menu', url: TableCard, component: 'table', subtype: 'tablecard', title: '表格', width: 12 },
  { type: 'menu', url: line, component: 'line', subtype: 'line', title: '折线图' },

 src/menu/pastecontroller/index.jsx

@@ -1,8 +1,10 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { fromJS } from 'immutable'
import { Icon, Modal, Button, notification } from 'antd'

import Utils from '@/utils/utils.js'
import MKEmitter from '@/utils/events.js'
import asyncComponent from '@/utils/asyncComponent'
import './index.scss'

@@ -23,7 +25,7 @@
    this.setState({visible: true})
  }

  resetconfig = (item, Tab, isgroup) => {
  resetconfig = (item, Tab, isgroup, copyBtns) => {
    item.uuid = Utils.getuuid()
    item.floor = Tab ? (Tab.floor + 1) : 1

@@ -49,13 +51,13 @@
        }

        tab.components = tab.components.map(cell => {
          cell = this.resetconfig(cell, tab)
          cell = this.resetconfig(cell, tab, copyBtns)
          return cell
        })
      })
    } else if (item.type === 'group') {
      item.components = item.components.forEach(cell => {
        cell = this.resetconfig(cell, item, true)
      item.components = item.components.map(cell => {
        cell = this.resetconfig(cell, item, true, copyBtns)
        return cell
      })
    } else if (item.type === 'card' || (item.type === 'table' && item.subtype === 'tablecard')) {
@@ -66,7 +68,14 @@
            card.elements = card.elements.filter(b => b.OpenType !== 'popview' && b.OpenType !== 'funcbutton')
          }
          card.elements = card.elements.map(cell => {
            cell.uuid = Utils.getuuid()
            let _uuid = Utils.getuuid()
            if (cell.OpenType === 'popview') {
              let _cell = fromJS(cell).toJS()
              _cell.$originUuid = _cell.uuid
              _cell.uuid = _uuid
              copyBtns.set(_uuid, _cell)
            }
            cell.uuid = _uuid
            return cell
          })
        }
@@ -75,7 +84,14 @@
            card.elements = card.elements.filter(b => b.OpenType !== 'popview' && b.OpenType !== 'funcbutton')
          }
          card.backElements = card.backElements.map(cell => {
            cell.uuid = Utils.getuuid()
            let _uuid = Utils.getuuid()
            if (cell.OpenType === 'popview') {
              let _cell = fromJS(cell).toJS()
              _cell.$originUuid = _cell.uuid
              _cell.uuid = _uuid
              copyBtns.set(_uuid, _cell)
            }
            cell.uuid = _uuid
            return cell
          })
        }
@@ -88,14 +104,6 @@
          if (c.type === 'colspan' && c.subcols) {
            c = loopCol(c)
          } else if (c.type === 'custom' && c.elements) {
            c.elements = c.elements.map(cell => {
              cell.uuid = Utils.getuuid()
              return cell
            })
          } else if (c.type === 'action' && c.elements) {
            if (sessionStorage.getItem('editMenuType') === 'popview') {
              c.elements = c.elements.filter(b => b.OpenType !== 'popview' && b.OpenType !== 'funcbutton')
            }
            c.elements = c.elements.map(cell => {
              cell.uuid = Utils.getuuid()
              return cell
@@ -122,7 +130,14 @@
            col.elements = col.elements.filter(c => c.OpenType !== 'popview' && c.OpenType !== 'funcbutton')
          }
          col.elements = col.elements.map(cell => {
            cell.uuid = Utils.getuuid()
            let _uuid = Utils.getuuid()
            if (cell.OpenType === 'popview') {
              let _cell = fromJS(cell).toJS()
              _cell.$originUuid = _cell.uuid
              _cell.uuid = _uuid
              copyBtns.set(_uuid, _cell)
            }
            cell.uuid = _uuid
            return cell
          })
        }
@@ -139,7 +154,14 @@
        item.action = item.action.filter(c => c.OpenType !== 'popview' && c.OpenType !== 'funcbutton')
      }
      item.action = item.action.map(cell => {
        cell.uuid = Utils.getuuid()
        let _uuid = Utils.getuuid()
        if (cell.OpenType === 'popview') {
          let _cell = fromJS(cell).toJS()
          _cell.$originUuid = _cell.uuid
          _cell.uuid = _uuid
          copyBtns.set(_uuid, _cell)
        }
        cell.uuid = _uuid
        return cell
      })
    }
@@ -188,11 +210,20 @@
        return
      }

      res = this.resetconfig(res, Tab, isgroup)
      let copyBtns = new Map()

      res = this.resetconfig(res, Tab, isgroup, copyBtns)

      delete res.copyType

      
      this.props.insert(res, Tab)

      copyBtns = [...copyBtns.values()]

      if (copyBtns.length > 0) {
        MKEmitter.emit('copyButtons', copyBtns)
      }

      this.setState({visible: false})

      notification.success({

 src/menu/popview/index.jsx

@@ -49,6 +49,7 @@
    oriConfig: null,
    openEdition: '',
    config: null,
    customComponents: []
  }

  UNSAFE_componentWillMount() {
@@ -64,6 +65,8 @@
  componentDidMount () {
    MKEmitter.addListener('delButtons', this.delButtons)
    MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle)
    MKEmitter.addListener('updateCustomComponent', this.updateCustomComponent)
    this.updateCustomComponent()
  }

  shouldComponentUpdate (nextProps, nextState) {
@@ -79,6 +82,40 @@
    }
    MKEmitter.removeListener('delButtons', this.delButtons)
    MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle)
    MKEmitter.removeListener('updateCustomComponent', this.updateCustomComponent)
  }

  updateCustomComponent = () => {
    Api.getSystemConfig({
      func: 's_get_custom_components',
      typecharone: ''
    }).then(res => {
      let coms = []
      if (res.cus_list && res.cus_list.length > 0) {
        res.cus_list.forEach(item => {
          let config = ''

          try {
            config = JSON.parse(window.decodeURIComponent(window.atob(item.long_param)))
          } catch (e) {
            console.warn('Parse Failure')
            config = ''
          }

          if (!config || !item.c_name) return

          coms.push({
            type: 'menu',
            title: item.c_name,
            url: item.images,
            component: config.type,
            subtype: config.subtype,
            config
          })
        })
      }
      this.setState({customComponents: coms})
    })
  }

  updateComponentStyle = (parentId, keys, style) => {
@@ -500,7 +537,7 @@

  render () {
    const { btn } = this.props
    const { activeKey, MenuType, dict, config, menuloading } = this.state
    const { activeKey, MenuType, dict, config, menuloading, customComponents } = this.state

    return (
      <DndProvider backend={HTML5Backend}>
@@ -518,6 +555,9 @@
              <Panel header={dict['mob.component']} key="component">
                <SourceWrap MenuType={MenuType} />
              </Panel>
              {customComponents && customComponents.length ? <Panel header="自定义组件" key="cuscomponent">
                <SourceWrap components={customComponents} MenuType={MenuType} />
              </Panel> : null}
              <Panel header={'背景'} key="background">
                {config ? <BgController config={config} updateConfig={this.updateConfig} /> : null}
              </Panel>

 src/tabviews/zshare/settingcomponent/editTable/index.jsx

@@ -170,8 +170,8 @@
        children: []
      }
      Object.keys(shortkeycode).forEach(key => {
        if (item === 'ctrl' && ['65', '67', '68', '86', '70', '72', '83'].includes(key)) return
        if (item === 'alt' && key === '65') return
        if (item === 'ctrl' && ['65', '67', '68', '69', '70', '71', '72', '74', '75', '76', '78', '79', '80', '82', '83', '84', '85', '86', '87', '88', '90'].includes(key)) return
        if (item === 'alt' && ['65', '68', '69', '70'].includes(key)) return

        _op.children.push({
          value: +key,

 src/tabviews/zshare/settingcomponent/index.jsx

@@ -361,9 +361,15 @@
        }

        socket.onerror = () => {
          let tool = item.verify.linkUrl
          if (item.verify.linkUrl === '127.0.0.1:13529') {
            tool = '明科通讯组件'
          } else if (item.verify.linkUrl === '127.0.0.1:13528') {
            tool = 'CAINIAO打印组件'
          }
          notification.warning({
            top: 92,
            message: '无法连接到:' + item.verify.linkUrl,
            message: '无法连接到: ' + tool,
            duration: 5
          })
        }

 src/views/login/index.scss

@@ -22,6 +22,7 @@
      font-weight: 600;
      padding-left: 20px;
      font-family: "黑体","宋体",sans-serif,"Arial","Microsoft YaHei";
      z-index: 1;
    }
  }

@@ -97,7 +98,7 @@
      min-width: 300px;
      border-radius: 5px;
      overflow: hidden;
      border: 1px solid #e8e8e8;
      border: 1px solid #bfbfbf;

      .form-item-wrap {
        padding: 0.6vw 1.6vw 1.6vw;

 src/views/menudesign/index.jsx

@@ -14,6 +14,7 @@
import antdEnUS from 'antd/es/locale/en_US'
import antdZhCN from 'antd/es/locale/zh_CN'
import MKEmitter from '@/utils/events.js'
import MenuUtils from '@/menu/utils/menuUtils.js'
import asyncComponent from '@/utils/asyncComponent'
import { modifyCustomMenu } from '@/store/action'

@@ -54,13 +55,15 @@
    tableFields: [],
    delButtons: [],
    copyButtons: [],
    thawButtons: [],
    activeKey: 'basedata',
    menuloading: false,
    oriConfig: null,
    openEdition: '',
    config: null,
    popBtn: null,             // 弹窗标签页
    visible: false
    visible: false,
    customComponents: []
  }

  UNSAFE_componentWillMount() {
@@ -91,9 +94,12 @@

  componentDidMount () {
    MKEmitter.addListener('delButtons', this.delButtons)
    MKEmitter.addListener('thawButtons', this.thawButtons)
    MKEmitter.addListener('copyButtons', this.copyButtons)
    MKEmitter.addListener('changePopview', this.initPopview)
    MKEmitter.addListener('submitComponentStyle', this.updateComponentStyle)
    MKEmitter.addListener('updateCustomComponent', this.updateCustomComponent)
    this.updateCustomComponent()
  }

  /**
@@ -104,9 +110,44 @@
      return
    }
    MKEmitter.removeListener('delButtons', this.delButtons)
    MKEmitter.removeListener('thawButtons', this.thawButtons)
    MKEmitter.removeListener('copyButtons', this.copyButtons)
    MKEmitter.removeListener('changePopview', this.initPopview)
    MKEmitter.removeListener('submitComponentStyle', this.updateComponentStyle)
    MKEmitter.removeListener('updateCustomComponent', this.updateCustomComponent)
  }

  updateCustomComponent = () => {
    Api.getSystemConfig({
      func: 's_get_custom_components',
      typecharone: ''
    }).then(res => {
      let coms = []
      if (res.cus_list && res.cus_list.length > 0) {
        res.cus_list.forEach(item => {
          let config = ''

          try {
            config = JSON.parse(window.decodeURIComponent(window.atob(item.long_param)))
          } catch (e) {
            console.warn('Parse Failure')
            config = ''
          }

          if (!config || !item.c_name) return

          coms.push({
            type: 'menu',
            title: item.c_name,
            url: item.images,
            component: config.type,
            subtype: config.subtype,
            config
          })
        })
      }
      this.setState({customComponents: coms})
    })
  }

  updateComponentStyle = (parentId, keys, style) => {
@@ -131,10 +172,20 @@
  }

  delButtons = (items) => {
    this.setState({delButtons: [...this.state.delButtons, ...items]})
    const { copyButtons } = this.state

    this.setState({
      delButtons: [...this.state.delButtons, ...items],
      copyButtons: copyButtons.filter(item => !items.includes(item.uuid))
    })
  }

  copyButtons = (items) => {
    this.setState({copyButtons: [...this.state.copyButtons, ...items]})
  }
  
  thawButtons = (item) => {
    this.setState({thawButtons: [...this.state.thawButtons, item]})
  }

  initPopview = (card, btn) => {
@@ -161,7 +212,7 @@
  }

  handleBack = () => {
    this.setState({popBtn: null, delButtons: []}, () => {
    this.setState({popBtn: null, delButtons: [], copyButtons: []}, () => {
      sessionStorage.setItem('editMenuType', 'menu')
      this.props.modifyCustomMenu(this.state.config)
      this.setState({visible: false})
@@ -348,7 +399,7 @@
  }

  submitConfig = () => {
    const { openEdition, MenuType, delButtons } = this.state
    const { openEdition, MenuType, delButtons, copyButtons, thawButtons } = this.state
    let config = fromJS(this.state.config).toJS()

    if (MenuType === 'billPrint' && (!config.firstCount || !config.everyPCount)) {
@@ -418,9 +469,13 @@
      LText: []
    }

    let btnIds = '' // 用于复制按钮的过滤
    if (MenuType !== 'billPrint') {
      btnParam.LText = this.getMenuMessage()
      btnParam.LText = btnParam.LText.join(' union all ')

      btnIds = btnParam.LText

      btnParam.LText = Utils.formatOptions(btnParam.LText)
      btnParam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss')
      btnParam.secretkey = Utils.encrypt(btnParam.LText, btnParam.timestamp)
@@ -432,7 +487,7 @@
      menuloading: true
    }, () => {
      new Promise(resolve => {
        if (MenuType === 'billPrint') {
        if (MenuType === 'billPrint') { // 打印生成页面效果图
          html2canvas(document.getElementById('menu-shell-inner')).then(canvas => {
            let img = canvas.toDataURL('image/png') // 获取生成的图片
            Api.fileuploadbase64(img, 'cloud').then(result => {
@@ -452,9 +507,6 @@
                      message: response.message,
                      duration: 5
                    })
                    this.setState({
                      menuloading: false
                    })
                    resolve(false)
                  }
                })
@@ -464,9 +516,6 @@
                  message: result.ErrMesg,
                  duration: 5
                })
                this.setState({
                  menuloading: false
                })
                resolve(false)
              }
            })
@@ -474,7 +523,7 @@
        } else {
          resolve(true)
        }
      }).then(res => {
      }).then(res => { // 按钮删除
        if (!res) return

        if (delButtons.length === 0) {
@@ -488,18 +537,9 @@
          }
          return Api.getSystemConfig(_param)
        }
      }).then(res => {
      }).then(res => { // 按钮解除冻结
        if (!res) return

        if (res.status) {
          this.setState({
            delButtons: []
          })
          return Api.getSystemConfig(param)
        } else {
          this.setState({
            menuloading: false
          })
        if (!res.status) {
          notification.warning({
            top: 92,
            message: res.message,
@@ -507,7 +547,32 @@
          })
          return false
        }
      }).then(res => {

        let ids = thawButtons.filter(item => btnIds.indexOf(item) !== -1)
        if (ids.length === 0) {
          return {
            status: true
          }
        } else {
          return Api.getSystemConfig({
            func: 'sPC_MainMenu_ReDel',
            MenuID: ids.join(',')
          })
        }
      }).then(res => { // 页面保存
        if (!res) return

        if (res.status) {
          return Api.getSystemConfig(param)
        } else {
          notification.warning({
            top: 92,
            message: res.message,
            duration: 5
          })
          return false
        }
      }).then(res => { // 页面按钮关系保存
        if (!res) return

        if (res.status) {
@@ -524,9 +589,6 @@
            }
          }
        } else {
          this.setState({
            menuloading: false
          })
          notification.warning({
            top: 92,
            message: res.message,
@@ -534,11 +596,105 @@
          })
          return false
        }
      }).then(res => {
      }).then(res => { // 按钮复制
        if (!res) return
        
        if (res.status) {
        if (!res.status) {
          notification.warning({
            top: 92,
            message: res.message,
            duration: 5
          })
          return false
        }

        if (copyButtons.length === 0) {
          return {
            status: true
          }
        } else {
          return new Promise(resolve => {
            let deffers = copyButtons.map(item => {
              return new Promise(resolve => {
                if (btnIds.indexOf(item.uuid) === -1) { // 复制的按钮已删除
                  resolve({
                    status: true
                  })
                  return
                }

                Api.getSystemConfig({
                  func: 'sPC_Get_LongParam',
                  MenuID: item.$originUuid
                }).then(result => {
                  if (result.status) {
                    let _conf = ''
              
                    try {
                      _conf = result.LongParam ? JSON.parse(window.decodeURIComponent(window.atob(result.LongParam))) : ''
                    } catch (e) {
                      console.warn('Parse Failure')
                      _conf = ''
                    }
                    
                    if (_conf) {
                      _conf.components = MenuUtils.resetConfig(_conf.components)
                      _conf.uuid = item.uuid
                      _conf.MenuID = item.uuid
                      _conf.Template = 'CustomPage'
                    } else {
                      resolve({
                        status: true
                      })
                      return
                    }

                    let _param = {
                      func: 'sPC_ButtonParam_AddUpt',
                      ParentID: _config.uuid,
                      MenuID: item.uuid,
                      MenuNo: '',
                      Template: 'CustomPage',
                      MenuName: item.label,
                      PageParam: JSON.stringify({Template: 'CustomPage'}),
                      LongParam: window.btoa(window.encodeURIComponent(JSON.stringify(_conf)))
                    }
            
                    Api.getSystemConfig(_param).then(response => {
                      resolve(response)
                    })
                  }
                })
              })
            })
            Promise.all(deffers).then(result => {
              let error = null
              result.forEach(response => {
                if (!response.status) {
                  error = response
                }
              })
    
              if (error) {
                notification.warning({
                  top: 92,
                  message: error.message,
                  duration: 5
                })
                resolve(false)
              } else {
                resolve({
                  status: true
                })
              }
            })
          })
        }
      }).then(res => {
        if (res && res.status) {
          this.setState({
            delButtons: [],
            copyButtons: [],
            thawButtons: [],
            menuloading: false,
            config: {...config, components: []}
          }, () => {
@@ -554,11 +710,6 @@
        } else {
          this.setState({
            menuloading: false
          })
          notification.warning({
            top: 92,
            message: res.message,
            duration: 5
          })
        }
      })
@@ -678,7 +829,7 @@
  }

  render () {
    const { activeKey, MenuType, popBtn, visible, dict, MenuId, config, ParentId, MenuName, MenuNo, menuloading } = this.state
    const { activeKey, MenuType, popBtn, visible, dict, MenuId, config, ParentId, MenuName, MenuNo, menuloading, customComponents } = this.state

    return (
      <ConfigProvider locale={_locale}>
@@ -717,6 +868,9 @@
                  <Panel header={dict['mob.component']} key="component">
                    <SourceWrap MenuType={MenuType} />
                  </Panel>
                  {customComponents && customComponents.length ? <Panel header="自定义组件" key="cuscomponent">
                    <SourceWrap components={customComponents} MenuType={MenuType} />
                  </Panel> : null}
                  <Panel header={'背景'} key="background">
                    {config ? <BgController config={config} updateConfig={this.updateConfig} /> : null}
                  </Panel>

 src/views/printTemplate/index.jsx

@@ -2,7 +2,7 @@
import { DndProvider } from 'react-dnd'
import { is, fromJS } from 'immutable'
import HTML5Backend from 'react-dnd-html5-backend'
import { Card, notification, Row, Button, Modal } from 'antd'
import { Card, notification, Row, Button, Modal, Input, Icon } from 'antd'
import DragElement from './dragelement'
import MutilForm from './mutilform'
import SourceElement from './dragelement/source'
@@ -39,7 +39,11 @@
    editItemType: '',
    fields: [],
    formlist: null,
    saveloading: false
    saveloading: false,
    upPlus: 1,
    upMinus: 1,
    leftPlus: 1,
    leftMinus: 1
  }

  getclickpoint = (e) => {
@@ -814,17 +818,81 @@
    })
  }

  change = (e, type) => {
    let val = e.target.value
    val = parseInt(val)

    if (isNaN(val)) {
      val = ''
    }
    this.setState({[type]: val})
  }

  updatePosition = (type) => {
    let val = 0
    if (type === 'upPlus') {
      val = this.state.upPlus || 0
    } else if (type === 'upMinus') {
      val = this.state.upMinus || 0
    } else if (type === 'leftPlus') {
      val = this.state.leftPlus || 0
    } else if (type === 'leftMinus') {
      val = this.state.leftMinus || 0
    }

    if (!val) return

    let config = fromJS(this.state.config).toJS()

    if (type === 'upPlus') {
      config.elements = config.elements.map(item => {
        item.top = (item.top || 0) + val
        return item
      })
    } else if (type === 'upMinus') {
      config.elements = config.elements.map(item => {
        item.top = (item.top || 0) - val
        return item
      })
    } else if (type === 'leftPlus') {
      config.elements = config.elements.map(item => {
        item.left = (item.left || 0) + val
        return item
      })
    } else if (type === 'leftMinus') {
      config.elements = config.elements.map(item => {
        item.left = (item.left || 0) - val
        return item
      })
    }

    this.setState({
      config: config,
      editItemId: config.uuid,
      editItemType: config.type,
      formlist: getpageform(config)
    }, () => {
      this.resetview()
    })
  }

  render () {
    return (
      <div className="print-template">
        <DndProvider backend={HTML5Backend}>
          <header className="print-header-container ant-menu-dark">模板制作</header>
          <aside className="tools">
            <Card title="工具栏">
            <Card className="tool-bar" title="工具栏">
              {printItems.map((item, index) => {
                return (<SourceElement key={index} content={item}/>)
              })}
            </Card>
            <Card className="move-bar" title="整体移动">
              <Input addonBefore={<Icon title="距上" type="arrow-up" />} addonAfter={<Icon onClick={() => this.updatePosition('upPlus')} type="plus" />} onChange={(e) => this.change(e, 'upPlus')} value={this.state.upPlus} />
              <Input addonBefore={<Icon title="距上" type="arrow-up" />} addonAfter={<Icon onClick={() => this.updatePosition('upMinus')} type="minus" />} onChange={(e) => this.change(e, 'upMinus')} value={this.state.upMinus} />
              <Input addonBefore={<Icon title="距左" type="arrow-left" />} addonAfter={<Icon onClick={() => this.updatePosition('leftPlus')} type="plus" />} onChange={(e) => this.change(e, 'leftPlus')} value={this.state.leftPlus} />
              <Input addonBefore={<Icon title="距左" type="arrow-left" />} addonAfter={<Icon onClick={() => this.updatePosition('leftMinus')} type="minus" />} onChange={(e) => this.change(e, 'leftMinus')} value={this.state.leftMinus} />
            </Card>
          </aside>
          <div className="switchbox" onClick={this.switchbox}></div>
          <DragElement dropcard={this.dropcard} />

 src/views/printTemplate/index.scss

@@ -4,6 +4,9 @@
  padding: 75px 250px 30px 240px;
  text-align: center;

  .ant-card-head {
    min-height: 45px;
  }
  .print-header-container {
    position: fixed;
    z-index: 1060;
@@ -27,7 +30,6 @@
    bottom: 0px;
    text-align: left;
    .ant-card {
      height: 100%;
      .ant-card-head {
        background: #1890ff;
        color: #ffffff;
@@ -36,7 +38,29 @@
        padding: 10px 0;
      }
      .ant-card-body {
        padding: 24px 12px;
        padding: 24px 12px 0px;
        .print-source-item:last-child {
          margin-bottom: 0;
        }
      }
    }
    .ant-card.tool-bar {
      height: 300px;
      border-bottom: 0;
    }
    .ant-card.move-bar {
      height: calc(100% - 300px);
      .ant-input-group-wrapper {
        margin-bottom: 15px;
        input + .ant-input-group-addon {
          padding: 0;
        }
        .anticon-plus, .anticon-minus {
          cursor: pointer;
          line-height: 25px;
          padding-left: 15px;
          padding-right: 15px;
        }
      }
    }
  }