From b68697ccdce3f7de67c3a918701c814497b6b41a Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 12 十一月 2019 22:05:24 +0800
Subject: [PATCH] 2019-11-12
---
src/components/sidemenu/comtableconfig/dragelement/card.jsx | 42 +++++++++++++++++++++++++++++++++---------
1 files changed, 33 insertions(+), 9 deletions(-)
diff --git a/src/components/sidemenu/comtableconfig/dragelement/card.jsx b/src/components/sidemenu/comtableconfig/dragelement/card.jsx
index a470607..a155017 100644
--- a/src/components/sidemenu/comtableconfig/dragelement/card.jsx
+++ b/src/components/sidemenu/comtableconfig/dragelement/card.jsx
@@ -1,19 +1,20 @@
import React from 'react'
import { useDrag, useDrop } from 'react-dnd'
-import { Icon, Button } from 'antd'
+import { Icon, Button, Select, DatePicker } from 'antd'
+import moment from 'moment'
import ItemTypes from './itemtypes'
import './index.scss'
const Card = ({ id, type, card, moveCard, findCard, editCard }) => {
const originalIndex = findCard(id).index
const [{ isDragging }, drag] = useDrag({
- item: { type: ItemTypes.CARD, id, originalIndex },
+ item: { type: ItemTypes[type], id, originalIndex },
collect: monitor => ({
isDragging: monitor.isDragging(),
}),
})
const [, drop] = useDrop({
- accept: ItemTypes.CARD,
+ accept: ItemTypes[type],
canDrop: () => false,
hover({ id: draggedId }) {
if (draggedId !== id) {
@@ -29,18 +30,30 @@
}
return (
- <div className="page-card" style={{ opacity }}>
+ <div className="page-card" style={type === 'columns' ? { flex: card.Width, opacity: opacity} : { opacity: opacity}}>
<div ref={node => drag(drop(node))}>
{type === 'search' && <div className="ant-row ant-form-item">
<div className="ant-col ant-form-item-label">
<label title={card.label}>{card.label}</label>
</div>
<div className="ant-col ant-form-item-control-wrapper">
- <div className="ant-form-item-control">
- <span className="ant-form-item-children">
- <input placeholder="" autoComplete="off" type="text" readOnly={true} className="ant-input" />
- </span>
- </div>
+ {card.type === 'text' &&
+ <div className="ant-form-item-control">
+ <span className="ant-form-item-children">
+ <input placeholder="" autoComplete="off" type="text" readOnly={true} className="ant-input" />
+ </span>
+ </div>
+ }
+ {card.type === 'select' &&
+ <Select defaultValue="lucy"></Select>
+ }
+ {card.type === 'dateday' &&
+ <DatePicker defaultValue={card.initval ? moment(card.initval, 'YYYY-MM-DD') : null} />
+ }
+ {card.type === 'datetime' &&
+ <DatePicker showTime defaultValue={card.initval ? moment(card.initval, 'YYYY-MM-DD HH:mm:ss') : null} />
+ }
+ <div className="input-mask"></div>
</div>
</div>}
{type === 'action' &&
@@ -50,6 +63,17 @@
key={card.uuid}
>{card.label}</Button>
}
+ {type === 'columns' &&
+ <span className="ant-table-header-column">
+ <div className="ant-table-column-sorters" style={{textAlign: card.Align}}>
+ <span className="ant-table-column-title">{card.label}</span>
+ {card.IsSort === 'true' && <span className="ant-table-column-sorter">
+ <Icon type="caret-up" />
+ <Icon type="caret-down" />
+ </span>}
+ </div>
+ </span>
+ }
</div>
<Icon className="edit" type="edit" onClick={edit} />
</div>
--
Gitblit v1.8.0