From 2cb65d99c9aebf8293cb2838fcfe3e09fb2739ce Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 06 十二月 2019 00:15:12 +0800
Subject: [PATCH] 2019-12-06
---
src/templates/modalconfig/dragelement/card.jsx | 44 +++++++++++++++++---------------------------
1 files changed, 17 insertions(+), 27 deletions(-)
diff --git a/src/templates/modalconfig/dragelement/card.jsx b/src/templates/modalconfig/dragelement/card.jsx
index 3955e21..0052895 100644
--- a/src/templates/modalconfig/dragelement/card.jsx
+++ b/src/templates/modalconfig/dragelement/card.jsx
@@ -1,20 +1,22 @@
import React from 'react'
import { useDrag, useDrop } from 'react-dnd'
-import { Icon, Button, Select, DatePicker, Input } from 'antd'
+import { Icon, Select, DatePicker, Input } from 'antd'
import moment from 'moment'
import ItemTypes from './itemtypes'
import './index.scss'
-const Card = ({ id, type, card, moveCard, findCard, editCard, copyCard, hasDrop }) => {
+const { MonthPicker } = DatePicker
+
+const Card = ({ id, card, moveCard, findCard, editCard, closeCard, hasDrop }) => {
const originalIndex = findCard(id).index
const [{ isDragging }, drag] = useDrag({
- item: { type: ItemTypes[type], id, originalIndex },
+ item: { type: ItemTypes.form, id, originalIndex },
collect: monitor => ({
isDragging: monitor.isDragging(),
}),
})
const [, drop] = useDrop({
- accept: ItemTypes[type],
+ accept: ItemTypes.form,
canDrop: () => true,
drop: (item) => {
if (!item.hasOwnProperty('originalIndex')) {
@@ -35,19 +37,22 @@
editCard(id)
}
- const copy = () => {
- copyCard(id)
+ const close = () => {
+ closeCard(id)
}
return (
- <div className="page-card" style={type === 'columns' ? { flex: card.Width, opacity: opacity} : { opacity: opacity}}>
+ <div className="page-card" style={{ opacity: opacity}}>
<div ref={node => drag(drop(node))}>
- {type === 'search' && <div className="ant-row ant-form-item">
+ {<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">
{card.type === 'text' &&
+ <Input style={{marginTop: '4px'}} defaultValue={card.initval} />
+ }
+ {card.type === 'number' &&
<Input style={{marginTop: '4px'}} defaultValue={card.initval} />
}
{(card.type === 'select' || card.type === 'link') &&
@@ -56,33 +61,18 @@
{card.type === 'date' &&
<DatePicker defaultValue={card.initval ? moment(card.initval, 'YYYY-MM-DD') : null} />
}
+ {card.type === 'datemonth' ?
+ <MonthPicker defaultValue={card.initval ? moment().subtract(card.initval, 'month') : null} /> : 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' &&
- <Button
- className={'mk-btn mk-' + card.class}
- icon={card.icon}
- key={card.uuid}
- >{card.label}</Button>
- }
- {type === 'columns' &&
- <span className="ant-table-header-column">
- <div className="ant-table-column-sorters" title={card.label} 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} />
- {type === 'action' && <Icon className="edit copy" type="copy" onClick={copy} />}
+ <Icon className="edit close" type="close" onClick={close} />
</div>
)
}
--
Gitblit v1.8.0