king
2024-08-25 326aa6b3effaccc71cfe0775d47b0f29eb3695a6
src/mob/searchconfig/index.jsx
@@ -3,24 +3,23 @@
import { is, fromJS } from 'immutable'
import { DndProvider } from 'react-dnd'
import HTML5Backend from 'react-dnd-html5-backend'
import moment from 'moment'
import { Button, Modal, Collapse, notification, Switch, Icon } from 'antd'
import { Button, Modal, Collapse, notification, Switch } from 'antd'
import { SettingOutlined, LeftOutlined, SearchOutlined, PlusOutlined } from '@ant-design/icons'
import Api from '@/api'
import Utils from '@/utils/utils.js'
import zhCN from '@/locales/zh-CN/model.js'
import enUS from '@/locales/en-US/model.js'
import { getSearchForm } from '@/templates/zshare/formconfig'
import SourceElement from '@/templates/modalconfig/dragelement/source'
import SettingForm from './settingform'
import asyncComponent from '@/utils/asyncComponent'
import { SearchItems } from './source'
import MKEmitter from '@/utils/events.js'
import './index.scss'
const { Panel } = Collapse
const { confirm } = Modal
const SearchForm = asyncComponent(() => import('@/templates/sharecomponent/searchcomponent/searchform'))
const PasteComponent = asyncComponent(() => import('./pastecomponent'))
// const PasteComponent = asyncComponent(() => import('./pastecomponent'))
const DragElement = asyncComponent(() => import('./searchdragelement'))
const GDragElement = asyncComponent(() => import('./groupdragelement'))
const GroupForm = asyncComponent(() => import('./groupform'))
@@ -33,7 +32,6 @@
  }
  state = {
    dict: sessionStorage.getItem('lang') !== 'en-US' ? zhCN : enUS,      // 字典
    config: null,          // 页面配置,包括模板类型、模态框设置、添加表名、表单列表
    visible: false,        // 表单编辑模态框,显示控制
    formlist: null,        // 表单编辑模态框,可编辑字段
@@ -43,7 +41,8 @@
    sqlVerifing: false,    // sql验证
    showField: false,      // 显示表单字段值
    group: null,
    editGroup: null
    editGroup: null,
    saving: false
  }
  /**
@@ -59,6 +58,10 @@
    })
  }
  componentDidMount () {
    MKEmitter.addListener('completeSave', this.completeSave)
  }
  /**
   * @description 组件销毁,清除state更新
   */
@@ -66,6 +69,11 @@
    this.setState = () => {
      return
    }
    MKEmitter.removeListener('completeSave', this.completeSave)
  }
  completeSave = () => {
    this.setState({saving: false})
  }
  /**
@@ -132,12 +140,25 @@
   * @description 表单编辑
   */
  handleForm = (_card) => {
    const { group } = this.state
    let card = fromJS(_card).toJS()
    let linkableFields = []
    group.fields.forEach(item => {
      if (item.uuid === card.uuid) return
      if (!['select', 'link', 'checkcard'].includes(item.type)) return
      if (item.type === 'checkcard' && item.multiple === 'true') return
      linkableFields.push({
        value: item.field,
        text: item.label
      })
    })
    this.setState({
      visible: true,
      card: card,
      formlist: getSearchForm(card, [])
      formlist: getSearchForm(card, linkableFields)
    })
  }
