import moment from "moment";
import React, { Component, createRef } from "react";
import reactComponentDebounce from "@/components/Common/ReactDebounce";
import * as commonFunc from "@/components/Common//commonFunc"; /* 通用单据方法 */ /* 通用单据方法 */
// import '@ant-design/compatible/assets/index.css';
import InstructSetSetting from "@/components/Common/InstructSetSetting"
import {
InputNumber,
Checkbox,
DatePicker,
Input,
Cascader,
Select,
AutoComplete,
Spin,
message,
Form,
Upload,
Image,
Button,
Space,
Table,
Pagination,
Tooltip,
Modal,
} from "antd-v4";
import {
DeleteOutlined,
EyeOutlined,
FilePdfOutlined,
FileWordOutlined,
FileExcelOutlined,
FileOutlined,
RightOutlined,
PlaySquareOutlined,
EditOutlined,
} 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 commonConfig from "@/utils/config";
import { VirtualKeyboard } from "@/oee/common/oeeKeyBoard"; // 虚拟软键盘
import "braft-editor/dist/output.css";
import SvgBox from "../BoxDesignCompontent/svg";
const FormItem = Form.Item;
const { Option } = Select;
const { TextArea } = Input;
const { Search } = Input;
const InputNumberA1 = reactComponentDebounce(300)(InputNumber);
const InputA1 = reactComponentDebounce(300)(Input);
const AutoCompleteA1 = reactComponentDebounce(300)(AutoComplete); /* 处理快速选择产品后离开 产品无法赋值问题s */
const TextAreaA1 = 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,
key: 0,
selectTableIndex: 0,
};
this.firstDataIndex = 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.dropDownCount = 0;
this.bSpecial = location.pathname?.includes("ResearchTableTree") && props.showConfig.sName === "sProductName";
}
/** 渲染前只执行一次 */
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']");
const antInput = currentNode.querySelector("input[class*='ant-input']");
const oInput = selectInputNode || antInput;
if (oInput && !this.props.noDebounce) {
oInput.addEventListener("compositionstart", () => {
this.chineseInputting = true;
});
oInput.addEventListener("compositionend", () => {
this.chineseInputting = false;
if (this.handleCompleteInputEventCache) {
this.handleCompleteInputEventCache();
}
});
}
if (currentNode) {
if (["t", "m", "y"].includes(this.firstDataIndex)) {
const oInput = currentNode.querySelector(`input[id*="${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);
}
};
}
}
}
document.addEventListener("mousedown", this.handleSelectClick);
}
/** 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.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 ||
(this.bSpecial && this.props.record.sProductNo !== nextProps.record.sProductNo)
) {
if (this.mounted) {
if (commonUtils.isEmpty(nextProps.dataValue)) {
this.lastValue = nextProps.dataValue;
}
const addState = {
dataValue: nextProps.dataValue,
enabled: nextProps.enabled,
sFieldName: nextProps.showConfig.sName,
sDropDownType: nextProps.showConfig.sDropDownType,
bNotEmpty: nextProps.showConfig.bNotEmpty,
showName: nextProps.showConfig.showName,
};
if (this.bSpecial && this.completeSelectFlag) {
addState.key = this.state.key + 1;
}
this.completeSelectFlag = false;
this.setState(addState);
}
}
}
shouldComponentUpdate(nextProps, nextState) {
const {
dataValue,
enabled,
dropDownData,
searchValue,
searchDropDownData,
sFieldName,
bNotEmpty,
sActiveDisplay,
sDropDownType,
spinState,
showConfig,
} = this.state;
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) ||
JSON.stringify(nextProps.showConfig) !== JSON.stringify(showConfig))
);
}
componentWillUnmount() {
this.mounted = false;
document.removeEventListener("mousedown", this.handleSelectClick);
}
onFocus = () => {
this.isDropdownFilter = false;
this.setState({ sActiveDisplay: false });
console.log(this.props, 'asdasdads');
};
onBlur = event => {
if (this.onExecInstructSet("blur")) return;
this.isDropdownFilter = false;
if (commonUtils.isNotEmptyStr(this.props.showConfig.sTableTitleSql) && this.props.showConfig.iVisCount > 1) {
this.setState({
searchPageNum: 1,
searchTotalPageCount: 1,
searchDropDownData: [],
searchValue: "",
spinState: false,
sActiveDisplay: true,
});
} else 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) => {
if (this.onExecInstructSet("blur")) return;
const currentValue = event?.target?.value;
if (currentValue === this.lastValue) 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 (sControlName !== "BtnSendDialog") {
if (!sActiveKey) return;
this.lastValue = currentValue;
onToolBarBtnClick({ key: sControlName });
}
}, timeout);
};
onExecInstructSet = type => {
const { sInstruct: sInstructStr, showName, sOnChangeInstruct } = this.props.showConfig;
const sInstruct = commonUtils.convertStrToObj(sInstructStr, {});
let { [type]: instructType } = sInstruct;
if (type === "change") {
const onChangeNew = commonUtils.convertStrToObj(sOnChangeInstruct, {});
instructType = onChangeNew[type];
}
if (instructType) {
if (this.props.onExecInstructSet) {
this.props.onExecInstructSet({
type,
sInstruct: instructType,
showName: `${showName}-${type === "blur" ? "离焦" : "变化"}`,
});
} else {
message.error("未定义调用指令集事件!");
}
return true;
}
return false;
};
onCheckFields = () => {
// 手机号、邮箱校验等校验
// setTimeout(() => {
const sDateFormatTypeList = ["phone", "mobile", "mail", "postcode"];
const { sName, showName, sDateFormat } = this.props.showConfig;
const { record } = this.props;
const IncorrectFormat = commonFunc.showLocalMessage(this.props, "IncorrectFormat", "格式不正确");
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}$/;
const reg2 = /^0\d{2,3}-\d{7,8}-\d{1,8}$/;
if (!reg.test(value) && !reg1.test(value) && !reg2.test(value)) {
flag = true;
}
} else if (sDateFormat === "mobile") {
const reg = /^0\d{2,3}-\d{7,8}$/;
const reg1 = /^1[0-9]{10}$/;
const reg2 = /^0\d{2,3}-\d{7,8}-\d{1,8}$/;
if (!reg.test(value) && !reg1.test(value) && !reg2.test(value)) {
flag = true;
}
} else if (sDateFormat === "mail") {
const reg = /^[a-zA-Z0-9]{1,20}@[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) {
this.props.onChange(
this.props.name,
"verificationFailed",
{ verificationFailed: true, verificationFailedMsg: `【${showName}】【${sName}】${IncorrectFormat}!` },
this.props.sId,
[]
);
message.warning(`【${showName}】【${sName}】${IncorrectFormat}!`);
} else if (record.verificationFailed) {
record.verificationFailed = undefined;
}
}
// }, 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, this.dropDownCount);
}
} 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) ||
(this.props.showConfig.sControlName && this.props.showConfig.sControlName.toLowerCase().indexOf("memo") > -1)
) {
const sCurrMemoProps = {
title,
name: this.props.name,
sValue: this.props.dataValue,
sMemoField: sMemo,
bVisibleMemo: true,
sRecord: this.props.record,
sMemoConfig: this.props.showConfig,
bOnlyShow: !this.props.enabled,
};
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("sName") > -1) {
/* 计算方案 变量设置双击弹出 */
this.props.onFieldDoubleClick(this.props.record, this.state.dataValue, this.props.showConfig, this.props.name);
} 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);
} else if (commonUtils.isNotEmptyObject(sMemo) && sMemo.toLowerCase().includes('instruct')) {
/* 赋值字段 变量设置双击弹出 */
// this.props.onFieldDoubleClick(this.state.dataValue, this.props.showConfig, this.props.name);
this.handleEditInstruct();
}
};
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 (!this.state.bDropDownOpen && /^[a-zA-Z0-9\u4e00-\u9fa5]+$/.test(e.keyCode)) {
this.setState({ bDropDownOpen: true });
}
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 设置界面 */
const { sType } = this.props?.app?.userinfo || {};
if (!["sysadmin"].includes(sType)) {
return;
}
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 !== undefined) {
this.props.onFieldPopupModal(showConfig, name);
}
};
/** 获取selectprops对象 */
getSelectProps = () => {
/* 返回值声明 */
const obj = {
id: `${this.props.showConfig.sName}${this.props.record ? this.props.record.sId : commonUtils.createSid()}`,
showSearch: true /* 是否有查找功能 */,
// disabled: !this.state.enabled /* 修改的时候传过来的数据 */
onSelect: () => {
if (this.state.mode !== "multiple") {
this.setState({ bDropDownOpen: false, bNotFirstEnter: true });
}
},
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,
onBlur: e => {
this.setState({ bDropDownOpen: false, bNotFirstEnter: false });
this.onBlur(e);
},
mode: this.state.mode,
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 = e => {
const { bDropDownOpen, bNotFirstEnter } = this.state;
if (bDropDownOpen && [38, 40, 13].includes(e.keyCode)) {
// eslint-disable-next-line no-console
} else if (bDropDownOpen && [27].includes(e.keyCode)) {
this.setState({ bDropDownOpen: false });
} else if (e.keyCode === 13 && !bNotFirstEnter) {
this.setState({ bDropDownOpen: true, bNotFirstEnter: true });
} else {
this.onKeyDown(e);
}
};
obj.onKeyUp = this.onKeyUp;
obj.open = this.state.bDropDownOpen !== undefined ? this.state.bDropDownOpen : false;
// obj.onBlur = () => {
// this.setState({ bDropDownOpen: false });
// };
obj.onMouseMove = () => {
this.bInputIn = true;
};
obj.onMouseLeave = () => {
this.bInputIn = false;
};
/* 返回值 */
return obj;
};
getLocalizedString = (jsonStr, language) => {
try {
const data = JSON.parse(jsonStr);
return data[language] || "";
} catch (e) {
console.error("Error parsing JSON:", e);
return "";
}
};
getSelectTableProps = () => {
const { currentPage, tempCurrentPage, searchValue } = this.state;
const pageNum = searchValue === "" ? currentPage : tempCurrentPage;
/* 返回值声明 */
const obj = {
id: `${this.props.showConfig.sName}${this.props.record ? this.props.record.sId : commonUtils.createSid()}`,
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 = e => {
const { selectTableData = [], selectTableIndex = 0, bDropDownOpen, bNotFirstEnter } = this.state;
const { keyCode } = e;
try {
if (bDropDownOpen) {
const oTBody = this.selectTableRef1.querySelector(".ant-table-body");
const { scrollTop } = oTBody;
const oTr = this.selectTableRef1.querySelector(".selected-record-row");
const trRect = oTr.getBoundingClientRect();
const tbodyRect = oTBody.getBoundingClientRect();
const tbodyTop = tbodyRect.top + window.scrollY;
const tbodyBottom = tbodyRect.bottom + window.scrollY;
const trTop = trRect.top + window.scrollY;
const trBottom = trRect.bottom + window.scrollY;
if (keyCode === 40) {
const selectTableIndexNew = Math.min(selectTableIndex + 1, selectTableData.length - 1);
if (selectTableIndex !== selectTableIndexNew) {
const bInView = trTop + 29 >= tbodyTop && trBottom + 29 <= tbodyBottom;
if (!bInView) {
oTBody.scrollTop = scrollTop + 29;
}
this.setState({
selectTableIndex: selectTableIndexNew,
});
}
} else if (keyCode === 38) {
const selectTableIndexNew = Math.max(selectTableIndex - 1, 0);
if (selectTableIndex !== selectTableIndexNew) {
const bInView = trTop - 29 >= tbodyTop && trBottom - 29 <= tbodyBottom;
if (!bInView) {
oTBody.scrollTop = scrollTop - 29;
}
this.setState({
selectTableIndex: selectTableIndexNew,
});
}
} else if (keyCode === 13) {
e.stopPropagation();
this.setState({ bNotFirstEnter: true });
setTimeout(() => {
oTr.click();
}, 10);
} else {
this.onKeyDown(e);
}
} else if (![37, 38, 39, 40, 13].includes(keyCode)) {
this.setState({ bDropDownOpen: true });
} else if (keyCode === 13 && !bNotFirstEnter) {
this.setState({ bDropDownOpen: true, bNotFirstEnter: true });
} else {
this.onKeyDown(e);
}
} catch (error) {
console.log(error);
}
};
obj.open = this.state.bDropDownOpen !== undefined ? this.state.bDropDownOpen : false;
obj.onBlur = () => {
if (!this.bInPagination) {
this.setState({ bDropDownOpen: false, bNotFirstEnter: false });
}
};
obj.onMouseMove = () => {
this.bInputIn = true;
};
obj.onMouseLeave = () => {
this.bInputIn = false;
};
obj.onKeyUp = this.onKeyUp;
/* eslint-disable */
obj.dropdownRender = menu => (
<>
{/*
this.selectTableSearch(e)}/>
*/}
{menu}
{
this.bInPagination = true;
}}
onMouseLeave={() => {
this.bInPagination = false;
if (this.selectTableRef) {
this.selectTableRef.focus();
}
}}
>
this.selectTableChange(e)}
showSizeChanger={false}
current={pageNum}
pageSize={20}
size="small"
total={this.state.totalCount}
/>
{this.props.showConfig.bFirstEmpty && (
)}
{this.props.showConfig.bNewRecord && (
)}
>
);
/* eslint-enable */
/* 返回值 */
return obj;
};
getSelectTableOption = () => {
const { selectTableData, selectTableIndex = 0 } = 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 * 12 + otherStrLen * 8;
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 * 12 + otherStrLen * 8;
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 (