5 文件已重命名
15个文件已修改
1个文件已删除
9个文件已添加
| | |
| | | * @param {Array} searches 搜索条件数组 |
| | | */ |
| | | formatSearch (searches) { |
| | | if (!searches || searches.length === 0) return [] |
| | | if (!searches) return [] |
| | | |
| | | let newsearches = [] |
| | | searches.forEach(search => { |
| | |
| | | required: search.required === 'true' |
| | | } |
| | | if (item.type === 'group') { |
| | | let copy = fromJS(item).toJS() |
| | | |
| | | item.value = search.initval && search.initval[0] ? search.initval[0] : '@$@' |
| | | item.match = '=' |
| | | |
| | | copy.key = search.datefield |
| | | copy.type = 'daterange' |
| | | copy.match = 'between' |
| | | copy.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')] |
| | | item.key = search.datefield |
| | | item.type = 'daterange' |
| | | item.match = 'between' |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')].join(',') |
| | | |
| | | newsearches.push(item) |
| | | newsearches.push(copy) |
| | | return |
| | | } else if (item.type === 'date') { |
| | | item.value = moment().format('YYYY-MM-DD') |
| | | } else if (item.type === 'datemonth') { |
| | | item.value = moment().format('YYYY-MM') |
| | | } else if (item.type === 'dateweek') { |
| | | item.value = [moment().startOf('week').format('YYYY-MM-DD'), moment().endOf('week').format('YYYY-MM-DD')] |
| | | item.value = moment().format('YYYY-MM-DD') |
| | | } else if (item.type === 'daterange') { |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')] |
| | | } else if (item.type === 'multiselect') { |
| | | item.value = ['@$@'] |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')].join(',') |
| | | } else if (item.type === 'multiselect' || (item.type === 'checkcard' && search.multiple === 'true')) { |
| | | item.type = 'multi' |
| | | item.value = '@$@' |
| | | } else { |
| | | item.value = '@$@' |
| | | } |
| | | newsearches.push(item) |
| | | }) |
| | | |
| | | |
| | | return newsearches |
| | | } |
| | | |
| | |
| | | config.easyCode = _curUserConfig.easyCode || config.easyCode || '' |
| | | } |
| | | |
| | | // 字段权限黑名单、必填、字段透视 |
| | | let valid = true |
| | | let roleId = sessionStorage.getItem('role_id') || '' |
| | | config.search = config.search.map(item => { |
| | | item.oriInitval = item.initval |
| | | if (['text', 'select', 'link'].includes(item.type) && param && param.$searchkey === item.field) { |
| | | item.initval = param.$searchval |
| | | } |
| | | config.search = Utils.initSearchVal(config.search) |
| | | |
| | | if (item.required === 'true' && !item.initval) { |
| | | valid = false |
| | | } |
| | | |
| | | if (!item.blacklist || item.blacklist.length === 0) return item |
| | | if (item.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { |
| | | item.Hide = 'true' |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | // 字段透视 |
| | | if (param && param.$searchkey) { |
| | | config.search = config.search.map(item => { |
| | | if (['text', 'select', 'link'].includes(item.type) && param.$searchkey === item.field) { |
| | | item.initval = param.$searchval |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | } |
| | | |
| | | // 数据源 |
| | | if (config.setting.interType === 'inner' && !config.setting.innerFunc) { |
| | |
| | | setting: config.setting, |
| | | searchlist: config.search, |
| | | arr_field: config.columns.map(item => item.field).join(','), |
| | | search: Utils.initMainSearch(config.search) // 搜索条件初始化(含有时间格式,需要转化) |
| | | search: Utils.initMainSearch(config.search) |
| | | }, () => { |
| | | if (config.setting.onload !== 'false' && valid) { // 初始化可加载 |
| | | if (config.setting.onload !== 'false') { |
| | | this.loadmaindata() |
| | | } |
| | | }) |
| | |
| | | async loadmaindata () { |
| | | const { setting, search, BID } = this.state |
| | | let param = '' |
| | | let requireFields = search.filter(item => item.required && (!item.value || item.value.length === 0)) |
| | | let requireFields = search.filter(item => item.required && item.value === '') |
| | | |
| | | if (requireFields.length > 0) { |
| | | return |
| | |
| | | } |
| | | let chartId = config.charts[0] ? config.charts[0].uuid : '' |
| | | |
| | | // 字段权限黑名单 |
| | | config.search = Utils.initSearchVal(config.search) |
| | | |
| | | // 字段透视及必填标志 |
| | | let hasReqFields = false |
| | | config.search = config.search.map(item => { |
| | | item.oriInitval = item.initval |
| | | if (['text', 'select', 'link'].includes(item.type) && param && param.$searchkey === item.field) { |
| | | item.initval = param.$searchval |
| | | } |
| | | |
| | | if (!item.blacklist || item.blacklist.length === 0) return item |
| | | if (item.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { |
| | | item.Hide = 'true' |
| | | if (item.required) { |
| | | hasReqFields = true |
| | | } |
| | | |
| | | return item |
| | |
| | | _columns.push(config.gridBtn) |
| | | } |
| | | |
| | | let valid = true // 搜索条件必填验证, 初始搜索条件, 如通过上级透视,写入搜索条件 |
| | | let hasReqFields = false |
| | | config.search.forEach(item => { |
| | | if (item.required !== 'true') return |
| | | if (!item.initval) { |
| | | valid = false |
| | | } |
| | | hasReqFields = true |
| | | }) |
| | | |
| | | this.setState({ |
| | | loadingview: false, |
| | | absFields, |
| | |
| | | columns: _columns, |
| | | arr_field: _arrField.join(','), |
| | | BID: param && param.$BID ? param.$BID : '', |
| | | search: Utils.initMainSearch(config.search), // 搜索条件初始化(含有时间格式,需要转化) |
| | | search: Utils.initMainSearch(config.search), |
| | | hasReqFields |
| | | }, () => { |
| | | if (config.setting.onload !== 'false' && valid) { // 初始化可加载 |
| | | if (config.setting.onload !== 'false') { // 初始化可加载 |
| | | this.loadData() |
| | | } |
| | | this.setShortcut() |
| | |
| | | let requireFields = [] |
| | | |
| | | if (hasReqFields) { |
| | | requireFields = search.filter(item => item.required && (!item.value || item.value.length === 0)) |
| | | requireFields = search.filter(item => item.required && item.value === '') |
| | | } |
| | | |
| | | this.setState({ |
| | |
| | | return false |
| | | } |
| | | } |
| | | // 搜索黑名单过滤 |
| | | |
| | | // 搜索条件初始化 |
| | | if (item.search && item.search.length > 0) { |
| | | item.search = item.search.map(cell => { |
| | | cell.oriInitval = cell.initval |
| | | |
| | | if (!cell.blacklist || cell.blacklist.length === 0) return cell |
| | | if (cell.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { |
| | | cell.Hide = 'true' |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | item.search = Utils.initSearchVal(item.search) |
| | | } |
| | | |
| | | if (item.type === 'table' && item.subtype === 'normaltable') { |
| | | let statFields = [] |
| | | let getCols = (cols) => { |
| | |
| | | }, |
| | | tables: [{"TbName":"s_custom_script","Remark":"自定义脚本"}], |
| | | search: [ |
| | | {"label":"描述","field":"Remark","type":"text","initval":"","match":"like","required":"false","ratio":6,"blacklist":[],"uuid":"1587005744706mppigfhf206gciiivf9"} |
| | | {"label":"描述","field":"Remark","type":"text","initval":"","oriInitval":"", "match":"like","required": false,"ratio":6,"blacklist":[],"uuid":"1587005744706mppigfhf206gciiivf9"} |
| | | ], |
| | | action:[ |
| | | {"label":"添加","OpenType":"pop","intertype":"inner","innerFunc":"s_custom_script_adduptdel","position":"toolbar","Ot":"notRequired","execSuccess":"grid","execError":"never","icon":"","class":"green","sql":"s_custom_script","sqlType":"insert","uuid":"1587006129803057fs8mb9q151ae6165"}, |
| | |
| | | config.action = config.action.filter(item => permAction[item.uuid]) |
| | | } |
| | | |
| | | let roleId = sessionStorage.getItem('role_id') || '' // 角色ID |
| | | // 字段权限黑名单 |
| | | config.search = config.search.map(item => { |
| | | item.oriInitval = item.initval |
| | | if (!item.blacklist || item.blacklist.length === 0) return item |
| | | if (item.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { |
| | | item.Hide = 'true' |
| | | config.search = Utils.initSearchVal(config.search) |
| | | |
| | | let hasReqFields = false |
| | | config.search.forEach(field => { |
| | | if (field.required) { |
| | | hasReqFields = true |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | // 字段权限黑名单 |
| | | let roleId = sessionStorage.getItem('role_id') || '' // 角色ID |
| | | |
| | | config.columns = config.columns.map(col => { |
| | | if (!col.blacklist || col.blacklist.length === 0) return col |
| | |
| | | _columns.push(config.gridBtn) |
| | | } |
| | | |
| | | let valid = true // 搜索条件必填验证 |
| | | let hasReqFields = false |
| | | config.search.forEach(field => { |
| | | if (field.required !== 'true') return |
| | | hasReqFields = true |
| | | if (!field.initval) { |
| | | valid = false |
| | | } |
| | | }) |
| | | |
| | | config.setting.tabType = 'sub' |
| | | // 数据源信息预处理 |
| | | config.setting.laypage = config.setting.laypage !== 'false' // 是否分页,转为boolean 统一格式 |
| | |
| | | actions: _actions, |
| | | columns: _columns, |
| | | arr_field: _arrField.join(','), |
| | | search: Utils.initMainSearch(config.search), // 搜索条件初始化(含有时间格式,需要转化) |
| | | search: Utils.initMainSearch(config.search), |
| | | hasReqFields |
| | | }, () => { |
| | | if (config.setting.onload !== 'false' && (!Tab.supMenu || BID || Tab.isTreeNode) && valid) { // 初始化可加载 |
| | | if (config.setting.onload !== 'false' && (!Tab.supMenu || BID || Tab.isTreeNode)) { // 初始化可加载 |
| | | this.loadData() |
| | | } |
| | | }) |
| | |
| | | config.action = config.action.filter(item => permAction[item.uuid]) |
| | | } |
| | | |
| | | let roleId = sessionStorage.getItem('role_id') || '' // 角色ID |
| | | // 字段权限黑名单 |
| | | config.search = config.search.filter(item => { |
| | | item.oriInitval = item.initval |
| | | if (!item.blacklist || item.blacklist.length === 0) return item |
| | | if (item.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { |
| | | item.Hide = 'true' |
| | | } |
| | | config.search = Utils.initSearchVal(config.search) |
| | | |
| | | return item |
| | | let hasReqFields = false |
| | | config.search.forEach(field => { |
| | | if (field.required) { |
| | | hasReqFields = true |
| | | } |
| | | }) |
| | | |
| | | // 字段权限黑名单 |
| | | let roleId = sessionStorage.getItem('role_id') || '' // 角色ID |
| | | |
| | | config.columns = config.columns.map(col => { |
| | | if (!col.blacklist || col.blacklist.length === 0) return col |
| | |
| | | _columns.push(config.gridBtn) |
| | | } |
| | | |
| | | let valid = true // 搜索条件必填验证 |
| | | let hasReqFields = false |
| | | config.search.forEach(field => { |
| | | if (field.required !== 'true') return |
| | | hasReqFields = true |
| | | if (!field.initval) { |
| | | valid = false |
| | | } |
| | | }) |
| | | |
| | | config.setting.tabType = 'subtab' |
| | | // 数据源信息预处理 |
| | | config.setting.laypage = config.setting.laypage !== 'false' // 是否分页,转为boolean 统一格式 |
| | |
| | | search: Utils.initMainSearch(config.search), // 搜索条件初始化(含有时间格式,需要转化) |
| | | hasReqFields |
| | | }, () => { |
| | | if (config.setting.onload !== 'false' && valid) { // 初始化可加载 |
| | | if (config.setting.onload !== 'false') { // 初始化可加载 |
| | | this.loadData() |
| | | } |
| | | }) |
| | |
| | | queryType: 'query', |
| | | }, |
| | | search:[ |
| | | {label: '传输号', field:'VersionName', type: 'text', initval:'',match: 'like', uuid: '1581736007223d84ddmht4gdfb1850nh'} |
| | | {label: '传输号', field: 'VersionName', type: 'text', initval:'', oriInitval: '', required: false, match: 'like', uuid: '1581736007223d84ddmht4gdfb1850nh'} |
| | | ], |
| | | action:[ |
| | | {label:'添加',OpenType:'pop',intertype:'outer',innerFunc:'',sysInterface:'true',outerFunc:'s_get_sVersiondetail_Up',interface:'http://cloud.mk9h.cn/webapi/dostars',callbackFunc:'s_sVersion_Local_add',position:'toolbar',Ot:'notRequired',execSuccess:'grid',execError:'never',icon:'',class:'green',uuid:'1583979660949vpssdb2p2lsqff9abkr'}, |
| | |
| | | onload:'true' |
| | | }, |
| | | search:[ |
| | | {label:'综合查询',field:'Remark,KeyWords,TypeName',type:'text',initval:'',match:'like','ratio':6,uuid:'1583983588787acl55md59fu9kpb52db'} |
| | | {label:'综合查询',field:'Remark,KeyWords,TypeName',type:'text',initval:'', oriInitval: '', required: false,match:'like','ratio':6,uuid:'1583983588787acl55md59fu9kpb52db'} |
| | | ], |
| | | action:[ |
| | | {label:'执行',OpenType:'pop',intertype:'outer',innerFunc:'',sysInterface:'true',outerFunc:'s_get_sVersionDetail_Ltext',interface:'http://cloud.mk9h.cn/webapi/dostars',callbackFunc:'s_sDataDictb_TBBack',position:'toolbar',execSuccess:'grid',execError:'never',icon:'',class:'primary',Ot:'required',uuid:'1583983849299g1qfd28g3c9n9e0e57a',verify:null}, |
| | |
| | | onload:'true' |
| | | }, |
| | | search:[ |
| | | {label:'综合查询',field:'Remark,KeyWords,TypeName',type:'text',initval:'',match:'like',uuid:'15839847143720ggaaukqtfhp3mirsuc'} |
| | | {label:'综合查询',field:'Remark,KeyWords,TypeName',type:'text',initval:'', oriInitval: '', required: false,match:'like',uuid:'15839847143720ggaaukqtfhp3mirsuc'} |
| | | ], |
| | | action:[], |
| | | columns:[ |
New file |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { fromJS } from 'immutable' |
| | | import { Form, Row, Col, Input, Select, DatePicker } from 'antd' |
| | | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import Utils from '@/utils/utils.js' |
| | | import './index.scss' |
| | | |
| | | const { MonthPicker, WeekPicker, RangePicker } = DatePicker |
| | | const CheckCard = asyncComponent(() => import('@/tabviews/zshare/mutilform/checkCard')) |
| | | |
| | | 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> |
| | | ) |
| | | } else if (item.type === 'checkcard') { // 多选框 |
| | | fields.push( |
| | | <Col span={item.ratio || 6} key={index}> |
| | | <Form.Item label={item.labelShow !== 'false' ? item.label : ''}> |
| | | {getFieldDecorator(item.field, { |
| | | initialValue: item.initval, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <CheckCard card={item} /> |
| | | )} |
| | | </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) |
New file |
| | |
| | | .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; |
| | | } |
| | | .check-card-form-box { |
| | | margin-top: 5px; |
| | | } |
| | | } |
New file |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { fromJS } from 'immutable' |
| | | 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 asyncComponent from '@/utils/asyncComponent' |
| | | 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' |
| | | import './index.scss' |
| | | |
| | | const { MonthPicker, WeekPicker, RangePicker } = DatePicker |
| | | const { Search } = Input |
| | | |
| | | const MutilForm = asyncSpinComponent(() => import('./advanceform')) |
| | | const CheckCard = asyncComponent(() => import('@/tabviews/zshare/mutilform/checkCard')) |
| | | |
| | | 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 // 刷新数据 |
| | | } |
| | | |
| | | state = { |
| | | dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | oriId: Utils.getuuid(), // 搜索表单Id |
| | | formId: '', // 搜索表单Id |
| | | searchlist: null, // 搜索项 |
| | | reset: true, // 控制组合搜索项重置 |
| | | float: '', // 浮动 |
| | | showButton: true, // 是否显示搜索按钮 |
| | | showAdvanced: false, // 是否显示高级搜索 |
| | | searchStyle: null, // 搜索条件样式 |
| | | searchValues: {}, // 搜索条件保存值 |
| | | advanceValues: [], // 高级搜索条件保存值 |
| | | visible: false, |
| | | adModelWidth: '1000px', |
| | | } |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { config, menuType, searchlist, setting } = this.props |
| | | |
| | | let _searchlist = [] |
| | | let _list = [] |
| | | let fieldMap = new Map() |
| | | let mainItems = [] // 云端或单点数据 |
| | | let localItems = [] // 本地数据 |
| | | let deForms = [] // 测试系统,单个请求 |
| | | 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() |
| | | } else if (config) { |
| | | _searchlist = fromJS(config.search).toJS() |
| | | if (config.type === 'search' && config.subtype === 'mainsearch') { |
| | | float = config.wrap.float |
| | | showButton = config.wrap.show !== 'false' |
| | | searchStyle = config.style |
| | | } else { |
| | | formId = '' |
| | | showButton = false |
| | | float = 'right' |
| | | } |
| | | } |
| | | |
| | | _searchlist.forEach(item => { |
| | | if (fieldMap.has(item.field)) { |
| | | item.field = item.field + '@tail@' |
| | | } |
| | | fieldMap.set(item.field, item) |
| | | |
| | | item.required = item.required === 'true' |
| | | |
| | | if (['select', 'link', 'multiselect', 'checkcard'].includes(item.type)) { |
| | | if (item.setAll === 'true' && ['select', 'link'].includes(item.type)) { |
| | | item.options.unshift({ |
| | | key: Utils.getuuid(), |
| | | Value: '', |
| | | Text: this.state.dict['main.all'] |
| | | }) |
| | | } |
| | | |
| | | // 数据源查询语句 |
| | | if (item.resourceType === '1' && item.dataSource) { |
| | | let _option = Utils.getSelectQueryOptions(item) |
| | | |
| | | // 测试系统单个请求 |
| | | if (menuType !== 'HS' && options.sysType === 'local' && !window.GLOB.systemType) { |
| | | deForms.push({ |
| | | ...item, |
| | | arr_field: _option.field, |
| | | data_sql: Utils.formatOptions(_option.sql) |
| | | }) |
| | | } else { // 合并请求,区分本地及系统 |
| | | // 外联数据库替换 |
| | | if (window.GLOB.externalDatabase !== null) { |
| | | _option.sql = _option.sql.replace(/@db@/ig, window.GLOB.externalDatabase) |
| | | } |
| | | if (item.database === 'sso') { |
| | | mainItems.push(`select '${item.field}' as obj_name,'${_option.field}' as arr_field,'${window.btoa(window.encodeURIComponent(_option.sql))}' as LText`) |
| | | } else { |
| | | localItems.push(`select '${item.field}' as obj_name,'${_option.field}' as arr_field,'${window.btoa(window.encodeURIComponent(_option.sql))}' as LText`) |
| | | } |
| | | } |
| | | } |
| | | item.oriOptions = fromJS(item.options).toJS() |
| | | } |
| | | |
| | | _list.push(item) |
| | | }) |
| | | |
| | | _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) |
| | | |
| | | if (!supItem) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: '未查询到搜索条件《' + item.label + '》关联字段!', |
| | | duration: 5 |
| | | }) |
| | | item.supInitVal = '' |
| | | } else { |
| | | item.supInitVal = supItem.initval |
| | | item.options = item.oriOptions.filter(option => option.ParentID === supItem.initval || option.Value === '') |
| | | } |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | float, |
| | | formId, |
| | | showButton, |
| | | searchStyle, |
| | | searchValues, |
| | | showAdvanced, |
| | | adModelWidth, |
| | | advanceValues, |
| | | searchlist: _list |
| | | }, () => { |
| | | if (menuType !== 'HS' && options.sysType === 'local' && !window.GLOB.systemType) { |
| | | this.improveSimpleSearch(deForms) |
| | | } else { |
| | | 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 |
| | | } |
| | | |
| | | // 查询下拉菜单 |
| | | improveSearch = (mainItems, localItems) => { |
| | | const { menuType, BID } = this.props |
| | | let deffers = [] |
| | | |
| | | if (menuType !== 'HS' && window.GLOB.systemType !== 'production') { |
| | | localItems = [...localItems, ...mainItems] |
| | | mainItems = [] |
| | | } |
| | | |
| | | // 本地请求 |
| | | let param = { |
| | | func: 'sPC_Get_SelectedList', |
| | | LText: localItems.join(' union all '), |
| | | obj_name: '', |
| | | arr_field: '', |
| | | table_type: 'Y' |
| | | } |
| | | |
| | | if (BID) { |
| | | param.BID = BID |
| | | } |
| | | |
| | | if (param.LText) { |
| | | param.LText = Utils.formatOptions(param.LText) |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.secretkey = Utils.encrypt(param.LText, param.timestamp) |
| | | |
| | | if (menuType === 'HS') { // 云端数据验证 |
| | | param.open_key = Utils.encryptOpenKey(param.secretkey, param.timestamp) |
| | | } |
| | | |
| | | deffers.push( |
| | | new Promise(resolve => { |
| | | Api.getSystemCacheConfig(param).then(res => { |
| | | if (!res.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: res.message, |
| | | duration: 5 |
| | | }) |
| | | } |
| | | resolve(res) |
| | | }) |
| | | }) |
| | | ) |
| | | } |
| | | |
| | | // 系统请求 |
| | | let mainparam = { |
| | | func: 'sPC_Get_SelectedList', |
| | | LText: mainItems.join(' union all '), |
| | | obj_name: '', |
| | | arr_field: '', |
| | | table_type: 'Y' |
| | | } |
| | | |
| | | if (BID) { |
| | | mainparam.BID = BID |
| | | } |
| | | |
| | | if (mainparam.LText) { |
| | | mainparam.LText = Utils.formatOptions(mainparam.LText) |
| | | mainparam.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | mainparam.secretkey = Utils.encrypt(mainparam.LText, mainparam.timestamp) |
| | | |
| | | if (menuType === 'HS') { // 云端数据验证 |
| | | mainparam.open_key = Utils.encryptOpenKey(mainparam.secretkey, mainparam.timestamp) |
| | | if (options.cloudServiceApi) { |
| | | mainparam.rduri = options.cloudServiceApi |
| | | mainparam.userid = sessionStorage.getItem('CloudUserID') || '' |
| | | mainparam.LoginUID = sessionStorage.getItem('CloudLoginUID') || '' |
| | | } |
| | | } else if (window.GLOB.mainSystemApi) { |
| | | mainparam.rduri = window.GLOB.mainSystemApi |
| | | } |
| | | |
| | | deffers.push( |
| | | new Promise(resolve => { |
| | | Api.getSystemCacheConfig(mainparam).then(res => { |
| | | if (!res.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: res.message, |
| | | duration: 5 |
| | | }) |
| | | } |
| | | resolve(res) |
| | | }) |
| | | }) |
| | | ) |
| | | } |
| | | |
| | | Promise.all(deffers).then(response => { |
| | | let result = {...response[0], ...(response[1] || {})} |
| | | |
| | | delete result.ErrCode |
| | | delete result.ErrMesg |
| | | delete result.message |
| | | delete result.status |
| | | |
| | | this.resetSearch(result) |
| | | }) |
| | | } |
| | | |
| | | resetSearch = (result) => { |
| | | let _searchlist = this.state.searchlist.map(item => { |
| | | if (['select', 'link', 'multiselect', 'checkcard'].includes(item.type) && result[item.field] && result[item.field].length > 0) { |
| | | let options = result[item.field].map(cell => { |
| | | let _item = { |
| | | key: Utils.getuuid() |
| | | } |
| | | |
| | | if (item.type !== 'checkcard') { |
| | | _item.Value = cell[item.valueField] |
| | | _item.Text = cell[item.valueText] |
| | | } else { |
| | | _item.$value = cell[item.cardValField] |
| | | _item = {..._item, ...cell} |
| | | } |
| | | |
| | | if (item.type === 'link') { |
| | | _item.ParentID = cell[item.linkField] |
| | | } |
| | | |
| | | return _item |
| | | }) |
| | | |
| | | item.oriOptions = [...item.oriOptions, ...options] |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | searchlist: _searchlist.map(item => { |
| | | if (item.type === 'link') { |
| | | if (item.supInitVal) { |
| | | item.options = item.oriOptions.filter(option => option.ParentID === item.supInitVal || option.Value === '') |
| | | } else { |
| | | item.options = item.oriOptions |
| | | } |
| | | } else if (item.type === 'select' || item.type === 'multiselect' || item.type === 'checkcard') { |
| | | item.options = item.oriOptions |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | // 测试系统单个请求下拉选项 |
| | | improveSimpleSearch = (deForms) => { |
| | | if (deForms.length === 0) return |
| | | |
| | | let deffers = deForms.map(item => { |
| | | let param = { |
| | | func: 'sPC_Get_SelectedList', |
| | | LText: item.data_sql, |
| | | obj_name: item.field, |
| | | arr_field: item.arr_field |
| | | } |
| | | |
| | | if (this.props.BID) { |
| | | param.BID = this.props.BID |
| | | } |
| | | |
| | | param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') |
| | | param.secretkey = Utils.encrypt(param.LText, param.timestamp) |
| | | |
| | | return ( |
| | | new Promise(resolve => { |
| | | Api.getSystemCacheConfig(param).then(res => { |
| | | if (!res.status) { |
| | | notification.warning({ |
| | | top: 92, |
| | | message: res.message, |
| | | duration: 5 |
| | | }) |
| | | } |
| | | resolve(res) |
| | | }) |
| | | }) |
| | | ) |
| | | }) |
| | | |
| | | Promise.all(deffers).then(response => { |
| | | let result = {} |
| | | |
| | | response.forEach(res => { |
| | | result = {...result, ...res} |
| | | }) |
| | | |
| | | delete result.ErrCode |
| | | delete result.ErrMesg |
| | | delete result.message |
| | | delete result.status |
| | | |
| | | this.resetSearch(result) |
| | | }) |
| | | } |
| | | |
| | | 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) { |
| | | this.searchChange() |
| | | return |
| | | } |
| | | |
| | | formlist = this.resetform(formlist, subfields, 0, fieldsvalue) |
| | | |
| | | if (Object.keys(fieldsvalue).length > 0) { |
| | | this.props.form.setFieldsValue(fieldsvalue) |
| | | } |
| | | |
| | | this.setState({ |
| | | searchlist: formlist |
| | | }, () => { |
| | | this.searchChange() |
| | | }) |
| | | } |
| | | |
| | | getFields() { |
| | | const { getFieldDecorator } = this.props.form |
| | | const { dict, showButton, formId, showAdvanced, float } = this.state |
| | | const fields = [] |
| | | |
| | | this.state.searchlist.forEach((item, index) => { |
| | | if (item.Hide === 'true' || (showAdvanced && item.advanced === 'true')) return |
| | | |
| | | 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: item.initval, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.input'] + item.label + '!' |
| | | } |
| | | ] |
| | | })(item.inputType === 'search' ? |
| | | <Search placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onSearch={this.handleSearch} enterButton/> : |
| | | <Input placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onPressEnter={this.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: item.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') { // 下拉多选 |
| | | let _initval = item.initval ? item.initval.split(',').filter(Boolean) : [] |
| | | 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" |
| | | onChange={this.searchChange} |
| | | 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: item.initval ? moment().subtract(item.initval, 'days') : null, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <DatePicker onChange={this.searchChange} 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: item.initval ? moment().subtract(item.initval, 'month') : null, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <MonthPicker onChange={this.searchChange} 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: item.initval ? moment().subtract(item.initval * 7, 'days') : null, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <WeekPicker onChange={this.searchChange} getCalendarContainer={() => formId ? document.getElementById(formId) : document.body} /> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | } else if (item.type === 'daterange') { |
| | | let _defaultValue = [null, null] |
| | | |
| | | if (item.initval) { |
| | | try { |
| | | let _initval = JSON.parse(item.initval) |
| | | _defaultValue = [moment().subtract(_initval[0], 'days'), moment().subtract(_initval[1], 'days')] |
| | | } catch { |
| | | _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'} |
| | | onChange={this.searchChange} |
| | | getCalendarContainer={() => formId ? document.getElementById(formId) : document.body} |
| | | /> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | } 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 ? 'group-required' : ''}> |
| | | <DateGroup reset={this.state.reset} position={index} card={item} onGroupChange={this.onGroupChange} /> |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | } else if (item.type === 'checkcard') { |
| | | fields.push( |
| | | <Col span={item.ratio || 6} key={index}> |
| | | <Form.Item label={item.labelShow !== 'false' ? item.label : ''}> |
| | | {getFieldDecorator(item.field, { |
| | | initialValue: item.initval, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <CheckCard card={item} onChange={this.searchChange} /> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | } |
| | | }) |
| | | |
| | | if (showButton) { |
| | | let action = ( |
| | | <Col span={6} style={{ whiteSpace: 'nowrap' }} className="search-button" key="actions"> |
| | | <Form.Item label={' '} colon={false} style={{ minHeight: '40px' }}> |
| | | <Button type="primary" onClick={this.handleSearch}> |
| | | {dict['main.search']} |
| | | </Button> |
| | | <Button style={{ marginLeft: 8 }} onClick={this.handleReset}> |
| | | {dict['main.reset']} |
| | | </Button> |
| | | {showAdvanced ? <Button type="link" onClick={this.handleAdvance}> |
| | | 高级 |
| | | </Button> : null} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | if (float === 'right') { |
| | | fields.unshift(action) |
| | | } else { |
| | | fields.push(action) |
| | | } |
| | | } |
| | | |
| | | return fields |
| | | } |
| | | |
| | | handleAdvance = () => { |
| | | this.setState({visible: true}) |
| | | } |
| | | |
| | | handleSearch = () => { |
| | | // 回车或点击搜索 |
| | | this.props.form.validateFields((err, values) => { |
| | | if (!err) { |
| | | 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 |
| | | } |
| | | |
| | | this.props.refreshdata(searches) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | onGroupChange = (values) => { |
| | | const { searchValues } = this.state |
| | | |
| | | this.setState({ |
| | | searchValues: {...searchValues, ...values} |
| | | }) |
| | | this.searchChange() |
| | | } |
| | | |
| | | searchChange = () => { |
| | | this.setState({}, () => { |
| | | this.props.form.validateFields((err, values) => { |
| | | if (!err) { |
| | | let searches = this.getFieldsValues(values) |
| | | |
| | | let requireFields = searches.filter(item => item.required && (!item.value || item.value.length === 0)) |
| | | if (requireFields.length > 0) { |
| | | return |
| | | } |
| | | |
| | | this.props.refreshdata(searches) |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * @description 搜索条件重置 |
| | | */ |
| | | handleReset = () => { |
| | | const { showAdvanced } = this.state |
| | | |
| | | 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, searchValues, advanceValues, reset: !this.state.reset}, () => { |
| | | this.props.form.resetFields() |
| | | this.props.form.validateFields((err, values) => { |
| | | if (!err) { |
| | | 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 |
| | | } |
| | | |
| | | this.props.refreshdata(searches) |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | getFieldsValues = (values) => { |
| | | const { searchValues, searchlist } = this.state |
| | | // 获取搜索条件值 |
| | | let search = [] |
| | | 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] || '' |
| | | } |
| | | |
| | | if (item.type === 'group') { |
| | | cell.type = 'daterange' |
| | | cell.key = item.datefield |
| | | cell.value = searchValues[item.datefield] || '' |
| | | cell.match = 'between' |
| | | |
| | | search.push(cell) |
| | | |
| | | 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, visible, searchlist, searchValues, showAdvanced, advanceValues, adModelWidth } = this.state |
| | | const formItemLayout = { |
| | | labelCol: { |
| | | xs: { span: 24 }, |
| | | sm: { span: 8 } |
| | | }, |
| | | wrapperCol: { |
| | | xs: { span: 24 }, |
| | | sm: { span: 16 } |
| | | } |
| | | } |
| | | |
| | | return ( |
| | | <> |
| | | <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> |
| | | </> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | export default Form.create()(MainSearch) |
New file |
| | |
| | | .top-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; |
| | | } |
| | | .group-required { |
| | | label::before { |
| | | display: inline-block; |
| | | margin-right: 4px; |
| | | color: #f5222d; |
| | | font-size: 14px; |
| | | font-family: SimSun, sans-serif; |
| | | line-height: 1; |
| | | 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; |
| | | } |
| | | } |
| | | } |
| | | .check-card-form-box { |
| | | margin-top: 5px; |
| | | } |
| | | } |
| | | .top-search.right { |
| | | >.ant-row { |
| | | >.ant-col { |
| | | float: right; |
| | | } |
| | | } |
| | | } |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { fromJS } from 'immutable' |
| | | import { Form, Row, Col, Input, Select, DatePicker } from 'antd' |
| | | import { Form, Row, Col, Input, Button } from 'antd' |
| | | |
| | | import asyncComponent from '@/utils/asyncComponent' |
| | | import Utils from '@/utils/utils.js' |
| | | import './index.scss' |
| | | |
| | | const { MonthPicker, WeekPicker, RangePicker } = DatePicker |
| | | const CheckCard = asyncComponent(() => import('@/tabviews/zshare/mutilform/checkCard')) |
| | | const { Search } = Input |
| | | const MKCheckCard = asyncComponent(() => import('@/tabviews/zshare/mutilform/checkCard')) |
| | | const MKSelect = asyncComponent(() => import('../mkSelect')) |
| | | const MKDatePicker = asyncComponent(() => import('../mkDatePicker')) |
| | | |
| | | class AdvanceSearch extends Component { |
| | | static propTpyes = { |
| | | dict: PropTypes.object, // 字典 |
| | | searchValues: PropTypes.object, // 搜索条件值 |
| | | record: PropTypes.object, // 搜索条件值 |
| | | searchlist: PropTypes.array, // 搜索条件列表 |
| | | handleSearch: PropTypes.func // 搜索条件提交 |
| | | advanceSubmit: PropTypes.func, // 搜索条件提交 |
| | | handleClose: 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 { record } = this.props |
| | | const fields = [] |
| | | |
| | | this.state.searchlist.forEach((item, index) => { |
| | | if (item.advanced !== 'true' || item.Hide === 'true') return |
| | | if (!item.advanced || item.hidden) 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] |
| | | const _rules = [ |
| | | { |
| | | required: item.required, |
| | | message: item.label + '不可为空!' |
| | | } |
| | | ] |
| | | |
| | | 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> |
| | | ) |
| | | } else if (item.type === 'checkcard') { // 多选框 |
| | | let content = null |
| | | item.initval = record[item.field] || '' |
| | | |
| | | if (item.type === 'text') { |
| | | if (item.inputType === 'search') { |
| | | content = <Search placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onSearch={this.handleSubmit} enterButton/> |
| | | } else { |
| | | content = <Input placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onPressEnter={this.handleSubmit} /> |
| | | } |
| | | } else if (item.type === 'select' || item.type === 'link' || item.type === 'multiselect') { |
| | | content = (<MKSelect config={item}/>) |
| | | } else if (item.type === 'date' || item.type === 'datemonth' || item.type === 'dateweek' || item.type === 'daterange') { |
| | | content = (<MKDatePicker config={item}/>) |
| | | } else if (item.type === 'checkcard') { |
| | | content = <MKCheckCard card={item}/> |
| | | } |
| | | |
| | | if (content) { |
| | | fields.push( |
| | | <Col span={item.ratio || 6} key={index}> |
| | | <Form.Item label={item.labelShow !== 'false' ? item.label : ''}> |
| | | {getFieldDecorator(item.field, { |
| | | initialValue: item.initval, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <CheckCard card={item} /> |
| | | )} |
| | | rules: _rules |
| | | })(content)} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | |
| | | return fields |
| | | } |
| | | |
| | | handleConfirm = () => { |
| | | handleSubmit = () => { |
| | | // 回车或点击搜索 |
| | | return new Promise((resolve, reject) => { |
| | | this.props.form.validateFields((err, values) => { |
| | | if (!err) { |
| | | resolve(values) |
| | | } |
| | | }) |
| | | this.props.form.validateFields((err, values) => { |
| | | if (err) return |
| | | |
| | | this.props.advanceSubmit(values) |
| | | }) |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | return ( |
| | | <Form {...formItemLayout} className="advance-search" id={this.state.formId}> |
| | | <Form {...formItemLayout} className="advance-search"> |
| | | <Row gutter={24}>{this.getFields()}</Row> |
| | | <div className="advance-button"> |
| | | <Button style={{ marginRight: 8 }} onClick={this.props.handleClose}> |
| | | 关闭 |
| | | </Button> |
| | | <Button type="primary" onClick={this.handleSubmit}> |
| | | 确定 |
| | | </Button> |
| | | </div> |
| | | </Form> |
| | | ) |
| | | } |
| | |
| | | .advance-search { |
| | | background: #ffffff; |
| | | margin-bottom: 35px; |
| | | .ant-form-item { |
| | | display: flex; |
| | | margin-bottom: 0px; |
| | |
| | | .check-card-form-box { |
| | | margin-top: 5px; |
| | | } |
| | | .advance-button { |
| | | position: absolute; |
| | | left: 0; |
| | | bottom: 0; |
| | | width: 100%; |
| | | text-align: right; |
| | | padding: 10px; |
| | | border-top: 1px solid #f0f0f0; |
| | | } |
| | | } |
New file |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { DatePicker, Tooltip, Icon } from 'antd' |
| | | import moment from 'moment' |
| | | |
| | | import Utils from '@/utils/utils.js' |
| | | import QuarterPicker from './quarterpicker' |
| | | import YearPicker from './yearpicker' |
| | | import './index.scss' |
| | | |
| | | const { MonthPicker, WeekPicker, RangePicker } = DatePicker |
| | | |
| | | class DateGroup extends Component { |
| | | static propTpyes = { |
| | | config: PropTypes.object, |
| | | position: PropTypes.number, // 索引,用于控制季度和年的展开方向 |
| | | onChange: PropTypes.func |
| | | } |
| | | |
| | | state = { |
| | | active: '', |
| | | quarterId: Utils.getuuid(), |
| | | yearId: Utils.getuuid(), |
| | | dateRange: '', |
| | | placement: this.props.position % 4 !== 3 ? 'bottomLeft' : 'bottomRight' |
| | | } |
| | | |
| | | UNSAFE_componentWillMount() { |
| | | const { config } = this.props |
| | | |
| | | this.setState({ |
| | | active: config.initType, |
| | | dateRange: config.initval |
| | | }) |
| | | } |
| | | |
| | | onChange = (date, type) => { |
| | | let values = [] |
| | | if (type === 'day') { |
| | | values = [moment(date).format('YYYY-MM-DD'), moment(date).format('YYYY-MM-DD')] |
| | | } else if (type === 'week') { |
| | | values = [moment(date).startOf('week').format('YYYY-MM-DD'), moment(date).endOf('week').format('YYYY-MM-DD')] |
| | | } else if (type === 'month') { |
| | | values = [moment(date).startOf('month').format('YYYY-MM-DD'), moment(date).endOf('month').format('YYYY-MM-DD')] |
| | | } else if (type === 'quarter') { |
| | | values = date |
| | | document.getElementById(this.state.quarterId).click() |
| | | } else if (type === 'year') { |
| | | values = date |
| | | document.getElementById(this.state.yearId).click() |
| | | } else if (type === 'customized') { |
| | | values = [moment(date[0]).format('YYYY-MM-DD'), moment(date[1]).format('YYYY-MM-DD')] |
| | | } |
| | | |
| | | values = values.join(',') |
| | | |
| | | this.setState({ |
| | | active: type, |
| | | dateRange: values |
| | | }, () => { |
| | | this.props.onChange(values, type) |
| | | }) |
| | | } |
| | | |
| | | clearTime = () => { |
| | | this.setState({ |
| | | active: '', |
| | | dateRange: '' |
| | | }, () => { |
| | | this.props.onChange('', '') |
| | | }) |
| | | } |
| | | |
| | | render() { |
| | | const { config } = this.props |
| | | const { active, quarterId, yearId, dateRange, placement } = this.state |
| | | let tabs = {day: '日', week: '周', month: '月', quarter: '季', year: '年', customized: '自定义'} |
| | | |
| | | return ( |
| | | <div className="table-search-date-group"> |
| | | {config.items.map(tab => { |
| | | if (tab === 'day') { |
| | | return (<span key={tab} className={'ant-tag ant-tag-checkable ' + (active === tab ? 'ant-tag-checkable-checked' : '')} > |
| | | {tabs[tab]} |
| | | <DatePicker allowClear={false} onChange={(date) => this.onChange(date, tab)} /> |
| | | </span>) |
| | | } else if (tab === 'week') { |
| | | return (<span key={tab} className={'ant-tag ant-tag-checkable ' + (active === tab ? 'ant-tag-checkable-checked' : '')} > |
| | | {tabs[tab]} |
| | | <WeekPicker dropdownClassName="group-week-picker" allowClear={false} onChange={(date) => this.onChange(date, tab)} /> |
| | | </span>) |
| | | } else if (tab === 'month') { |
| | | return (<span key={tab} className={'ant-tag ant-tag-checkable ' + (active === tab ? 'ant-tag-checkable-checked' : '')} > |
| | | {tabs[tab]} |
| | | <MonthPicker allowClear={false} onChange={(date) => this.onChange(date, tab)} /> |
| | | </span>) |
| | | } else if (tab === 'quarter') { |
| | | return ( |
| | | <Tooltip key={tab} placement={placement} overlayClassName={'quarter-picker-tooltip ' + placement} trigger="click" title={ |
| | | <div> |
| | | <QuarterPicker card={config} onChange={(date) => this.onChange(date, tab)}/> |
| | | </div> |
| | | }> |
| | | <span id={quarterId} className={'ant-tag ant-tag-quarter ant-tag-checkable ' + (active === tab ? 'ant-tag-checkable-checked' : '')} > |
| | | {tabs[tab]} |
| | | </span> |
| | | </Tooltip> |
| | | ) |
| | | } else if (tab === 'year') { |
| | | return ( |
| | | <Tooltip key={tab} placement={placement} overlayClassName={'year-picker-tooltip ' + placement} trigger="click" title={ |
| | | <div> |
| | | <YearPicker card={config} onChange={(date) => this.onChange(date, tab)}/> |
| | | </div> |
| | | }> |
| | | <span id={yearId} className={'ant-tag ant-tag-quarter ant-tag-checkable ' + (active === tab ? 'ant-tag-checkable-checked' : '')} > |
| | | {tabs[tab]} |
| | | </span> |
| | | </Tooltip> |
| | | ) |
| | | } else { |
| | | return (<span key={tab} className={'ant-tag ant-tag-checkable ' + (active === tab ? 'ant-tag-checkable-checked' : '')} > |
| | | {tabs[tab]} |
| | | <RangePicker allowClear={false} onChange={(date) => this.onChange(date, tab)} /> |
| | | </span>) |
| | | } |
| | | })} |
| | | |
| | | {dateRange ? <div className="table-search-date-group-value"> |
| | | {dateRange.replace(',', ' ~ ')} |
| | | <Icon type="close-circle" onClick={this.clearTime} className="ant-calendar-picker-clear" /> |
| | | </div> : null} |
| | | </div> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | export default DateGroup |
| | |
| | | import React, {Component} from 'react' |
| | | import PropTypes from 'prop-types' |
| | | import { fromJS } from 'immutable' |
| | | import { Form, Row, Col, Input, Button, Select, DatePicker, notification, Modal, Icon } from 'antd' |
| | | import { Form, Row, Col, Input, Button, 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 asyncComponent from '@/utils/asyncComponent' |
| | | import asyncSpinComponent from '@/utils/asyncSpinComponent' |
| | | import Utils from '@/utils/utils.js' |
| | |
| | | import enUS from '@/locales/en-US/main.js' |
| | | import './index.scss' |
| | | |
| | | const { MonthPicker, WeekPicker, RangePicker } = DatePicker |
| | | const { Search } = Input |
| | | |
| | | const MutilForm = asyncSpinComponent(() => import('./advanceform')) |
| | | const CheckCard = asyncComponent(() => import('@/tabviews/zshare/mutilform/checkCard')) |
| | | const MKCheckCard = asyncComponent(() => import('@/tabviews/zshare/mutilform/checkCard')) |
| | | const MKSelect = asyncComponent(() => import('./mkSelect')) |
| | | const DateGroup = asyncComponent(() => import('./dategroup')) |
| | | const MKDatePicker = asyncComponent(() => import('./mkDatePicker')) |
| | | |
| | | class MainSearch extends Component { |
| | | static propTpyes = { |
| | |
| | | |
| | | state = { |
| | | dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, |
| | | oriId: Utils.getuuid(), // 搜索表单Id |
| | | formId: '', // 搜索表单Id |
| | | searchlist: null, // 搜索项 |
| | | reset: true, // 控制组合搜索项重置 |
| | | float: '', // 浮动 |
| | | showButton: true, // 是否显示搜索按钮 |
| | | showAdvanced: false, // 是否显示高级搜索 |
| | | searchStyle: null, // 搜索条件样式 |
| | | searchValues: {}, // 搜索条件保存值 |
| | | advanceValues: [], // 高级搜索条件保存值 |
| | | visible: false, |
| | | adModelWidth: '1000px', |
| | | hasReqFields: false |
| | | } |
| | | |
| | | record = {} |
| | | |
| | | UNSAFE_componentWillMount () { |
| | | const { config, menuType, searchlist, setting } = this.props |
| | | |
| | | let _searchlist = [] |
| | | let _list = [] |
| | | let fieldMap = new Map() |
| | | let mainItems = [] // 云端或单点数据 |
| | | let localItems = [] // 本地数据 |
| | |
| | | let float = '' |
| | | let showButton = true |
| | | let searchStyle = null |
| | | let searchValues = {} |
| | | let advanceValues = [] |
| | | let showAdvanced = false |
| | | let adModelWidth = 1000 |
| | | let formId = Utils.getuuid() |
| | | let linkFields = {} |
| | | let record = {} |
| | | let hasReqFields = false |
| | | |
| | | if (setting && setting.advanceWidth) { |
| | | adModelWidth = setting.advanceWidth |
| | |
| | | showButton = config.wrap.show !== 'false' |
| | | searchStyle = config.style |
| | | } else { |
| | | formId = '' |
| | | showButton = false |
| | | float = 'right' |
| | | } |
| | | } |
| | | |
| | | _searchlist.forEach(item => { |
| | | if (item.type === 'link') { |
| | | linkFields[item.linkField] = linkFields[item.linkField] || [] |
| | | linkFields[item.linkField].push({field: item.field, uuid: item.uuid}) |
| | | } |
| | | |
| | | if (fieldMap.has(item.field)) { |
| | | item.field = item.field + '@tail@' |
| | | } |
| | | fieldMap.set(item.field, item) |
| | | |
| | | item.required = item.required === 'true' |
| | | if (item.required) { |
| | | hasReqFields = true |
| | | } |
| | | |
| | | if (showButton && item.advanced) { |
| | | showAdvanced = true |
| | | } else { |
| | | item.advanced = false |
| | | } |
| | | |
| | | if (item.advanced && item.initval) { |
| | | advanceValues.push({field: item.field, type: item.type, label: item.label, value: item.initval}) |
| | | } |
| | | |
| | | if (item.type === 'group') { |
| | | record[item.field] = item.initType |
| | | record[item.datefield] = item.initval |
| | | } else { |
| | | record[item.field] = item.initval |
| | | } |
| | | |
| | | if (['select', 'link', 'multiselect', 'checkcard'].includes(item.type)) { |
| | | item.options = item.options || [] |
| | | if (item.setAll === 'true' && ['select', 'link'].includes(item.type)) { |
| | | item.options.unshift({ |
| | | key: Utils.getuuid(), |
| | |
| | | item.oriOptions = fromJS(item.options).toJS() |
| | | } |
| | | |
| | | _list.push(item) |
| | | fieldMap.set(item.field, item) |
| | | }) |
| | | |
| | | _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 |
| | | this.record = record |
| | | |
| | | 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] : '' |
| | | let _list = _searchlist.map(item => { |
| | | if (item.hidden) return item |
| | | |
| | | if (linkFields[item.field] && (item.type === 'select' || item.type === 'link')) { |
| | | item.linkFields = linkFields[item.field] |
| | | } |
| | | |
| | | if (item.type === 'link') { |
| | |
| | | message: '未查询到搜索条件《' + item.label + '》关联字段!', |
| | | duration: 5 |
| | | }) |
| | | item.supInitVal = '' |
| | | item.type = 'select' |
| | | } else { |
| | | item.supInitVal = supItem.initval |
| | | item.options = item.oriOptions.filter(option => option.ParentID === supItem.initval || option.Value === '') |
| | |
| | | |
| | | this.setState({ |
| | | float, |
| | | formId, |
| | | showButton, |
| | | searchStyle, |
| | | searchValues, |
| | | hasReqFields, |
| | | showAdvanced, |
| | | adModelWidth, |
| | | advanceValues, |
| | |
| | | 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 |
| | | } |
| | | |
| | | // 查询下拉菜单 |
| | |
| | | }) |
| | | } |
| | | |
| | | resetSearch = (result) => { |
| | | let _searchlist = this.state.searchlist.map(item => { |
| | | if (['select', 'link', 'multiselect', 'checkcard'].includes(item.type) && result[item.field] && result[item.field].length > 0) { |
| | | let options = result[item.field].map(cell => { |
| | | let _item = { |
| | | key: Utils.getuuid() |
| | | } |
| | | |
| | | if (item.type !== 'checkcard') { |
| | | _item.Value = cell[item.valueField] |
| | | _item.Text = cell[item.valueText] |
| | | } else { |
| | | _item.$value = cell[item.cardValField] |
| | | _item = {..._item, ...cell} |
| | | } |
| | | |
| | | if (item.type === 'link') { |
| | | _item.ParentID = cell[item.linkField] |
| | | } |
| | | |
| | | return _item |
| | | }) |
| | | |
| | | item.oriOptions = [...item.oriOptions, ...options] |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | this.setState({ |
| | | searchlist: _searchlist.map(item => { |
| | | if (item.type === 'link') { |
| | | if (item.supInitVal) { |
| | | item.options = item.oriOptions.filter(option => option.ParentID === item.supInitVal || option.Value === '') |
| | | } else { |
| | | item.options = item.oriOptions |
| | | } |
| | | } else if (item.type === 'select' || item.type === 'multiselect' || item.type === 'checkcard') { |
| | | item.options = item.oriOptions |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | // 测试系统单个请求下拉选项 |
| | | improveSimpleSearch = (deForms) => { |
| | | if (deForms.length === 0) return |
| | |
| | | }) |
| | | } |
| | | |
| | | 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 |
| | | resetSearch = (result) => { |
| | | let _searchlist = this.state.searchlist.map(item => { |
| | | if (['select', 'link', 'multiselect', 'checkcard'].includes(item.type) && result[item.field] && result[item.field].length > 0) { |
| | | let options = result[item.field].map(cell => { |
| | | let _item = { |
| | | key: Utils.getuuid() |
| | | } |
| | | |
| | | subfields.push(item) |
| | | } |
| | | return item |
| | | }) |
| | | }) |
| | | |
| | | if (subfields.length === 0 || index > 6) { |
| | | return formlist |
| | | } else { |
| | | return this.resetform(formlist, subfields, index, fieldsvalue) |
| | | } |
| | | } |
| | | if (item.type !== 'checkcard') { |
| | | _item.Value = cell[item.valueField] |
| | | _item.Text = cell[item.valueText] |
| | | } else { |
| | | _item.$value = cell[item.cardValField] |
| | | _item = {..._item, ...cell} |
| | | } |
| | | |
| | | selectChange = (_field, value) => { |
| | | let formlist = fromJS(this.state.searchlist).toJS() |
| | | if (item.type === 'link') { |
| | | _item.ParentID = cell[item.linkField] |
| | | } |
| | | |
| | | 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 : '' |
| | | return _item |
| | | }) |
| | | |
| | | if (this.props.form.getFieldValue(item.field) !== undefined) { |
| | | fieldsvalue[item.field] = item.initval |
| | | } |
| | | |
| | | subfields.push(item) |
| | | item.oriOptions = [...item.oriOptions, ...options] |
| | | } |
| | | return item |
| | | }) |
| | | |
| | | if (subfields.length === 0) { |
| | | this.searchChange() |
| | | return |
| | | } |
| | | |
| | | formlist = this.resetform(formlist, subfields, 0, fieldsvalue) |
| | | |
| | | if (Object.keys(fieldsvalue).length > 0) { |
| | | this.props.form.setFieldsValue(fieldsvalue) |
| | | } |
| | | |
| | | this.setState({ |
| | | searchlist: formlist |
| | | }, () => { |
| | | this.searchChange() |
| | | searchlist: _searchlist.map(item => { |
| | | if (item.type === 'link') { |
| | | if (item.supInitVal) { |
| | | item.options = item.oriOptions.filter(option => option.ParentID === item.supInitVal || option.Value === '') |
| | | } else { |
| | | item.options = item.oriOptions |
| | | } |
| | | } else if (item.type === 'select' || item.type === 'multiselect' || item.type === 'checkcard') { |
| | | item.options = item.oriOptions |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | recordChange = (val, defer, item) => { |
| | | this.record[item.field] = val |
| | | |
| | | if (defer) return |
| | | |
| | | if (item.linkFields) { |
| | | setTimeout(() => { |
| | | this.handleSubmit() |
| | | }, 1000) |
| | | } else { |
| | | this.handleSubmit() |
| | | } |
| | | } |
| | | |
| | | dateGroupChange = (val, type, item) => { |
| | | this.record[item.datefield] = val |
| | | this.record[item.field] = type |
| | | |
| | | this.handleSubmit() |
| | | } |
| | | |
| | | getFields() { |
| | | const { getFieldDecorator } = this.props.form |
| | | const { dict, showButton, formId, showAdvanced, float } = this.state |
| | | const { dict, showButton, showAdvanced, float } = this.state |
| | | const fields = [] |
| | | |
| | | this.state.searchlist.forEach((item, index) => { |
| | | if (item.Hide === 'true' || (showAdvanced && item.advanced === 'true')) return |
| | | |
| | | 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: item.initval, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.input'] + item.label + '!' |
| | | } |
| | | ] |
| | | })(item.inputType === 'search' ? |
| | | <Search placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onSearch={this.handleSearch} enterButton/> : |
| | | <Input placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onPressEnter={this.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: item.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') { // 下拉多选 |
| | | let _initval = item.initval ? item.initval.split(',').filter(Boolean) : [] |
| | | 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" |
| | | onChange={this.searchChange} |
| | | 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: item.initval ? moment().subtract(item.initval, 'days') : null, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <DatePicker onChange={this.searchChange} 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: item.initval ? moment().subtract(item.initval, 'month') : null, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <MonthPicker onChange={this.searchChange} 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: item.initval ? moment().subtract(item.initval * 7, 'days') : null, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <WeekPicker onChange={this.searchChange} getCalendarContainer={() => formId ? document.getElementById(formId) : document.body} /> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | } else if (item.type === 'daterange') { |
| | | let _defaultValue = [null, null] |
| | | if (item.hidden || item.advanced) return |
| | | |
| | | if (item.initval) { |
| | | try { |
| | | let _initval = JSON.parse(item.initval) |
| | | _defaultValue = [moment().subtract(_initval[0], 'days'), moment().subtract(_initval[1], 'days')] |
| | | } catch { |
| | | _defaultValue = [null, null] |
| | | } |
| | | const _rules = [ |
| | | { |
| | | required: item.required, |
| | | message: item.label + '不可为空!' |
| | | } |
| | | ] |
| | | |
| | | 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'} |
| | | onChange={this.searchChange} |
| | | getCalendarContainer={() => formId ? document.getElementById(formId) : document.body} |
| | | /> |
| | | )} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | let content = null |
| | | let field = item.field |
| | | |
| | | if (item.type === 'text') { |
| | | if (item.inputType === 'search') { |
| | | content = <Search placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onSearch={this.handleSubmit} enterButton/> |
| | | } else { |
| | | content = <Input placeholder={item.labelShow === 'false' ? item.label : ''} autoComplete="off" onPressEnter={this.handleSubmit} /> |
| | | } |
| | | } else if (item.type === 'select' || item.type === 'link' || item.type === 'multiselect') { |
| | | content = (<MKSelect config={item} onChange={(val, defer) => this.recordChange(val, defer, item)} />) |
| | | } else if (item.type === 'date' || item.type === 'datemonth' || item.type === 'dateweek' || item.type === 'daterange') { |
| | | content = (<MKDatePicker config={item} onChange={(val) => this.recordChange(val, false, item)} />) |
| | | } 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 ? 'group-required' : ''}> |
| | | <DateGroup reset={this.state.reset} position={index} card={item} onGroupChange={this.onGroupChange} /> |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | | field = item.datefield |
| | | content = <DateGroup position={index} config={item} onChange={(val, type) => this.dateGroupChange(val, type, item)} /> |
| | | } else if (item.type === 'checkcard') { |
| | | content = <MKCheckCard card={item} onChange={this.handleSubmit} /> |
| | | } |
| | | |
| | | if (content) { |
| | | fields.push( |
| | | <Col span={item.ratio || 6} key={index}> |
| | | <Form.Item label={item.labelShow !== 'false' ? item.label : ''}> |
| | | {getFieldDecorator(item.field, { |
| | | {getFieldDecorator(field, { |
| | | initialValue: item.initval, |
| | | rules: [ |
| | | { |
| | | required: item.required, |
| | | message: dict['form.required.select'] + item.label + '!' |
| | | } |
| | | ] |
| | | })( |
| | | <CheckCard card={item} onChange={this.searchChange} /> |
| | | )} |
| | | rules: _rules |
| | | })(content)} |
| | | </Form.Item> |
| | | </Col> |
| | | ) |
| | |
| | | let action = ( |
| | | <Col span={6} style={{ whiteSpace: 'nowrap' }} className="search-button" key="actions"> |
| | | <Form.Item label={' '} colon={false} style={{ minHeight: '40px' }}> |
| | | <Button type="primary" onClick={this.handleSearch}> |
| | | <Button type="primary" onClick={this.handleSubmit}> |
| | | {dict['main.search']} |
| | | </Button> |
| | | <Button style={{ marginLeft: 8 }} onClick={this.handleReset}> |
| | |
| | | this.setState({visible: true}) |
| | | } |
| | | |
| | | handleSearch = () => { |
| | | // 回车或点击搜索 |
| | | this.props.form.validateFields((err, values) => { |
| | | if (!err) { |
| | | 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 |
| | | } |
| | | |
| | | this.props.refreshdata(searches) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | onGroupChange = (values) => { |
| | | const { searchValues } = this.state |
| | | |
| | | this.setState({ |
| | | searchValues: {...searchValues, ...values} |
| | | }) |
| | | this.searchChange() |
| | | } |
| | | |
| | | searchChange = () => { |
| | | handleSubmit = () => { |
| | | this.setState({}, () => { |
| | | this.props.form.validateFields((err, values) => { |
| | | if (!err) { |
| | | let searches = this.getFieldsValues(values) |
| | | |
| | | let requireFields = searches.filter(item => item.required && (!item.value || item.value.length === 0)) |
| | | if (requireFields.length > 0) { |
| | | return |
| | | } |
| | | |
| | | this.props.refreshdata(searches) |
| | | } |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | /** |
| | | * @description 搜索条件重置 |
| | | */ |
| | | handleReset = () => { |
| | | const { showAdvanced } = this.state |
| | | |
| | | 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, searchValues, advanceValues, reset: !this.state.reset}, () => { |
| | | this.props.form.resetFields() |
| | | this.props.form.validateFields((err, values) => { |
| | | if (!err) { |
| | | let searches = this.getFieldsValues(values) |
| | | |
| | | if (err) return |
| | | |
| | | let searches = this.getFieldsValues(values) |
| | | |
| | | if (this.state.hasReqFields) { |
| | | let requireFields = searches.filter(item => item.required && (!item.value || item.value.length === 0)) |
| | | if (requireFields.length > 0) { |
| | | let labels = requireFields.map(item => item.label) |
| | |
| | | }) |
| | | return |
| | | } |
| | | |
| | | this.props.refreshdata(searches) |
| | | } |
| | | |
| | | this.props.refreshdata(searches) |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | getFieldsValues = (values) => { |
| | | const { searchValues, searchlist } = this.state |
| | | /** |
| | | * @description 搜索条件重置 |
| | | */ |
| | | handleReset = () => { |
| | | let record = {} |
| | | let advanceValues = [] |
| | | let searchlist = this.state.searchlist.map(item => { |
| | | item.initval = item.oriInitval |
| | | |
| | | if (item.type === 'group') { |
| | | record[item.datefield] = item.initval |
| | | record[item.field] = item.initType |
| | | } else { |
| | | record[item.field] = item.initval |
| | | } |
| | | if (item.advanced && item.initval) { |
| | | advanceValues.push({field: item.field, type: item.type, label: item.label, value: item.initval}) |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | |
| | | this.record = record |
| | | |
| | | this.setState({searchlist: [], advanceValues}, () => { |
| | | this.setState({searchlist}, () => { |
| | | this.handleSubmit() |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | getFieldsValues = (vals) => { |
| | | const { searchlist } = this.state |
| | | let values = {...this.record, ...vals} |
| | | this.record = values |
| | | |
| | | // 获取搜索条件值 |
| | | let search = [] |
| | | 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] || '' |
| | | } |
| | | |
| | | if (item.type === 'group') { |
| | | cell.type = 'daterange' |
| | | cell.key = item.datefield |
| | | cell.value = searchValues[item.datefield] || '' |
| | | cell.match = 'between' |
| | | |
| | | search.push(cell) |
| | | |
| | | 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) |
| | | search.push({ |
| | | type: 'daterange', |
| | | key: item.datefield, |
| | | value: values[item.datefield] || '', |
| | | label: item.label, |
| | | match: 'between', |
| | | required: item.required |
| | | }, { |
| | | type: 'group', |
| | | key: item.field, |
| | | value: values[item.field] || '', |
| | | label: item.label, |
| | | match: '=', |
| | | forbid: true, |
| | | required: item.required |
| | | }) |
| | | } 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) |
| | | let type = item.type |
| | | if (type === 'multiselect' || (type === 'checkcard' && item.multiple === 'true')) { |
| | | type = 'multi' |
| | | } |
| | | let val = values[item.field] !== undefined ? values[item.field] : '' |
| | | |
| | | if (typeof(val) === 'string') { |
| | | val = val.replace(/(^\s*|\s*$)/ig, '') |
| | | } |
| | | |
| | | search.push({ |
| | | type: type, |
| | | key: item.field.replace(/@tail@$/, ''), |
| | | value: val, |
| | | label: item.label, |
| | | match: item.match, |
| | | required: item.required |
| | | }) |
| | | } |
| | | }) |
| | | |
| | | return search |
| | | } |
| | | |
| | | handleOk = () => { |
| | | const { searchValues, searchlist } = this.state |
| | | handleOk = (values) => { |
| | | this.record = {...this.record, ...values} |
| | | |
| | | 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 advanceValues = [] |
| | | this.state.searchlist.forEach(item => { |
| | | if (!item.advanced) return |
| | | |
| | | 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() |
| | | }) |
| | | let val = this.record[item.field] |
| | | if (val || val === 0) { |
| | | advanceValues.push({field: item.field, type: item.type, label: item.label, value: val}) |
| | | } |
| | | }) |
| | | |
| | | this.setState({advanceValues, visible: false}) |
| | | this.handleSubmit() |
| | | } |
| | | |
| | | closeAdvanceForm = (cell) => { |
| | | const { searchValues, advanceValues } = this.state |
| | | this.record[cell.field] = '' |
| | | |
| | | this.setState({searchValues: {...searchValues, [cell.field]: ''}, advanceValues: advanceValues.filter(item => item.field !== cell.field)}, () => { |
| | | this.handleSearch() |
| | | }) |
| | | this.setState({advanceValues: this.state.advanceValues.filter(item => item.field !== cell.field)}) |
| | | this.handleSubmit() |
| | | } |
| | | |
| | | render() { |
| | | const { float, searchStyle, visible, searchlist, searchValues, showAdvanced, advanceValues, adModelWidth } = this.state |
| | | const { float, searchStyle, visible, searchlist, showAdvanced, advanceValues, adModelWidth } = this.state |
| | | const formItemLayout = { |
| | | labelCol: { |
| | | xs: { span: 24 }, |
| | |
| | | |
| | | return ( |
| | | <> |
| | | <Form {...formItemLayout} className={`top-search ${float}`} style={searchStyle} id={this.state.formId || this.state.oriId}> |
| | | <Form {...formItemLayout} className={`top-search ${float}`} style={searchStyle}> |
| | | <Row gutter={24}>{this.getFields()}</Row> |
| | | <Row gutter={24}> |
| | | {showAdvanced ? <div className="advanced-list"> |
| | |
| | | visible={visible} |
| | | width={adModelWidth} |
| | | closable={false} |
| | | onOk={this.handleOk} |
| | | cancelText={'关闭'} |
| | | onCancel={() => this.setState({visible: false})} |
| | | footer={null} |
| | | destroyOnClose |
| | | > |
| | | <MutilForm |
| | | dict={this.state.dict} |
| | | searchlist={searchlist} |
| | | searchValues={searchValues} |
| | | handleSearch={this.handleOk} |
| | | wrappedComponentRef={(inst) => this.formRef = inst} |
| | | record={this.record} |
| | | advanceSubmit={this.handleOk} |
| | | handleClose={() => this.setState({visible: false})} |
| | | /> |
| | | </Modal> |
| | | </> |
| | |
| | | } |
| | | .advanced-list { |
| | | font-size: 13px; |
| | | padding: 0 12px; |
| | | > div { |
| | | display: inline-block; |
| | | margin-right: 10px; |
New file |
| | |
| | | import React, { Component } from 'react' |
| | | import { is, fromJS } from 'immutable' |
| | | import { DatePicker } from 'antd' |
| | | import moment from 'moment' |
| | | |
| | | import './index.scss' |
| | | |
| | | const { MonthPicker, WeekPicker, RangePicker } = DatePicker |
| | | |
| | | /** |
| | | * @description 自定义时间选择器 |
| | | */ |
| | | class MkDatePicker extends Component { |
| | | constructor(props) { |
| | | super(props) |
| | | |
| | | const config = props.config |
| | | |
| | | let mode = 'date' |
| | | let format = 'YYYY-MM-DD' |
| | | |
| | | if (config.type === 'datemonth') { |
| | | mode = 'month' |
| | | format = 'YYYY-MM' |
| | | } else if (config.type === 'week') { |
| | | mode = 'week' |
| | | format = 'YYYY-MM-DD' |
| | | } else if (config.type === 'daterange') { |
| | | mode = 'daterange' |
| | | format = 'YYYY-MM-DD' |
| | | } |
| | | let value = config.initval || null |
| | | |
| | | if (mode === 'daterange') { |
| | | if (value) { |
| | | let val = value.split(',') |
| | | value = [moment(val[0], format), moment(val[1], format)] |
| | | } else { |
| | | value = [null, null] |
| | | } |
| | | } else if (value) { |
| | | value = moment(value, format) |
| | | } |
| | | |
| | | this.state = { |
| | | value, |
| | | mode, |
| | | format |
| | | } |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | componentWillUnmount () { |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | } |
| | | |
| | | onChange = (val) => { |
| | | const { format, mode } = this.state |
| | | |
| | | this.setState({value: val}) |
| | | |
| | | if (mode === 'daterange') { |
| | | let _val = val |
| | | if (_val && !_val[0]) { |
| | | _val = '' |
| | | } |
| | | this.props.onChange(_val ? `${moment(_val[0]).format(format)},${moment(_val[1]).format(format)}` : '') |
| | | } else { |
| | | this.props.onChange(val ? moment(val).format(format) : '') |
| | | } |
| | | } |
| | | |
| | | render() { |
| | | const { value, mode } = this.state |
| | | |
| | | if (mode === 'date') { |
| | | return <DatePicker value={value} onChange={this.onChange}/> |
| | | } else if (mode === 'month') { |
| | | return <MonthPicker value={value} onChange={this.onChange}/> |
| | | } else if (mode === 'week') { |
| | | return <WeekPicker value={value} onChange={this.onChange}/> |
| | | } else if (mode === 'daterange') { |
| | | return <RangePicker placeholder={['开始日期', '结束日期']} value={value} onChange={this.onChange}/> |
| | | } |
| | | } |
| | | } |
| | | |
| | | export default MkDatePicker |
New file |
| | |
| | | import React, {Component} from 'react' |
| | | import { is, fromJS } from 'immutable' |
| | | import { Select } from 'antd' |
| | | |
| | | import MKEmitter from '@/utils/events.js' |
| | | import './index.scss' |
| | | |
| | | class MKSearchSelect extends Component { |
| | | constructor(props) { |
| | | super(props) |
| | | |
| | | const config = props.config |
| | | let value = config.initval |
| | | |
| | | if (config.type === 'multiselect') { |
| | | if (value) { |
| | | value = value.split(',') |
| | | } else { |
| | | value = [] |
| | | } |
| | | } |
| | | |
| | | this.state = { |
| | | config: fromJS(config).toJS(), |
| | | options: fromJS(config.options).toJS(), |
| | | value, |
| | | } |
| | | } |
| | | |
| | | componentDidMount () { |
| | | const { config } = this.state |
| | | |
| | | if (config.type !== 'multiselect') { |
| | | MKEmitter.addListener('mkSP', this.mkFormHandle) |
| | | } |
| | | } |
| | | |
| | | shouldComponentUpdate (nextProps, nextState) { |
| | | return !is(fromJS(this.state), fromJS(nextState)) |
| | | } |
| | | |
| | | UNSAFE_componentWillReceiveProps (nextProps) { |
| | | const { config } = this.state |
| | | |
| | | if (!is(fromJS(config.oriOptions), fromJS(nextProps.config.oriOptions))) { |
| | | this.setState({ |
| | | config: fromJS(nextProps.config).toJS(), |
| | | options: fromJS(nextProps.config.options).toJS() |
| | | }) |
| | | } |
| | | } |
| | | |
| | | componentWillUnmount () { |
| | | this.setState = () => { |
| | | return |
| | | } |
| | | MKEmitter.removeListener('mkSP', this.mkFormHandle) |
| | | } |
| | | |
| | | mkFormHandle = (uuid, parentId, level) => { |
| | | const { config } = this.state |
| | | |
| | | if (uuid !== config.uuid) return |
| | | |
| | | let options = config.oriOptions.filter(option => option.ParentID === parentId || option.Value === '') |
| | | let val = options[0] ? options[0].Value : '' |
| | | |
| | | this.setState({ |
| | | options, |
| | | value: val |
| | | }) |
| | | |
| | | this.props.onChange(val, true) |
| | | |
| | | if (level < 7 && config.linkFields) { |
| | | config.linkFields.forEach((m, i) => { |
| | | setTimeout(() => { |
| | | MKEmitter.emit('mkSP', m.uuid, val, level + 1) |
| | | }, (i + 1) * 10) |
| | | }) |
| | | } |
| | | } |
| | | |
| | | selectChange = (val) => { |
| | | const { config } = this.state |
| | | |
| | | if (config.linkFields) { |
| | | config.linkFields.forEach((m, i) => { |
| | | setTimeout(() => { |
| | | MKEmitter.emit('mkSP', m.uuid, val, 0) |
| | | }, (i + 1) * 10) |
| | | }) |
| | | } |
| | | |
| | | if (config.type === 'multiselect') { |
| | | this.props.onChange(val.join(',')) |
| | | } else { |
| | | this.props.onChange(val) |
| | | } |
| | | |
| | | this.setState({value: val}) |
| | | } |
| | | |
| | | render() { |
| | | const { value, config, options } = this.state |
| | | |
| | | return ( |
| | | <Select |
| | | showSearch |
| | | mode={config.type === 'multiselect' ? 'multiple' : ''} |
| | | value={value} |
| | | filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0} |
| | | onChange={this.selectChange} |
| | | > |
| | | {options.map(option => |
| | | <Select.Option id={option.key} key={option.key} value={option.Value}>{option.Text}</Select.Option> |
| | | )} |
| | | </Select> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | export default MKSearchSelect |
| | |
| | | if (!_verify.script && card.intertype === 'system') { |
| | | let search = this.formatSearch(config.search) |
| | | search = Utils.joinMainSearchkey(search) |
| | | search = search.replace(/@\$@/ig, '') |
| | | search = search ? 'where ' + search : '' |
| | | |
| | | defaultscript = `update ${config.setting.tableName || ''} set idefine5= idefine5+1 ,modifydate=getdate(),cdefine5='已导出',modifyuserid=@userid@ ${search}` |
| | |
| | | |
| | | let newsearches = [] |
| | | searches.forEach(search => { |
| | | if (!search.field) return |
| | | |
| | | let item = { |
| | | key: search.field, |
| | | match: search.match, |
| | | type: search.type, |
| | | label: search.label, |
| | | value: `@${search.field}@`, |
| | | value: search.initval, |
| | | required: search.required === 'true' |
| | | } |
| | | if (item.type === 'group') { |
| | | let copy = fromJS(item).toJS() |
| | | |
| | | item.value = `@${search.field}@` |
| | | item.match = '=' |
| | | |
| | | copy.key = search.datefield |
| | | copy.type = 'daterange' |
| | | copy.match = 'between' |
| | | copy.value = [`@${search.datefield}@`, `@${search.datefield}1@`] |
| | | item.key = search.datefield |
| | | item.type = 'daterange' |
| | | item.match = 'between' |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')].join(',') |
| | | |
| | | newsearches.push(item) |
| | | newsearches.push(copy) |
| | | return |
| | | } else if (item.type === 'date') { |
| | | item.value = moment().format('YYYY-MM-DD') |
| | | } else if (item.type === 'datemonth') { |
| | | item.value = moment().format('YYYY-MM') |
| | | } else if (item.type === 'dateweek') { |
| | | item.value = [`@${search.field}@`, `@${search.field}1@`] |
| | | item.value = moment().format('YYYY-MM-DD') |
| | | } else if (item.type === 'daterange') { |
| | | item.value = [`@${search.field}@`, `@${search.field}1@`] |
| | | } else if (item.type === 'multiselect') { |
| | | item.value = [`@${search.field}@`] |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')].join(',') |
| | | } else if (item.type === 'multiselect' || (item.type === 'checkcard' && search.multiple === 'true')) { |
| | | item.type = 'multi' |
| | | item.value = '@$@' |
| | | } else { |
| | | item.value = '@$@' |
| | | } |
| | | newsearches.push(item) |
| | | }) |
| | |
| | | value: search.initval, |
| | | required: search.required === 'true' |
| | | } |
| | | |
| | | if (item.type === 'group') { |
| | | let copy = fromJS(item).toJS() |
| | | |
| | | item.value = search.initval && search.initval[0] ? search.initval[0] : '@$@' |
| | | item.match = '=' |
| | | |
| | | copy.key = search.datefield |
| | | copy.type = 'daterange' |
| | | copy.match = 'between' |
| | | copy.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')] |
| | | item.key = search.datefield |
| | | item.type = 'daterange' |
| | | item.match = 'between' |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')].join(',') |
| | | |
| | | newsearches.push(item) |
| | | newsearches.push(copy) |
| | | return |
| | | } else if (item.type === 'date') { |
| | | item.value = moment().format('YYYY-MM-DD') |
| | | } else if (item.type === 'datemonth') { |
| | | item.value = moment().format('YYYY-MM') |
| | | } else if (item.type === 'dateweek') { |
| | | item.value = [moment().startOf('week').format('YYYY-MM-DD'), moment().endOf('week').format('YYYY-MM-DD')] |
| | | item.value = moment().format('YYYY-MM-DD') |
| | | } else if (item.type === 'daterange') { |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')] |
| | | } else if (item.type === 'multiselect') { |
| | | item.value = ['@$@'] |
| | | item.value = [moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')].join(',') |
| | | } else if (item.type === 'multiselect' || (item.type === 'checkcard' && search.multiple === 'true')) { |
| | | item.type = 'multi' |
| | | item.value = '@$@' |
| | | } else { |
| | | item.value = '@$@' |
| | | } |
| | |
| | | } |
| | | |
| | | /** |
| | | * @description 初始化搜索条件 |
| | | * @description 初始化搜索条件初始值 |
| | | * @param {Array} searches 搜索条件 |
| | | * @return {String} searches 格式化后结果 |
| | | */ |
| | | static initMainSearch (searches) { |
| | | if (!searches || searches.length === 0) return [] |
| | | static initSearchVal (searches) { |
| | | if (!searches) return [] |
| | | |
| | | let newsearches = [] |
| | | searches.forEach(search => { |
| | | let item = { |
| | | key: search.field, |
| | | match: search.match, |
| | | type: search.type, |
| | | label: search.label, |
| | | value: search.initval, |
| | | required: search.required === 'true' |
| | | } |
| | | let roleId = sessionStorage.getItem('role_id') || '' |
| | | |
| | | if (item.type === 'group') { |
| | | let copy = JSON.parse(JSON.stringify(item)) |
| | | copy.key = search.datefield |
| | | return searches.map(item => { |
| | | item.hidden = item.Hide === 'true' |
| | | item.required = item.required === 'true' |
| | | item.advanced = item.advanced === 'true' |
| | | |
| | | item.value = search.initval && search.initval[0] ? search.initval[0] : '' |
| | | item.match = '=' |
| | | item.forbid = true |
| | | |
| | | copy.type = 'daterange' |
| | | copy.match = 'between' |
| | | copy.value = '' |
| | | |
| | | if (search.initval && search.initval.length > 0) { |
| | | let _type = search.initval[0] |
| | | let _val = search.initval[1] |
| | | |
| | | if (item.type === 'date') { // 时间搜索 |
| | | item.initval = item.initval ? moment().subtract(item.initval, 'days').format('YYYY-MM-DD') : '' |
| | | } else if (item.type === 'datemonth') { |
| | | item.initval = item.initval ? moment().subtract(item.initval, 'month').format('YYYY-MM') : '' |
| | | } else if (item.type === 'dateweek') { |
| | | item.initval = item.initval ? moment().subtract(item.initval * 7, 'days').format('YYYY-MM-DD') : '' |
| | | } else if (item.type === 'daterange') { |
| | | if (item.initval) { |
| | | try { |
| | | let _initval = JSON.parse(item.initval) |
| | | let _vals = [moment().subtract(_initval[0], 'days').format('YYYY-MM-DD'), moment().subtract(_initval[1], 'days').format('YYYY-MM-DD')] |
| | | item.initval = _vals.join(',') |
| | | } catch { |
| | | item.initval = '' |
| | | } |
| | | } |
| | | } else if (item.type === 'group') { |
| | | if (item.initval && item.initval[0]) { |
| | | let _type = item.initval[0] |
| | | let _val = item.initval[1] |
| | | let _dateRange = '' |
| | | |
| | | if (_type === 'day') { |
| | | copy.value = [moment().subtract(_val, 'days').format('YYYY-MM-DD'), |
| | | _dateRange = [moment().subtract(_val, 'days').format('YYYY-MM-DD'), |
| | | moment().subtract(_val, 'days').format('YYYY-MM-DD')] |
| | | } else if (_type === 'week') { |
| | | copy.value = [moment().subtract(_val * 7, 'days').startOf('week').format('YYYY-MM-DD'), |
| | | _dateRange = [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') { |
| | | copy.value = [moment().subtract(_val, 'month').startOf('month').format('YYYY-MM-DD'), |
| | | _dateRange = [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: |
| | |
| | | break |
| | | default: |
| | | } |
| | | |
| | | copy.value = [moment().subtract(_pdiffer + _val * 3, 'month').startOf('month').format('YYYY-MM-DD'), |
| | | _dateRange = [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 |
| | | copy.value = [_year + '-01-01', _year + '-12-31'] |
| | | _dateRange = [_year + '-01-01', _year + '-12-31'] |
| | | } else if (_type === 'customized') { |
| | | try { |
| | | _val = JSON.parse(_val) |
| | | } catch { |
| | | _val = [0, 0] |
| | | } |
| | | copy.value = [moment().subtract(_val[0], 'days').format('YYYY-MM-DD'), |
| | | _dateRange = [moment().subtract(_val[0], 'days').format('YYYY-MM-DD'), |
| | | moment().subtract(_val[1], 'days').format('YYYY-MM-DD')] |
| | | } |
| | | } |
| | | |
| | | newsearches.push(item) |
| | | newsearches.push(copy) |
| | | return |
| | | } else if (item.type === 'date') { |
| | | item.value = item.value ? moment().subtract(item.value, 'days').format('YYYY-MM-DD') : '' |
| | | } else if (item.type === 'datemonth') { |
| | | item.value = item.value ? moment().subtract(item.value, 'month').format('YYYY-MM') : '' |
| | | } else if (item.type === 'dateweek') { |
| | | item.value = item.value ? [moment().subtract(item.value * 7, 'days').startOf('week').format('YYYY-MM-DD'), |
| | | moment().subtract(item.value * 7, 'days').endOf('week').format('YYYY-MM-DD')] : '' |
| | | } else if (item.type === 'daterange') { |
| | | let _val = item.value |
| | | if (_val) { |
| | | try { |
| | | _val = JSON.parse(_val) |
| | | } catch { |
| | | _val = '' |
| | | } |
| | | item.initval = _dateRange.join(',') |
| | | item.initType = _type |
| | | } else { |
| | | item.initval = '' |
| | | item.initType = '' |
| | | } |
| | | item.value = _val ? [moment().subtract(_val[0], 'days').format('YYYY-MM-DD'), |
| | | moment().subtract(_val[1], 'days').format('YYYY-MM-DD')] : '' |
| | | } else if (item.type === 'multiselect') { |
| | | item.value = item.value ? item.value.split(',').filter(Boolean) : [] |
| | | } |
| | | newsearches.push(item) |
| | | |
| | | item.oriInitval = item.initval |
| | | |
| | | if (item.blacklist && item.blacklist.length > 0 && !item.hidden) { |
| | | if (item.blacklist.filter(v => roleId.indexOf(v) > -1).length > 0) { |
| | | item.hidden = true |
| | | } |
| | | } |
| | | |
| | | return item |
| | | }) |
| | | |
| | | return newsearches |
| | | } |
| | | |
| | | /** |
| | | * @description 初始化搜索条件 |
| | | * @param {Array} searches 搜索条件 |
| | | * @return {String} searches 格式化后结果 |
| | | */ |
| | | static initMainSearch (searches) { |
| | | if (!searches) return [] |
| | | |
| | | let values = [] |
| | | searches.forEach(cell => { |
| | | let item = { |
| | | key: cell.field, |
| | | match: cell.match, |
| | | type: cell.type, |
| | | label: cell.label, |
| | | value: cell.initval, |
| | | required: cell.required |
| | | } |
| | | |
| | | if (cell.type === 'multiselect' || (cell.type === 'checkcard' && cell.multiple === 'true')) { |
| | | item.type = 'multi' |
| | | } else if (item.type === 'group') { |
| | | item.key = cell.datefield |
| | | item.type = 'daterange' |
| | | item.match = 'between' |
| | | |
| | | values.push({ |
| | | type: 'group', |
| | | key: cell.field, |
| | | value: cell.initType, |
| | | label: cell.label, |
| | | match: '=', |
| | | forbid: true, |
| | | required: cell.required |
| | | }) |
| | | } |
| | | |
| | | values.push(item) |
| | | }) |
| | | |
| | | return values |
| | | } |
| | | |
| | | /** |
| | | * @description 初始化自定义函数搜索条件 |
| | | * @param {Array} searches 搜索条件 |
| | | */ |
| | | static formatCustomMainSearch (searches) { |
| | | if (!searches || searches.length === 0) return {} |
| | | if (!searches) return {} |
| | | |
| | | let newsearches = {} |
| | | searches.forEach(item => { |
| | | if (item.type === 'date') { |
| | | let timetail = '' |
| | | let _val = item.value |
| | | let _val = item.value || '' |
| | | |
| | | if (item.match === '<' || item.match === '<=') { |
| | | timetail = ' 00:00:00.000' |
| | | if (_val) { |
| | | _val = moment(_val, 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') |
| | | if (_val) { |
| | | if (item.match === '<' || item.match === '<=') { |
| | | _val = moment(_val, 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | } else if (item.match === '>' || item.match === '>=') { |
| | | _val = _val + ' 00:00:00.000' |
| | | } |
| | | } else if (item.match === '>' || item.match === '>=') { |
| | | timetail = ' 00:00:00.000' |
| | | } |
| | | |
| | | if (newsearches[item.key]) { |
| | | newsearches[item.key + '1'] = _val ? _val + timetail : '' |
| | | newsearches[item.key + '1'] = _val |
| | | } else { |
| | | newsearches[item.key] = _val ? _val + timetail : '' |
| | | newsearches[item.key] = _val |
| | | } |
| | | } else if (item.type === 'datemonth') { |
| | | // 月-过滤条件,从月开始至结束 |
| | |
| | | newsearches[item.key] = _startval |
| | | newsearches[item.key + '1'] = _endval |
| | | } else if (item.type === 'dateweek') { |
| | | let _startval = '' |
| | | let _endval = '' |
| | | if (item.value) { |
| | | _endval = moment(item.value[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') |
| | | _startval = moment(item.value, 'YYYY-MM-DD' ).startOf('week').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | _endval = moment(item.value, 'YYYY-MM-DD').endOf('week').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | } |
| | | |
| | | newsearches[item.key] = item.value ? item.value[0] + ' 00:00:00.000' : '' |
| | | newsearches[item.key + '1'] = item.value ? _endval + ' 00:00:00.000' : '' |
| | | newsearches[item.key] = _startval |
| | | newsearches[item.key + '1'] = _endval |
| | | } else if (item.type === 'daterange') { |
| | | let _startval = '' |
| | | let _endval = '' |
| | | if (item.value) { |
| | | _endval = moment(item.value[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') |
| | | let val = item.value.split(',') |
| | | _startval = val[0] + ' 00:00:00.000' |
| | | _endval = moment(val[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | } |
| | | |
| | | newsearches[item.key] = item.value ? item.value[0] + ' 00:00:00.000' : '' |
| | | newsearches[item.key + '1'] = item.value ? _endval + ' 00:00:00.000' : '' |
| | | newsearches[item.key] = _startval |
| | | newsearches[item.key + '1'] = _endval |
| | | } else if (item.type === 'text' || item.type === 'select') { |
| | | item.key.split(',').forEach(field => { // 综合搜索,所字段拼接 |
| | | newsearches[field] = item.value |
| | | }) |
| | | } else if (item.type === 'multiselect') { |
| | | newsearches[item.key] = item.value.join(',') |
| | | } else { |
| | | newsearches[item.key] = item.value |
| | | } |
| | | }) |
| | | |
| | | Object.keys(newsearches).forEach(key => { |
| | | if (!newsearches[key]) { |
| | | delete newsearches[key] |
| | | } |
| | | }) |
| | | |
| | |
| | | |
| | | let searchText = '' |
| | | searches.forEach(item => { |
| | | if (item.forbid || !item.value || (item.type === 'multiselect' && item.value.length === 0)) return |
| | | if (item.forbid || !item.value) return |
| | | |
| | | searchText += (searchText !== '' ? ' AND ' : '') |
| | | if (item.type === 'text' || item.type === 'select') { // 综合搜索,文本或下拉,所有字段拼接 |
| | |
| | | }) |
| | | |
| | | searchText += '(' + fields.join(' OR ') + ')' |
| | | } else if (item.type === 'multiselect') { |
| | | |
| | | searchText += `'${item.value}' ` + item.match + ' \'%\'+' + item.key + '+\'%\'' |
| | | } else if (item.type === 'multi') { |
| | | searchText += `'${item.value}' ${item.match} '%'+${item.key}+'%'` |
| | | } else if (item.type === 'date') { |
| | | let _val = item.value |
| | | let timetail = ' 00:00:00.000' |
| | |
| | | |
| | | searchText += '(' + item.key + ' >= \'' + _startval + '\' AND ' + item.key + ' < \'' + _endval + '\')' |
| | | } else if (item.type === 'dateweek') { // 周-过滤条件 |
| | | let _startval = item.value[0] + ' 00:00:00.000' |
| | | let _endval = moment(item.value[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | let _startval = moment(item.value, 'YYYY-MM-DD' ).startOf('week').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | let _endval = moment(item.value, 'YYYY-MM-DD').endOf('week').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | |
| | | searchText += '(' + item.key + ' >= \'' + _startval + '\' AND ' + item.key + ' < \'' + _endval + '\')' |
| | | } else if (item.type === 'daterange') { |
| | | let _startval = item.value[0] + ' 00:00:00.000' |
| | | let _endval = moment(item.value[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | let val = item.value.split(',') |
| | | let _startval = val[0] + ' 00:00:00.000' |
| | | let _endval = moment(val[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | |
| | | searchText += '(' + item.key + ' >= \'' + _startval + '\' AND ' + item.key + ' < \'' + _endval + '\')' |
| | | } else { |
| | |
| | | options.push(item) |
| | | options.push(copy) |
| | | } else if (item.type === 'dateweek') { |
| | | let _startval = item.value && item.value[0] ? moment(item.value[0], 'YYYY-MM-DD').format('YYYY-MM-DD') + ' 00:00:00.000' : '1970-01-01 00:00:00.000' |
| | | let _endval = item.value && item.value[1] ? moment(item.value[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' : '2050-01-01 00:00:00.000' |
| | | let _startval = item.value ? moment(item.value, 'YYYY-MM-DD').startOf('week').format('YYYY-MM-DD') + ' 00:00:00.000' : '1970-01-01 00:00:00.000' |
| | | let _endval = item.value ? moment(item.value, 'YYYY-MM-DD').endOf('week').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' : '2050-01-01 00:00:00.000' |
| | | |
| | | let copy = JSON.parse(JSON.stringify(item)) |
| | | copy.key = copy.key + '1' |
| | |
| | | options.push(item) |
| | | options.push(copy) |
| | | } else if (item.type === 'daterange') { |
| | | let _startval = item.value && item.value[0] ? item.value[0] + ' 00:00:00.000' : '1970-01-01 00:00:00.000' |
| | | let _endval = item.value && item.value[1] ? moment(item.value[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' : '2050-01-01 00:00:00.000' |
| | | let _startval = '1970-01-01 00:00:00.000' |
| | | let _endval = '2050-01-01 00:00:00.000' |
| | | |
| | | if (item.value) { |
| | | let val = item.value.split(',') |
| | | _startval = val[0] + ' 00:00:00.000' |
| | | _endval = moment(val[1], 'YYYY-MM-DD').add(1, 'days').format('YYYY-MM-DD') + ' 00:00:00.000' |
| | | } |
| | | |
| | | let copy = JSON.parse(JSON.stringify(item)) |
| | | copy.key = copy.key + '1' |
| | |
| | | |
| | | options.push(item) |
| | | options.push(copy) |
| | | } else if (item.type === 'multiselect') { |
| | | item.value = item.value ? item.value.join(',') : item.value |
| | | |
| | | options.push(item) |
| | | } else if (item.type === 'text' || item.type === 'select') { |
| | | item.key.split(',').forEach(field => { // 综合搜索,所字段拼接 |
| | | let cell = JSON.parse(JSON.stringify(item)) |
| | |
| | | |
| | | if (search.type === 'group') { |
| | | options.push({ |
| | | key: search.field, |
| | | value: '0' |
| | | }) |
| | | options.push({ |
| | | key: search.datefield, |
| | | value: '0' |
| | | }) |
| | |
| | | }) |
| | | |
| | | return options |
| | | } |
| | | |
| | | /** |
| | | * @description 拼接搜索条件datamanage |
| | | * @param {Array} searches 搜索条件 |
| | | * @return {String} searchText 拼接结果 |
| | | */ |
| | | static jointsearchkey (searches) { |
| | | if (!searches || searches.length === 0) return '' |
| | | let searchText = '' |
| | | searches.forEach(item => { |
| | | if (!item.value) return |
| | | searchText += (searchText !== '' ? ' AND ' : '') |
| | | if (item.type === 'text') { |
| | | let options = item.key.split(',').map(op => { |
| | | // equal时不添加% |
| | | let str = item.op === 'equal' ? '' : '%' |
| | | return op + ' ' + item.op + ' \'' + str + item.value + str + '\'' |
| | | }) |
| | | searchText += '(' + options.join(' OR ') + ')' |
| | | } else if (item.type === 'date') { |
| | | searchText += '(' + item.key + ' ' + item.op + ' \'' + item.value + '\')' |
| | | } else { |
| | | searchText += '(' + item.key + ' ' + item.op + ' \'' + item.value + '\')' |
| | | } |
| | | }) |
| | | return searchText |
| | | } |
| | | |
| | | /** |