531 lines
17 KiB
JavaScript
531 lines
17 KiB
JavaScript
|
// 核心库
|
|||
|
|
import React, { Component } from 'react'
|
|||
|
|
import { connect } from 'dva'
|
|||
|
|
// 组件库
|
|||
|
|
import { Row, Col, Select, TreeSelect, Button, Collapse, Icon } from 'antd'
|
|||
|
|
import IFComponent from '../common/IFComponent'
|
|||
|
|
// 工具库
|
|||
|
|
import { getDataFieldValue, setDataFieldValue, initFilter, guid } from '../utils/common'
|
|||
|
|
import getControl from '../utils/getControl'
|
|||
|
|
import { getFieldConfigs, getGroupByGroupConfigs } from '../utils/getFieldConfigs'
|
|||
|
|
import { isEqual } from 'lodash'
|
|||
|
|
|
|||
|
|
const Option = Select.Option
|
|||
|
|
const Panel = Collapse.Panel
|
|||
|
|
const TreeSelectNode = TreeSelect.TreeNode
|
|||
|
|
// dateType 对应 controlType
|
|||
|
|
const dataMapControl = { 2: 7, 3: 3, 4: 4, 5: 10, 6: 12, 8: 17, 9: 18, 10: 19, 11: 9, 12: 20, 13: 21, 14: 11, 15: 22, 16: 23, 17: 2 }
|
|||
|
|
|
|||
|
|
const digGroupData = (arr, target) => {
|
|||
|
|
for (let i = 0, j = arr.length; i < j; i++) {
|
|||
|
|
if (arr[i].id === target) return arr[i]
|
|||
|
|
if (Array.isArray(arr[i].childGroups) && arr[i].childGroups.length) {
|
|||
|
|
const result = digGroupData(arr[i].childGroups, target)
|
|||
|
|
if (result) return result
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const operator1 = [
|
|||
|
|
{ value: 1, label: '等于' },
|
|||
|
|
{ value: 2, label: '不等于' },
|
|||
|
|
{ value: 7, label: '开始于' },
|
|||
|
|
{ value: 8, label: '结束于' },
|
|||
|
|
{ value: 9, label: '包含' }
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
const operator3 = [
|
|||
|
|
{ value: 1, label: '等于' },
|
|||
|
|
{ value: 2, label: '不等于' }
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
const operator7 = [
|
|||
|
|
{ value: 1, label: '等于' },
|
|||
|
|
{ value: 2, label: '不等于' },
|
|||
|
|
{ value: 3, label: '小于' },
|
|||
|
|
{ value: 4, label: '小于或等于' },
|
|||
|
|
{ value: 5, label: '大于' },
|
|||
|
|
{ value: 6, label: '大于或等于' }
|
|||
|
|
]
|
|||
|
|
|
|||
|
|
function PanelContent (props) {
|
|||
|
|
// 新增一组字段
|
|||
|
|
const addFieldConfig = () => {
|
|||
|
|
const { code, config, customConfigId, onChange, onPressEnter } = props
|
|||
|
|
!config.fieldConfigs && (config.fieldConfigs = [])
|
|||
|
|
config.fieldConfigs.push({
|
|||
|
|
id: guid(),
|
|||
|
|
searchGroupId: config.id,
|
|||
|
|
isSysQueryField: false,
|
|||
|
|
userCCQueryId: customConfigId || null,
|
|||
|
|
code,
|
|||
|
|
onChange,
|
|||
|
|
data: {
|
|||
|
|
onPressEnter
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
props.onPanelContentChange instanceof Function && props.onPanelContentChange()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 删除一组字段
|
|||
|
|
const deleteFieldConfig = (id) => {
|
|||
|
|
const { config } = props
|
|||
|
|
const findIndex = config.fieldConfigs.findIndex(item => item.id === id)
|
|||
|
|
if (findIndex !== -1) {
|
|||
|
|
config.fieldConfigs.splice(findIndex, 1)
|
|||
|
|
props.onPanelContentChange instanceof Function && props.onPanelContentChange()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 字段选择
|
|||
|
|
const onSelectChange = (id, nodeData) => {
|
|||
|
|
const dataType = getDataFieldValue(nodeData, 'DataType')
|
|||
|
|
const controlType = dataMapControl[dataType] ? dataMapControl[dataType] : 1
|
|||
|
|
|
|||
|
|
// 配置出选中的配置
|
|||
|
|
const fieldConfig = {
|
|||
|
|
field: getDataFieldValue(nodeData, 'FieldName'),
|
|||
|
|
label: getDataFieldValue(nodeData, 'ShowLabel'),
|
|||
|
|
controlType,
|
|||
|
|
dataType,
|
|||
|
|
operator: controlType === 1 ? '9' : '1',
|
|||
|
|
isCustom: getDataFieldValue(nodeData, 'IsCustom'),
|
|||
|
|
isSysParam: getDataFieldValue(nodeData, 'IsSysParam'),
|
|||
|
|
defaultValue: null,
|
|||
|
|
isSysQueryField: getDataFieldValue(nodeData, 'IsSysField', false),
|
|||
|
|
caseType: getDataFieldValue(nodeData, 'CaseType'),
|
|||
|
|
isRequire: getDataFieldValue(nodeData, 'IsRequire')
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 获取到当前选中项
|
|||
|
|
const { config } = props
|
|||
|
|
const find = config.fieldConfigs.find(item => item.id === id)
|
|||
|
|
if (find) {
|
|||
|
|
Object.keys(fieldConfig).forEach(key => {
|
|||
|
|
// 重写当前选中项各项值为选中的配置
|
|||
|
|
setDataFieldValue(find, key, getDataFieldValue(fieldConfig, key))
|
|||
|
|
!find.data && (find.data = {})
|
|||
|
|
find.data.enumName = getDataFieldValue(nodeData, 'EnumName')
|
|||
|
|
})
|
|||
|
|
props.onPanelContentChange instanceof Function && props.onPanelContentChange()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 操作关系选择
|
|||
|
|
const onOperatorChange = (id, value) => {
|
|||
|
|
const { config } = props
|
|||
|
|
const find = config.fieldConfigs.find(item => item.id === id)
|
|||
|
|
if (find) {
|
|||
|
|
find.operator = value ? value.toString() : ''
|
|||
|
|
props.onPanelContentChange instanceof Function && props.onPanelContentChange()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 构造树节点
|
|||
|
|
const getFieldTreeNode = (data) => {
|
|||
|
|
return data.filter(item => !item.IsCustom).map(item => {
|
|||
|
|
if (item.Children) {
|
|||
|
|
return (
|
|||
|
|
<TreeSelectNode
|
|||
|
|
title={item.Label}
|
|||
|
|
key={item.FieldName}
|
|||
|
|
value={item.FieldName}
|
|||
|
|
data={item}
|
|||
|
|
isLeaf={item.IsLeaf}
|
|||
|
|
>
|
|||
|
|
{getFieldTreeNode(item.Children)}
|
|||
|
|
</TreeSelectNode>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
return (
|
|||
|
|
<TreeSelectNode
|
|||
|
|
title={<>{item.IsRequire ? <span style={{ color: 'red' }}>*</span> : null}{item.Label}</>}
|
|||
|
|
key={item.FieldName}
|
|||
|
|
value={item.FieldName}
|
|||
|
|
data={item}
|
|||
|
|
isLeaf={item.IsLeaf}
|
|||
|
|
/>
|
|||
|
|
)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// TreeSelect 远程数据加载
|
|||
|
|
const handleLoadChildTreeNode = (treeNode) => {
|
|||
|
|
const { login, formId, dispatch } = props
|
|||
|
|
const { data } = treeNode.props
|
|||
|
|
if (data.Children) return Promise.resolve()
|
|||
|
|
|
|||
|
|
const json = initFilter(login.OrgId, formId, 'CREATE_TIME', 0, 1, data.FieldName, data.TypeName, data.Label)
|
|||
|
|
return dispatch({
|
|||
|
|
type: 'search/getQueryFields',
|
|||
|
|
payload: json
|
|||
|
|
}).then(ret => {
|
|||
|
|
treeNode.props.data.Children = ret
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const { data, config, queryFields } = props
|
|||
|
|
const { fieldConfigs = [], childGroups = [] } = config
|
|||
|
|
return (
|
|||
|
|
<>
|
|||
|
|
<IFComponent
|
|||
|
|
IF={fieldConfigs.length}
|
|||
|
|
ELSE={
|
|||
|
|
<Button
|
|||
|
|
icon='plus'
|
|||
|
|
type='dashed'
|
|||
|
|
shape='circle'
|
|||
|
|
title='新增条件'
|
|||
|
|
onClick={addFieldConfig}
|
|||
|
|
style={{ marginLeft: 12 }}
|
|||
|
|
/>
|
|||
|
|
}
|
|||
|
|
>
|
|||
|
|
{
|
|||
|
|
fieldConfigs.map((item, index) => {
|
|||
|
|
item.value = getDataFieldValue(data, item.id)
|
|||
|
|
const options = item.controlType === 1 ? operator1 : item.controlType === 3 ? operator3 : item.controlType === 7 ? operator7 : []
|
|||
|
|
return (
|
|||
|
|
<Row gutter={16} key={item.id} style={{ marginBottom: 6 }}>
|
|||
|
|
<Col span={6}>
|
|||
|
|
<TreeSelect
|
|||
|
|
allowClear
|
|||
|
|
showSearch
|
|||
|
|
value={item.field}
|
|||
|
|
placeholder='请选择字段'
|
|||
|
|
treeNodeFilterProp='title'
|
|||
|
|
loadData={handleLoadChildTreeNode}
|
|||
|
|
onSelect={(value, node) => onSelectChange(item.id, node.props.data)}
|
|||
|
|
onChange={value => !value && onSelectChange(item.id, null)}
|
|||
|
|
dropdownStyle={{
|
|||
|
|
maxHeight: 400,
|
|||
|
|
overflow: 'auto'
|
|||
|
|
}}
|
|||
|
|
style={{ width: '100%' }}
|
|||
|
|
>
|
|||
|
|
{getFieldTreeNode(queryFields)}
|
|||
|
|
</TreeSelect>
|
|||
|
|
</Col>
|
|||
|
|
<IFComponent IF={!!item.field}>
|
|||
|
|
<Col span={3}>
|
|||
|
|
<IFComponent IF={options.length}>
|
|||
|
|
<Select
|
|||
|
|
allowClear
|
|||
|
|
value={item.operator ? +item.operator : null}
|
|||
|
|
onChange={val => onOperatorChange(item.id, val)}
|
|||
|
|
>
|
|||
|
|
{options.map(option => <Option value={option.value} key={option.id + option.value}>{option.label}</Option>)}
|
|||
|
|
</Select>
|
|||
|
|
</IFComponent>
|
|||
|
|
</Col>
|
|||
|
|
<Col span={6}>{getControl(item)}</Col>
|
|||
|
|
</IFComponent>
|
|||
|
|
<Col span={3}>
|
|||
|
|
<Button
|
|||
|
|
icon='delete'
|
|||
|
|
type='danger'
|
|||
|
|
shape='circle'
|
|||
|
|
title='删除'
|
|||
|
|
onClick={() => deleteFieldConfig(item.id)}
|
|||
|
|
/>
|
|||
|
|
<IFComponent IF={index === fieldConfigs.length - 1}>
|
|||
|
|
<Button
|
|||
|
|
icon='plus'
|
|||
|
|
type='dashed'
|
|||
|
|
shape='circle'
|
|||
|
|
title='新增条件'
|
|||
|
|
onClick={addFieldConfig}
|
|||
|
|
style={{ marginLeft: 12 }}
|
|||
|
|
/>
|
|||
|
|
</IFComponent>
|
|||
|
|
</Col>
|
|||
|
|
</Row>
|
|||
|
|
)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
</IFComponent>
|
|||
|
|
<IFComponent IF={childGroups.length}>
|
|||
|
|
<SearchGroupField
|
|||
|
|
{...props}
|
|||
|
|
key={childGroups.map(item => item.id).join(';') || guid()}
|
|||
|
|
childField
|
|||
|
|
groups={childGroups}
|
|||
|
|
/>
|
|||
|
|
</IFComponent>
|
|||
|
|
</>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function PanelHeader (props) {
|
|||
|
|
const { app, config, index, onSelectChange, deleteGroupConfig, addGroupConfig } = props
|
|||
|
|
const enumOptions = app.enums && app.enums['FMUserCCQueryGroupRelationTypeEnum'] && app.enums['FMUserCCQueryGroupRelationTypeEnum'].options
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<div className='opt-search__collapseHeader'>
|
|||
|
|
<span>条件组{index + 1}</span>
|
|||
|
|
<div className='opt-search__collapseHeaderSelect'>
|
|||
|
|
<span>分组关系</span>
|
|||
|
|
<Select
|
|||
|
|
value={config.relationType}
|
|||
|
|
onChange={onSelectChange}
|
|||
|
|
size='small'
|
|||
|
|
style={{ width: 60 }}
|
|||
|
|
>
|
|||
|
|
{(enumOptions || []).map(option => <Option key={option.value} value={option.value}>{option.label}</Option>)}
|
|||
|
|
</Select>
|
|||
|
|
</div>
|
|||
|
|
<div className='opt-search__collapseHeaderAction'>
|
|||
|
|
<Icon
|
|||
|
|
type='delete'
|
|||
|
|
title='删除该分组'
|
|||
|
|
style={{ color: '#f00', marginRight: 15 }}
|
|||
|
|
onClick={deleteGroupConfig}
|
|||
|
|
/>
|
|||
|
|
<Icon
|
|||
|
|
type='plus'
|
|||
|
|
title='新增分组'
|
|||
|
|
onClick={addGroupConfig}
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
const CPanelHeader = connect(({ app }) => ({ app }))(PanelHeader)
|
|||
|
|
|
|||
|
|
class SearchGroupField extends Component {
|
|||
|
|
// 注意：该组件作为循环嵌套使用的子组件时，state 值均为父组件 state 的值的引用，无需 cloneDeep
|
|||
|
|
constructor (props) {
|
|||
|
|
super(props)
|
|||
|
|
this.state = {
|
|||
|
|
data: {},
|
|||
|
|
groupConfigs: [],
|
|||
|
|
queryFields: []
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
componentDidMount () {
|
|||
|
|
// 如果是 PanelContent 中渲染出来的该组件，那么可以直接拿 groups 属性作为 groupConfigs
|
|||
|
|
if (this.props.childField) {
|
|||
|
|
this.setState({
|
|||
|
|
data: this.props.data,
|
|||
|
|
groupConfigs: this.props.groups,
|
|||
|
|
queryFields: this.props.queryFields
|
|||
|
|
})
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.getQueryFields()
|
|||
|
|
const { onRef, fields, groups, presetValue } = this.props
|
|||
|
|
this.setGroupConfigs({ fields, groups, presetValue })
|
|||
|
|
onRef instanceof Function && onRef(this)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
UNSAFE_componentWillReceiveProps (nextProps) {
|
|||
|
|
// 如果是 PanelContent 中渲染出来的该组件，那么共享 queryFields
|
|||
|
|
// 放在 UNSAFE_componentWillReceiveProps 生命周期中是因为父组件的 queryFields 是通过接口获取的
|
|||
|
|
if (this.props.childField && !isEqual(nextProps.queryFields, this.state.queryFields)) {
|
|||
|
|
this.setState({ queryFields: this.props.queryFields })
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
getQueryFields = () => {
|
|||
|
|
const { code, formId, customConfigId, login, dispatch } = this.props
|
|||
|
|
const json = initFilter(login.OrgId, formId, '', 0, 1, customConfigId, login.userId, code)
|
|||
|
|
dispatch({
|
|||
|
|
type: 'search/getUserConfig',
|
|||
|
|
payload: json
|
|||
|
|
}).then(ret => {
|
|||
|
|
if (ret && ret.Nav_Fields) {
|
|||
|
|
this.setState({
|
|||
|
|
queryFields: ret.Nav_Fields.filter(item => !item.IsCustom)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
getGroupConfigs = (fields, groups, parentId, parent, list, fieldConfigs) => {
|
|||
|
|
const tempGroups = groups.filter(item => item.PARENT_ID === parentId)
|
|||
|
|
if (tempGroups && tempGroups.length) {
|
|||
|
|
tempGroups.sort((x, y) => x.NUM - y.NUM)
|
|||
|
|
tempGroups.forEach(group => {
|
|||
|
|
const config = {
|
|||
|
|
id: group.ID || guid(),
|
|||
|
|
title: group.TITLE,
|
|||
|
|
parentId: group.PARENT_ID,
|
|||
|
|
code: group.CODE,
|
|||
|
|
relationType: group.RELATION_TYPE,
|
|||
|
|
isDisplay: group.IS_DISPLAY,
|
|||
|
|
userCCQueryId: group.USER_C_C_QUERY_ID
|
|||
|
|
}
|
|||
|
|
const tempFields = fields.filter(item => item.USER_C_C_QUERY_GROUP_ID === config.id)
|
|||
|
|
if (tempFields && tempFields.length) {
|
|||
|
|
config.fieldConfigs = []
|
|||
|
|
tempFields.forEach(item => {
|
|||
|
|
const fieldConfig = getFieldConfigs({
|
|||
|
|
field: item,
|
|||
|
|
onPressEnter: this.onPressEnter,
|
|||
|
|
onChange: this.onChange
|
|||
|
|
})
|
|||
|
|
config.fieldConfigs.push(fieldConfig)
|
|||
|
|
fieldConfigs.push(fieldConfig)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
if (parent) {
|
|||
|
|
!parent.childGroups && (parent.childGroups = [])
|
|||
|
|
parent.childGroups.push(config)
|
|||
|
|
} else {
|
|||
|
|
list.push(config)
|
|||
|
|
}
|
|||
|
|
this.getGroupConfigs(fields, groups, config.id, config, list, fieldConfigs)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
setGroupConfigs = ({ fields, groups, presetValue }) => {
|
|||
|
|
const fieldConfigs = []
|
|||
|
|
const groupConfigs = []
|
|||
|
|
if (groups && groups.length) {
|
|||
|
|
groups.sort((x, y) => x.NUM - y.NUM)
|
|||
|
|
this.getGroupConfigs(fields, groups, null, null, groupConfigs, fieldConfigs)
|
|||
|
|
}
|
|||
|
|
// 赋值 data { field: value }
|
|||
|
|
const data = {}
|
|||
|
|
fieldConfigs.forEach(item => {
|
|||
|
|
if (presetValue !== undefined && typeof presetValue === 'object' && Object.keys(presetValue).length) {
|
|||
|
|
if (Object.prototype.hasOwnProperty.call(presetValue, item.field)) {
|
|||
|
|
data[item.id] = presetValue[item.field]
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (item.defaultValue !== undefined) {
|
|||
|
|
data[item.id] = item.defaultValue
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
this.setState({
|
|||
|
|
data,
|
|||
|
|
groupConfigs
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 新增一组配置 提供给 ref 调用
|
|||
|
|
addGroupConfig = (id) => {
|
|||
|
|
const { code, customConfigId } = this.props
|
|||
|
|
const config = {
|
|||
|
|
id: guid(),
|
|||
|
|
parentId: id,
|
|||
|
|
relationType: 1,
|
|||
|
|
isDisplay: true,
|
|||
|
|
code,
|
|||
|
|
userCCQueryId: customConfigId || null
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const find = digGroupData(this.state.groupConfigs, id)
|
|||
|
|
if (find) {
|
|||
|
|
!find.childGroups && (find.childGroups = [])
|
|||
|
|
find.childGroups.push(config)
|
|||
|
|
} else if (!id) {
|
|||
|
|
// 无 id，代表新增根配置
|
|||
|
|
this.state.groupConfigs.push(config)
|
|||
|
|
}
|
|||
|
|
// 直接修改 state，并使用 forceUpdate 更新，目的是为了保持对父组件 state 值的引用
|
|||
|
|
this.forceUpdate()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 删除一组配置
|
|||
|
|
deleteGroupConfig = (id) => {
|
|||
|
|
const findIndex = this.state.groupConfigs.findIndex(item => item.id === id)
|
|||
|
|
if (findIndex !== -1) {
|
|||
|
|
this.state.groupConfigs.splice(findIndex, 1)
|
|||
|
|
// 直接修改 state，并使用 forceUpdate 更新，目的是为了保持对父组件 state 值的引用
|
|||
|
|
this.forceUpdate()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 分组关系选择
|
|||
|
|
onSelectChange = (id, value) => {
|
|||
|
|
const find = digGroupData(this.state.groupConfigs, id)
|
|||
|
|
if (find) {
|
|||
|
|
find.relationType = value
|
|||
|
|
// 直接修改 state，并使用 forceUpdate 更新，目的是为了保持对父组件 state 值的引用
|
|||
|
|
this.forceUpdate()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// PanelContent 内容更新
|
|||
|
|
onPanelContentChange = () => {
|
|||
|
|
this.forceUpdate()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 回车搜索
|
|||
|
|
onPressEnter = ({ e: evt }) => {
|
|||
|
|
evt.stopPropagation()
|
|||
|
|
this.handleSearch()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// field change 时候赋值给 data
|
|||
|
|
onChange = (params) => {
|
|||
|
|
const { value, colConfig } = params
|
|||
|
|
setDataFieldValue(this.state.data, colConfig.id, value)
|
|||
|
|
// 直接修改 state，并使用 forceUpdate 更新，目的是为了保持对父组件 state 值的引用
|
|||
|
|
this.forceUpdate()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 执行搜索，搜索流程为：
|
|||
|
|
* 调用 Search 组件 onSearch 方法，
|
|||
|
|
* 然后 Search 分别通过 ref 分别调用 AdvanceSearch 和 SearchGroupField 的 getSearchParams 方法获取到搜索参数，
|
|||
|
|
* 最后再由 Search 组件完成搜索操作，这样搜索就统一在 Search 中做了
|
|||
|
|
*/
|
|||
|
|
handleSearch = () => {
|
|||
|
|
const { onSearch } = this.props
|
|||
|
|
onSearch instanceof Function && onSearch()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 获取搜索参数 提供给 ref 调用
|
|||
|
|
getSearchParams = (groups = []) => {
|
|||
|
|
return getGroupByGroupConfigs(this.state.data, this.state.groupConfigs, null, groups,this.props.user)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
render () {
|
|||
|
|
const { data, groupConfigs, queryFields } = this.state
|
|||
|
|
return (
|
|||
|
|
<IFComponent IF={groupConfigs.length}>
|
|||
|
|
<Collapse activeKey={groupConfigs.map(item => item.id)} className='opt-search__collapseWrap'>
|
|||
|
|
{
|
|||
|
|
groupConfigs.map((config, index) => {
|
|||
|
|
return (
|
|||
|
|
<Panel
|
|||
|
|
header={
|
|||
|
|
<CPanelHeader
|
|||
|
|
config={config}
|
|||
|
|
index={index}
|
|||
|
|
onSelectChange={val => this.onSelectChange(config.id, val)}
|
|||
|
|
deleteGroupConfig={() => this.deleteGroupConfig(config.id)}
|
|||
|
|
addGroupConfig={() => this.addGroupConfig(config.id)}
|
|||
|
|
/>
|
|||
|
|
}
|
|||
|
|
key={config.id}
|
|||
|
|
showArrow={false}
|
|||
|
|
style={{ background: '#eee' }}
|
|||
|
|
>
|
|||
|
|
<PanelContent
|
|||
|
|
{...this.props}
|
|||
|
|
data={data}
|
|||
|
|
queryFields={queryFields}
|
|||
|
|
config={config}
|
|||
|
|
onPanelContentChange={this.onPanelContentChange}
|
|||
|
|
onChange={this.onChange}
|
|||
|
|
onPressEnter={this.onPressEnter}
|
|||
|
|
/>
|
|||
|
|
</Panel>
|
|||
|
|
)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
</Collapse>
|
|||
|
|
</IFComponent>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default connect(({ login }) => ({ login }))(SearchGroupField)
|