From bca9d545b6b10e1d0120b8edaece22f9acbe12f3 Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期一, 30 十月 2023 16:08:14 +0800 Subject: [PATCH] 2023-10-30 --- src/tabviews/custom/components/table/edit-table/normalTable/mkPopSelect/index.jsx | 305 +++++++++++++++++++++----------------------------- 1 files changed, 128 insertions(+), 177 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 651bc6f..f2444ec 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,6 +1,6 @@ import React, {Component} from 'react' import { is, fromJS } from 'immutable' -import { notification, Modal, Table, Input } from 'antd' +import { notification, Modal, Table, Input, Tabs } from 'antd' import moment from 'moment' import { TableOutlined, CloseCircleFilled } from '@ant-design/icons' @@ -9,109 +9,32 @@ import './index.scss' const { Search } = Input +const { TabPane } = Tabs -class MKPopSelect extends Component { - constructor(props) { - super(props) - - let config = fromJS(props.config).toJS() - let value = props.defaultValue - - let arrfield = config.columns.map(f => f.field) - - if (config.subFields && config.subFields.length > 0) { - config.subFields.forEach(n => { - if (!arrfield.includes(n.field)) { - arrfield.push(n.field) - } - }) - } - - if (sessionStorage.getItem('dataM') === 'true') { // 鏁版嵁鏉冮檺 - config.dataSource = config.dataSource.replace(/\$@/ig, '/*').replace(/@\$/ig, '*/').replace(/@datam@/ig, '\'Y\'') - } else { - config.dataSource = config.dataSource.replace(/@\$|\$@/ig, '').replace(/@datam@/ig, '\'\'') - } - - config.dataSource = config.dataSource.replace(/@LoginUID@/ig, `'${sessionStorage.getItem('LoginUID') || ''}'`) - config.dataSource = config.dataSource.replace(/@SessionUid@/ig, `'${localStorage.getItem('SessionUid') || ''}'`) - config.dataSource = config.dataSource.replace(/@UserID@/ig, `'${sessionStorage.getItem('UserID') || ''}'`) - config.dataSource = config.dataSource.replace(/@Appkey@/ig, `'${window.GLOB.appkey || ''}'`) - - if (/\s/.test(config.dataSource)) { // 鎷兼帴鍒悕 - config.dataSource = '(' + config.dataSource + ') tb' - } - - let columns = [] - let labels = {} - config.columns.forEach(col => { - labels[col.field] = col.label - - if (col.Hide === 'true') return - - columns.push({ - dataIndex: col.field, - title: col.label, - sorter: col.IsSort === 'true', - width: col.Width || 120 - }) - }) - - let placeholder = '' - if (!config.searchKey) { - config.onload = 'true' - } else { - placeholder = [] - config.searchKey.split(',').forEach(key => { - if (!labels[key]) { - placeholder = '' - } else if (placeholder) { - placeholder.push(labels[key]) - } - }) - - placeholder = placeholder ? placeholder.join('銆�') : '' - } - - this.state = { - config: config, - options: [], - columns, - value, - placeholder, - arr_field: arrfield.join(','), - searchKey: '', - pageIndex: 1, - pageSize: 10, - orderBy: '', - visible: false, - loading: false - } - - this.timer = null +class PopTable extends Component { + state = { + options: [], + searchKey: '', + pageIndex: 1, + pageSize: 10, + orderBy: '', + loading: false } + + timer = null componentDidMount () { - const { mask } = this.props + const { config } = this.props + const { options } = this.state - if (mask) { - this.trigger() - } - } - - shouldComponentUpdate (nextProps, nextState) { - return !is(fromJS(this.state), fromJS(nextState)) - } - - componentWillUnmount () { - this.setState = () => { - return + if (config.onload === 'true' && options.length === 0) { + this.loadData() } } loadData () { - const { BID, ID } = this.props - const { config, pageIndex, pageSize, arr_field, searchKey, orderBy } = this.state + const { BID, ID, config } = this.props + const { pageIndex, pageSize, searchKey, orderBy } = this.state this.setState({ loading: true @@ -121,7 +44,7 @@ func: 'sPC_Get_TableData', obj_name: 'data', exec_type: 'y', - arr_field: arr_field, + arr_field: config.arr_field, default_sql: 'true', custom_script: '', menuname: config.label @@ -142,12 +65,12 @@ _datasource = _datasource.replace(/@ID@/ig, `'${ID || ''}'`) if (config.laypage === 'true') { - sql = `/*system_query*/select top ${pageSize} ${arr_field} from (select ${arr_field} ,ROW_NUMBER() over(order by ${_orderBy}) as rows from ${_datasource} ${_search}) tmptable where rows > ${pageSize * (pageIndex - 1)} order by tmptable.rows ` + sql = `/*system_query*/select top ${pageSize} ${config.arr_field} from (select ${config.arr_field} ,ROW_NUMBER() over(order by ${_orderBy}) as rows from ${_datasource} ${_search}) tmptable where rows > ${pageSize * (pageIndex - 1)} order by tmptable.rows ` DateCount = `/*system_query*/select count(1) as total from ${_datasource} ${_search}` } else if (_orderBy) { - sql = `/*system_query*/select ${arr_field} from (select ${arr_field} ,ROW_NUMBER() over(order by ${_orderBy}) as rows from ${_datasource} ${_search}) tmptable order by tmptable.rows ` + sql = `/*system_query*/select ${config.arr_field} from (select ${config.arr_field} ,ROW_NUMBER() over(order by ${_orderBy}) as rows from ${_datasource} ${_search}) tmptable order by tmptable.rows ` } else { - sql = `/*system_query*/select ${arr_field} from ${_datasource} ${_search} ` + sql = `/*system_query*/select ${config.arr_field} from ${_datasource} ${_search} ` } let departmentcode = sessionStorage.getItem('departmentcode') || '' @@ -173,12 +96,11 @@ param.username = sessionStorage.getItem('User_Name') || '' param.fullname = sessionStorage.getItem('Full_Name') || '' - Api.genericInterface(param).then(result => { + Api.getSystemCacheConfig(param, config.cache === 'true').then(result => { if (result.status) { let options = result.data.map((item, index) => { item.key = index item.$$uuid = item[config.primaryKey] || '' - item.$label = item[config.showField] if (config.controlField && item[config.controlField] === 'true') { item.$disabled = true @@ -239,10 +161,12 @@ }, 500) } - selectChange = (val, record) => { - const { config } = this.state + changeRow = (record) => { + const { config } = this.props - let values = {[config.field]: val} + if (record.$disabled) return + + let values = {[config.field]: record.$$uuid} if (config.linkSubField) { config.linkSubField.forEach(m => { @@ -250,45 +174,7 @@ }) } - this.props.onChange(values) - this.setState({value: val}) - } - - trigger = (e) => { - const { config, options } = this.state - - e && e.stopPropagation() - - this.setState({visible: true}, () => { - if (config.onload === 'true' && options.length === 0) { - this.loadData() - } - }) - } - - changeRow = (record) => { - - if (record.$disabled) return - - 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: ''}) + this.props.onChange(values, record.$$uuid) } changeTable = (pagination, filters, sorter) => { @@ -311,6 +197,94 @@ }) } + render() { + const { config, value } = this.props + const { options, loading, total, pageIndex, pageSize } = this.state + + return <> + {config.searchKey ? <Search placeholder={config.placeholder} onSearch={this.searchOption} enterButton /> : null} + <Table + rowKey="$$uuid" + bordered={true} + rowSelection={null} + columns={config.cols} + dataSource={options} + loading={loading} + onRow={(record) => { + let className = '' + + if (record.$disabled) { + className = ' mk-disable-line ' + } else if (value === record.$$uuid) { + className = ' ant-table-row-selected ' + } + + return { + className: className, + onClick: () => {this.changeRow(record)}, + } + }} + onChange={this.changeTable} + pagination={config.laypage === 'true' ? { + current: pageIndex, + pageSize: pageSize, + showSizeChanger: true, + total: total || 0, + showTotal: (total, range) => `${range[0]}-${range[1]} 鍏� ${total} 鏉 + } : false} + /> + </> + } +} + +class MKPopSelect extends Component { + constructor(props) { + super(props) + + this.state = { + value: props.defaultValue, + visible: false + } + } + + shouldComponentUpdate (nextProps, nextState) { + return !is(fromJS(this.state), fromJS(nextState)) + } + + componentWillUnmount () { + this.setState = () => { + return + } + } + + selectChange = (values, val) => { + this.props.onChange(values) + this.setState({value: val, visible: false}) + } + + trigger = (e) => { + e && e.stopPropagation() + + this.setState({visible: true}) + } + + clear = (e) => { + const { config } = this.props + + e.stopPropagation() + + let values = {[config.field]: ''} + + if (config.linkSubField) { + config.linkSubField.forEach(m => { + values[m] = '' + }) + } + + this.props.onChange(values) + this.setState({value: ''}) + } + cancel = () => { const { mask } = this.props @@ -322,8 +296,8 @@ } render() { - const { mask } = this.props - const { value, config, options, visible, loading, total, pageIndex, pageSize, columns, placeholder } = this.state + const { mask, BID, ID, config } = this.props + const { value, visible } = this.state return <> {mask ? <div className="mk-pop-select-mask" onClick={this.trigger}></div> : null} @@ -333,7 +307,7 @@ <TableOutlined onClick={this.trigger}/> </div> <Modal - wrapClassName='mk-pop-select-modal' + wrapClassName='mk-table-pop-select-modal' title={config.label} visible={visible} closable={true} @@ -344,37 +318,14 @@ onCancel={this.cancel} destroyOnClose > - {config.searchKey ? <Search placeholder={placeholder} onSearch={this.searchOption} enterButton /> : null} - <Table - rowKey="$$uuid" - bordered={true} - rowSelection={null} - columns={columns} - dataSource={options} - loading={loading} - onRow={(record) => { - let className = '' - - if (record.$disabled) { - className = ' mk-disable-line ' - } else if (value === record.$$uuid) { - className = ' ant-table-row-selected ' - } - - return { - className: className, - onClick: () => {this.changeRow(record)}, - } - }} - onChange={this.changeTable} - pagination={config.laypage === 'true' ? { - current: pageIndex, - pageSize: pageSize, - showSizeChanger: true, - total: total || 0, - showTotal: (total, range) => `${range[0]}-${range[1]} 鍏� ${total} 鏉 - } : false} - /> + {config.pops ? <Tabs> + {config.pops.map(tab => ( + <TabPane tab={tab.tabName} key={tab.uuid}> + <PopTable config={tab} BID={BID} ID={ID} value={value} onChange={this.selectChange}/> + </TabPane> + ))} + </Tabs> : + <PopTable config={config} BID={BID} ID={ID} value={value} onChange={this.selectChange}/>} </Modal> </> } -- Gitblit v1.8.0