2023-10-27

king

2023-10-27 882d11341442d5128c9e314f76e48d4d829f31cc

 src/tabviews/custom/components/table/edit-table/normalTable/mkPopSelect/index.jsx

@@ -1,13 +1,11 @@
import React, {Component} from 'react'
import { is, fromJS } from 'immutable'
import { Select } from 'antd'
import { notification, Modal, Table, Input } from 'antd'
import moment from 'moment'
import { TableOutlined } from '@ant-design/icons'
import { TableOutlined, CloseCircleFilled } from '@ant-design/icons'

import Api from '@/api'
import Utils from '@/utils/utils.js'
import MKEmitter from '@/utils/events.js'
import './index.scss'

const { Search } = Input
@@ -17,7 +15,7 @@
    super(props)
    
    let config = fromJS(props.config).toJS()
    let value = props.defaultValue || config.initval
    let value = props.defaultValue

    let arrfield = config.columns.map(f => f.field)
  
@@ -94,10 +92,10 @@
  }

  componentDidMount () {
    const { config } = this.state
    const { mask } = this.props

    if (config.onload === 'true' && config.editType !== 'popSelect') {
      this.loadData()
    if (mask) {
      this.trigger()
    }
  }

@@ -243,46 +241,26 @@

  selectChange = (val, record) => {
    const { config } = this.state
    let other = {}

    if (config.subFields) {
      let option = record || null
    let values = {[config.field]: val}

      if (!option) {
        option = this.state.options.filter(m => m.$$uuid === val)[0]
      }

      option && config.subFields.forEach((n, i) => {
        other[n.field] = option[n.field]
        setTimeout(() => {
          MKEmitter.emit('mkFC', 'input', n.uuid, option[n.field])
        }, i * 5)
    if (config.linkSubField) {
      config.linkSubField.forEach(m => {
        values[m] = record[m] === undefined ? '' : record[m]
      })
    }

    this.props.onChange(val, other)
    this.setState({value: val}, () => {
      if (config.enter === 'tab') {
        MKEmitter.emit('mkFC', 'focus', config.tabUuid)
      } else if (config.enter === 'sub') {
        if (config.subFields) {
          setTimeout(() => {
            this.props.onSubmit()
          }, 1000)
        } else {
          this.props.onSubmit()
        }
      }
    })
    this.props.onChange(values)
    this.setState({value: val})
  }

  trigger = (e) => {
    const { config, options } = this.state
    
    e.stopPropagation()
    e && e.stopPropagation()

    this.setState({visible: true}, () => {
      if (config.editType === 'popSelect' && options.length === 0) {
      if (config.onload === 'true' && options.length === 0) {
        this.loadData()
      }
    })
@@ -294,6 +272,23 @@

    this.selectChange(record.$$uuid, record)
    this.setState({visible: false})
  }

  clear = (e) => {
    const { config } = this.state

    e.stopPropagation()
    
    let values = {[config.field]: ''}

    if (config.linkSubField) {
      config.linkSubField.forEach(m => {
        values[m] = ''
      })
    }

    this.props.onChange(values)
    this.setState({value: ''})
  }

  changeTable = (pagination, filters, sorter) => {
@@ -316,25 +311,27 @@
    })
  }

  cancel = () => {
    const { mask } = this.props

    this.setState({visible: false})

    if (mask) {
      this.props.blur()
    }
  }

  render() {
    const { mask } = this.props
    const { value, config, options, visible, loading, total, pageIndex, pageSize, columns, placeholder } = this.state
    
    return <>
      <Select
        className="mk-pop-select"
        showSearch={!!config.searchKey}
        allowClear
        value={value}
        onSearch={(val) => val && this.searchOption(val)}
        filterOption={false}
        onChange={(val) => this.selectChange(val === undefined ? '' : val)}
        disabled={config.readonly}
        suffixIcon={<TableOutlined onClick={this.trigger}/>}
      >
        {options.map(option =>
          <Select.Option disabled={option.$disabled} key={option.key} value={option.$$uuid}>{option.$label}</Select.Option>
        )}
      </Select>
      {mask ? <div className="mk-pop-select-mask" onClick={this.trigger}></div> : null}
      <div className="mk-pop-select-wrap" onClick={this.trigger}>
        {value}
        {value && !mask ? <CloseCircleFilled onClick={this.clear} /> : null}
        <TableOutlined onClick={this.trigger}/>
      </div>
      <Modal
        wrapClassName='mk-pop-select-modal'
        title={config.label}
@@ -344,7 +341,7 @@
        maskClosable={false}
        cancelText="关闭"
        width={config.popWidth < 100 ? config.popWidth + 'vw' : config.popWidth}
        onCancel={() => this.setState({visible: false})}
        onCancel={this.cancel}
        destroyOnClose
      >
        {config.searchKey ? <Search placeholder={placeholder} onSearch={this.searchOption} enterButton /> : null}