From 31ec63f0419895876cbaba99637a884a32d33d0d Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 01 九月 2021 10:31:45 +0800 Subject: [PATCH] 2021-09-01 --- src/menu/components/search/main-search/dragsearch/card.jsx | 68 ++++++++++++++++++++------------- 1 files changed, 41 insertions(+), 27 deletions(-) diff --git a/src/menu/components/search/main-search/dragsearch/card.jsx b/src/menu/components/search/main-search/dragsearch/card.jsx index 47a7283..788cdbd 100644 --- a/src/menu/components/search/main-search/dragsearch/card.jsx +++ b/src/menu/components/search/main-search/dragsearch/card.jsx @@ -3,12 +3,16 @@ import { Icon, Select, DatePicker, Input, Popover, Form } from 'antd' import moment from 'moment' +import asyncComponent from '@/utils/asyncComponent' import DateGroup from '../dategroup' import './index.scss' const { MonthPicker, WeekPicker, RangePicker } = DatePicker +const { Search } = Input +const CheckCard = asyncComponent(() => import('@/templates/modalconfig/checkCard')) +const appType = sessionStorage.getItem('appType') -const Card = ({ id, card, moveCard, copyCard, findCard, editCard, delCard }) => { +const Card = ({ id, card, showField, moveCard, copyCard, findCard, editCard, delCard }) => { const originalIndex = findCard(id).index const [{ isDragging }, drag] = useDrag({ item: { type: 'search', id, originalIndex }, @@ -49,10 +53,42 @@ try { let _initval = JSON.parse(card.initval) _defaultValue = [moment().subtract(_initval[0], 'days'), moment().subtract(_initval[1], 'days')] - } catch { + } catch (e) { _defaultValue = [null, null] } } + } + + let formItem = null + if (card.type === 'text') { + if (card.inputType === 'search') { + formItem = (<Search style={{marginTop: '4px'}} placeholder={card.labelShow === 'false' ? card.label : ''} value={card.initval} enterButton />) + } else { + formItem = (<Input style={{marginTop: '4px'}} placeholder={card.labelShow === 'false' ? card.label : ''} value={card.initval} />) + } + } else if (card.type === 'multiselect' || card.type === 'select' || card.type === 'link') { + formItem = (<Select value={_defaultValue}></Select>) + } else if (card.type === 'date' && appType === 'mob') { + formItem = (<div className="mob-list-item">{card.initval ? moment().subtract(card.initval, 'days').format('YYYY-MM-DD') : '璇烽�夋嫨'}<Icon type="right" /></div>) + } else if (card.type === 'datemonth' && appType === 'mob') { + formItem = (<div className="mob-list-item">{card.initval ? moment().subtract(card.initval, 'month').format('YYYY-MM') : '璇烽�夋嫨'}<Icon type="right" /></div>) + } else if (card.type === 'date') { + formItem = (<Input style={{marginTop: '4px'}} placeholder={card.labelShow === 'false' ? card.label : ''} value={card.initval} />) + } else if (card.type === 'dateweek') { + formItem = (<WeekPicker value={card.initval ? moment().subtract(card.initval * 7, 'days') : null} />) + } else if (card.type === 'datemonth') { + formItem = (<MonthPicker value={card.initval ? moment().subtract(card.initval, 'month') : null} />) + } else if (card.type === 'daterange') { + formItem = (<RangePicker + className="data-range" + placeholder={['BeginTime', 'EndTime']} + renderExtraFooter={() => 'extra footer'} + value={_defaultValue} + />) + } else if (card.type === 'group') { + formItem = (<DateGroup card={card} />) + } else if (card.type === 'checkcard') { + formItem = <CheckCard config={card} /> } return ( @@ -63,38 +99,16 @@ <Icon className="close" title="delete" type="close" onClick={() => delCard(id)} /> </div> } trigger="hover"> - <div className={'page-card ' + card.labelShow} style={{ opacity: opacity}}> + <div className={'page-card ' + card.labelShow + ' ' + card.type} style={{ opacity: opacity}}> <div ref={node => drag(drop(node))}> <Form.Item labelCol={{xs: { span: 24 }, sm: { span: 8 }}} wrapperCol = {{xs: { span: 24 }, sm: { span: 16 }}} label={card.labelShow !== 'false' ? card.label : ''} required={card.required === 'true'} + help={showField ? card.field + (card.datefield ? ', ' + card.datefield : '') : ''} > - {card.type === 'text' ? - <Input style={{marginTop: '4px'}} placeholder={card.labelShow === 'false' ? card.label : ''} value={card.initval} /> : null - } - {(card.type === 'multiselect' || card.type === 'select' || card.type === 'link') ? - <Select value={_defaultValue}></Select> : null - } - {card.type === 'date' ? - <DatePicker value={card.initval ? moment().subtract(card.initval, 'days') : null} /> : null - } - {card.type === 'dateweek' ? - <WeekPicker value={card.initval ? moment().subtract(card.initval * 7, 'days') : null} /> : null - } - {card.type === 'datemonth' ? - <MonthPicker value={card.initval ? moment().subtract(card.initval, 'month') : null} /> : null - } - {card.type === 'daterange' ? - <RangePicker - className="data-range" - placeholder={['BeginTime', 'EndTime']} - renderExtraFooter={() => 'extra footer'} - value={_defaultValue} - /> : null - } - {card.type === 'group' ? <DateGroup card={card} /> : null } + {formItem} </Form.Item> </div> </div> -- Gitblit v1.8.0