2021-12-20

king

2021-12-20 e6a10ced1ed8db39486dc0a1795191c701ef3224

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

@@ -8,15 +8,14 @@
import { resetStyle } from '@/utils/utils-custom.js'
import MKEmitter from '@/utils/events.js'
import Utils from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import getWrapForm from '../data-card/options'
import './index.scss'

const SettingComponent = asyncIconComponent(() => import('@/menu/datasource'))
const WrapComponent = asyncIconComponent(() => import('../data-card/wrapsetting'))
const NormalForm = asyncIconComponent(() => import('@/components/normalform'))
const CardComponent = asyncComponent(() => import('../cardcomponent'))
const CopyComponent = asyncIconComponent(() => import('@/menu/components/share/copycomponent'))
const PasteComponent = asyncIconComponent(() => import('@/menu/components/share/pastecomponent'))
const PasteComponent = asyncIconComponent(() => import('@/components/paste'))
const LogComponent = asyncIconComponent(() => import('@/menu/components/share/logcomponent'))
const UserComponent = asyncIconComponent(() => import('@/menu/components/share/usercomponent'))
const ClockComponent = asyncIconComponent(() => import('@/menu/components/share/clockcomponent'))
@@ -32,7 +31,6 @@
  }

  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
    appType: sessionStorage.getItem('appType'),
    card: null,
    back: false
@@ -84,6 +82,10 @@
        _card.wrap.name = card.name
        _card.style = config.style
        _card.headerStyle = config.headerStyle

        _card.setting = config.setting
        _card.columns = config.columns
        _card.scripts = config.scripts

        _card.subcards = config.subcards.map(scard => {
          scard.uuid = Utils.getuuid()
@@ -238,7 +240,7 @@
  changeStyle = () => {
    const { card } = this.state

    MKEmitter.emit('changeStyle', [card.uuid], ['background', 'border', 'padding', 'margin'], card.style)
    MKEmitter.emit('changeStyle', [card.uuid], ['background', 'border', 'padding', 'margin', 'shadow'], card.style)
  }

  getStyle = (comIds, style) => {
@@ -255,33 +257,38 @@
    this.props.updateConfig(_card)
  }

  addCard = () => {
  addCard = (copy) => {
    let card = fromJS(this.state.card).toJS()
    let newcard = {}

    let newcard = {
      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.subcards.length > 0) {
      newcard = fromJS(card.subcards.slice(-1)[0]).toJS()
      newcard.uuid = Utils.getuuid()
      newcard.elements = newcard.elements.map(elem => {
        elem.uuid = Utils.getuuid()
        return elem
      })
      newcard.backElements = newcard.backElements.map(elem => {
        elem.uuid = Utils.getuuid()
        return elem
      })
    if (copy) { // 粘贴
      newcard = copy
    } else {
      newcard = {
        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.subcards.length > 0) {
        newcard = fromJS(card.subcards.slice(-1)[0]).toJS()
        newcard.uuid = Utils.getuuid()
        newcard.elements = newcard.elements.map(elem => {
          elem.uuid = Utils.getuuid()
          return elem
        })
        newcard.backElements = newcard.backElements.map(elem => {
          elem.uuid = Utils.getuuid()
          return elem
        })
      }
    }

    card.subcards.push(newcard)
@@ -359,6 +366,93 @@
    this.props.updateConfig(card)
  }

  pasteComponent = (res, resolve) => {
    const { appType } = this.state

    delete res.copyType
    delete res.$cardType

    res.uuid = Utils.getuuid()
    res.setting = res.setting || {}
    res.setting.width = res.setting.width || 6

    let copyBtns = []
    let mobtypes = ['pop', 'prompt', 'exec', 'innerpage']

    let elements = []
    res.elements && res.elements.forEach(cell => {
      if (cell.eleType !== 'button') {
        cell.uuid = Utils.getuuid()
        elements.push(cell)
      } else if (appType === 'mob' && !mobtypes.includes(cell.OpenType)) {
        return
      } else {
        let _uuid = Utils.getuuid()

        if (cell.OpenType === 'popview') {
          let _cell = fromJS(cell).toJS()
          _cell.$originUuid = _cell.uuid
          _cell.uuid = _uuid
          copyBtns.push(_cell)
        }

        cell.uuid = _uuid
        elements.push(cell)
      }
    })

    res.elements = elements

    let backElements = []

    if (appType !== 'mob') {
      res.backElements && res.backElements.forEach(cell => {
        if (cell.eleType !== 'button') {
          cell.uuid = Utils.getuuid()
          backElements.push(cell)
        } else if (appType === 'mob' && !mobtypes.includes(cell.OpenType)) {
          return
        } else {
          let _uuid = Utils.getuuid()

          if (cell.OpenType === 'popview') {
            let _cell = fromJS(cell).toJS()
            _cell.$originUuid = _cell.uuid
            _cell.uuid = _uuid
            copyBtns.push(_cell)
          }

          cell.uuid = _uuid
          backElements.push(cell)
        }
      })
    }

    res.backElements = backElements

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

    resolve({status: true})

    this.addCard(res)
  }

  getWrapForms = () => {
    const { card } = this.state
    return getWrapForm(card.wrap, card.subtype, card.columns, card.uuid)
  }

  updateWrap = (res) => {
    let _card = {...this.state.card, wrap: res}

    if (res.supModule && res.supModule.length > 0) {
      _card.setting.supModule = res.supModule
    }
    this.updateComponent(_card)
  }

  clickComponent = (e) => {
    if (sessionStorage.getItem('style-control') === 'true' || sessionStorage.getItem('style-control') === 'component') {
      e.stopPropagation()
@@ -385,13 +479,15 @@

    return (
      <div className="menu-prop-card-edit-box" style={_style} onClick={this.clickComponent} id={card.uuid}>
        <NormalHeader defaultshow="hidden" config={card} updateComponent={this.updateComponent}/>
        <NormalHeader config={card} updateComponent={this.updateComponent}/>
        <Popover overlayClassName="mk-popover-control-wrap" mouseLeaveDelay={0.2} mouseEnterDelay={0.2} content={
          <div className="mk-popover-control">
            <Icon className="plus" title="添加卡片" onClick={this.addCard} type="plus" />
            <WrapComponent config={card} updateConfig={this.updateComponent} />
            <Icon className="plus" title="添加卡片" onClick={() => this.addCard()} type="plus" />
            <NormalForm title="属性卡设置" width={800} update={this.updateWrap} getForms={this.getWrapForms}>
              <Icon type="edit" style={{color: '#1890ff'}} title="编辑"/>
            </NormalForm>
            <CopyComponent type="propcard" card={card}/>
            <PasteComponent config={card} options={['cardcell']} updateConfig={this.updateComponent} />
            <PasteComponent options={['cardcell']} updateConfig={this.pasteComponent} />
            <Icon className="style" title="调整样式" onClick={this.changeStyle} type="font-colors" />
            <LogComponent btnlog={card.btnlog || []} handlelog={this.handleLog} />
            <ClockComponent config={card} updateConfig={this.updateComponent}/>