2022-07-20

king

2022-07-20 ed7d889f7d9dfca77fd7f055ad8d6ec6ad85ae91

 src/templates/sharecomponent/searchcomponent/index.jsx

@@ -12,8 +12,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 +29,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
  }

  /**
@@ -316,6 +318,22 @@
    })
  }

  handleSetting = () => {
    this.setState({
      setVisible: true
    })
  }

  settingSubmit = () => {
    const { config } = this.props

    this.settingFormRef.handleConfirm().then(res => {
      this.setState({
        setVisible: false
      })
      this.props.updatesearch({...config, setting: {...config.setting, ...res}})
    })
  }

  /**
   * @description 组件销毁，清除state更新
@@ -332,35 +350,30 @@
    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}>
      <div className={'model-table-search-list length' + searchlist.length + (showField ? ' show-field' : '')}>
        <Tooltip placement="bottomLeft" overlayClassName="middle" title="在左侧工具栏《搜索》中，选择对应搜索框拖至此处添加；或点击按钮《添加搜索条件》批量添加，选择批量添加时，需提前选择使用表。">
          <QuestionCircleOutlined style={{color: '#c49f47', position: 'relative', left: '-15px', top: '5px'}} />
        </Tooltip>
        <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}
          handleSetting={this.handleSetting}
        />
        {/* 编辑搜索条件 */}
        <Modal
@@ -381,6 +394,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>
    )
  }