From 3b103caa6bfc9ed410e67156c3ca1785bf1cecc9 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 19 八月 2022 01:15:31 +0800 Subject: [PATCH] 2022-08-19 --- src/templates/sharecomponent/searchcomponent/index.jsx | 113 +++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 71 insertions(+), 42 deletions(-) diff --git a/src/templates/sharecomponent/searchcomponent/index.jsx b/src/templates/sharecomponent/searchcomponent/index.jsx index 5179021..2f848fc 100644 --- a/src/templates/sharecomponent/searchcomponent/index.jsx +++ b/src/templates/sharecomponent/searchcomponent/index.jsx @@ -1,8 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import { is, fromJS } from 'immutable' -import { Tooltip, Modal, notification, Switch } from 'antd' -import { QuestionCircleOutlined } from '@ant-design/icons' +import { Modal, notification, Switch } from 'antd' import moment from 'moment' import Api from '@/api' @@ -12,8 +11,9 @@ import { getSearchForm } from '@/templates/zshare/formconfig' import asyncComponent from '@/utils/asyncComponent' import MKEmitter from '@/utils/events.js' -import SearchForm from './searchform' import DragElement from './dragsearch' +import SearchForm from './searchform' +import SettingForm from './settingform' import './index.scss' const { confirm } = Modal @@ -28,11 +28,12 @@ state = { dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS, - searchlist: null, // 鎼滅储鏉′欢闆� - sqlVerifing: false, // sql楠岃瘉涓� - visible: false, // 妯℃�佹鎺у埗 + searchlist: null, + sqlVerifing: false, + visible: false, showField: false, - card: null // 缂栬緫涓厓绱� + setVisible: false, + card: null } /** @@ -44,24 +45,13 @@ }) } - // /** - // * @description 鐩戝惉鍒版悳绱㈡潯浠跺鍒舵椂锛岃Е鍙戞悳绱㈡潯浠剁紪杈� - // */ - // UNSAFE_componentWillReceiveProps (nextProps) { - // const { searchlist } = this.state - - // if (!is(fromJS(nextProps.config.search), fromJS(this.props.config.search)) && !is(fromJS(nextProps.config.search), fromJS(searchlist))) { - // let len = nextProps.config.search.length - // let item = nextProps.config.search[len - 1] - // if (item && item.focus) { - // this.handleSearch(item) - // } - // this.setState({searchlist: fromJS(nextProps.config.search).toJS()}) - // } - // } - componentDidMount () { MKEmitter.addListener('plusSearch', this.plusSearch) + MKEmitter.addListener('revert', this.revert) + } + + revert = () => { + this.setState({searchlist: fromJS(this.props.config.search).toJS()}) } plusSearch = (MenuId, item, type) => { @@ -122,10 +112,17 @@ }) }) + let columns = null + if (this.props.config.type === 'table') { + columns = this.props.config.columns.map(item => { + return {key: item.uuid, text: item.field, value: item.field, label: item.label} + }) + } + this.setState({ visible: true, card: card, - formlist: getSearchForm(card, linkableFields) + formlist: getSearchForm(card, linkableFields, columns) }) } @@ -233,10 +230,10 @@ LText: res.dataSource } - param.LText = param.LText.replace(/@\$|\$@/ig, '') + param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') + param.LText = param.LText.replace(/@\$|\$@/ig, '').replace(/@(BID|ID|LoginUID|SessionUid|UserID|Appkey|time_id)@/ig, `'${param.timestamp}'`) param.LText = Utils.formatOptions(param.LText) - param.timestamp = moment().format('YYYY-MM-DD HH:mm:ss') param.secretkey = Utils.encrypt('', param.timestamp) if (window.GLOB.mainSystemApi && res.database === 'sso') { @@ -304,6 +301,31 @@ }) } + handleSetting = () => { + this.setState({ + setVisible: true + }) + } + + settingSubmit = () => { + const { config } = this.props + + this.settingFormRef.handleConfirm().then(res => { + this.setState({ + setVisible: false + }) + + let _config = null + + if (config.wrap) { // 鑷畾涔夐〉闈able + _config = {...config, wrap: {...config.wrap, ...res}} + } else { + _config = {...config, setting: {...config.setting, ...res}} + } + + this.props.updatesearch(_config) + }) + } /** * @description 缁勪欢閿�姣侊紝娓呴櫎state鏇存柊 @@ -312,6 +334,7 @@ this.setState = () => { return } + MKEmitter.removeListener('revert', this.revert) MKEmitter.removeListener('plusSearch', this.plusSearch) } @@ -319,36 +342,27 @@ if (!is(fromJS(this.state), fromJS(nextState))) { return true } else if (this.props.config.wrap) { - return this.props.config.wrap.show !== nextProps.config.wrap.show + return !is(fromJS(nextProps.config.wrap), fromJS(this.props.config.wrap)) } else { - return this.props.config.setting.show !== nextProps.config.setting.show + return !is(fromJS(nextProps.config.setting), fromJS(this.props.config.setting)) } } render() { const { config } = this.props - const { dict, searchlist, visible, sqlVerifing, card, showField } = this.state - - let show = config.setting.show - if (config.wrap) { - show = config.wrap.show - } + const { dict, searchlist, visible, sqlVerifing, card, showField, setVisible } = this.state return ( - <div className={'model-table-search-list length' + searchlist.length}> - <Tooltip placement="bottomLeft" overlayClassName="middle" title={dict['model.tooltip.search.guide']}> - <QuestionCircleOutlined style={{color: '#c49f47', position: 'relative', left: '-15px', top: '5px'}} /> - </Tooltip> + <div className={'model-table-search-list length' + searchlist.length + (showField ? ' show-field' : '')}> <FieldsComponent config={{uuid: config.uuid, search: searchlist}} type="search" /> - <Switch checkedChildren={dict['model.switch.open']} unCheckedChildren={dict['model.switch.close']} defaultChecked={showField} onChange={this.onFieldChange} /> + <Switch className="switch-field-show" checkedChildren={dict['model.switch.open']} unCheckedChildren={dict['model.switch.close']} defaultChecked={showField} onChange={this.onFieldChange} /> <DragElement list={searchlist} - show={show} - showField={showField} + setting={config.wrap || config.setting} handleList={this.handleList} handleMenu={this.handleSearch} deleteMenu={this.deleteElement} - placeholder={dict['header.form.search.placeholder']} + handleSetting={this.handleSetting} /> {/* 缂栬緫鎼滅储鏉′欢 */} <Modal @@ -369,6 +383,21 @@ wrappedComponentRef={(inst) => this.searchFormRef = inst} /> </Modal> + <Modal + title={'鎼滅储璁剧疆'} + visible={setVisible} + width={800} + maskClosable={false} + onOk={this.settingSubmit} + onCancel={() => this.setState({setVisible: false})} + destroyOnClose + > + <SettingForm + setting={config.wrap || config.setting} + inputSubmit={this.settingSubmit} + wrappedComponentRef={(inst) => this.settingFormRef = inst} + /> + </Modal> </div> ) } -- Gitblit v1.8.0