From 29432c9167e3fcdf83f35d0bb9dbe9acb7c7ffbf Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期二, 22 六月 2021 14:35:23 +0800
Subject: [PATCH] 2021-06-22
---
src/templates/modalconfig/dragelement/card.jsx | 64 +++++++++++++-------------------
1 files changed, 26 insertions(+), 38 deletions(-)
diff --git a/src/templates/modalconfig/dragelement/card.jsx b/src/templates/modalconfig/dragelement/card.jsx
index 75afee1..f5ad414 100644
--- a/src/templates/modalconfig/dragelement/card.jsx
+++ b/src/templates/modalconfig/dragelement/card.jsx
@@ -1,6 +1,6 @@
import React from 'react'
import { useDrag, useDrop } from 'react-dnd'
-import { Icon, Select, DatePicker, Input, InputNumber, Button, Popover, Switch, Radio, Checkbox } from 'antd'
+import { Icon, Select, DatePicker, Input, InputNumber, Button, Popover, Switch, Radio, Checkbox, Form } from 'antd'
import moment from 'moment'
import asyncComponent from '@/utils/asyncComponent'
@@ -13,7 +13,7 @@
const ColorSketch = asyncComponent(() => import('@/mob/colorsketch'))
const CheckCard = asyncComponent(() => import('../checkCard'))
-const Card = ({ id, card, cols, moveCard, findCard, editCard, closeCard, copyCard, showField }) => {
+const Card = ({ id, card, moveCard, findCard, editCard, closeCard, copyCard, showField }) => {
const originalIndex = findCard(id).index
const [{ isDragging }, drag] = useDrag({
item: { type: 'form', id, originalIndex },
@@ -60,29 +60,6 @@
}
} else if (card.setAll === 'true') {
selectval = card.emptyText || '绌�'
- }
- }
- let labelCol = 'ant-col-sm-8'
- let wrapCol = 'ant-col-sm-16'
- let isEntireLine = false
-
- if (card.entireLine === 'true' || ['textarea', 'hint', 'checkcard', 'brafteditor'].includes(card.type)) {
- isEntireLine = true
- }
-
- if (isEntireLine) {
- if (cols === '2') {
- labelCol = 'ant-col-sm-4'
- wrapCol = 'ant-col-sm-20'
- } else if (cols === '3') {
- labelCol = 'ant-col-cuslabel'
- wrapCol = 'ant-col-cuswrap'
- } else if (cols === '4') {
- labelCol = 'ant-col-sm-2'
- wrapCol = 'ant-col-sm-22'
- }
- if (card.hidelabel === 'true') {
- wrapCol = 'ant-col-sm-24'
}
}
@@ -133,9 +110,19 @@
<Checkbox value="D">D</Checkbox>
</Checkbox.Group>)
} else if (card.type === 'hint') {
- formItem = <div style={{marginTop: '10px', color: 'rgba(0, 0, 0, 0.85)'}}>{card.message}</div>
+ formItem = <div style={{marginTop: '10px', color: 'rgba(0, 0, 0, 0.85)', lineHeight: '1.5'}}>{card.message}</div>
+ } else if (card.type === 'split') {
+ formItem = <div className="split-line">{card.label}</div>
} else if (card.type === 'checkcard') {
- formItem = <CheckCard width={card.width} ratio={card.ratio} display={card.display} fields={card.fields} options={card.options} />
+ formItem = <CheckCard config={card} />
+ }
+
+ let _label = card.label
+ if (card.tooltip) {
+ _label = <span><Icon type="question-circle" />{card.label}</span>
+ }
+ if (card.type === 'brafteditor' && card.hidelabel === 'true') {
+ _label = null
}
return (
@@ -148,17 +135,18 @@
} trigger="hover">
<div className="page-card" style={{ opacity: opacity}}>
<div ref={node => drag(drop(node))}>
- {<div className="ant-row ant-form-item">
- {card.hidelabel !== 'true' ? <div className={'ant-col ant-form-item-label ant-col-xs-24 ' + labelCol}>
- {card.label ? <label className={card.required === 'true' ? 'required' : ''}>{card.tooltip ?
- <Icon type="question-circle" /> : null}
- {card.label}</label> : null}
- </div> : null}
- <div className={'ant-col ant-form-item-control-wrapper ant-col-xs-24 ' + wrapCol}>
- {formItem}
- {showField ? card.field : ''}
- </div>
- </div>}
+ {card.type === 'split' ? formItem : <Form.Item
+ className="ant-form-item"
+ colon={!!_label}
+ label={_label}
+ required={card.required === 'true'}
+ extra={card.extra || null}
+ labelCol={card.labelwidth ? {style: {width: card.labelwidth + '%'}} : null}
+ wrapperCol={card.labelwidth ? {style: {width: (100 - card.labelwidth) + '%'}} : null}
+ >
+ {formItem}
+ {showField ? <div className="field-name">{card.field}{card.hidden === 'true' ? '(闅愯棌)' : ''}</div> : ''}
+ </Form.Item>}
</div>
</div>
</Popover>
--
Gitblit v1.8.0