From 882d11341442d5128c9e314f76e48d4d829f31cc Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期五, 27 十月 2023 17:15:47 +0800 Subject: [PATCH] 2023-10-27 --- src/tabviews/custom/components/table/edit-table/normalTable/mkPopSelect/index.jsx | 99 ++++++++++++++++++++++++------------------------- 1 files changed, 48 insertions(+), 51 deletions(-) diff --git a/src/tabviews/custom/components/table/edit-table/normalTable/mkPopSelect/index.jsx b/src/tabviews/custom/components/table/edit-table/normalTable/mkPopSelect/index.jsx index ca6c4d0..651bc6f 100644 --- a/src/tabviews/custom/components/table/edit-table/normalTable/mkPopSelect/index.jsx +++ b/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} -- Gitblit v1.8.0