| | |
| | | import update from 'immutability-helper' |
| | | |
| | | import Card from './card' |
| | | import Utils from '@/utils/utils.js' |
| | | import Action from './action' |
| | | import './index.scss' |
| | | |
| | | const Container = ({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) |
| | |
| | | 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) |
| | | } |
| | | }) |
| | | |
| | | 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} |
| | | /> |
| | | ))} |
| | | {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> |
| | | ) |
| | | } |