2020-12-16

king

2020-12-16 06404e701a89955958cbf56213e2eec618d8644d

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

@@ -8,7 +8,7 @@
import enUS from '@/locales/en-US/model.js'
import asyncComponent from '@/utils/asyncComponent'
import { getCardCellForm } from './formconfig'
import { getActionForm } from '@/menu/actioncomponent/formconfig'
import { getActionForm } from '@/menu/components/share/actioncomponent/formconfig'

import MKEmitter from '@/utils/events.js'
import ElementForm from './elementform'
@@ -17,12 +17,12 @@

const { confirm } = Modal

const ActionForm = asyncComponent(() => import('@/menu/actioncomponent/actionform'))
const ActionForm = asyncComponent(() => import('@/menu/components/share/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'))
const VerifyPrint = asyncComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyprint'))
const VerifyExcelIn = asyncComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyexcelin'))
const VerifyExcelOut = asyncComponent(() => import('@/templates/sharecomponent/actioncomponent/verifyexcelout'))

class CardCellComponent extends Component {
  static propTpyes = {
@@ -65,6 +65,7 @@
  }

  UNSAFE_componentWillReceiveProps(nextProps) {
    const { cards } = this.props
    if (this.props.side !== nextProps.side) {
      this.setState({
        elements: fromJS(nextProps.elements).toJS()
@@ -72,6 +73,10 @@
    } else if (nextProps.elements.length === 0 && this.state.elements.length > 0) {
      this.setState({
        elements: []
      })
    } else if (cards.subtype === 'normaltable' && this.state.elements.length > nextProps.elements.length) { // 表格中按钮移出
      this.setState({
        elements: fromJS(nextProps.elements).toJS()
      })
    }
  }
@@ -133,7 +138,7 @@

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

      let fontSize = 14
@@ -371,7 +376,7 @@
          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') {
          } else if (res.eleType === 'text' || res.eleType === 'number') {
            let fontSize = 14
            let lineHeight = 1.5
            let line = res.height || 1
@@ -384,8 +389,8 @@
            }
            res.innerHeight = fontSize * lineHeight * line

            if (res.eleType === 'link' && !res.style.color) {
              res.style.color = 'rgba(24, 144, 255, 1)'
            if (res.eleType === 'text' && res.link && !res.style.color) {
              res.style.color = '#2440B3'
            }
          } else if (res.eleType === 'barcode') {
            let fontSize = 14
@@ -416,12 +421,26 @@
   */
  handleActionSubmit = () => {
    const { elements } = this.state
    let color = { primary: '#1890ff', yellow: '#c49f47', orange: 'orange', danger: '#ff4d4f', green: '#26C281', dgreen: '#32c5d2', purple: '#8E44AD', cyan: '#13c2c2', gray: '#666666' }

    this.actionFormRef.handleConfirm().then(res => {
      let _elements = elements.map(cell => {
        if (cell.uuid === res.uuid) {
          res = {...cell, ...res}
          delete res.focus
          let btnstyle = {}

          if (res.class !== cell.class || res.show !== cell.show || !res.btnstyle) {
            if (res.show === 'link' || res.show === 'icon') {
              btnstyle.color = color[res.class]
              btnstyle.backgroundColor = 'transparent'
            } else {
              btnstyle.color = '#ffffff'
              btnstyle.backgroundColor = color[res.class]
            }
          }
          res.btnstyle = {...res.btnstyle, ...btnstyle}

          return res
        }
        return cell
@@ -541,6 +560,40 @@
    })
  }

  updateMarks = (card) => {
    const { elements } = this.state

    let _elements = elements.map(cell => {
      if (cell.uuid === card.uuid) return card
      return cell
    })

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

  dropButton = (id) => {
    const { cards } = this.props
    let index = cards.action.findIndex(item => item.uuid === id)

    if (index === -1) return

    let btn = cards.action[index]
    btn.eleType = 'button'

    let _elements = [...this.state.elements, btn]
    let _action = cards.action.filter(item => item.uuid !== id)

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

  render() {
    const { cards } = this.props
    const { elements, visible, actvisible, profVisible, card, dict } = this.state
@@ -549,9 +602,12 @@
      <div className="model-menu-card-cell-list">
        <DragElement
          list={elements}
          fields={cards.columns}
          updateMarks={this.updateMarks}
          handleList={this.handleList}
          handleMenu={this.handleElement}
          handleStyle={this.handleStyle}
          dropButton={this.dropButton}
          profileAction={this.profileAction}
          handleSubConfig={this.handleSubConfig}
          deleteMenu={this.deleteElement}