From d3edd6d592db12fbec67e2700d168e07546aed29 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 15 十一月 2019 09:46:00 +0800
Subject: [PATCH] 2019-11-15
---
src/components/sidemenu/comtableconfig/dragelement/index.jsx | 57 +++++++++++++++++++++++++++++++++++++++------------------
1 files changed, 39 insertions(+), 18 deletions(-)
diff --git a/src/components/sidemenu/comtableconfig/dragelement/index.jsx b/src/components/sidemenu/comtableconfig/dragelement/index.jsx
index 0201b40..c89134c 100644
--- a/src/components/sidemenu/comtableconfig/dragelement/index.jsx
+++ b/src/components/sidemenu/comtableconfig/dragelement/index.jsx
@@ -7,7 +7,7 @@
import ItemTypes from './itemtypes'
import './index.scss'
-const Container = ({list, type, handleList, handleMenu }) => {
+const Container = ({list, type, placeholder, handleList, handleMenu }) => {
let target = null
const [cards, setCards] = useState(list)
const moveCard = (id, atIndex) => {
@@ -97,9 +97,18 @@
target = null
}
})
- // const [, drop] = useDrop({ accept: ItemTypes[type] })
+ let columns = []
+ if (type === 'columns' && cards.length > 12) {
+ let number = Math.ceil(cards.length / Math.ceil(cards.length / 12))
+ for (let i = 0, len = cards.length; i < len; i += number) {
+ columns.push(cards.slice(i, i + number))
+ }
+ } else if (type === 'columns') {
+ columns.push(cards)
+ }
+
return (
- <div ref={drop} className="ant-row" style={type === 'columns' ? {display: 'flex'} : {}}>
+ <div ref={drop} className="ant-row">
{type === 'action' && cards.map(card => (
<Card
key={card.uuid}
@@ -127,21 +136,33 @@
</Col>
))}
{type === 'columns' && cards.length > 0 &&
- <div className="page-card" style={{flex: 60}}>
- <span className="ant-checkbox-inner"></span>
- </div>}
- {type === 'columns' && cards.map(card => (
- <Card
- key={card.uuid}
- id={`${card.id}`}
- type={type}
- card={card}
- moveCard={moveCard}
- editCard={editCard}
- findCard={findCard}
- hasDrop={hasDrop}
- />
- ))}
+ columns.map((column, i) => (
+ <div key={i} className="column-box">
+ {i === 0 &&
+ <div className="page-card" style={{flex: 60}}>
+ <span className="ant-checkbox-inner"></span>
+ </div>
+ }
+ {column.map(card => (
+ <Card
+ key={card.uuid}
+ id={`${card.id}`}
+ type={type}
+ card={card}
+ moveCard={moveCard}
+ editCard={editCard}
+ findCard={findCard}
+ hasDrop={hasDrop}
+ />
+ ))}
+ </div>
+ ))
+ }
+ {cards.length === 0 &&
+ <div className="common-drawarea-placeholder">
+ {placeholder}
+ </div>
+ }
</div>
)
}
--
Gitblit v1.8.0