2020-11-10

king

2020-11-10 a9ac16fecc0cf9bc66dfaefe4e9b35fa3c722812

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

@@ -8,21 +8,23 @@
import options from '@/store/options.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import asyncComponent from '@/utils/asyncComponent'
import { getCardCellForm } from './formconfig'
import { getActionForm } from '@/menu/actioncomponent/formconfig'

import MKEmitter from '@/utils/events.js'
import ElementForm from './elementform'
import DragElement from './dragaction'
import ActionForm from '@/menu/actioncomponent/actionform'
import CreateFunc from '@/templates/zshare/createfunc'
import VerifyCard from '@/templates/zshare/verifycard'
import VerifyPrint from '@/menu/actioncomponent/verifyprint'
import VerifyExcelIn from '@/menu/actioncomponent/verifyexcelin'
import VerifyExcelOut from '@/menu/actioncomponent/verifyexcelout'
import './index.scss'

const { confirm } = Modal

const ActionForm = asyncComponent(() => import('@/menu/actioncomponent/actionform'))
const CreateFunc = asyncComponent(() => import('@/templates/zshare/createfunc'))
const VerifyCard = asyncComponent(() => import('@/templates/zshare/verifycard'))
const VerifyPrint = asyncComponent(() => import('@/menu/actioncomponent/verifyprint'))
const VerifyExcelIn = asyncComponent(() => import('@/menu/actioncomponent/verifyexcelin'))
const VerifyExcelOut = asyncComponent(() => import('@/menu/actioncomponent/verifyexcelout'))

class CardCellComponent extends Component {
  static propTpyes = {
@@ -40,7 +42,7 @@
    elements: null,      // 按钮组
    visible: false,      // 模态框控制
    actvisible: false,   // 按钮编辑模态框
    profVisible: false
    profVisible: false,  // 验证信息编辑
  }

