From cf804e19634ff953bb132af1b2f46905d80c1e3a Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 12 五月 2021 15:08:34 +0800
Subject: [PATCH] 2021-05-12
---
src/templates/sharecomponent/settingcomponent/settingform/datasource/index.scss | 3
src/tabviews/custom/components/card/prop-card/index.jsx | 2
src/templates/zshare/editTable/index.jsx | 2
src/assets/css/viewstyle.scss | 10
src/menu/components/card/cardcomponent/settingform/index.jsx | 18
src/menu/components/search/main-search/wrapsetting/settingform/index.jsx | 12
src/tabviews/zshare/dategroup/index.jsx | 43 -
src/tabviews/zshare/topSearch/index.jsx | 480 ++++++++++++++++++--------
src/templates/zshare/formconfig.jsx | 27
src/templates/sharecomponent/settingcomponent/settingform/datasource/index.jsx | 14
src/tabviews/custom/components/table/normal-table/index.jsx | 4
src/tabviews/calendar/index.jsx | 4
src/tabviews/custom/components/carousel/data-card/index.jsx | 2
src/tabviews/zshare/topSearch/index.scss | 29 +
src/menu/components/table/normal-table/wrapsetting/settingform/index.jsx | 12
src/tabviews/subtable/index.jsx | 2
src/tabviews/subtabtable/index.jsx | 2
src/tabviews/commontable/index.jsx | 2
src/tabviews/zshare/topSearch/advanceform/index.scss | 28 +
src/templates/sharecomponent/settingcalcomponent/verifycard/settingform/index.jsx | 14
src/tabviews/zshare/topSearch/advanceform/index.jsx | 286 +++++++++++++++
src/tabviews/custom/components/card/data-card/index.jsx | 4
src/templates/sharecomponent/searchcomponent/searchform/index.jsx | 77 +--
23 files changed, 812 insertions(+), 265 deletions(-)
diff --git a/src/assets/css/viewstyle.scss b/src/assets/css/viewstyle.scss
index 56a1d37..ee22ba5 100644
--- a/src/assets/css/viewstyle.scss
+++ b/src/assets/css/viewstyle.scss
@@ -205,7 +205,7 @@
.top-search {
>.ant-row {
.ant-col.search-button {
- .ant-btn:not(.ant-btn-primary):active, .ant-btn:not(.ant-btn-primary).active, .ant-btn:not(.ant-btn-primary):hover, .ant-btn:not(.ant-btn-primary):focus {
+ .ant-btn:not(.ant-btn-primary):not(.ant-btn-link):active, .ant-btn:not(.ant-btn-primary):not(.ant-btn-link).active, .ant-btn:not(.ant-btn-primary):not(.ant-btn-link):hover, .ant-btn:not(.ant-btn-primary):not(.ant-btn-link):focus {
color: $color7;
border-color: $color7;
}
@@ -213,6 +213,14 @@
background-color: $color6;
border-color: $color6;
}
+ .ant-btn-link {
+ color: $color6;
+ }
+ }
+ }
+ .advanced-list {
+ .advance-value {
+ color: $color6;
}
}
}
diff --git a/src/menu/components/card/cardcomponent/settingform/index.jsx b/src/menu/components/card/cardcomponent/settingform/index.jsx
index 738bd50..393b797 100644
--- a/src/menu/components/card/cardcomponent/settingform/index.jsx
+++ b/src/menu/components/card/cardcomponent/settingform/index.jsx
@@ -17,15 +17,15 @@
state = {
type: this.props.setting.type || 'simple',
click: this.props.setting.click || '',
- isApp: sessionStorage.getItem('appType') === 'pc',
+ appType: sessionStorage.getItem('appType'),
menulist: []
}
UNSAFE_componentWillMount() {
- const { isApp } = this.state
+ const { appType } = this.state
let menulist = null
- if (isApp) {
+ if (appType) {
menulist = sessionStorage.getItem('appMenus')
} else {
menulist = sessionStorage.getItem('fstMenuList')
@@ -67,7 +67,7 @@
render() {
const { setting, cards } = this.props
const { getFieldDecorator } = this.props.form
- const { menulist, click, isApp } = this.state
+ const { menulist, click, appType } = this.state
const formItemLayout = {
labelCol: {
@@ -102,7 +102,7 @@
})(<InputNumber min={1} max={24} precision={0} onPressEnter={this.handleSubmit}/>)}
</Form.Item>
</Col>
- <Col span={12}>
+ {appType !== 'mob' ? <Col span={12}>
<Form.Item label={
<Tooltip placement="topLeft" title="閫夋嫨澶嶅紡鍗℃椂锛屽彲閰嶇疆榧犳爣鎮诞鏃剁殑鏄剧ず淇℃伅銆�">
<Icon type="question-circle" />
@@ -118,7 +118,7 @@
</Radio.Group>
)}
</Form.Item>
- </Col>
+ </Col> : null}
{this.state.type === 'multi' ? <Col span={12}>
<Form.Item label={
<Tooltip placement="topLeft" title="澶嶅紡鍗＄墖榧犳爣鎮诞淇℃伅鐨勫姩鐢绘晥鏋溿��">
@@ -167,7 +167,7 @@
)}
</Form.Item>
</Col>
- {!isApp && click === 'menu' ? <Col span={12}>
+ {!appType && click === 'menu' ? <Col span={12}>
<Form.Item label="鑿滃崟">
{getFieldDecorator('menu', {
initialValue: setting.menu || [],
@@ -182,7 +182,7 @@
)}
</Form.Item>
</Col> : null}
- {isApp && click === 'menu' ? <Col span={12}>
+ {appType && click === 'menu' ? <Col span={12}>
<Form.Item label="鍏宠仈鑿滃崟">
{getFieldDecorator('menu', {
initialValue: setting.menu || '',
@@ -217,7 +217,7 @@
})( <TextArea rows={2}/> )}
</Form.Item>
</Col> : null}
- {isApp ? <Col span={12}>
+ {appType === 'pc' ? <Col span={12}>
<Form.Item label="鎵撳紑鏂瑰紡">
{getFieldDecorator('open', {
initialValue: setting.open || 'blank'
diff --git a/src/menu/components/search/main-search/wrapsetting/settingform/index.jsx b/src/menu/components/search/main-search/wrapsetting/settingform/index.jsx
index 9d728db..ad6f0ff 100644
--- a/src/menu/components/search/main-search/wrapsetting/settingform/index.jsx
+++ b/src/menu/components/search/main-search/wrapsetting/settingform/index.jsx
@@ -110,6 +110,18 @@
</Col>
<Col span={12}>
<Form.Item label={
+ <Tooltip placement="topLeft" title="楂樼骇鎼滅储寮圭獥鐨勫搴︼紝娉細褰撳搴﹀�煎皬浜�100鏃惰〃绀哄崰绐楀彛鐨勭櫨鍒嗘瘮锛屽ぇ浜�100鏃惰〃绀哄搴︾殑缁濆鍊笺��">
+ <Icon type="question-circle" />
+ 楂樼骇鎼滅储
+ </Tooltip>
+ }>
+ {getFieldDecorator('advanceWidth', {
+ initialValue: wrap.advanceWidth || 1000
+ })(<InputNumber min={10} max={3000} precision={0}/>)}
+ </Form.Item>
+ </Col>
+ <Col span={12}>
+ <Form.Item label={
<Tooltip placement="topLeft" title="鍙冲榻愭椂锛岄殣钘忔悳绱㈡寜閽��">
<Icon type="question-circle" />
瀵归綈
diff --git a/src/menu/components/table/normal-table/wrapsetting/settingform/index.jsx b/src/menu/components/table/normal-table/wrapsetting/settingform/index.jsx
index b811a4e..106e56d 100644
--- a/src/menu/components/table/normal-table/wrapsetting/settingform/index.jsx
+++ b/src/menu/components/table/normal-table/wrapsetting/settingform/index.jsx
@@ -215,6 +215,18 @@
</Col>
<Col span={12}>
<Form.Item label={
+ <Tooltip placement="topLeft" title="楂樼骇鎼滅储寮圭獥鐨勫搴︼紝娉細褰撳搴﹀�煎皬浜�100鏃惰〃绀哄崰绐楀彛鐨勭櫨鍒嗘瘮锛屽ぇ浜�100鏃惰〃绀哄搴︾殑缁濆鍊笺��">
+ <Icon type="question-circle" />
+ 楂樼骇鎼滅储
+ </Tooltip>
+ }>
+ {getFieldDecorator('advanceWidth', {
+ initialValue: wrap.advanceWidth || 1000
+ })(<InputNumber min={10} max={3000} precision={0} onPressEnter={this.handleSubmit}/>)}
+ </Form.Item>
+ </Col>
+ <Col span={12}>
+ <Form.Item label={
<Tooltip placement="topLeft" title="鍙屽嚮琛ㄦ牸涓锛岃Е鍙戠殑鎸夐挳銆�">
<Icon type="question-circle" />
鍙屽嚮浜嬩欢
diff --git a/src/tabviews/calendar/index.jsx b/src/tabviews/calendar/index.jsx
index a9bf2a5..54acf75 100644
--- a/src/tabviews/calendar/index.jsx
+++ b/src/tabviews/calendar/index.jsx
@@ -515,13 +515,13 @@
render() {
const { menuType } = this.props
- const { BID, searchlist, loadingview, viewlost, config, loading, data, triggerTime } = this.state
+ const { BID, setting, searchlist, loadingview, viewlost, config, loading, data, triggerTime } = this.state
return (
<div className="calendar-page" id={this.state.ContainerId}>
{loadingview && <Spin size="large" />}
{searchlist && searchlist.length > 0 ?
- <MainSearch BID={BID} searchlist={searchlist} menuType={menuType} refreshdata={this.refreshbysearch}/> : null
+ <MainSearch BID={BID} searchlist={searchlist} setting={setting} menuType={menuType} refreshdata={this.refreshbysearch}/> : null
}
{config && config.calendar ? <CalendarComponent calendar={config.calendar} loading={loading} data={data} triggerDate={this.triggerDate} changeDate={this.changeDate}/> : null}
{menuType !== 'HS' ? <PagemsgComponent menu={{MenuName: this.props.MenuName, MenuNo: this.props.MenuNo}} config={config} dict={this.state.dict} /> : null}
diff --git a/src/tabviews/commontable/index.jsx b/src/tabviews/commontable/index.jsx
index e12bba7..46c6f02 100644
--- a/src/tabviews/commontable/index.jsx
+++ b/src/tabviews/commontable/index.jsx
@@ -1048,7 +1048,7 @@
<div className="commontable" id={this.state.ContainerId}>
{loadingview ? <Spin size="large" /> : null}
{searchlist && searchlist.length ?
- <MainSearch BID={BID} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
+ <MainSearch BID={BID} searchlist={searchlist} setting={setting} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
}
{setting ? <Row className="chart-view" gutter={16}>
{/* 瑙嗗浘缁� */}
diff --git a/src/tabviews/custom/components/card/data-card/index.jsx b/src/tabviews/custom/components/card/data-card/index.jsx
index 9d6a752..9d2542e 100644
--- a/src/tabviews/custom/components/card/data-card/index.jsx
+++ b/src/tabviews/custom/components/card/data-card/index.jsx
@@ -131,7 +131,7 @@
this.setState({sync: false, data: _data})
} else if (nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) {
if (config.setting.syncRefresh === 'true') {
- this.setState({}, () => {
+ this.setState({pageIndex: 1}, () => {
this.loadData()
})
}
@@ -541,7 +541,7 @@
}
return (
- <div className="custom-data-card-box" style={{...config.style, minHeight: config.wrap.minHeight}}>
+ <div className="custom-data-card-box" style={config.style}>
{loading ?
<div className="loading-mask">
{data ? <div className="ant-spin-blur"></div> : null}
diff --git a/src/tabviews/custom/components/card/prop-card/index.jsx b/src/tabviews/custom/components/card/prop-card/index.jsx
index 4ba5870..588dc2e 100644
--- a/src/tabviews/custom/components/card/prop-card/index.jsx
+++ b/src/tabviews/custom/components/card/prop-card/index.jsx
@@ -425,7 +425,7 @@
const { config, loading, data, activeKey } = this.state
return (
- <div className="custom-prop-card-box" style={{...config.style, minHeight: config.wrap.minHeight}}>
+ <div className="custom-prop-card-box" style={config.style}>
{loading ?
<div className="loading-mask">
<div className="ant-spin-blur"></div>
diff --git a/src/tabviews/custom/components/carousel/data-card/index.jsx b/src/tabviews/custom/components/carousel/data-card/index.jsx
index 1e6e1aa..b77c04e 100644
--- a/src/tabviews/custom/components/carousel/data-card/index.jsx
+++ b/src/tabviews/custom/components/carousel/data-card/index.jsx
@@ -315,7 +315,7 @@
const { config, loading, data, card } = this.state
return (
- <div className="custom-data-carousel-box" style={{...config.style, minHeight: config.wrap.minHeight}}>
+ <div className="custom-data-carousel-box" style={config.style}>
{loading ?
<div className="loading-mask">
{data ? <div className="ant-spin-blur"></div> : null}
diff --git a/src/tabviews/custom/components/table/normal-table/index.jsx b/src/tabviews/custom/components/table/normal-table/index.jsx
index d22195b..c147e6f 100644
--- a/src/tabviews/custom/components/table/normal-table/index.jsx
+++ b/src/tabviews/custom/components/table/normal-table/index.jsx
@@ -517,7 +517,7 @@
this.setState({sync: false, data: _data})
} else if (nextProps.mainSearch && !is(fromJS(this.props.mainSearch), fromJS(nextProps.mainSearch))) {
if (config.setting.syncRefresh === 'true') {
- this.setState({}, () => {
+ this.setState({pageIndex: 1}, () => {
this.reloadtable()
})
}
@@ -555,7 +555,7 @@
<div className="custom-normal-table" style={config.style}>
<NormalHeader config={config}/>
{searchlist && searchlist.length ?
- <MainSearch BID={BID} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
+ <MainSearch BID={BID} setting={config.wrap} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
}
<MainAction
BID={BID}
diff --git a/src/tabviews/subtable/index.jsx b/src/tabviews/subtable/index.jsx
index 3084145..c3335b6 100644
--- a/src/tabviews/subtable/index.jsx
+++ b/src/tabviews/subtable/index.jsx
@@ -944,7 +944,7 @@
<div className="subtable" id={'subtable' + this.props.MenuID}>
{loadingview && <Spin />}
{searchlist && searchlist.length ?
- <SubSearch BID={this.props.BID} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
+ <SubSearch BID={this.props.BID} setting={setting} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
}
{config ? <Row className="chart-view" gutter={16}>
{/* 瑙嗗浘缁� */}
diff --git a/src/tabviews/subtabtable/index.jsx b/src/tabviews/subtabtable/index.jsx
index 9fb5fdc..bea6d12 100644
--- a/src/tabviews/subtabtable/index.jsx
+++ b/src/tabviews/subtabtable/index.jsx
@@ -776,7 +776,7 @@
<div className="subtabtable" id={'subtabtable' + this.props.MenuID}>
{loadingview && <Spin />}
{searchlist && searchlist.length ?
- <SubSearch BID={this.props.BID} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
+ <SubSearch BID={this.props.BID} setting={setting} searchlist={searchlist} menuType={this.props.menuType} refreshdata={this.refreshbysearch}/> : null
}
{config ? <Row className="chart-view" gutter={16}>
{/* 瑙嗗浘缁� */}
diff --git a/src/tabviews/zshare/dategroup/index.jsx b/src/tabviews/zshare/dategroup/index.jsx
index 64a37cf..e566a07 100644
--- a/src/tabviews/zshare/dategroup/index.jsx
+++ b/src/tabviews/zshare/dategroup/index.jsx
@@ -88,7 +88,14 @@
}
}
+ UNSAFE_componentWillReceiveProps (nextProps) {
+ if (this.props.reset !== nextProps.reset) {
+ this.reset()
+ }
+ }
+
onChange = (date, type) => {
+ const { card } = this.props
let values = []
if (type === 'day') {
values = [moment(date).format('YYYY-MM-DD'), moment(date).format('YYYY-MM-DD')]
@@ -110,16 +117,17 @@
active: type,
dateRange: values
}, () => {
- this.props.onGroupChange()
+ this.props.onGroupChange({[card.datefield]: values, [card.field]: type})
})
}
clearTime = () => {
+ const { card } = this.props
this.setState({
active: '',
dateRange: ''
}, () => {
- this.props.onGroupChange()
+ this.props.onGroupChange({[card.datefield]: '', [card.field]: ''})
})
}
@@ -130,35 +138,6 @@
active: initType,
dateRange: initDateRange
})
- }
-
- getSearchItems = () => {
- const { card } = this.props
- const { dateRange, active } = this.state
- let items = []
-
- items.push({
- type: 'daterange',
- key: card.datefield,
- value: dateRange,
- label: card.label,
- match: 'between',
- required: card.required === 'true'
- })
-
- if (card.transfer === 'true') {
- items.push({
- type: card.type,
- key: card.field,
- value: active,
- label: card.label,
- match: '=',
- forbid: true,
- required: card.required === 'true'
- })
- }
-
- return items
}
render() {
@@ -220,7 +199,7 @@
{dateRange.join(' ~ ')}
<Icon type="close-circle" onClick={this.clearTime} className="ant-calendar-picker-clear" />
</div> : null}
- {!dateRange && card.required === 'true' ? <div className="ant-form-explain">璇烽�夋嫨{card.label}!</div> : null}
+ {!dateRange && card.required ? <div className="ant-form-explain">璇烽�夋嫨{card.label}!</div> : null}
</div>
)
}
diff --git a/src/tabviews/zshare/topSearch/advanceform/index.jsx b/src/tabviews/zshare/topSearch/advanceform/index.jsx
new file mode 100644
index 0000000..cd54444
--- /dev/null
+++ b/src/tabviews/zshare/topSearch/advanceform/index.jsx
@@ -0,0 +1,286 @@
+import React, {Component} from 'react'
+import PropTypes from 'prop-types'
+import { fromJS } from 'immutable'
+import { Form, Row, Col, Input, Select, DatePicker } from 'antd'
+
+import Utils from '@/utils/utils.js'
+import './index.scss'
+
+const { MonthPicker, WeekPicker, RangePicker } = DatePicker
+
+class AdvanceSearch extends Component {
+ static propTpyes = {
+ dict: PropTypes.object, // 瀛楀吀
+ searchValues: PropTypes.object, // 鎼滅储鏉′欢鍊�
+ searchlist: PropTypes.array, // 鎼滅储鏉′欢鍒楄〃
+ handleSearch: PropTypes.func // 鎼滅储鏉′欢鎻愪氦
+ }
+
+ state = {
+ dict: this.props.dict,
+ formId: Utils.getuuid(), // 鎼滅储琛ㄥ崟Id
+ searchlist: fromJS(this.props.searchlist).toJS()
+ }
+
+ resetform = (formlist, supfields, index, fieldsvalue) => {
+ index++
+ let subfields = []
+
+ supfields.forEach(supfield => {
+ formlist = formlist.map(item => {
+ if (item.type === 'link' && item.linkField === supfield.field) {
+ item.options = item.oriOptions.filter(option => option.ParentID === supfield.initval || option.Value === '')
+ item.initval = item.options[0] ? item.options[0].Value : ''
+
+ if (this.props.form.getFieldValue(item.field) !== undefined) {
+ fieldsvalue[item.field] = item.initval
+ }
+
+ subfields.push(item)
+ }
+ return item
+ })
+ })
+
+ if (subfields.length === 0 || index > 6) {
+ return formlist
+ } else {
+ return this.resetform(formlist, subfields, index, fieldsvalue)
+ }
+ }
+
+ selectChange = (_field, value) => {
+ let formlist = fromJS(this.state.searchlist).toJS()
+
+ let subfields = []
+ let fieldsvalue = {}
+ formlist = formlist.map(item => {
+ if (item.type === 'link' && item.linkField === _field.field) {
+ item.options = item.oriOptions.filter(option => option.ParentID === value || option.Value === '')
+ item.initval = item.options[0] ? item.options[0].Value : ''
+
+ if (this.props.form.getFieldValue(item.field) !== undefined) {
+ fieldsvalue[item.field] = item.initval
+ }
+
+ subfields.push(item)
+ }
+ return item
+ })
+
+ if (subfields.length === 0) {
+ return
+ }
+
+ formlist = this.resetform(formlist, subfields, 0, fieldsvalue)
+
+ if (Object.keys(fieldsvalue).length > 0) {
+ this.props.form.setFieldsValue(fieldsvalue)
+ }
+
+ this.setState({
+ searchlist: formlist
+ })
+ }
+
+ getFields() {
+ const { getFieldDecorator } = this.props.form
+ const { searchValues } = this.props
+ const { dict, formId } = this.state
+ const fields = []
+
+ this.state.searchlist.forEach((item, index) => {
+ if (item.advanced !== 'true' || item.Hide === 'true') return
+
+ let initval = searchValues[item.field] || ''
+ if (item.type === 'text') { // 鏂囨湰鎼滅储
+ fields.push(
+ <Col span={item.ratio || 6} key={index}>
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
+ {getFieldDecorator(item.field, {
+ initialValue: initval,
+ rules: [
+ {
+ required: item.required,
+ message: dict['form.required.input'] + item.label + '!'
+ }
+ ]
+ })(<Input placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onPressEnter={this.props.handleSearch} />)}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'select' || item.type === 'link') { // 涓嬫媺鎼滅储
+ fields.push(
+ <Col span={item.ratio || 6} key={index}>
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
+ {getFieldDecorator(item.field, {
+ initialValue: initval,
+ rules: [
+ {
+ required: item.required,
+ message: dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <Select
+ showSearch
+ onChange={(value) => {this.selectChange(item, value)}}
+ filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0 || option.props.value.toLowerCase().indexOf(input.toLowerCase()) >= 0}
+ getPopupContainer={() => formId ? document.getElementById(formId) : document.body}
+ >
+ {item.options.map((option, i) =>
+ <Select.Option id={`${i}`} title={option.Text} key={`${i}`} value={option.Value}>{option.Text}</Select.Option>
+ )}
+ </Select>
+ )}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'multiselect') { // 涓嬫媺澶氶��
+ fields.push(
+ <Col span={item.ratio || 6} key={index}>
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
+ {getFieldDecorator(item.field, {
+ initialValue: initval,
+ rules: [
+ {
+ required: item.required,
+ message: dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <Select
+ showSearch
+ mode="multiple"
+ filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
+ getPopupContainer={() => formId ? document.getElementById(formId) : document.body}
+ >
+ {item.options.map((option, i) =>
+ <Select.Option id={`${i}`} title={option.Text} key={`${i}`} value={option.Value}>{option.Text}</Select.Option>
+ )}
+ </Select>
+ )}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'date') { // 鏃堕棿鎼滅储
+ fields.push(
+ <Col span={item.ratio || 6} key={index}>
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
+ {getFieldDecorator(item.field, {
+ initialValue: initval || null,
+ rules: [
+ {
+ required: item.required,
+ message: dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <DatePicker getCalendarContainer={() => formId ? document.getElementById(formId) : document.body} />
+ )}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'datemonth') {
+ fields.push(
+ <Col span={item.ratio || 6} key={index}>
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
+ {getFieldDecorator(item.field, {
+ initialValue: initval || null,
+ rules: [
+ {
+ required: item.required,
+ message: dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <MonthPicker getCalendarContainer={() => formId ? document.getElementById(formId) : document.body} />
+ )}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'dateweek') {
+ fields.push(
+ <Col span={item.ratio || 6} key={index}>
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
+ {getFieldDecorator(item.field, {
+ initialValue: initval || null,
+ rules: [
+ {
+ required: item.required,
+ message: dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <WeekPicker getCalendarContainer={() => formId ? document.getElementById(formId) : document.body} />
+ )}
+ </Form.Item>
+ </Col>
+ )
+ } else if (item.type === 'daterange') {
+ let _defaultValue = initval
+
+ if (!initval) {
+ _defaultValue = [null, null]
+ }
+
+ fields.push(
+ <Col className="daterange" span={item.ratio || 6} key={index}>
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
+ {getFieldDecorator(item.field,
+ {
+ initialValue: _defaultValue,
+ rules: [
+ {
+ required: item.required,
+ message: dict['form.required.select'] + item.label + '!'
+ }
+ ]
+ })(
+ <RangePicker
+ placeholder={['寮�濮嬫棩鏈�', '缁撴潫鏃ユ湡']}
+ renderExtraFooter={() => 'extra footer'}
+ getCalendarContainer={() => formId ? document.getElementById(formId) : document.body}
+ />
+ )}
+ </Form.Item>
+ </Col>
+ )
+ }
+ })
+
+ return fields
+ }
+
+ handleConfirm = () => {
+ // 鍥炶溅鎴栫偣鍑绘悳绱�
+ return new Promise((resolve, reject) => {
+ this.props.form.validateFields((err, values) => {
+ if (!err) {
+ resolve(values)
+ }
+ })
+ })
+ }
+
+ render() {
+ const formItemLayout = {
+ labelCol: {
+ xs: { span: 24 },
+ sm: { span: 8 }
+ },
+ wrapperCol: {
+ xs: { span: 24 },
+ sm: { span: 16 }
+ }
+ }
+
+ return (
+ <Form {...formItemLayout} className="advance-search" id={this.state.formId}>
+ <Row gutter={24}>{this.getFields()}</Row>
+ </Form>
+ )
+ }
+}
+
+export default Form.create()(AdvanceSearch)
\ No newline at end of file
diff --git a/src/tabviews/zshare/topSearch/advanceform/index.scss b/src/tabviews/zshare/topSearch/advanceform/index.scss
new file mode 100644
index 0000000..141283d
--- /dev/null
+++ b/src/tabviews/zshare/topSearch/advanceform/index.scss
@@ -0,0 +1,28 @@
+.advance-search {
+ background: #ffffff;
+ .ant-form-item {
+ display: flex;
+ margin-bottom: 0px;
+ min-height: 60px;
+ .ant-form-explain {
+ white-space: nowrap;
+ }
+ }
+ .ant-form-item-control-wrapper {
+ flex: 1;
+ width: calc(100% - 100px);
+ }
+ .ant-form-item-label {
+ text-overflow: ellipsis;
+ }
+ .daterange .ant-calendar-picker-input {
+ padding: 4px 20px 4px 5px;
+ font-size: 13px;
+ }
+ .ant-select-dropdown {
+ z-index: 10 !important;
+ }
+ .ant-calendar-picker-container {
+ z-index: 10 !important;
+ }
+}
\ No newline at end of file
diff --git a/src/tabviews/zshare/topSearch/index.jsx b/src/tabviews/zshare/topSearch/index.jsx
index 1fbf809..be6e6fe 100644
--- a/src/tabviews/zshare/topSearch/index.jsx
+++ b/src/tabviews/zshare/topSearch/index.jsx
@@ -1,12 +1,13 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
import { fromJS } from 'immutable'
-import { Form, Row, Col, Input, Button, Select, DatePicker, notification } from 'antd'
+import { Form, Row, Col, Input, Button, Select, DatePicker, notification, Modal, Icon } from 'antd'
import moment from 'moment'
import Api from '@/api'
import options from '@/store/options.js'
import DateGroup from '@/tabviews/zshare/dategroup'
+import asyncSpinComponent from '@/utils/asyncSpinComponent'
import Utils from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/main.js'
import enUS from '@/locales/en-US/main.js'
@@ -14,12 +15,15 @@
const { MonthPicker, WeekPicker, RangePicker } = DatePicker
+const MutilForm = asyncSpinComponent(() => import('./advanceform'))
+
class MainSearch extends Component {
static propTpyes = {
BID: PropTypes.any, // 鐖剁骇Id锛岀敤浜庢煡璇笅鎷夐�夋嫨椤�
menuType: PropTypes.any, // 鑿滃崟鏉冮檺锛屾槸鍚︿负HS
searchlist: PropTypes.array, // 鎼滅储鏉′欢鍒楄〃
config: PropTypes.object, // 缁勪欢閰嶇疆淇℃伅(鑷畾涔夐〉闈�)
+ setting: PropTypes.object, // 缁勪欢閰嶇疆淇℃伅(鑷畾涔夐〉闈�)
refreshdata: PropTypes.func // 鍒锋柊鏁版嵁
}
@@ -27,25 +31,22 @@
dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,
oriId: Utils.getuuid(), // 鎼滅储琛ㄥ崟Id
formId: '', // 鎼滅储琛ㄥ崟Id
- match: null, // 鎼滅储鏉′欢鍖归厤瑙勫垯
- style: null, // 鎼滅储鏉′欢绫诲瀷
- label: null, // 鎻愮ず鏂囧瓧
- required: null, // 鏄惁蹇呭～
searchlist: null, // 鎼滅储椤�
- groups: null, // 缁勫悎鎼滅储椤�
+ reset: true, // 鎺у埗缁勫悎鎼滅储椤归噸缃�
float: '', // 娴姩
showButton: true, // 鏄惁鏄剧ず鎼滅储鎸夐挳
- searchStyle: null // 鎼滅储鏉′欢鏍峰紡
+ showAdvanced: false, // 鏄惁鏄剧ず楂樼骇鎼滅储
+ searchStyle: null, // 鎼滅储鏉′欢鏍峰紡
+ searchValues: {}, // 鎼滅储鏉′欢淇濆瓨鍊�
+ advanceValues: [], // 楂樼骇鎼滅储鏉′欢淇濆瓨鍊�
+ visible: false,
+ adModelWidth: '1000px',
}
UNSAFE_componentWillMount () {
- const { config, menuType, searchlist } = this.props
+ const { config, menuType, searchlist, setting } = this.props
let _searchlist = []
- let match = {}
- let label = {}
- let style = {}
- let required = {}
let _list = []
let fieldMap = new Map()
let mainItems = [] // 浜戠鎴栧崟鐐规暟鎹�
@@ -54,7 +55,23 @@
let float = ''
let showButton = true
let searchStyle = null
+ let searchValues = {}
+ let advanceValues = []
+ let showAdvanced = false
+ let adModelWidth = 1000
let formId = Utils.getuuid()
+
+ if (setting && setting.advanceWidth) {
+ adModelWidth = setting.advanceWidth
+ } else if (config && config.wrap && config.wrap.advanceWidth) {
+ adModelWidth = config.wrap.advanceWidth
+ }
+
+ if (adModelWidth < 100) {
+ adModelWidth = adModelWidth + 'vw'
+ } else {
+ adModelWidth = adModelWidth + 'px'
+ }
if (searchlist) {
_searchlist = fromJS(searchlist).toJS()
@@ -77,10 +94,7 @@
}
fieldMap.set(item.field, item)
- match[item.field] = item.match
- label[item.field] = item.label
- style[item.field] = item.type
- required[item.field] = item.required === 'true'
+ item.required = item.required === 'true'
if (['select', 'link', 'multiselect'].includes(item.type)) {
if (item.setAll === 'true' && item.type !== 'multiselect') {
@@ -120,8 +134,23 @@
_list.push(item)
})
- let _groups = []
_list = _list.map(item => {
+ if (item.Hide === 'true') {
+ searchValues[item.field] = this.getInitValue(item)
+ } else if (showButton && item.advanced === 'true') {
+ showAdvanced = true
+ let _value = this.getInitValue(item)
+ searchValues[item.field] = _value
+
+ let _val = this.getAdvanceValue(item, _value)
+ if (_val) {
+ advanceValues.push({field: item.field, type: item.type, label: item.label, value: _val})
+ }
+ } else if (item.type === 'group') {
+ searchValues[item.datefield] = this.getInitValue(item)
+ searchValues[item.field] = item.initval && item.initval[0] ? item.initval[0] : ''
+ }
+
if (item.type === 'link') {
let supItem = fieldMap.get(item.linkField)
@@ -136,24 +165,21 @@
item.supInitVal = supItem.initval
item.options = item.oriOptions.filter(option => option.ParentID === supItem.initval || option.Value === '')
}
- } else if (item.type === 'group' && item.Hide !== 'true') {
- _groups.push(fromJS(item).toJS())
}
return item
})
this.setState({
- match,
- label,
- style,
float,
formId,
- required,
showButton,
searchStyle,
- searchlist: _list,
- groups: _groups
+ searchValues,
+ showAdvanced,
+ adModelWidth,
+ advanceValues,
+ searchlist: _list
}, () => {
if (menuType !== 'HS' && options.sysType === 'local' && !window.GLOB.systemType) {
this.improveSimpleSearch(deForms)
@@ -161,6 +187,98 @@
this.improveSearch(mainItems, localItems)
}
})
+ }
+
+ getInitValue = (item) => {
+ let value = item.initval || ''
+
+ if (item.type === 'multiselect') { // 涓嬫媺澶氶��
+ value = item.initval ? item.initval.split(',').filter(Boolean) : []
+ } else if (item.type === 'date') { // 鏃堕棿鎼滅储
+ value = item.initval ? moment().subtract(item.initval, 'days') : ''
+ } else if (item.type === 'datemonth') {
+ value = item.initval ? moment().subtract(item.initval, 'month') : ''
+ } else if (item.type === 'dateweek') {
+ value = item.initval ? moment().subtract(item.initval * 7, 'days') : ''
+ } else if (item.type === 'daterange') {
+ if (item.initval) {
+ try {
+ let _initval = JSON.parse(item.initval)
+ value = [moment().subtract(_initval[0], 'days'), moment().subtract(_initval[1], 'days')]
+ } catch {
+ value = ''
+ }
+ }
+ } else if (item.type === 'group' && item.initval && item.initval.length > 0) {
+ let _type = item.initval[0]
+ let _val = item.initval[1]
+
+ if (_type === 'day') {
+ value = [moment().subtract(_val, 'days').format('YYYY-MM-DD'), moment().subtract(_val, 'days').format('YYYY-MM-DD')]
+ } else if (_type === 'week') {
+ value = [moment().subtract(_val * 7, 'days').startOf('week').format('YYYY-MM-DD'), moment().subtract(_val * 7, 'days').endOf('week').format('YYYY-MM-DD')]
+ } else if (_type === 'month') {
+ value = [moment().subtract(_val, 'month').startOf('month').format('YYYY-MM-DD'), moment().subtract(_val, 'month').endOf('month').format('YYYY-MM-DD')]
+ } else if (_type === 'quarter') {
+ let _differ = parseInt(moment().format('MM')) % 3
+ let _pdiffer = 0
+ let _ndiffer = 0
+
+ // 宸�艰绠�
+ switch(_differ) {
+ case 0:
+ _pdiffer = 2
+ _ndiffer = 0
+ break
+ case 1:
+ _pdiffer = 0
+ _ndiffer = -2
+ break
+ case 2:
+ _pdiffer = 1
+ _ndiffer = -1
+ break
+ default:
+ }
+
+ value = [moment().subtract(_pdiffer + _val * 3, 'month').startOf('month').format('YYYY-MM-DD'), moment().subtract(_ndiffer + _val * 3, 'month').endOf('month').format('YYYY-MM-DD')]
+ } else if (_type === 'year') {
+ let _year = parseInt(moment().format('YYYY')) - _val
+ value = [_year + '-01-01', _year + '-12-31']
+ } else if (_type === 'customized') {
+ try {
+ _val = JSON.parse(_val)
+ } catch {
+ _val = [0, 0]
+ }
+ value = [moment().subtract(_val[0], 'days').format('YYYY-MM-DD'), moment().subtract(_val[1], 'days').format('YYYY-MM-DD')]
+ }
+ }
+
+ return value
+ }
+
+ getAdvanceValue = (item, value) => {
+ if (!value || (Array.isArray(value) && value.length === 0)) return ''
+
+ let val = ''
+ if (item.type === 'multiselect') {
+ val = value.join(', ')
+ } else if (item.type === 'daterange') {
+ if (value[0] && value[1]) {
+ val = `${moment(value[0]).format('YYYY-MM-DD')} ~ ${moment(value[1]).format('YYYY-MM-DD')}`
+ }
+ } else if (item.type === 'dateweek') {
+ val = `${moment(value).startOf('week').format('YYYY-MM-DD')} ~ ${moment(value).endOf('week').format('YYYY-MM-DD')}`
+ } else if (item.type === 'date') {
+ val = moment(value).format('YYYY-MM-DD')
+ } else if (item.type === 'datemonth') {
+ val = moment(value).format('YYYY-MM')
+ } else {
+ val = value.replace(/(^\s*|\s*$)/ig, '')
+ }
+
+ return val
}
// 鏌ヨ涓嬫媺鑿滃崟
@@ -455,11 +573,11 @@
getFields() {
const { getFieldDecorator } = this.props.form
- const { dict, showButton, formId } = this.state
+ const { dict, showButton, formId, showAdvanced } = this.state
const fields = []
this.state.searchlist.forEach((item, index) => {
- if (item.Hide === 'true') return
+ if (item.Hide === 'true' || (showAdvanced && item.advanced === 'true')) return
if (item.type === 'text') { // 鏂囨湰鎼滅储
fields.push(
@@ -469,7 +587,7 @@
initialValue: item.initval,
rules: [
{
- required: item.required === 'true',
+ required: item.required,
message: dict['form.required.input'] + item.label + '!'
}
]
@@ -477,7 +595,7 @@
</Form.Item>
</Col>
)
- } else if (item.type === 'select') { // 涓嬫媺鎼滅储
+ } else if (item.type === 'select' || item.type === 'link') { // 涓嬫媺鎼滅储
fields.push(
<Col span={item.ratio || 6} key={index}>
<Form.Item label={item.labelShow !== 'false' ? item.label : ''}>
@@ -485,7 +603,7 @@
initialValue: item.initval,
rules: [
{
- required: item.required === 'true',
+ required: item.required,
message: dict['form.required.select'] + item.label + '!'
}
]
@@ -513,7 +631,7 @@
initialValue: _initval,
rules: [
{
- required: item.required === 'true',
+ required: item.required,
message: dict['form.required.select'] + item.label + '!'
}
]
@@ -541,7 +659,7 @@
initialValue: item.initval ? moment().subtract(item.initval, 'days') : null,
rules: [
{
- required: item.required === 'true',
+ required: item.required,
message: dict['form.required.select'] + item.label + '!'
}
]
@@ -559,7 +677,7 @@
initialValue: item.initval ? moment().subtract(item.initval, 'month') : null,
rules: [
{
- required: item.required === 'true',
+ required: item.required,
message: dict['form.required.select'] + item.label + '!'
}
]
@@ -577,7 +695,7 @@
initialValue: item.initval ? moment().subtract(item.initval * 7, 'days') : null,
rules: [
{
- required: item.required === 'true',
+ required: item.required,
message: dict['form.required.select'] + item.label + '!'
}
]
@@ -607,7 +725,7 @@
initialValue: _defaultValue,
rules: [
{
- required: item.required === 'true',
+ required: item.required,
message: dict['form.required.select'] + item.label + '!'
}
]
@@ -625,8 +743,8 @@
} else if (item.type === 'group') {
fields.push(
<Col span={item.ratio || 6} key={index}>
- <Form.Item label={item.labelShow !== 'false' ? item.label : ''} className={item.required === 'true' ? 'group-required' : ''}>
- <DateGroup ref={item.uuid} position={index} card={item} onGroupChange={this.searchChange} />
+ <Form.Item label={item.labelShow !== 'false' ? item.label : ''} className={item.required ? 'group-required' : ''}>
+ <DateGroup reset={this.state.reset} position={index} card={item} onGroupChange={this.onGroupChange} />
</Form.Item>
</Col>
)
@@ -643,6 +761,9 @@
<Button style={{ marginLeft: 8 }} onClick={this.handleReset}>
{dict['main.reset']}
</Button>
+ {showAdvanced ? <Button type="link" onClick={this.handleAdvance}>
+ 楂樼骇
+ </Button> : null}
</Form.Item>
</Col>
)
@@ -651,47 +772,14 @@
return fields
}
- addHideFieldValue = (values) => {
- const { searchlist } = this.state
- let hideValue = {}
- searchlist.forEach(item => {
- if (item.Hide === 'true') {
- let value = ''
-
- if (item.type === 'multiselect') { // 涓嬫媺澶氶��
- value = item.initval ? item.initval.split(',').filter(Boolean) : []
- } else if (item.type === 'date') { // 鏃堕棿鎼滅储
- value = item.initval ? moment().subtract(item.initval, 'days') : ''
- } else if (item.type === 'datemonth') {
- value = item.initval ? moment().subtract(item.initval, 'month') : ''
- } else if (item.type === 'dateweek') {
- value = item.initval ? moment().subtract(item.initval * 7, 'days') : ''
- } else if (item.type === 'daterange') {
- if (item.initval) {
- try {
- let _initval = JSON.parse(item.initval)
- value = [moment().subtract(_initval[0], 'days'), moment().subtract(_initval[1], 'days')]
- } catch {
- value = ''
- }
- }
- } else if (item.type !== 'group') {
- value = item.initval
- }
-
- hideValue[item.field] = value
- }
- })
-
- return {...hideValue, ...values}
+ handleAdvance = () => {
+ this.setState({visible: true})
}
- handleSearch = (e) => {
+ handleSearch = () => {
// 鍥炶溅鎴栫偣鍑绘悳绱�
- e.preventDefault()
this.props.form.validateFields((err, values) => {
if (!err) {
- values = this.addHideFieldValue(values)
let searches = this.getFieldsValues(values)
let requireFields = searches.filter(item => item.required && (!item.value || item.value.length === 0))
@@ -712,11 +800,19 @@
})
}
+ onGroupChange = (values) => {
+ const { searchValues } = this.state
+
+ this.setState({
+ searchValues: {...searchValues, ...values}
+ })
+ this.searchChange()
+ }
+
searchChange = () => {
this.setState({}, () => {
this.props.form.validateFields((err, values) => {
if (!err) {
- values = this.addHideFieldValue(values)
let searches = this.getFieldsValues(values)
let requireFields = searches.filter(item => item.required && (!item.value || item.value.length === 0))
@@ -734,101 +830,162 @@
* @description 鎼滅储鏉′欢閲嶇疆
*/
handleReset = () => {
- const { groups } = this.state
+ const { showAdvanced } = this.state
- if (groups.length > 0) {
- groups.forEach(item => {
- this.refs[item.uuid].reset()
- })
- }
-
+ let searchValues = {}
+ let advanceValues = []
let searchlist = this.state.searchlist.map(item => {
item.initval = item.oriInitval
+
+ if (item.Hide === 'true') {
+ searchValues[item.field] = this.getInitValue(item)
+ } else if (showAdvanced && item.advanced === 'true') {
+ let _value = this.getInitValue(item)
+ searchValues[item.field] = _value
+
+ let _val = this.getAdvanceValue(item, _value)
+ if (_val) {
+ advanceValues.push({field: item.field, type: item.type, label: item.label, value: _val})
+ }
+ } else if (item.type === 'group') {
+ searchValues[item.datefield] = this.getInitValue(item)
+ searchValues[item.field] = item.initval && item.initval[0] ? item.initval[0] : ''
+ }
return item
})
- this.setState({searchlist}, () => {
+ this.setState({searchlist, searchValues, advanceValues, reset: !this.state.reset}, () => {
this.props.form.resetFields()
this.props.form.validateFields((err, values) => {
if (!err) {
- // 寮傛鑾峰彇鏇存柊鍚庣殑鏃堕棿缁�
- this.setState({}, () => {
- values = this.addHideFieldValue(values)
- let searches = this.getFieldsValues(values)
+ let searches = this.getFieldsValues(values)
- let requireFields = searches.filter(item => item.required && (!item.value || item.value.length === 0))
- if (requireFields.length > 0) {
- let labels = requireFields.map(item => item.label)
- labels = Array.from(new Set(labels))
-
- notification.warning({
- top: 92,
- message: this.state.dict['form.required.input'] + labels.join('銆�') + ' !',
- duration: 3
- })
- return
- }
+ let requireFields = searches.filter(item => item.required && (!item.value || item.value.length === 0))
+ if (requireFields.length > 0) {
+ let labels = requireFields.map(item => item.label)
+ labels = Array.from(new Set(labels))
+
+ notification.warning({
+ top: 92,
+ message: this.state.dict['form.required.input'] + labels.join('銆�') + ' !',
+ duration: 3
+ })
+ return
+ }
- this.props.refreshdata(searches)
- })
+ this.props.refreshdata(searches)
}
})
})
}
getFieldsValues = (values) => {
- const { groups } = this.state
+ const { searchValues, searchlist } = this.state
// 鑾峰彇鎼滅储鏉′欢鍊�
let search = []
- Object.keys(values).forEach(key => {
- let _value = ''
- if (this.state.style[key] === 'daterange') {
- if (values[key].length > 0 && values[key][0] && values[key][1]) {
- _value = [moment(values[key][0]).format('YYYY-MM-DD'), moment(values[key][1]).format('YYYY-MM-DD')]
- }
- } else if (this.state.style[key] === 'dateweek') {
- if (values[key]) {
- _value = [moment(values[key]).startOf('week').format('YYYY-MM-DD'), moment(values[key]).endOf('week').format('YYYY-MM-DD')]
- }
- } else if (this.state.style[key] === 'date') {
- if (values[key]) {
- _value = moment(values[key]).format('YYYY-MM-DD')
- }
- } else if (this.state.style[key] === 'datemonth') {
- if (values[key]) {
- _value = moment(values[key]).format('YYYY-MM')
- }
- } else if (this.state.style[key] === 'multiselect') {
- _value = values[key] || []
-
- } else {
- _value = (values[key] || values[key] === 0) ? values[key] : ''
-
- _value = _value.replace(/(^\s*|\s*$)/ig, '')
+ searchlist.forEach(item => {
+ let cell = {
+ type: item.type,
+ key: item.field.replace(/@tail@$/, ''),
+ label: item.label,
+ match: item.match || '=',
+ required: item.required,
+ value: ''
+ }
+ if ((item.Hide === 'true' || item.advanced === 'true')) {
+ cell.value = searchValues[item.field] || ''
}
- search.push({
- type: this.state.style[key],
- key: key.replace(/@tail@$/, ''),
- value: _value,
- label: this.state.label[key],
- match: this.state.match[key],
- required: this.state.required[key]
- })
- })
+ if (item.type === 'group') {
+ cell.type = 'daterange'
+ cell.key = item.datefield
+ cell.value = searchValues[item.datefield] || ''
+ cell.match = 'between'
- if (groups.length > 0) {
- groups.forEach(item => {
- let items = this.refs[item.uuid].getSearchItems()
- search.push(...items)
- })
- }
+ search.push(cell)
+ if (item.transfer === 'true') {
+ let copy = fromJS(cell).toJS()
+ copy.type = 'group'
+ copy.key = item.field.replace(/@tail@$/, '')
+ copy.value = searchValues[item.field] || ''
+ copy.match = '='
+ copy.forbid = true
+ search.push(copy)
+ }
+ } else {
+ let _value = values[item.field] || cell.value || ''
+ if (!_value) {
+ if (item.type === 'multiselect') {
+ cell.value = []
+ }
+ search.push(cell)
+ } else {
+ if (item.type === 'daterange') {
+ if (_value[0] && _value[1]) {
+ _value = [moment(_value[0]).format('YYYY-MM-DD'), moment(_value[1]).format('YYYY-MM-DD')]
+ } else {
+ _value = ''
+ }
+ } else if (item.type === 'dateweek') {
+ _value = [moment(_value).startOf('week').format('YYYY-MM-DD'), moment(_value).endOf('week').format('YYYY-MM-DD')]
+ } else if (item.type === 'date') {
+ _value = moment(_value).format('YYYY-MM-DD')
+ } else if (item.type === 'datemonth') {
+ _value = moment(_value).format('YYYY-MM')
+ } else if (item.type === 'multiselect') {
+
+ } else {
+ _value = _value.replace(/(^\s*|\s*$)/ig, '')
+ }
+
+ cell.value = _value
+ search.push(cell)
+ }
+ }
+ })
return search
}
+ handleOk = () => {
+ const { searchValues, searchlist } = this.state
+
+ this.formRef.handleConfirm().then(res => {
+ let values = {}
+ let advanceValues = []
+ searchlist.forEach(item => {
+ if (item.advanced === 'true' && item.Hide !== 'true') {
+ let _value = res[item.field] || ''
+
+ if (!_value && item.type === 'multiselect') {
+ _value = []
+ } else if (typeof(_value) === 'string') {
+ _value = _value.replace(/(^\s*|\s*$)/ig, '')
+ }
+ values[item.field] = _value
+
+ let _val = this.getAdvanceValue(item, _value)
+ if (_val) {
+ advanceValues.push({field: item.field, type: item.type, label: item.label, value: _val})
+ }
+ }
+ })
+ this.setState({searchValues: {...searchValues, ...values}, advanceValues, visible: false}, () => {
+ this.handleSearch()
+ })
+ })
+ }
+
+ closeAdvanceForm = (cell) => {
+ const { searchValues, advanceValues } = this.state
+
+ this.setState({searchValues: {...searchValues, [cell.field]: ''}, advanceValues: advanceValues.filter(item => item.field !== cell.field)}, () => {
+ this.handleSearch()
+ })
+ }
+
render() {
- const { float, searchStyle } = this.state
+ const { float, searchStyle, visible, searchlist, searchValues, showAdvanced, advanceValues, adModelWidth } = this.state
const formItemLayout = {
labelCol: {
xs: { span: 24 },
@@ -841,9 +998,42 @@
}
return (
- <Form {...formItemLayout} className={`top-search ${float}`} style={searchStyle} id={this.state.formId || this.state.oriId}>
- <Row gutter={24}>{this.getFields()}</Row>
- </Form>
+ <>
+ <Form {...formItemLayout} className={`top-search ${float}`} style={searchStyle} id={this.state.formId || this.state.oriId}>
+ <Row gutter={24}>{this.getFields()}</Row>
+ <Row gutter={24}>
+ {showAdvanced ? <div className="advanced-list">
+ {advanceValues.map((item, index) => {
+ return (
+ <div key={index}>
+ <span>{item.label}: </span>
+ <span className="advance-value">{item.value}</span>
+ <Icon type="close" onClick={() => this.closeAdvanceForm(item)} />
+ </div>)
+ })}
+ </div> : null}
+ </Row>
+ </Form>
+ <Modal
+ title="楂樼骇鎼滅储"
+ maskClosable={false}
+ visible={visible}
+ width={adModelWidth}
+ closable={false}
+ onOk={this.handleOk}
+ cancelText={'鍏抽棴'}
+ onCancel={() => this.setState({visible: false})}
+ destroyOnClose
+ >
+ <MutilForm
+ dict={this.state.dict}
+ searchlist={searchlist}
+ searchValues={searchValues}
+ handleSearch={this.handleOk}
+ wrappedComponentRef={(inst) => this.formRef = inst}
+ />
+ </Modal>
+ </>
)
}
}
diff --git a/src/tabviews/zshare/topSearch/index.scss b/src/tabviews/zshare/topSearch/index.scss
index 9388a99..449f40b 100644
--- a/src/tabviews/zshare/topSearch/index.scss
+++ b/src/tabviews/zshare/topSearch/index.scss
@@ -36,6 +36,33 @@
content: '*';
}
}
+ .search-button {
+ .ant-btn-link, .ant-btn-link:hover, .ant-btn-link:active{
+ border-color: transparent;
+ span {
+ position: relative;
+ top: 5px;
+ }
+ }
+ }
+ .advanced-list {
+ font-size: 13px;
+ > div {
+ display: inline-block;
+ margin-right: 10px;
+ border: 1px solid #dddddd;
+ padding: 0 4px 0 4px;
+ background: rgba(0, 0, 0, 0.02);
+
+ .anticon-close {
+ margin-left: 5px;
+ cursor: pointer;
+ color: #bcbcbc;
+ font-size: 12px;
+ padding: 2px;
+ }
+ }
+ }
}
.top-search.right {
>.ant-row {
@@ -43,4 +70,4 @@
float: right;
}
}
-}
\ No newline at end of file
+}
diff --git a/src/templates/sharecomponent/searchcomponent/searchform/index.jsx b/src/templates/sharecomponent/searchcomponent/searchform/index.jsx
index 843331c..9918283 100644
--- a/src/templates/sharecomponent/searchcomponent/searchform/index.jsx
+++ b/src/templates/sharecomponent/searchcomponent/searchform/index.jsx
@@ -1,5 +1,6 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
+import { fromJS } from 'immutable'
import { Form, Row, Col, Input, Select, Icon, Radio, notification, Tooltip, InputNumber, Checkbox, Cascader } from 'antd'
import { dateOptions, matchReg, formRule } from '@/utils/option.js'
import EditTable from '../searcheditable'
@@ -80,6 +81,18 @@
},
]
+const searchTypeOptions = {
+ text: ['label', 'field', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced'],
+ select: ['label', 'field', 'resourceType', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced', 'setAll'],
+ multiselect: ['label', 'field', 'resourceType', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced'],
+ link: ['label', 'field', 'resourceType', 'initval', 'type', 'linkField', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced', 'setAll'],
+ date: ['label', 'field', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced'],
+ dateweek: ['label', 'field', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced'],
+ datemonth: ['label', 'field', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced'],
+ daterange: ['label', 'field', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow', 'advanced'],
+ group: ['label', 'type', 'field', 'datefield', 'initval', 'blacklist', 'ratio', 'items', 'required', 'transfer', 'labelShow']
+}
+
class MainSearch extends Component {
static propTpyes = {
dict: PropTypes.object, // 瀛楀吀椤�
@@ -106,23 +119,8 @@
let type = formlist.filter(cell => cell.key === 'type')[0].initVal
let _items = formlist.filter(cell => cell.key === 'items')[0].initVal
let resourceType = formlist.filter(cell => cell.key === 'resourceType')[0].initVal
- let _options = ['label', 'field', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow'] // 榛樿鏄剧ず椤�
- if ((type === 'multiselect' || type === 'select' || type === 'link') && resourceType === '0') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓鸿嚜瀹氫箟璧勬簮
- _options = [..._options, 'resourceType', 'options', 'display']
- } else if ((type === 'multiselect' || type === 'select' || type === 'link') && resourceType === '1') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓哄悗鍙版暟鎹簮涓幏鍙�
- _options = [..._options, 'resourceType', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display', 'database']
- } else if (type === 'group') {
- _options = ['label', 'type', 'field', 'datefield', 'initval', 'blacklist', 'ratio', 'items', 'required', 'transfer', 'labelShow']
- }
-
- if (type === 'select' || type === 'link') {
- _options.push('setAll')
- }
-
- if (type === 'link') { // 鍏宠仈绫诲瀷銆佸鍔犲叧鑱斾笂绾х殑瀛楁鍚�
- _options = [..._options, 'linkField']
- }
+ let _options = this.getOptions(type, resourceType)
this.setState({
openType: type,
@@ -174,6 +172,18 @@
}
}
+ getOptions = (type, resourceType) => {
+ let _options = fromJS(searchTypeOptions[type]).toJS() // 閫夐」鍒楄〃
+
+ if (['multiselect', 'select', 'link'].includes(type) && resourceType === '0') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓鸿嚜瀹氫箟璧勬簮
+ _options.push('options')
+ } else if (['multiselect', 'select', 'link'].includes(type) && resourceType === '1') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓哄悗鍙版暟鎹簮涓幏鍙�
+ _options.push('dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database')
+ }
+
+ return _options
+ }
+
/**
* @description 鎼滅储鏉′欢绫诲瀷鍒囨崲
*/
@@ -182,24 +192,7 @@
const { resourceType, items } = this.state
if (key === 'type') {
- let _options = ['label', 'field', 'initval', 'type', 'match', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow']
-
- if ((value === 'multiselect' || value === 'select' || value === 'link') && resourceType === '0') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓鸿嚜瀹氫箟璧勬簮
- _options = [..._options, 'resourceType', 'options', 'display']
- } else if ((value === 'multiselect' || value === 'select' || value === 'link') && resourceType === '1') { // 涓嬫媺閫夋嫨绫诲瀷銆侀�夐」涓哄悗鍙版暟鎹簮涓幏鍙�
- _options = [..._options, 'resourceType', 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'display', 'database']
- } else if (value === 'group') {
- _options = ['label', 'type', 'field', 'datefield', 'initval', 'items', 'ratio', 'blacklist', 'required', 'transfer', 'labelShow']
- }
-
- if (value === 'select' || value === 'link') {
- _options.push('setAll')
- }
-
- if (value === 'link') {
- _options = [..._options, 'linkField']
- }
-
+ let _options = this.getOptions(value, resourceType)
let matchs = []
this.setState({
@@ -263,22 +256,8 @@
let value = e.target.value
if (key === 'resourceType') {
- let _options = ['label', 'field', 'initval', 'type', 'match', 'resourceType', 'display', 'ratio', 'blacklist', 'required', 'Hide', 'labelShow']
+ let _options = this.getOptions(openType, value)
- if (value === '0') {
- _options = [..._options, 'options']
- } else if (value === '1') {
- _options = [..._options, 'dataSource', 'valueField', 'valueText', 'orderBy', 'orderType', 'database']
- }
-
- if (openType === 'select' || openType === 'link') {
- _options.push('setAll')
- }
-
- if (openType === 'link') {
- _options = [..._options, 'linkField']
- }
-
this.setState({
resourceType: value,
formlist: this.state.formlist.map(form => {
diff --git a/src/templates/sharecomponent/settingcalcomponent/verifycard/settingform/index.jsx b/src/templates/sharecomponent/settingcalcomponent/verifycard/settingform/index.jsx
index 0554ea7..d2ace67 100644
--- a/src/templates/sharecomponent/settingcalcomponent/verifycard/settingform/index.jsx
+++ b/src/templates/sharecomponent/settingcalcomponent/verifycard/settingform/index.jsx
@@ -1,6 +1,6 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
-import { Form, Row, Col, Input, Radio, Tooltip, Icon, notification } from 'antd'
+import { Form, Row, Col, Input, Radio, Tooltip, Icon, notification, InputNumber } from 'antd'
import moment from 'moment'
import Api from '@/api'
@@ -312,6 +312,18 @@
</Radio.Group>)}
</Form.Item>
</Col>
+ <Col span={12}>
+ <Form.Item label={
+ <Tooltip placement="topLeft" title="楂樼骇鎼滅储寮圭獥鐨勫搴︼紝娉細褰撳搴﹀�煎皬浜�100鏃惰〃绀哄崰绐楀彛鐨勭櫨鍒嗘瘮锛屽ぇ浜�100鏃惰〃绀哄搴︾殑缁濆鍊笺��">
+ <Icon type="question-circle" />
+ 楂樼骇鎼滅储
+ </Tooltip>
+ }>
+ {getFieldDecorator('advanceWidth', {
+ initialValue: setting.advanceWidth || 1000
+ })(<InputNumber min={10} max={3000} precision={0}/>)}
+ </Form.Item>
+ </Col>
</Row>
</Form>
</div>
diff --git a/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.jsx b/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.jsx
index fc9d30e..3b19179 100644
--- a/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.jsx
+++ b/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.jsx
@@ -1,6 +1,6 @@
import React, {Component} from 'react'
import PropTypes from 'prop-types'
-import { Form, Row, Col, Input, Radio, Tooltip, Icon, notification, Select } from 'antd'
+import { Form, Row, Col, Input, Radio, Tooltip, Icon, notification, Select, InputNumber } from 'antd'
import moment from 'moment'
import Api from '@/api'
@@ -616,6 +616,18 @@
</Col>
<Col span={12}>
<Form.Item label={
+ <Tooltip placement="topLeft" title="楂樼骇鎼滅储寮圭獥鐨勫搴︼紝娉細褰撳搴﹀�煎皬浜�100鏃惰〃绀哄崰绐楀彛鐨勭櫨鍒嗘瘮锛屽ぇ浜�100鏃惰〃绀哄搴︾殑缁濆鍊笺��">
+ <Icon type="question-circle" />
+ 楂樼骇鎼滅储
+ </Tooltip>
+ }>
+ {getFieldDecorator('advanceWidth', {
+ initialValue: setting.advanceWidth || 1000
+ })(<InputNumber min={10} max={3000} precision={0}/>)}
+ </Form.Item>
+ </Col>
+ <Col span={12}>
+ <Form.Item label={
<Tooltip placement="topLeft" title="鍙屽嚮琛ㄦ牸涓锛岃Е鍙戠殑鎸夐挳銆�">
<Icon type="question-circle" />
鍙屽嚮浜嬩欢
diff --git a/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.scss b/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.scss
index a6d2df7..f404309 100644
--- a/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.scss
+++ b/src/templates/sharecomponent/settingcomponent/settingform/datasource/index.scss
@@ -17,6 +17,9 @@
color: #c49f47;
margin-right: 3px;
}
+ .ant-input-number {
+ width: 100%;
+ }
}
}
\ No newline at end of file
diff --git a/src/templates/zshare/editTable/index.jsx b/src/templates/zshare/editTable/index.jsx
index 85acc60..2caf0cc 100644
--- a/src/templates/zshare/editTable/index.jsx
+++ b/src/templates/zshare/editTable/index.jsx
@@ -354,7 +354,7 @@
if (!unique) return
- data.unshift(cell)
+ data.push(cell)
})
this.setState({ data, editingKey: '', visible: false }, () => {
diff --git a/src/templates/zshare/formconfig.jsx b/src/templates/zshare/formconfig.jsx
index a9fa640..40738de 100644
--- a/src/templates/zshare/formconfig.jsx
+++ b/src/templates/zshare/formconfig.jsx
@@ -506,20 +506,6 @@
text: '>='
}]
},
- // {
- // type: 'select',
- // key: 'display',
- // label: Formdict['header.form.display'],
- // initVal: card.display || 'dropdown',
- // required: true,
- // options: [{
- // value: 'dropdown',
- // text: Formdict['header.form.dropdown']
- // // }, {
- // // value: 'button',
- // // text: Formdict['header.form.button']
- // }]
- // },
{
type: 'radio',
key: 'database',
@@ -597,6 +583,19 @@
}]
},
{
+ type: 'radio',
+ key: 'advanced',
+ label: '楂樼骇鎼滅储',
+ initVal: card.advanced || 'false',
+ options: [{
+ value: 'true',
+ text: Formdict['model.true']
+ }, {
+ value: 'false',
+ text: Formdict['model.false']
+ }]
+ },
+ {
type: 'multiselect',
key: 'blacklist',
label: Formdict['header.form.blacklist'],
--
Gitblit v1.8.0