2022-09-06

king

2022-09-06 b8e1395f02c929eaa96b949cf6027ee2a43856a6

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

@@ -2,13 +2,13 @@
import { useDrop } from 'react-dnd'
import { is, fromJS } from 'immutable'
import update from 'immutability-helper'
import { Icon } from 'antd'

import Utils from '@/utils/utils.js'
import Card from './card'
import Utils from '@/utils/utils.js'
import Action from './action'
import './index.scss'

const Container = ({type, list, handleList, handleMenu, deleteMenu }) => {
const Container = ({list, parent, fields, handleList, handleMenu, deleteMenu, profileAction, handleStyle, updateMarks, dropButton, handleSubConfig }) => {
  const [cards, setCards] = useState(list)
  const moveCard = (id, atIndex) => {
    const { card, index } = findCard(id)
@@ -33,56 +33,130 @@
    handleMenu(card)
  }

  const copyCard = id => {
    const { card } = findCard(id)
    let copycard = fromJS(card).toJS()
    let _cards = fromJS(cards).toJS()

    if (card.eleType === 'button') {
      copycard.copyType = 'action'
    } else {
      copycard.copyType = 'customCardElement'
    }
    copycard.focus = true

    let _val = fromJS(copycard).toJS()

    if (_val.control) {
      delete _val.controlField
      delete _val.controlVal
    }

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

    try {
      delete _val.$srcId
    
      let srcid = localStorage.getItem(window.location.href.split('#')[0] + 'srcId')
      if (srcid) {
        _val.$srcId = srcid
      }
      
      _val = window.btoa(window.encodeURIComponent(JSON.stringify(_val)))
    } catch (e) {
      console.warn('Stringify Failure')
      _val = ''
    }

    if (_val) {
      let oInput = document.createElement('input')
      oInput.value = _val
      document.body.appendChild(oInput)
      oInput.select()
      document.execCommand('Copy')
      document.body.removeChild(oInput)
    }

    _cards.push(copycard)

    handleList(_cards)
    handleMenu(copycard)
  }

  const changeStyle = id => {
    const { card } = findCard(id)
    handleStyle(card)
  }

  const profileCard = id => {
    const { card } = findCard(id)
    profileAction(card)
  }

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

    if (card.eleType !== 'button') {
      return
    }
    
    handleSubConfig(card)
  }

  const delCard = id => {
    const { card } = findCard(id)
    deleteMenu(card)
  }

  let cardIds = cards.map(card => card.uuid)

  const [, drop] = useDrop({
    accept: 'action',
    drop() {}
    drop(item) {
      const { index } = findCard(item.id)
      if (index > -1) return
      dropButton(item.id)
    }
  })

  const addelement = () => {
    let newcard = {}
    newcard.uuid = Utils.getuuid()
    newcard.focus = true
    
    newcard.eleType = 'text'
    newcard.datatype = 'dynamic'
    newcard.color = 'rgba(0,0,0,0.85)'
    newcard.padding = '5px'
    newcard.align = 'left'

    let targetId = cards.length > 0 ? cards[cards.length - 1].uuid : 0

    const { index: overIndex } = findCard(`${targetId}`)
    let targetIndex = overIndex

    targetIndex++

    const _cards = update(cards, { $splice: [[targetIndex, 0, newcard]] })

    handleList(_cards, newcard)
  }

  return (
    <div ref={drop} className="ant-row card-detail-row">
      {cards.map(card => (
        <Card
          id={card.uuid}
          key={card.uuid}
          cardIds={cardIds}
          card={card}
          moveCard={moveCard}
          editCard={editCard}
          delCard={delCard}
          findCard={findCard}
        />
      ))}
      <Icon type="plus" title="添加元素" onClick={addelement}/>
      {cards.map(card => {
        if (card.eleType === 'button') {
          return (
            <Action
              id={card.uuid}
              key={card.uuid}
              card={card}
              parent={parent}
              copyCard={copyCard}
              moveCard={moveCard}
              editCard={editCard}
              changeStyle={changeStyle}
              profileCard={profileCard}
              doubleClickCard={doubleClickCard}
              delCard={delCard}
              findCard={findCard}
            />
          )
        } else {
          return (
            <Card
              id={card.uuid}
              key={card.uuid}
              card={card}
              parent={parent}
              fields={fields}
              moveCard={moveCard}
              copyCard={copyCard}
              editCard={editCard}
              updateMarks={updateMarks}
              changeStyle={changeStyle}
              delCard={delCard}
              findCard={findCard}
            />
          )
        }
      })}
    </div>
  )
}