  /**
@@ -57,6 +59,7 @@
  componentDidMount () {
    MKEmitter.addListener('cardAddElement', this.cardAddElement)
    MKEmitter.addListener('submitStyle', this.getStyle)
    MKEmitter.addListener('submitModal', this.handleSave)
  }

  shouldComponentUpdate (nextProps, nextState) {
@@ -79,6 +82,8 @@
      return
    }
    MKEmitter.removeListener('cardAddElement', this.cardAddElement)
    MKEmitter.removeListener('submitStyle', this.getStyle)
    MKEmitter.removeListener('submitModal', this.handleSave)
  }

  cardAddElement = (ids, element) => {
@@ -97,10 +102,9 @@
    const { cards, cardCell } = this.props

    let _style = element.style ? fromJS(element.style).toJS() : {}
    let options = ['font', 'border', 'padding', 'margin']
    let options = ['font', 'border', 'padding', 'margin', 'backgroundColor']

    if (element.eleType === 'button') {
      options.push('background')
      if (element.btnstyle) {
        _style = {..._style, ...element.btnstyle}
      }
@@ -127,7 +131,32 @@

    let _card = fromJS(card).toJS()
    
    if (card.eleType === 'button') { // 拆分style
    if (_card.eleType === 'text' || _card.eleType === 'number' || _card.eleType === 'link') {
      _card.style = style

      let fontSize = 14
      let lineHeight = 1.5
      let line = _card.height || 1

      if (_card.style.fontSize) {
        fontSize = parseInt(_card.style.fontSize)
      }
      if (_card.style.lineHeight) {
        lineHeight = parseFloat(_card.style.lineHeight)
      }

      _card.innerHeight = fontSize * lineHeight * line
    } else if (_card.eleType === 'barcode') {
      _card.style = style

      let fontSize = 14

      if (_card.style.fontSize) {
        fontSize = parseInt(_card.style.fontSize)
      }

      _card.innerHeight = _card.barHeight + (_card.displayValue === 'true' ? fontSize + 2 : 0)
    } else if (_card.eleType === 'button') { // 拆分style
      let _style = fromJS(style).toJS()
      _card.style = {}

@@ -198,13 +227,15 @@
   * @description 元素编辑，获取元素表单信息
   */
  handleElement = (card) => {
    const { cards } = this.props

    if (card.eleType === 'button') {
      this.handleAction(card)
    } else {
      this.setState({
        visible: true,
        card: card,
        formlist: getCardCellForm(card)
        formlist: getCardCellForm(card, cards.type)
      })
    }
  }
@@ -371,16 +402,40 @@
  handleSubmit = () => {
    const { elements } = this.state

    this.elementFormRef.handleConfirm().then(ele => {
    this.elementFormRef.handleConfirm().then(res => {
      let _elements = elements.map(cell => {
        if (cell.uuid === ele.uuid) {
          ele.style = cell.style || {}
          if (ele.eleType === 'splitline' && cell.eleType !== 'splitline') {
            ele.style.paddingTop = '5px'
            ele.style.paddingBottom = '5px'
        if (cell.uuid === res.uuid) {
          res.style = cell.style || {}
          if (res.eleType === 'splitline' && cell.eleType !== 'splitline') {
            res.style.paddingTop = '5px'
            res.style.paddingBottom = '5px'
          } else if (res.eleType === 'text' || res.eleType === 'number' || res.eleType === 'link') {
            let fontSize = 14
            let lineHeight = 1.5
            let line = res.height || 1
      
            if (res.style && res.style.fontSize) {
              fontSize = parseInt(res.style.fontSize)
            }
            if (res.style && res.style.lineHeight) {
              lineHeight = parseFloat(res.style.lineHeight)
            }
            res.innerHeight = fontSize * lineHeight * line

            if (res.eleType === 'link' && !res.style.color) {
              res.style.color = 'rgba(24, 144, 255, 1)'
            }
          } else if (res.eleType === 'barcode') {
            let fontSize = 14
      
            if (res.style && res.style.fontSize) {
              fontSize = parseInt(res.style.fontSize)
            }
      
            res.innerHeight = res.barHeight + (res.displayValue === 'true' ? fontSize + 2 : 0)
          }
          
          return ele
          return res
        }
        return cell
      })
@@ -400,15 +455,13 @@
  handleActionSubmit = () => {
    const { elements } = this.state

    this.actionFormRef.handleConfirm().then(ele => {
    this.actionFormRef.handleConfirm().then(res => {
      let _elements = elements.map(cell => {
        if (cell.uuid === ele.uuid) {
          ele.eleType = 'button'
          ele.style = cell.style || {}
          ele.btnstyle = cell.btnstyle || {}
          return ele
        if (cell.uuid === res.uuid) {
          res = {...cell, ...res}
          delete res.focus
          return res
        }

        return cell
      })

@@ -457,15 +510,12 @@
   * @description 验证信息保存
   */
  verifySubmit = () => {
    const { elements } = this.state
    
    const { elements, card } = this.state

    this.verifyRef.handleConfirm().then(res => {
      console.log(res)
      let _elements = elements.map(cell => {
        if (cell.uuid === res.uuid) {
          res.eleType = 'button'
          res.style = cell.style || {}
          return res
        if (cell.uuid === card.uuid) {
          cell.verify = res
        }

        return cell
@@ -473,10 +523,59 @@

      this.setState({
        elements: _elements,
        actvisible: false
        profVisible: false
      }, () => {
        this.props.updateElement(_elements)
      })
    })
  }

  handleSubConfig = (item) => {
    const { cards } = this.props

    if (item.eleType !== 'button') return
    if (item.OpenType === 'pop') {
      let btn = fromJS(item).toJS()
      if (!btn.modal) {
        btn.modal = {
          setting: {
            title: btn.label,
            width: 60,
            cols: '2',
            container: 'tab',
            focus: '',
            finish: 'close',
            clickouter: 'unclose',
            display: 'modal'
          },
          tables: [],
          groups: [],
          fields: []
        }
      }

      MKEmitter.emit('changeModal', cards, btn)
    }
  }

  handleSave = (_cards, btn, modal) => {
    const { cards } = this.props
    const { elements } = this.state

    if (cards.uuid !== _cards.uuid) return

    let _elements = elements.map(cell => {
      if (cell.uuid === btn.uuid) {
        cell.modal = modal
      }

      return cell
    })

    this.setState({
      elements: _elements
    }, () => {
      this.props.updateElement(_elements)
    })
  }

@@ -492,6 +591,7 @@
          handleMenu={this.handleElement}
          handleStyle={this.handleStyle}
          profileAction={this.profileAction}
          handleSubConfig={this.handleSubConfig}
          deleteMenu={this.deleteElement}
        />
        {/* 编辑按钮：复制、编辑 */}
@@ -552,7 +652,6 @@
        >
          {card && !card.execMode && card.OpenType !== 'excelIn' && card.OpenType !== 'excelOut' ?
            <VerifyCard
              // floor={this.props.type}
              card={card}
              dict={dict}
              config={cards}