@@ -148,20 +169,49 @@
   * 3、通过loading刷新
   */
  handleSubmit = () => {
    const { config } = this.state
    this.formRef.handleConfirm().then(res => {
      let _group = fromJS(this.state.group).toJS()
      let fieldrepet = false // 字段重复
      _group.fields = _group.fields.map(item => {
        if (item.uuid !== res.uuid && item.field.toLowerCase() === res.field.toLowerCase()) {
          fieldrepet = true
        }
        if (item.uuid === res.uuid) {
          return res
        } else {
          return item
        }
      })
      let fieldrepet = false // 字段重复
      let lowerField = res.field.toLowerCase()
      if (config.setting.field) {
        let m = config.setting.field.toLowerCase().split(',')
        if (m.includes(lowerField)) {
          fieldrepet = true
        }
      }
      config.fields.forEach(item => {
        if (item.uuid === res.uuid) return
        if (res.type === 'date' && item.type === 'date') return
        if (item.field.toLowerCase() === lowerField) {
          fieldrepet = true
        }
      })
      config.groups.forEach(group => {
        if (group.setting.field) {
          let m = group.setting.field.toLowerCase().split(',')
          if (m.includes(lowerField)) {
            fieldrepet = true
          }
        }
        group.fields.forEach(item => {
          if (item.uuid === res.uuid) return
          if (res.type === 'date' && item.type === 'date') return
          if (item.field.toLowerCase() === lowerField) {
            fieldrepet = true
          }
        })
      })
      if (fieldrepet) {
@@ -173,29 +223,17 @@
        return
      }
      if (['checkcard'].includes(res.type) && res.resourceType === '1' && /\s/.test(res.dataSource)) {
      if (['checkcard'].includes(res.type) && res.resourceType === '1' && res.database !== 'sso' && /\s/.test(res.dataSource)) {
        this.setState({
          sqlVerifing: true
        })
        let param = {
          func: 's_debug_sql',
          exec_type: 'y',
          LText: res.dataSource
        }
        param.LText = param.LText.replace(/@\$|\$@/ig, '')
        let sql = `declare @mk_departmentcode nvarchar(512),@mk_organization nvarchar(512),@mk_user_type nvarchar(20)
        ${res.dataSource}`
        sql = sql.replace(/@\$|\$@/ig, '')
        
        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') {
          param.rduri = window.GLOB.mainSystemApi
        }
        Api.getLocalConfig(param).then(result => {
          if (result.status) {
        Api.sDebug(sql).then(result => {
          if (result.status || result.ErrCode === '-2') {
            this.setState({
              sqlVerifing: false,
              group: _group,
@@ -226,18 +264,18 @@
   * @description 表单删除并刷新
   */
  closeForm = (card) => {
    let _this = this
    let that = this
    confirm({
      content: `确定删除${card.label ? `<<${card.label}>>` : ''}吗?`,
      onOk() {
        let _group = fromJS(_this.state.group).toJS()
        let _group = fromJS(that.state.group).toJS()
        _group.fields = _group.fields.filter(item => item.uuid !== card.uuid)
        _this.setState({
        that.setState({
          group: _group,
        })
        _this.resetConfig(_group)
        that.resetConfig(_group)
      },
      onCancel() {}
    })
@@ -246,24 +284,23 @@
  submitConfig = () => {
    const { config } = this.state
    this.setState({originConfig: fromJS(config).toJS()})
    this.setState({originConfig: fromJS(config).toJS(), saving: true})
    this.props.handleSave(config)
    notification.success({
      top: 92,
      message: '保存成功。',
      duration: 2
    })
    setTimeout(() => {
      MKEmitter.emit('triggerMenuSave')
    }, 100)
  }
  cancelConfig = () => {
    const { config, originConfig } = this.state
    if (!is(fromJS(config), fromJS(originConfig))) {
      let _this = this
      let that = this
      confirm({
        content: '配置信息未保存,确定返回吗?',
        onOk() {
          _this.props.handleBack()
          that.props.handleBack()
        },
        onCancel() {}
      })
@@ -285,8 +322,54 @@
   * @description 保存分组设置
   */
  settingSave = () => {
    const { config } = this.state
    this.settingRef.handleConfirm().then(res => {
      let _group = {...this.state.group, setting: res}
      let lowers = _group.setting.field ? _group.setting.field.toLowerCase() : ''
      if (lowers) {
        let fieldrepet = false // 字段重复
        lowers = lowers.split(',')
        let length = lowers.length
        if (_group.floor !== 1 && config.setting.field) {
          let m = config.setting.field.toLowerCase().split(',')
          if (Array.from(new Set([...m, ...lowers])).length < m.length + length) {
            fieldrepet = true
          }
        }
        config.fields.forEach(item => {
          if (lowers.includes(item.field.toLowerCase())) {
            fieldrepet = true
          }
        })
        config.groups.forEach(group => {
          if (_group.uuid === group.uuid) return
          if (group.setting.field) {
            let m = group.setting.field.toLowerCase().split(',')
            if (Array.from(new Set([...m, ...lowers])).length < m.length + length) {
              fieldrepet = true
            }
          }
          group.fields.forEach(item => {
            if (lowers.includes(item.field.toLowerCase())) {
              fieldrepet = true
            }
          })
        })
        if (fieldrepet) {
          notification.warning({
            top: 92,
            message: '字段已存在!',
            duration: 10
          })
          return
        }
      }
      this.setState({
        group: _group,
        settingVisible: false
@@ -321,7 +404,7 @@
    let _g = {
      uuid: Utils.getuuid(),
      wrap: { name: 'name', icon: '' },
      setting: { type: 'title', field: '', title: '', focus: 'true', btn: 'hidden' },
      setting: { type: 'title', field: '', title: '', focus: 'true', btn: 'hidden', backgroundColor: sessionStorage.getItem('sysBgColor') },
      fields: []
    }
@@ -363,15 +446,15 @@
  }
  closeGroup = (g) => {
    const _this = this
    const that = this
    let _group = fromJS(this.state.group).toJS()
    _group.groups = _group.groups.filter(item => item.uuid !== g.uuid)
    confirm({
      content: `确定删除分组《${g.wrap.name}》吗?`,
      onOk() {
        _this.setState({ group: _group })
        _this.resetConfig(_group)
        that.setState({ group: _group })
        that.resetConfig(_group)
      },
      onCancel() {}
    })
@@ -386,13 +469,14 @@
  }
  render () {
    const { dict, group, editGroup } = this.state
    const { group, editGroup, saving } = this.state
    return (
      <div className="mob-search-board">
        <DndProvider backend={HTML5Backend}>
          <div className="tools">
            <Collapse accordion defaultActiveKey="1" bordered={false}>
              <Panel header={dict['header.menu.form']} key="1">
              <Panel header="搜索条件" key="1">
                <div className="search-element">
                  {SearchItems.map((item, index) => {
                    return (<SourceElement key={index} content={item}/>)
@@ -402,24 +486,25 @@
            </Collapse>
          </div>
          <div className="modal-control">
            <Button type="primary" onClick={this.submitConfig}>保存</Button>
            <Button type="primary" loading={saving} onClick={this.submitConfig}>保存</Button>
            <Button onClick={this.cancelConfig}>关闭</Button>
            {!group.floor ? <Button onClick={this.returnUp}>返回上级</Button> : null}
            <PasteComponent insert={this.insert} />
            <Switch checkedChildren={dict['model.switch.open']} unCheckedChildren={dict['model.switch.close']} defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} />
            {/* <PasteComponent insert={this.insert} /> */}
            <Switch checkedChildren="开" unCheckedChildren="关" defaultChecked={this.state.showField} onChange={(val) => this.setState({showField: val})} />
          </div>
          <div className="setting">
            <div className="mob-shell" style={{width: window.GLOB.shellWidth, height: window.GLOB.shellHeight}}>
              <div className="mob-shell-inner">
                <Icon className="setting-group" onClick={this.changeSetting} type="setting" />
              <div className="mob-shell-inner" style={{backgroundColor: group.setting.backgroundColor || '#ffffff'}}>
                <SettingOutlined className="setting-group" onClick={this.changeSetting}/>
                {group.setting.type === 'title' ? <div className="am-navbar">
                  <Icon type="close" />
                  <LeftOutlined />
                  <div className="am-navbar-title">{group.setting.title}</div>
                </div> : <div className="am-navbar">
                  <Icon type="left" />
                  <div className="search-bar"><Icon type="search" /></div>
                  {/* <LeftOutlined /> */}
                  <div className="search-bar"><SearchOutlined style={{marginRight: '10px'}}/>{group.setting.label || ''}</div>
                  <Button >取消</Button>
                </div>}
                {group.floor === 1 ? <Icon className="plus-group" type="plus" onClick={this.plusGroup} /> : null}
                {group.floor === 1 ? <PlusOutlined className="plus-group" onClick={this.plusGroup} /> : null}
                <div style={{minHeight: 'calc(100% - 100px)'}}>
                  {group.floor === 1 && group.groups.length > 0 ? <GDragElement
                    list={group.groups}
@@ -445,16 +530,15 @@
          </div>
        </DndProvider>
        <Modal
          title={this.state.dict['model.edit']}
          title="编辑"
          visible={this.state.visible}
          width={850}
          width={950}
          onCancel={this.editModalCancel}
          onOk={this.handleSubmit}
          confirmLoading={this.state.sqlVerifing}
          destroyOnClose
        >
          <SearchForm
            dict={this.state.dict}
            card={this.state.card}
            formlist={this.state.formlist}
            inputSubmit={this.handleSubmit}
@@ -462,7 +546,7 @@
          />
        </Modal>
        <Modal
          title={this.state.dict['model.edit']}
          title="编辑"
          visible={this.state.settingVisible}
          width={850}
          maskClosable={false}
@@ -477,7 +561,7 @@
          />
        </Modal>
        <Modal
          title={this.state.dict['model.edit']}
          title="编辑"
          visible={this.state.gVisible}
          width={600}
          maskClosable={false}