import moment from 'moment'; import React, { Component, createRef } from 'react'; import reactComponentDebounce from '@/components/Common/ReactDebounce'; import '@ant-design/compatible/assets/index.css'; import { InputNumber, Checkbox, DatePicker, TimePicker, Input, Cascader, Select, AutoComplete, Spin, message, Form, Upload, Image, Button, Space, Table, Pagination, Tooltip, } from 'antd'; import { EyeOutlined, FilePdfOutlined, FileWordOutlined, FileExcelOutlined, FileOutlined, InfoCircleFilled, PlusOutlined, } from '@ant-design/icons'; import * as commonUtils from '@/utils/utils'; import styles from '@/index.less'; import Provinces from '@/assets/provinces.json'; import Cities from '@/assets/cities.json'; import Areas from '@/assets/areas.json'; import * as commonConfig from '@/utils/config'; import { VirtualKeyboard } from '@/oee/common/oeeKeyBoard';// 虚拟软键盘 import 'braft-editor/dist/output.css'; import TBTimeModalComponent from '../../../mes/common/tbTimeModalComponent'; import InputMultiModalComponent from '../../../mes/common/inputMultiModalComponent'; const FormItem = Form.Item; const { Option } = Select; const { TextArea } = Input; const { Search } = Input; const InputNumberA = reactComponentDebounce(300)(InputNumber); const InputA = reactComponentDebounce(300)(Input); const AutoCompleteA = reactComponentDebounce(300)(AutoComplete); /* 处理快速选择产品后离开 产品无法赋值问题s */ const TextAreaA = reactComponentDebounce(500)(TextArea); // const InputNumberA = InputNumber; // const InputA = Input; // const AutoCompleteA = AutoComplete; // const TextAreaA = TextArea; const { RangePicker, MonthPicker } = DatePicker; export default class CommonComponent extends Component { /** 构造函数 */ constructor(props) { super(props); this.state = { dataValue: props.dataValue, /* 本showType数据 */ enabled: props.enabled, /* 是否是查看状态(数据格式:布尔) */ dropDownData: [], /* 下拉数据集(如果不是下拉控件该值为空,数据格式:数组对象) */ conditonValues: {}, sFieldName: props.showConfig.sName, // 字段名 bNotEmpty: props.showConfig.bNotEmpty, mode: props.showConfig.bMultipleChoice ? 'multiple' : 'default', bNewRecord: props.showConfig.bNewRecord, /* 是否有新纪录 */ sActiveDisplay: true, pageNum: 0, totalPageCount: 1, searchValue: '', searchDropDownData: [], searchTotalPageCount: 1, searchPageNum: 0, spinState: false, currentPage: 1, selectTableData: [], buttonLoading: false, }; this.lastValue = props.dataValue; this.firstDataIndex = props.showConfig.sDateFormat === "decimalPoint" ? "d" : props.showConfig.sName.substring(0, 1); /* 控件首字母(数据格式:字符串) */ this.max = props.showConfig.sMaxValue; /* 最大值(数据格式:数字) */ this.min = props.showConfig.sMinValue; /* 最小值(数据格式:数字) */ // 重构修改 this.getFieldDecorator = commonUtils.isUndefined(props.form) ? undefined : props.form.getFieldDecorator; /* 字段验证(数据格式:数字) */ // this.getFieldDecorator = commonUtils.isUndefined(props.form) ? undefined : undefined; /* 字段验证(数据格式:数字) */ this.floatNum = this.props.getFloatNum(props.showConfig.sName); /* 数字格式化规范转换(数据格式:数字) */ this.floatPrice = this.getFloatPrice(this.floatNum); /* 价格格式化规范转换(数据格式:数字) */ this.formItemLayout = commonUtils.isNotEmptyObject(props.formItemLayout) ? props.formItemLayout : location.pathname.toLowerCase().indexOf('oee') > -1 ? { labelCol: { span: 7, style: { color: 'rgba(0, 0, 0, 0.65)', backgroundColor: '#BFEFFF' } }, wrapperCol: { span: 15 } } : { labelCol: { span: 7, style: { height: '27.82px', color: 'rgba(0, 0, 0, 0.65)', backgroundColor: '#BFEFFF' } }, wrapperCol: { span: 15 } }; /* 表格样式(主要是colspan和rowspan,数据格式:对象) */ this.isDropdownFilter = false; this.V = { value: props.dataValue }; this.myRef = createRef(); this.isReportInfo = this.props.showConfig?.sControlName?.startsWith('reportInfo'); this.bTbTime = this.firstDataIndex === "t" && this.props.showConfig?.sControlName?.startsWith('tbTime'); } /** 渲染前只执行一次 */ componentWillMount() { this.mounted = true; if (this.props.showConfig.sDropDownType === 'const') { /* 常量下拉 */ /* 常量下拉其实只取一次数据就可以啦,去过数据的会给state中的dropDownData赋值,所以dropDownData有值的情况就不需要再获取了 */ const showDropDown = commonUtils.isNotEmptyArr(this.props.showConfig.dropDownData) ? this.props.showConfig.dropDownData : (typeof this.props.showConfig.showDropDown === 'object') ? this.props.showConfig.showDropDown : commonUtils.objectToArr(commonUtils.convertStrToObj(this.props.showConfig.showDropDown)); /* 给state赋值 */ if (this.mounted) { this.setState({ dropDownData: showDropDown, }); } } else if (this.props.showConfig.sDropDownType === 'sql' && !commonUtils.isEmptyArr(this.props.showConfig.dropDownData)) { if (this.mounted) { this.setState({ dropDownData: this.props.showConfig.dropDownData, }); } } } componentDidMount() { const currentNode = this.myRef.current; const selectInputNode = currentNode.querySelector("input[class*='ant-select-selection-search-input']"); if (selectInputNode) { selectInputNode.addEventListener('compositionstart', () => { this.chineseInputting = true; }); selectInputNode.addEventListener('compositionend', () => { this.chineseInputting = false; }); } if (currentNode) { if (['t', 'm', 'y'].includes(this.firstDataIndex)) { const oInput = currentNode.querySelector(`#${this.props.showConfig.sName}`); if (oInput) { let { sDateFormat } = this.props.showConfig; if (commonUtils.isEmptyStr(sDateFormat)) { if (this.firstDataIndex === 'm') { sDateFormat = 'YYYY-MM'; } else if (this.firstDataIndex === 'y') { sDateFormat = 'YYYY'; } else { sDateFormat = this.props.getDateFormat(); } } oInput.oninput = (e) => { const { value } = e.target; const isValidDate = moment(value, sDateFormat, true).isValid(); if (isValidDate) { this.handleSelectOptionEvent(moment(this.state.dataValue), value); } }; } } } if (this.bTbTime) { const oInput = currentNode.querySelector('.ant-picker-input input'); if (oInput) { oInput.onfocus = () => { this.setState({ tbTimeModalVisible: true }); } } } if (currentNode && commonUtils.isNotEmptyObject(this.props.showConfig.sName) && this.props.showConfig.sDropDownType === 'popup') { const oInput = currentNode.querySelector('input'); const oBtn = currentNode.querySelector('.ant-input-group-addon button'); if (oInput && oBtn) { oInput.onfocus = () => { oBtn.click(); } } } // 默认获取下拉值 if (this.props.getDefaultDropDownData && this.props.showConfig.sDropDownType === 'sql' && commonUtils.isEmptyArr(this.props.showConfig.dropDownData)) { this.props.getSqlDropDownData(this.props.formId, this.props.name, this.props.showConfig, this.props.record, '', 1).then(result => { this.props.getDefaultDropDownData(result); }); } } /** props改变的时候触发 */ componentWillReceiveProps(nextProps) { /* 如果是下拉控件,则要获取数据(获取下拉数据前要先更新sqlCondition) */ const { dataValue, enabled, sFieldName, bNotEmpty, showName, sDropDownType, } = this.state; if (nextProps.showConfig === undefined || this.props.showConfig === undefined) return; this.firstDataIndex = nextProps.showConfig.sDateFormat === "decimalPoint" ? "d" : nextProps.showConfig.sName.substring(0, 1); /* 控件首字母(数据格式:字符串) */ if (nextProps.showConfig.sDropDownType === 'const') { /* 常量下拉 */ /* 常量下拉其实只取一次数据就可以啦,去过数据的会给state中的dropDownData赋值,所以dropDownData有值的情况就不需要再获取了 */ const showDropDown = commonUtils.isNotEmptyArr(nextProps.showConfig.dropDownData) ? nextProps.showConfig.dropDownData : (typeof nextProps.showConfig.showDropDown === 'object') ? nextProps.showConfig.showDropDown : commonUtils.objectToArr(commonUtils.convertStrToObj(nextProps.showConfig.showDropDown)); // 对应工序单独处理 // if (this.props.showConfig.showName === '对应工序') { // showDropDown = nextProps.customDropData; // } /* 给state赋值 */ if (this.mounted) { this.setState({ dropDownData: showDropDown, }); } } else if (nextProps.showConfig.sDropDownType === 'sql' && !commonUtils.isEmptyArr(nextProps.showConfig.dropDownData)) { if (this.mounted) { this.setState({ dropDownData: nextProps.showConfig.dropDownData, }); } } /* 把需要更新的数据setState */ if (dataValue !== nextProps.dataValue || enabled !== nextProps.enabled || bNotEmpty !== nextProps.showConfig.bNotEmpty || sFieldName !== nextProps.showConfig.sName || (showName !== nextProps.showConfig.showName || !showName) || sDropDownType !== nextProps.showConfig.sDropDownType) { if (this.mounted) { if (nextProps.dataValue === undefined) { this.lastValue = nextProps.dataValue; } this.setState({ dataValue: nextProps.dataValue, enabled: nextProps.enabled, sFieldName: nextProps.showConfig.sName, sDropDownType: nextProps.showConfig.sDropDownType, bNotEmpty: nextProps.showConfig.bNotEmpty, showName: nextProps.showConfig.showName, numberChanged: this.numberChanged }); } } } shouldComponentUpdate(nextProps, nextState) { const { dataValue, enabled, dropDownData, searchValue, searchDropDownData, sFieldName, bNotEmpty, sActiveDisplay, sDropDownType, spinState, tbTimeModalVisible, inputMultiModalVisible } = this.state; let iBigBoardNoFlag = false; if ( (nextProps.name === "salveWydm2" && nextProps?.showConfig?.sName === 'iBigBoardNo') || (nextProps.name === "slaveWypj2" && nextProps?.showConfig?.sName === 'sReelNo') || (nextProps.name === "slaveWypj2" && nextProps?.showConfig?.sName === 'sIndexNo') || (nextProps.name === "salveWybz2" && nextProps?.showConfig?.sName?.endsWith('BigBoardNo')) || (nextProps.name === "slaveWyrj2" && nextProps?.showConfig?.sName === 'sIndexNo') ) { iBigBoardNoFlag = JSON.stringify(nextProps.record) !== JSON.stringify(this.props.record); } return nextProps.showConfig !== undefined && (dataValue !== nextState.dataValue || enabled !== nextState.enabled || sFieldName !== nextState.sFieldName || sDropDownType !== nextState.sDropDownType || bNotEmpty !== nextState.bNotEmpty || JSON.stringify(dropDownData) !== JSON.stringify(nextState.dropDownData) || searchValue !== nextState.searchValue || JSON.stringify(searchDropDownData) !== JSON.stringify(nextState.searchDropDownData) || JSON.stringify(sActiveDisplay) !== JSON.stringify(nextState.sActiveDisplay) || nextProps.showTime !== this.props.showTime || spinState !== nextState.spinState || JSON.stringify(nextState.selectTableData) !== JSON.stringify(this.state.selectTableData) || iBigBoardNoFlag || tbTimeModalVisible !== nextState.tbTimeModalVisible || inputMultiModalVisible !== nextState.inputMultiModalVisible); } componentWillUnmount() { this.mounted = false; } onFocus = () => { if (['i', 'd', 'b', 's'].includes(this.firstDataIndex)) { const { sOnChangeInstruct } = this.props.showConfig; const sInstruct = commonUtils.convertStrToObj(sOnChangeInstruct, {}); if (sInstruct.blur) { this.props.app?.globalFun?.onSetMask(true); } } clearTimeout(this.leaveTimer); this.isDropdownFilter = false; this.setState({ sActiveDisplay: false }); }; onBlur = (event) => { this.isDropdownFilter = false; if (this.state.searchValue !== '' && this.props.showConfig.sDropDownType === 'sql' && commonUtils.isEmptyArr(this.props.showConfig.dropDownData)) { if (!this.props.showConfig.bCanInput) { this.handleSelectOptionEvent(''); } this.setState({ searchPageNum: 1, searchTotalPageCount: 1, searchDropDownData: [], searchValue: '', spinState: false, sActiveDisplay: true, }); } else { this.setState({ sActiveDisplay: true, }); } /* 若下拉配置了movesql 则离开时 调用下拉sql数据 */ if (this.props.showConfig && (this.props.showConfig.sDropDownType === 'movesql' || commonUtils.isNotEmptyObject(this.props.showConfig.sButtonParam))) { this.props.onDropDownBlur(this.props.name, this.props.showConfig.sName, this.props.record, this.props.showConfig); } this.onCheckFields(500); this.onBlurText(event, 500); }; onBlurText = (event, timeout = 0) => { const currentValue = event?.target?.value; if (currentValue == this.lastValue) { this.props.app?.globalFun?.onSetMask(false); return; } if (this.onExecInstructSet('blur')) { this.lastValue = currentValue; return; }; setTimeout(() => { const { name, record, sBtnSendDialogConfigList, onToolBarBtnClick, } = this.props; if (name !== 'master') return; if (commonUtils.isEmptyArr(sBtnSendDialogConfigList)) return; const { sName } = this.props.showConfig; if (!record[sName]) return; const { sActiveKey, sControlName } = sBtnSendDialogConfigList.find((item) => { const { sActiveKey = '' } = item; return sActiveKey.split(',').includes(`${name}.${sName}`); }) || {}; if (!sActiveKey) return; this.lastValue = currentValue; onToolBarBtnClick({ key: sControlName }); }, timeout); } onExecInstructSet = (type) => { const { showName, sOnChangeInstruct } = this.props.showConfig; const sInstruct = commonUtils.convertStrToObj(sOnChangeInstruct, {}); const { [type]: instructType } = sInstruct; if (instructType) { if (this.props.onExecInstructSet) { this.props.onExecInstructSet({ nextProps: { [`${this.props.name}SelectedRowKeys`]: [this.props.record.sId] }, btnConfig: { sInstruct: JSON.stringify(instructType), showName: `${showName}-${type === 'blur' ? '离焦' : '变化'}`, }, callback: () => { type === 'blur' && this.props.app.globalFun?.onSetMask(false); } }); } else { message.error('未定义调用指令集事件！'); } return true; } return false; } onCheckFields = (timeout = 0) => { // 手机号、邮箱校验等校验 setTimeout(() => { const sDateFormatTypeList = ['phone', 'mobile', 'mail', 'postcode']; const { sName, showName, sDateFormat } = this.props.showConfig; const { record } = this.props; const value = record?.[sName]; if ( value !== undefined && value !== '' && sDateFormatTypeList.includes(sDateFormat) ) { let flag = false; if (sDateFormat === 'phone') { const reg = /^0\d{2,3}-\d{7,8}$/; const reg1 = /^1[0-9]{10}$/; if (!reg.test(value) && !reg1.test(value)) { flag = true; } } else if (sDateFormat === 'mobile') { const reg = /^0\d{2,3}-\d{7,8}$/; const reg1 = /^1[0-9]{10}$/; if (!reg.test(value) && !reg1.test(value)) { flag = true; } } else if (sDateFormat === 'mail') { const reg = /^[a-zA-Z0-9]{1,10}@[a-zA-Z0-9]{1,5}\.[a-zA-Z0-9]{1,5}$/; if (!reg.test(value)) { flag = true; } } else if (sDateFormat === 'postcode') { const reg = /^[1-9][0-9]{5}$/; if (!reg.test(value)) { flag = true; } } if (flag) { message.warning(`【${showName}】【${sName}】格式不正确！`); } } }, timeout); } /** 下拉时看是否要重新获取数据 */ onDropdownVisibleChange = (open) => { const { dropDownData, bNewRecord, pageNum: pageNumOld, totalPageCount: totalPageCountOld, searchValue, conditonValues, } = this.state; if (this.mounted && open) { const conditonValuesNew = this.props.getSqlCondition(this.props.showConfig, this.props.name, this.props.record); const pageNum = JSON.stringify(conditonValuesNew) !== JSON.stringify(conditonValues) ? 1 : pageNumOld === 0 ? 1 : pageNumOld; const totalPageCount = conditonValuesNew !== conditonValues ? 1 : totalPageCountOld; if (pageNum === 1 && this.props.showConfig.sDropDownType === 'sql' && commonUtils.isEmptyArr(this.props.showConfig.dropDownData)) { this.setState({ spinState: true }); this.getDropDownData(pageNum, totalPageCount, searchValue); } } else { // if (searchValue !== '' && this.props.showConfig.sDropDownType === 'sql' && commonUtils.isEmptyArr(this.props.showConfig.dropDownData)) { // this.setState({ // searchPageNum: 1, searchTotalPageCount: 1, searchDropDownData: [], searchValue: '', spinState: false, // }); // } this.isDropdownFilter = false; } if (this.props.onDropdownVisibleChange !== undefined) { if (dropDownData.length === 0 && !bNewRecord) { /* 如果没有值并且没有新纪录，则不展开 */ open = false; } this.props.onDropdownVisibleChange(open); } } onDoubleClick = () => { const sMemo = this.props.showConfig.sName; const title = this.props.showConfig.showName; const bSParamValue = sMemo === 'sParamValue'; if ((commonUtils.isNotEmptyObject(sMemo) && sMemo.indexOf('Memo') > -1) || (bSParamValue && !this.props.record.sDropDownData)) { const sCurrMemoProps = { title, name: this.props.name, sValue: this.props.dataValue, sMemoField: sMemo, bVisibleMemo: true, sRecord: this.props.record, sMemoConfig: this.props.showConfig, }; if (this.props.bInSlaveMemo) { this.props.onSaveState({ sCurrMemoProps1: sCurrMemoProps }); } else if (this.props.onSaveState) { this.props.onSaveState({ sCurrMemoProps }); } } else if (commonUtils.isNotEmptyObject(sMemo) && sMemo.indexOf('sValue') > -1) { /* 计算方案 变量设置双击弹出 */ this.props.onFieldDoubleClick(this.props.record, this.state.dataValue, this.props.showConfig, this.props.name); } else if (commonUtils.isNotEmptyObject(sMemo) && sMemo.indexOf('sAssignField') > -1) { /* 赋值字段 变量设置双击弹出 */ this.props.onFieldDoubleClick(this.state.dataValue, this.props.showConfig, this.props.name); } } onEditorClick = () => { // if (this.props.enabled) { // // } const curEditorProps = { title: this.props.showConfig.showName, name: this.props.name, value: this.props.dataValue, sName: this.props.showConfig.sName, visible: true, record: this.props.record, config: this.props.showConfig, }; this.props.onSaveState({ curEditorProps }); } onKeyUp = (e) => { if (this.props.onKeyUp) { this.props.onKeyUp(e); } } onKeyDown = (e) => { if (e.ctrlKey && e.keyCode === 82) { /* CTRL+ALT+R 代替右击事件 */ this.onContextMenu(e); } else if (e.key === 'F10') { message.info(this.props.showConfig.sName); } else if (e.ctrlKey && (e.altKey || e.metaKey) && e.keyCode === 71) { /* CTRL+ALT+G F7 设置界面 */ if (commonUtils.isNotEmptyObject(this.props)) { const { name, tableConfig, record, configName, } = this.props; if (commonUtils.isNotEmptyObject(tableConfig)) { const myTableConfig = JSON.parse(JSON.stringify(tableConfig)); myTableConfig.sActiveId = '16411004790004762980820285096000'; myTableConfig.sName = this.props.showConfig.sName; const myTableConfigArr = []; myTableConfigArr.push(myTableConfig); if (this.props.name === 'master') { /* 主表 */ this.props.onViewClick(name, 'myTableConfig', record, 0, myTableConfigArr, configName); } else { /* 从表 */ this.props.onViewClick(name, 'myTableConfig', record, 0, myTableConfigArr, configName); } } } } else if (this.props.onKeyDown) { const { showConfig, record, name } = this.props; this.props.onKeyDown(e, record, showConfig.sName, name); } } /* CommonList列表onkeydown-F10处理 */ onKeyDownDiv = (e) => { if (this.props.onKeyDown) { this.props.onKeyDown(e); } if (e.key === 'F10') { message.info(this.props.showConfig.sName); } else if (e.ctrlKey && e.keyCode === 67) { console.log('复制成功！'); } else if (e.ctrlKey && e.keyCode === 65) { console.log('全选成功！'); } else { e.preventDefault(); return false; } } /* 单击右键全部更新，弹出窗选择后，更新此列所有数据 （只更新非只读字段） */ onContextMenu = (e) => { if (this.state.enabled && commonUtils.isNotEmptyObject(this.props) && this.props.name !== 'master' && commonUtils.isNotEmptyObject(this.props.showConfig)) { const { showConfig, name } = this.props; const { bReadonly } = showConfig; if (bReadonly) { return; } e.preventDefault(); /* 阻止浏览器本身的右击事件 */ if (this.props.onContextMenu) { const { showConfig, record } = this.props; this.props.onContextMenu(e, record, showConfig, name); } } } /* 字段选择弹窗 */ onFieldPopupModal = (showConfig, name, open) => { if (open) { this.props.onFieldPopupModal(showConfig, name); } } /** 获取selectprops对象 */ getSelectProps = () => { /* 返回值声明 */ const obj = { showSearch: true, /* 是否有查找功能 */ // disabled: !this.state.enabled /* 修改的时候传过来的数据 */ onChange: this.handleSelectOptionEvent, /* 选择触发事件 */ filterOption: this.filterOption, /* 搜索时过滤对应的 option 属性 */ onDropdownVisibleChange: this.onDropdownVisibleChange, onPopupScroll: this.handlePopupScroll, onSearch: this.handleSearch, notFoundContent: this.state.spinState ? : '暂无数据', // getPopupContainer: this.props.name === 'slave' || this.props.name === 'searchColumnShow' ? this.getPopupContainer : null,/*解决下拉框不随浏览器滚动问题 */ onFocus: this.onFocus, onBlur: this.onBlur, mode: this.state.mode, maxTagCount: 'responsive', onPaste: (event) => { if (this.props.showConfig.bMultipleChoice) { const clipboardText = event.clipboardData.getData('text/plain').trim(); if (clipboardText) { const { dataValue = '' } = this.state; let dataValueNew = dataValue; if (dataValueNew === '') { dataValueNew += clipboardText; } else { dataValueNew += `,${clipboardText}`; } this.handleSelectOptionEvent(dataValueNew, []); document.activeElement.blur(); } } }, }; if (this.props.showConfig.sDropDownType === 'sql') { obj.optionLabelProp = 'title'; } if (this.props.readOnly) { obj.readOnly = 'readOnly'; } else { obj.disabled = !this.state.enabled; } obj.placeholder = this.props.showConfig.placeholder; /* 区分Oee设置字体与其他系统设置字体 */ obj.dropdownStyle = commonUtils.isNotEmptyObject(location.pathname) && location.pathname.toLowerCase().indexOf('oee') > -1 ? { fontSize: '1.3rem' } : { fontSize: '12px' }; obj.dropdownClassName = commonUtils.isNotEmptyObject(location.pathname) && location.pathname.toLowerCase().indexOf('oee') > -1 ? (location.pathname.toLowerCase().indexOf('loginoee') > -1 ? 'loginOeeDropDown' : 'oeeDropDown') : ''; /* 主表时才赋值value */ if (this.props.bTable) { if (this.props.showConfig.bMultipleChoice) { obj.value = !commonUtils.isEmpty(this.state.dataValue) ? this.state.dataValue.split(",") : []; /* 数据值 */ } else { obj.value = this.state.dataValue; /* 数据值 */ } obj.className = this.props.costomClassName === undefined ? styles.editSelect : this.props.costomClassName; } if (this.props.showConfig.iDropWidth > 0) { obj.dropdownMatchSelectWidth = false; /* true时 下拉菜单和选择器同宽。默认将设置 min-width，当值小于选择框宽度时会被忽略。 */ obj.dropdownStyle.width = this.props.showConfig.iDropWidth; } obj.onInputKeyDown = this.onKeyDown; obj.onKeyUp = this.onKeyUp; if (this.props.showConfig.sName === 'sLabelColor') { if (obj.value === '红牌') { obj.className = styles.colorRed; } else if (obj.value === '黄牌') { obj.className = styles.colorYellow; } } /* 返回值 */ return obj; }; getSelectTableProps = () => { const { currentPage, tempCurrentPage, searchValue } = this.state; const pageNum = searchValue === '' ? currentPage : tempCurrentPage; /* 返回值声明 */ const obj = { dropdownMatchSelectWidth: false, filterOption: this.filterOption, /* 搜索时过滤对应的 option 属性 */ onDropdownVisibleChange: (open) => { this.onDropdownVisibleChange(open); if (open === false) { clearTimeout(this.blurtimer); this.blurtimer = setTimeout(() => { this.onBlur(); }, 500); } else { clearTimeout(this.blurtimer); this.onFocus(); } }, onSearch: this.selectTableSearch, showSearch: true, // onFocus: this.onFocus, // onBlur: this.onBlur, }; if (this.props.showConfig.sDropDownType === 'sql') { obj.optionLabelProp = 'title'; } if (this.props.readOnly) { obj.readOnly = 'readOnly'; } else { obj.disabled = !this.state.enabled; } obj.placeholder = this.props.showConfig.placeholder; /* 区分Oee设置字体与其他系统设置字体 */ obj.dropdownStyle = commonUtils.isNotEmptyObject(location.pathname) && location.pathname.toLowerCase().indexOf('oee') > -1 ? { fontSize: '1.3rem' } : { fontSize: '12px' }; obj.dropdownClassName = commonUtils.isNotEmptyObject(location.pathname) && location.pathname.toLowerCase().indexOf('oee') > -1 ? (location.pathname.toLowerCase().indexOf('loginoee') > -1 ? 'loginOeeDropDown' : 'oeeDropDown') : ''; /* 主表时才赋值value */ if (this.props.bTable) { obj.value = this.props.showConfig.bMultipleChoice && !commonUtils.isEmpty(this.state.dataValue) ? this.state.dataValue.split(',') : this.state.dataValue; /* 数据值 */ obj.className = this.props.costomClassName === undefined ? styles.editSelect : this.props.costomClassName; } if (this.props.showConfig.iDropWidth > 0) { obj.dropdownMatchSelectWidth = false; /* true时 下拉菜单和选择器同宽。默认将设置 min-width，当值小于选择框宽度时会被忽略。 */ } obj.onInputKeyDown = this.onKeyDown; obj.onKeyUp = this.onKeyUp; /* eslint-disable */ obj.dropdownRender = (menu) => ( <> {/*
this.selectTableSearch(e)}/>
*/} {menu}
this.selectTableChange(e)} showSizeChanger={false} current={pageNum} pageSize={20} size="large" total={this.state.totalCount} /> {this.props.showConfig.bFirstEmpty && ( ) } {this.props.showConfig.bNewRecord && ( ) }
) /* eslint-enable */ /* 返回值 */ return obj; }; getLocalizedString = (jsonStr, language) => { try { const data = JSON.parse(jsonStr); return data[language] || ""; } catch (e) { console.error("Error parsing JSON:", e); return ""; } }; getSelectTableOption = () => { const { selectTableData } = this.state; const { showConfig , app} = this.props; const { userinfo } = app; let { sTableTitleSql } = showConfig; /* 根据用户配置语言 设置表格标题 */ if (commonUtils.isJSON(sTableTitleSql) && sTableTitleSql.includes("Chinese")) { sTableTitleSql = this.getLocalizedString(sTableTitleSql, userinfo.sLanguage); } const tempColumnArr = sTableTitleSql.split(','); let scrollX = 0; const columns = tempColumnArr.map((item, index) => { const tempArr = item.split(':'); const [value, title, columnWidth] = tempArr; let width; if (!Number.isNaN(Number(columnWidth))) { // 如果配置了列宽 width = Number(columnWidth); } else { // 没有配置列宽，就根据字符数算宽度 // 获取中文字数、非中文字数， 中文12px，其它8px const titleStr = title; const totalStringLen = titleStr?.length; const otherStrLen = titleStr.replace(/[^\x00-\xff]/g, '').length; // eslint-disable-line const chineseStrLen = totalStringLen - otherStrLen; const defaultWidth = (chineseStrLen * 20) + (otherStrLen * 12); const maxStrLen = selectTableData.reduce((res, pre) => { let tempValue = pre[value] !== undefined ? pre[value] : ''; if (tempValue === '') { return res; } tempValue = typeof tempValue === 'string' ? tempValue : JSON.stringify(tempValue); const totalStringLen = tempValue.length; const otherStrLen = tempValue.replace(/[^\x00-\xff]/g, '').length; // eslint-disable-line const chineseStrLen = totalStringLen - otherStrLen; const tempWidth = (chineseStrLen * 20) + (otherStrLen * 12); return Math.max(tempWidth, res); }, defaultWidth); width = Math.min(maxStrLen + 8, 300); } scrollX += width; return { title, dataIndex: value, key: value, width: index !== tempColumnArr.length - 1 ? width : undefined, render: (text) => { return (
{text}
); }, }; }); return (