/* eslint-disable */
/* eslint-disable react/no-multi-comp,key-spacing,space-in-parens */
/* eslint-disable guard-for-in */
/* eslint-disable no-undef,import/first,prefer-destructuring,jsx-a11y/alt-text */
/* eslint-disable react/no-array-index-key */
/* eslint-disable react/jsx-closing-tag-location */
/* eslint-disable */
import React, { useEffect, useRef, useState } from "react";
import {
CheckCircleFilled,
ClockCircleFilled,
CloseCircleFilled,
DownloadOutlined,
ExclamationCircleFilled,
RightOutlined,
SearchOutlined,
StopFilled,
UploadOutlined,
EyeOutlined,
FilePdfOutlined,
FileWordOutlined,
FileExcelOutlined,
ExportOutlined,
FileOutlined,
FileSearchOutlined,
ClearOutlined,
PlusOutlined,
MinusOutlined,
CopyOutlined,
FormOutlined,
CaretUpOutlined,
CaretDownOutlined,
SaveOutlined
} from "@ant-design/icons";
import { Icon as LegacyIcon } from "@ant-design/compatible";
import "@ant-design/compatible/assets/index.css";
import lodash, { cloneDeep } from "lodash";
import {
Table,
Input,
Checkbox,
Button,
Upload,
message,
Popover,
Spin,
Space,
Form,
Tooltip,
Row,
Progress,
Modal
} from "antd";
import { DndProvider, DropTarget, DragSource } from "react-dnd";
import {
sortableContainer,
sortableElement,
sortableHandle
} from "react-sortable-hoc";
import { MenuOutlined } from "@ant-design/icons";
import { HTML5Backend } from "react-dnd-html5-backend";
import { Resizable } from "react-resizable";
import styles from "./index.less";
import * as commonUtils from "@/utils/utils";
import ShowTypeNew from "@/components/Common/CommonComponent";
import Highlighter from "react-highlight-words";
import * as commonConfig from "@/utils/config";
import update from "immutability-helper";
import * as commonFunc from "@/components/Common/commonFunc";
import moment from "moment";
import ParamIcon from "@/assets/param.svg";
import ShowImg from "@/components/Common/ShowImage/ShowImage";
import ShowImgStyle from "@/components/Common/ShowImage/ShowImage.less";
import AntdDraggableModal from "@/components/Common/AntdDraggableModal";
import CommonListSelectTree from "@/components/Common/CommonListSelectTree";
import CommonListSelect from "@/components/Common/CommonListSelect";
import CommonListTreeSelect from "@/components/Common/CommonListTreeSelect";
import AntdDraggableDiv from "@/components/Common/AntdDraggableDiv";
import SlaveMemo from "@/components/Common/SlaveMemo";
import { VList } from "@/components/Vlist";
import { VList as VListNew } from "@/components/VlistNew";
import SvgIcon from "../../SvgIcon";
import PrintPdf from "@/components/PrintPdf/PrintPdf";
import OfficePreview from "@/components/Common/OfficePreview";
import AffixOeeMenu from "@/oee/common/AffixOeeMenu";
// import { VList } from 'virtuallist-antd';
/* 获取配置及数据 */
const FormItem = Form.Item;
const ResizeableTitle = props => {
const { onResize, width, ...restProps } = props;
if (!width) {
return
{
return content;
}}
>
{content}
);
}
};
} else {
sPartNameStatus[0].render = itemStr => {
if (itemStr) {
const sPartItem = itemStr.split("->");
return (
{// eslint-disable-next-line array-callback-return
sPartItem.map((t, i) => {
const sPartItemLength = sPartItem.length;
const ArrItemStr = t.split("#")[0]; /* 工序名称 */
const ArrItemNum = t.split("#")[1]; /* 状态 */
const ArrItemName = t.split("#")[2]; /* 机台名称 */
const ArrItemBanZhu = t.split("#")[3]; /* 班组 */
const ArrItemTime = t.split("#")[4]; /* 排单时间 */
const ArrItemPCNum = t.split("#")[5]; /* 排程数 */
const ArrItemSBNum = t.split("#")[6]; /* 上报数 */
const ArrItem7Num =
commonUtils.isNotEmptyArr(t.split("#")) &&
t.split("#").length > 8
? t.split("#")[8]
: ""; /* 包数 */
const ArrItem8Num =
commonUtils.isNotEmptyArr(t.split("#")) &&
t.split("#").length > 9
? t.split("#")[9]
: ""; /* 每包数量 */
const ArrItem9Num =
commonUtils.isNotEmptyArr(t.split("#")) &&
t.split("#").length > 10
? t.split("#")[10]
: ""; /* 零头数量 */
let ArrItemNumChange = "";
let icon;
// eslint-disable-next-line default-case
switch (Number(ArrItemNum)) {
case 0:
ArrItemNumChange = "未排程";
icon = (
);
break;
case 1:
ArrItemNumChange = "未完成";
icon = (
);
break;
case 2:
ArrItemNumChange = "生产中";
icon = (
);
break;
case 3:
ArrItemNumChange = "暂停";
icon = (
);
break;
case 4:
ArrItemNumChange = "取消";
icon = (
);
break;
case 5:
ArrItemNumChange = "完成";
icon = (
);
break;
}
// eslint-disable-next-line no-unused-vars
const content = (
工序名称:
{ArrItemStr}
状态:
{ArrItemNumChange}
机台名称:
{ArrItemName}
班组:
{ArrItemBanZhu}
排单时间:
{ArrItemTime}
排程数:
{ArrItemPCNum}
上报数:
{ArrItemSBNum}
{ArrItem7Num ? (
包数:
{ArrItem7Num}
) : (
""
)}
{ArrItem8Num ? (
每包数量:
{ArrItem8Num}
) : (
""
)}
{ArrItem9Num ? (
零头数量:
{ArrItem9Num}
) : (
""
)}
);
// 数字转换图标
return (
{icon}
{ArrItemStr}
{/*{ i + 1 === sPartItemLength ? '' :
}*/}
);
})}
);
}
};
}
}
// 判断材料准备状态
if (
commonUtils.isNotEmptyArr(sMaterialsStatus) &&
commonUtils.isNotEmptyArr(dataSource)
) {
this.useVListNew = true;
const sModelsType =
commonUtils.isNotEmptyObject(this.props) &&
commonUtils.isNotEmptyObject(this.props.app)
? this.props.app.currentPane.sModelsType
: "";
if (
true ||
sModelsType === "production/productionPlanInfo" ||
sModelsType === "productionMainPlan/productionMainPlan" ||
(commonUtils.isNotEmptyObject(sModelsType) &&
sModelsType.includes("view/")) ||
location.pathname.toLowerCase().indexOf("oee") > -1
) {
/* 动态列Jsonn解析 */
if (
commonUtils.isNotEmptyArr(sMaterialsStatus) &&
commonUtils.isNotEmptyArr(dataSource)
) {
sMaterialsStatus.forEach((jsonStatus, index) => {
if (commonUtils.isNotEmptyArr(jsonStatus.children)) {
/* 嵌套列头JSON解析 */
for (const obj of jsonStatus.children) {
obj.render = itemStr => {
if (commonUtils.isJSON(itemStr)) {
const sPartItem = JSON.parse(itemStr);
/* 取箭头弹出的窗体配置 */
let showConfig = {};
let linkStyle = ""; /* 弹窗 */
if (
commonUtils.isNotEmptyArr(this.props.config) &&
commonUtils.isNotEmptyArr(
this.props.config.gdsconfigformslave
) &&
commonUtils.isNotEmptyStr("sMaterialsStatus")
) {
const showConfigArr = this.props.config.gdsconfigformslave.filter(
item =>
item.sName === "sMaterialsStatus" && item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr[0];
if (
commonUtils.isNotEmptyObject(showConfig) &&
showConfig.sDropDownType === "picArr" &&
!commonUtils.isEmpty(showConfig.sActiveId) &&
commonUtils.isEmptyArr(this.props.sGroupByList)
) {
linkStyle = "sMaterialsStatusStyle";
}
}
}
return (
{
return (
{// eslint-disable-next-line array-callback-return;
sPartItem.map((t, i) => {
const sPartItemLength = sPartItem.length;
let colorValue = "#000000";
if (t?.background) {
colorValue = t.background;
} else {
const sState = commonUtils.isEmpty(t.sState)
? 4
: t.sState;
switch (
Number(sState) // 根据状态显示颜色
) {
case 0:
colorValue = "#000000"; /* 0:黑色 */
break;
case 1:
colorValue = "#ff4d4f"; /* 1:红色 */
break;
case 2:
colorValue = "#49aa19"; /* 2:绿色 */
break;
case 3:
colorValue = "#49aa19"; /* 3:绿色 */
break;
case 4:
colorValue = "#ff4d4f"; /* 4:红色 */
break;
default:
colorValue = "#000000";
}
}
return (
{commonUtils.isNotEmptyObject(
t.sMaterialsName
) ? (
{t.sMaterialsName}
) : (
""
)}
{i + 1 === sPartItemLength ? (
""
) : (
-
)}
);
})}
);
}}
>
{// eslint-disable-next-line array-callback-return;
sPartItem.map((t, i) => {
const sPartItemLength = sPartItem.length;
let colorValue = "#000000";
if (t?.background) {
colorValue = t.background;
} else {
const sState = commonUtils.isEmpty(t.sState)
? 4
: t.sState;
switch (
Number(sState) // 根据状态显示颜色
) {
case 0:
colorValue = "#000000"; /* 0:黑色 */
break;
case 1:
colorValue = "#ff4d4f"; /* 1:红色 */
break;
case 2:
colorValue = "#49aa19"; /* 2:绿色 */
break;
case 3:
colorValue = "#49aa19"; /* 3:绿色 */
break;
case 4:
colorValue = "#ff4d4f"; /* 4:红色 */
break;
default:
colorValue = "#000000";
}
}
return (
{commonUtils.isNotEmptyObject(
t.sMaterialsName
) ? (
{t.sMaterialsName}
) : (
""
)}
{i + 1 === sPartItemLength ? (
""
) : (
-
)}
);
})}
);
} else {
return itemStr;
}
};
}
} else {
/* 无嵌套列头JSON列解析 */
sMaterialsStatus[index].render = itemStr => {
if (commonUtils.isJSON(itemStr)) {
const sPartItem = JSON.parse(itemStr);
/* 取箭头弹出的窗体配置 */
let showConfig = {};
let linkStyle = ""; /* 弹窗 */
if (
commonUtils.isNotEmptyArr(this.props.config) &&
commonUtils.isNotEmptyArr(
this.props.config.gdsconfigformslave
) &&
commonUtils.isNotEmptyStr("sMaterialsStatus")
) {
const showConfigArr = this.props.config.gdsconfigformslave.filter(
item => item.sName === "sMaterialsStatus" && item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr[0];
if (
commonUtils.isNotEmptyObject(showConfig) &&
showConfig.sDropDownType === "picArr" &&
!commonUtils.isEmpty(showConfig.sActiveId) &&
commonUtils.isEmptyArr(this.props.sGroupByList)
) {
linkStyle = "sMaterialsStatusStyle";
}
}
}
return (
{
return (
{// eslint-disable-next-line array-callback-return;
sPartItem.map((t, i) => {
const sPartItemLength = sPartItem.length;
let colorValue = "#000000";
if (t?.background) {
colorValue = t.background;
} else {
const sState = commonUtils.isEmpty(t.sState)
? 4
: t.sState;
switch (
Number(sState) // 根据状态显示颜色
) {
case 0:
colorValue = "#000000"; /* 0:黑色 */
break;
case 1:
colorValue = "#ff4d4f"; /* 1:红色 */
break;
case 2:
colorValue = "#49aa19"; /* 2:绿色 */
break;
case 3:
colorValue = "#49aa19"; /* 3:绿色 */
break;
case 4:
colorValue = "#ff4d4f"; /* 4:红色 */
break;
default:
colorValue = "#000000";
}
}
return (
{commonUtils.isNotEmptyObject(
t.sMaterialsName
) ? (
{t.sMaterialsName}
) : (
""
)}
{i + 1 === sPartItemLength ? (
""
) : (
-
)}
);
})}
);
}}
>
{// eslint-disable-next-line array-callback-return;
sPartItem.map((t, i) => {
const sPartItemLength = sPartItem.length;
let colorValue = "#000000";
if (t?.background) {
colorValue = t.background;
} else {
const sState = commonUtils.isEmpty(t.sState)
? 4
: t.sState;
switch (
Number(sState) // 根据状态显示颜色
) {
case 0:
colorValue = "#000000"; /* 0:黑色 */
break;
case 1:
colorValue = "#ff4d4f"; /* 1:红色 */
break;
case 2:
colorValue = "#49aa19"; /* 2:绿色 */
break;
case 3:
colorValue = "#49aa19"; /* 3:绿色 */
break;
case 4:
colorValue = "#ff4d4f"; /* 4:红色 */
break;
default:
colorValue = "#000000";
}
}
return (
{commonUtils.isNotEmptyObject(
t.sMaterialsName
) ? (
{t.sMaterialsName}
) : (
""
)}
{i + 1 === sPartItemLength ? (
""
) : (
-
)}
);
})}
);
} else {
return itemStr;
}
};
}
});
}
}
}
/* 动态列Jsonn解析 */
if (
commonUtils.isNotEmptyArr(dynamicColumn) &&
commonUtils.isNotEmptyArr(dataSource)
) {
dynamicColumn.forEach((jsonStatus, index) => {
if (commonUtils.isNotEmptyArr(jsonStatus.children)) {
/* 嵌套列头JSON解析 */
const childrenJson = jsonStatus.children.filter(
itemChild =>
itemChild.dataIndex && itemChild.dataIndex.includes("json")
);
for (const obj of childrenJson) {
obj.render = itemStr => {
if (
commonUtils.isNotEmptyObject(itemStr) &&
commonUtils.isJSON(itemStr)
) {
const sPartItem = JSON.parse(itemStr);
return (
{// eslint-disable-next-line array-callback-return;
sPartItem.map((t, i) => {
// const sPartItemLength = sPartItem.length;
let colorValue = "#000000";
const sState = commonUtils.isEmpty(t.sState)
? 4
: t.sState;
switch (
Number(sState) // 根据状态显示颜色
) {
case 1:
colorValue = "#ff0000"; /* 1:红色 */
break;
case 2:
colorValue = "#49aa19"; /* 2:绿色 */
break;
case 3:
colorValue = "#ffff00"; /* 3:黄色 */
break;
case 0:
colorValue = ""; /* 3:不要颜色 */
break;
default:
colorValue = "";
}
return (
);
})}
);
}
};
}
} else {
/* 无嵌套列头JSON列解析 */
dynamicColumn[index].render = itemStr => {
if (
commonUtils.isNotEmptyObject(itemStr) &&
commonUtils.isJSON(itemStr)
) {
const sPartItem = JSON.parse(itemStr);
return (
{// eslint-disable-next-line array-callback-return;
sPartItem.map((t, i) => {
// const sPartItemLength = sPartItem.length;
let colorValue = "#000000";
const sState = commonUtils.isEmpty(t.sState) ? 4 : t.sState;
switch (
Number(sState) // 根据状态显示颜色
) {
case 1:
colorValue = "#ff0000"; /* 1:红色 */
break;
case 2:
colorValue = "#49aa19"; /* 2:绿色 */
break;
case 3:
colorValue = "#ffff00"; /* 3:黄色 */
break;
default:
colorValue = "#666";
}
return (
);
})}
);
} else {
return itemStr;
}
};
}
});
}
// 判断时间状态
if (
commonUtils.isNotEmptyArr(sTimeStatus) &&
commonUtils.isNotEmptyArr(dataSource)
) {
sTimeStatus[0].render = itemStr => {
if (commonUtils.isJSON(itemStr)) {
const sPartItem = JSON.parse(itemStr);
const linkStyle = "sTimeStatusStyle"; /* 弹窗 */
return (
{// eslint-disable-next-line array-callback-return;
sPartItem.map((t, i) => {
const sPartItemLength = sPartItem.length;
const sColor = t.sColor;
const dWidth =
t.dRate !== undefined && t.dRate !== 0
? `${t.dRate * 500}px`
: "100px";
const content = (
{`${t.sName} :${t.sValue}`}
);
return (
{t.sValue}
);
})}
);
} else {
return itemStr;
}
};
}
// 判断拼板状态
if (
commonUtils.isNotEmptyArr(sScheduleStatusJson) &&
commonUtils.isNotEmptyArr(dataSource)
) {
this.useVListNew = true;
sScheduleStatusJson[0].render = itemStr => {
if (commonUtils.isJSON(itemStr)) {
const itemJson = commonUtils.convertStrToObj(itemStr);
const itemLength = itemJson.length;
const content = itemJson.map((t, i) => {
const { sState, sColor = "#000000", sName = "" } = t;
return (
{sName}
{i + 1 === itemLength ? "" : }
);
});
return (
{
return {content}
;
}}
>
{content}
);
}
};
}
let components = {};
if (this.isDragAndDrop) {
components.header = { cell: ResizeableTitle };
components.body = { row: DragableBodyRow };
} else {
components.header = { cell: ResizeableTitle };
}
let bPagination = true; /* 默认表格分页s */
if (commonUtils.isNotEmptyObject(this.props)) {
bPagination =
commonUtils.isNotEmptyObject(this.props.tableProps) &&
commonUtils.isNotEmptyObject(this.props.tableProps.pagination);
}
let noVlistController = false;
if (
this.props.config &&
this.props.config.gdsconfigformslave.filter(
item => item.sControlName === "bNoVlist"
)[0]
) {
noVlistController = true;
}
// 判断是否有合并单元格, 有的话默认关闭虚拟滚动
// if (this.mergeCellStateMap) {
// for (let key in this.mergeCellStateMap) {
// if (this.mergeCellStateMap[key]) {
// noVlistController= true;
// }
// }
// }
// if (!this.props.noVlist && !noVlistController) {
if (this.props.slaveInfo || this.useVListNew) {
if (!this.uniqueId) {
this.uniqueId = this.props.formId
? `${this.props.formId}_${lodash.uniqueId()}`
: lodash.uniqueId();
}
if (!this.Vcomponents || window.vlistNewSearh) {
const { tableClassName } = this.state;
const oTable = document.querySelectorAll(`.${tableClassName}`)[0];
if (oTable) {
const oBody = oTable.querySelector(".ant-table-body");
oBody && (oBody.scrollTop = 0);
}
window.vlistNewSearh = null;
this.Vcomponents = VListNew({
height: this.scrollY,
vid: this.uniqueId,
onScroll: () => {
setTimeout(() => {
let divs = document.getElementsByClassName("noInputInsert");
if (divs.length) {
Array.prototype.forEach.call(divs, item => {
item.parentNode.parentNode.parentNode.parentNode.classList.add(
"insertTd"
);
});
}
}, 20);
}
});
}
components = { ...this.Vcomponents, ...components };
} else {
// vid是多个列表在同个页面中,同时渲染会促发问题
// vid不可以为随机数,随机数会导致双击时,点击的两个VList id不同
if (!this.uniqueId) {
this.uniqueId = this.props.formId
? `${this.props.formId}_${lodash.uniqueId()}`
: lodash.uniqueId();
}
if (!this.Vcomponents1 || window.vlistNewSearh) {
const { tableClassName } = this.state;
const oTable = document.querySelectorAll(`.${tableClassName}`)[0];
if (oTable) {
const oBody = oTable.querySelector(".ant-table-body");
oBody && (oBody.scrollTop = 0);
}
window.vlistNewSearh = null;
this.Vcomponents1 = VList({
height: this.scrollY,
vid: this.uniqueId,
rowKey: this.rowKey,
onScroll: () => {
setTimeout(() => {
let divs = document.getElementsByClassName("noInputInsert");
if (divs.length) {
Array.prototype.forEach.call(divs, item => {
item.parentNode.parentNode.parentNode.parentNode.classList.add(
"insertTd"
);
});
}
}, 20);
}
});
}
components = { ...this.Vcomponents1, ...components };
}
// }
if (this.props.config && this.props.config.iFreezeColumn) {
tableColumn.forEach((val, index) => {
if (tableColumn[index].fixedHelp) {
tableColumn[index].fixed = false;
tableColumn[index].fixedHelp = false;
}
if (index < this.props.config.iFreezeColumn) {
tableColumn[index].fixed = "left";
tableColumn[index].fixedHelp = true;
}
});
}
// 处理拖拽排序
if (this.props.dragHandle) {
const handleSort = tableColumn.filter(
item => item.dataIndex === "handleSort"
).length;
if (tableColumn[0]) {
function arrayMoveMutable(array, fromIndex, toIndex) {
const startIndex =
fromIndex < 0 ? array.length + fromIndex : fromIndex;
if (startIndex >= 0 && startIndex < array.length) {
const endIndex = toIndex < 0 ? array.length + toIndex : toIndex;
const [item] = array.splice(fromIndex, 1);
array.splice(endIndex, 0, item);
}
}
function arrayMoveImmutable(array, fromIndex, toIndex) {
array = [...array];
arrayMoveMutable(array, fromIndex, toIndex);
return array;
}
const DragHandle = sortableHandle(() => (
));
const SortableItem = sortableElement(props =>
|
);
const SortableContainer = sortableContainer(props => (
));
const onSortEnd = ({ oldIndex, newIndex }) => {
const { dataSource } = this.state;
if (oldIndex !== newIndex) {
const newData = arrayMoveImmutable(
[].concat(dataSource),
oldIndex,
newIndex
).filter(el => !!el);
this.props.onDrag(newData, this.props.name);
}
};
const DraggableContainer = props => (
);
const DraggableBodyRow = ({ className, style, ...restProps }) => {
const { dataSource } = this.state;
// function findIndex base on Table rowKey props and should always be a right array index
const index = dataSource.findIndex(
x => x.index === restProps["data-row-key"]
);
return (
);
};
// 处理渲染后丢失input focus的bug.
if (!this.DraggableContainer) {
this.DraggableContainer = DraggableContainer;
}
if (!this.DraggableBodyRow) {
this.DraggableBodyRow = DraggableBodyRow;
}
if (!handleSort) {
components = {
...components,
body: {
wrapper: this.DraggableContainer,
row: this.DraggableBodyRow
}
};
} else {
components = {
...components,
body: {
wrapper: this.DraggableContainer,
row: this.DraggableBodyRow
}
};
tableColumn.shift();
}
tableColumn.unshift({
title: "排序",
dataIndex: "handleSort",
fixed: "left",
width: 40,
className: "drag-visible",
render: () =>
});
}
}
let rowSelection =
this.props.rowSelection !== undefined
? this.props.rowSelection
: this.getRowSelection(this.props.name, "slave"); // 是否选择多选框的问题
if (this.props.config && !this.props.config.bisMutiSelect) {
rowSelection = null;
}
const { expKeys } = this.state;
/* 返回值 */
return {
components,
rowKey: this.rowKey,
// size: 'middle',
bordered: true /* 显示边框 */,
className: !this.props.enabled
? styles.disabledProup
: styles.proup /* 样式控制 */,
scroll: { x: "max-content" } /* 宽度 */,
dataSource /* 数据 */,
columns: tableColumn /* 表头 */,
// rowSelection: this.props.rowSelection !== undefined ? this.props.rowSelection : this.getRowSelection(this.props.name, 'slave'), /* 添加的复选框(checkbox)功能 */
rowSelection,
// pagination: false, /* 不分页 */
rowClassName: this.setRowClassName.bind(this, "slave"),
onRow: (record, index) => {
if (this.isDragAndDrop) {
return {
index,
onClick: () => {
this.onRowClick(
record,
index,
undefined,
this.props.name,
"slave"
);
},
onMouseEnter: () => {
this.onRowMouseEnter(record);
},
onMouseLeave: () => {
this.onRowMouseLeave(record);
},
onDoubleClick: () => {
this.onDoubleClick(this.props.name, record);
},
moveRow: (dragIndex, hoverIndex, dragKey, hoverKey) => {
this.moveRow(dragIndex, hoverIndex, dragKey, hoverKey);
},
onDragClick: type => {
this.onRowClick(record, index, type, this.props.name, "slave");
}
};
} else {
return {
index,
style: {
background:
this.props.bGyXunjian &&
this.props.getXunBgColor &&
this.props.getXunBgColor(record, undefined, true)
},
onClick: () => {
this.onRowClick(
record,
index,
undefined,
this.props.name,
"slave"
);
},
onDoubleClick: () => {
this.onDoubleClick(this.props.name, record);
},
onMouseEnter: () => {
this.onRowMouseEnter(record);
},
onMouseLeave: () => {
this.onRowMouseLeave();
}
};
}
},
onExpand: (expanded, record) => {
if (this.showExpAll) {
if (expanded) {
const expKeysNew = [...expKeys, record[this.rowKey]];
this.currentExpKeys = expKeysNew;
this.setState({
expKeys: expKeysNew
});
} else {
const expKeysNew = expKeys.filter(
item => item !== record[this.rowKey]
);
this.currentExpKeys = expKeysNew;
this.setState({
expKeys: expKeysNew
});
}
}
this.onExpand(expanded, record, "slave"); /* 点击展开图标时触发s */
},
expandedRowKeys: expKeys.length || this.showExpAll ? expKeys : null,
id: commonUtils.isEmptyArr(dataSource)
? "unDataBox"
: "dataBox" /* 用户修改antd table中自带的样式(我听别人说的要这么弄,你们别骂我) */,
...this.props.tableProps,
pagination: bPagination
? {
...this.props.tableProps.pagination,
onChange: (current, size) => {
this.curPagination = {
current,
pageSize: size
};
}
}
: false /* 表格是否分页 */,
onChange: this.onChange
};
};
/** 获取子从表复选框对象的props */
getSlaveRowSelection = (name, type) => {
const { bMutiSelect } = this.props.slaveInfo; /* 显示单选框还是复选框 */
let { bisMutiSelect } = this.props.slaveInfo; /* 是否显示选择框 */
if (this.props.slaveInfo.config) {
bisMutiSelect = this.props.slaveInfo.config.bisMutiSelect;
}
if (
name === "control" ||
(commonUtils.isNotEmptyObject(location.pathname) &&
location.pathname.indexOf("commonAuto") > -1)
) {
// 控制表中可以通过bisMutiSelect显示或者隐藏勾选框
if (bisMutiSelect) {
return {
preserveSelectedRowKeys: true,
selectedRowKeys:
type === "slaveInfo"
? this.state.slaveInfoSelectedRowKeys
: this.state.selectedRowKeys /* 已选择的数据集 */,
onChange: this.handleSelectRowChange.bind(
this,
name
) /* 选择行发生改变时调用的函数 */,
getCheckboxProps: record => ({
disabled: !!record.checkboxDisabled,
style:
record.bSum && commonConfig.hasSum
? { display: "none" }
: { display: "checkbox" }
}) /* 过滤合计的选择框 */,
type: bMutiSelect
? this.props.rowSelectionType
: "radio" /* checkbox or radio */,
columnWidth: 37
};
} else {
return null;
}
} else {
return {
preserveSelectedRowKeys: true,
selectedRowKeys:
type === "slaveInfo"
? this.state.slaveInfoSelectedRowKeys
: this.state.selectedRowKeys /* 已选择的数据集 */,
onChange: this.handleSelectRowChange.bind(
this,
name
) /* 选择行发生改变时调用的函数 */,
getCheckboxProps: record => ({
disabled: !!record.checkboxDisabled,
style:
record.bSum && commonConfig.hasSum
? { display: "none" }
: { display: "checkbox" }
}) /* 过滤合计的选择框 */,
type: bMutiSelect
? this.props.rowSelectionType
: "radio" /* checkbox or radio */,
columnWidth: 37
};
}
};
/** 获取table对象的props */
getSlaveTableProps = () => {
/* 给数据都添加上key */
if (
this.props.setExpandedRowRender !== undefined &&
this.props.setExpandedRowRender.toString() === "Y"
) {
const {
dataSource,
tableColumn,
tableProps,
name: slaveInfoName,
config: slaveInfoConfig
} = this.props.slaveInfo;
// const scrollHeight = parseInt(document.body.clientHeight - 400, 10);
const components = {};
if (this.isDragAndDrop) {
components.header = { cell: ResizeableTitle };
components.body = { row: DragableBodyRow };
} else {
components.header = { cell: ResizeableTitle };
}
let rowSelection =
this.props.rowSelection !== undefined
? this.props.rowSelection
: this.getSlaveRowSelection(slaveInfoName, "slaveInfo");
if (slaveInfoConfig && !slaveInfoConfig.bisMutiSelect) {
/* 如果子表配置不显示选择框 则不显示选择框 */
rowSelection = null;
}
/* 返回值 */
return {
components,
rowKey: tableProps.rowKey,
size: "small",
bordered: true /* 显示边框 */,
className: !this.props.enabled
? styles.disabledProup
: styles.proup /* 样式控制 */,
scroll: { x: "max-content" } /* 宽度 */,
dataSource /* 数据 */,
columns: tableColumn /* 表头 */,
rowSelection: rowSelection /* s 添加的复选框(checkbox)功能 */,
pagination: false /* 不分页 */,
rowClassName: this.setRowClassName.bind(this, "slaveInfo"),
onRow: (record, index) => {
if (this.isDragAndDrop) {
return {
index,
onClick: () => {
this.onRowClick(
record,
index,
undefined,
slaveInfoName,
"slaveInfo"
);
},
onDoubleClick: () => {
this.onDoubleClick(
record,
index,
undefined,
slaveInfoName,
"slaveInfo"
);
},
moveRow: (dragIndex, hoverIndex, dragKey, hoverKey) => {
this.moveRow(dragIndex, hoverIndex, dragKey, hoverKey);
},
onDragClick: type => {
this.onRowClick(
record,
index,
type,
slaveInfoName,
"slaveInfo"
);
}
};
} else {
return {
index,
onClick: () => {
this.onRowClick(
record,
index,
undefined,
slaveInfoName,
"slaveInfo"
);
},
onDoubleClick: () => {
this.onDoubleClick(slaveInfoName, record);
}
};
}
},
// footer: this.props.footer === undefined ? this.tableFooter : undefined,
id: commonUtils.isEmptyArr(dataSource)
? "unDataBox"
: "dataBox" /* 用户修改antd table中自带的样式(我听别人说的要这么弄,你们别骂我) */,
...this.props.slaveInfo.tableProps,
onChange: this.onChange
};
} else {
return null;
}
};
getTableFilterData = () => {
const { dataSource } = this.state;
let filterData = 0;
const GetFilterData = this.props.OnGetFilterData;
if (GetFilterData !== undefined) {
filterData = this.props.OnGetFilterData(
this.props.name,
this.props.bFinished
);
} else {
filterData = dataSource.length;
}
return filterData;
};
/** 获取showConfig */
getShowConfig = (props, sName) => {
/* 返回值声明 */
let showConfig = [];
/* 通过sName过滤出对应的showConfig */
if (props.customConfig) {
const showConfigArr = props.customConfig.filter(
item => item.sName === sName && item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr[0];
}
} else {
if (props.config) {
const showConfigArr = props.config.gdsconfigformslave.filter(
item => item.sName === sName && item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr[0];
}
}
if (
commonUtils.isNotEmptyObject(this.props.slaveInfo) &&
commonUtils.isNotEmptyObject(this.props.slaveInfo.config)
) {
const showConfigArr = this.props.slaveInfo.config.gdsconfigformslave.filter(
item =>
commonUtils.isNotEmptyObject(item.sName) &&
commonUtils.isNotEmptyObject(item.sColorTerms) &&
item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr;
}
}
}
/* 返回值 */
return showConfig;
};
/** 获取颜色Config */
getColorConfig = () => {
let showConfig = [];
/* 通过sName过滤出对应的showConfig */
/* 通过sName过滤出对应的showConfig */
if (this.props.customConfig) {
const showConfigArr = this.props.customConfig.filter(
item =>
commonUtils.isNotEmptyObject(item.sName) &&
commonUtils.isNotEmptyObject(item.sColorTerms) &&
item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr;
}
} else {
if (this.props.config) {
const showConfigArr = this.props.config.gdsconfigformslave.filter(
item =>
commonUtils.isNotEmptyObject(item.sName) &&
commonUtils.isNotEmptyObject(item.sColorTerms) &&
item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr;
}
}
if (
commonUtils.isNotEmptyObject(this.props.slaveInfo) &&
commonUtils.isNotEmptyObject(this.props.slaveInfo.config)
) {
const showConfigArr = this.props.slaveInfo.config.gdsconfigformslave.filter(
item =>
commonUtils.isNotEmptyObject(item.sName) &&
commonUtils.isNotEmptyObject(item.sColorTerms) &&
item.bVisible
);
if (commonUtils.isNotEmptyArr(showConfigArr)) {
showConfig = showConfigArr;
}
}
}
/* 返回值 */
return showConfig;
};
getColorStyle = (record, isRowShow) => {
let styleColorArrTotal = "";
const showConfigArr = this.getColorConfig(); /* 拿到颜色配置json */
if (commonUtils.isNotEmptyArr(showConfigArr) && showConfigArr.length > 0) {
for (const showConfig of showConfigArr) {
let styleColorArr = "";
const colorConditon = commonUtils.isNotEmptyObject(showConfig)
? showConfig.sColorTerms
: null;
if (commonUtils.isNotEmptyObject(colorConditon)) {
let colorConditionArr = "";
try {
colorConditionArr = JSON.parse(colorConditon); /* 转化为json */
} catch (e) {
colorConditionArr = "";
}
colorConditionArr = Array.isArray(colorConditionArr)
? colorConditionArr
: ""; /* 判断是否是数组 */
for (const item of colorConditionArr) {
let styleColor = "";
const { column, condition, conditionValue, color, isRow } = item;
if (record[column] !== undefined) {
if (
color &&
!document.getElementById(`color${color.replace("#", "-")}`)
) {
var style = document.createElement("style");
style.type = "text/css";
style.id = `color${color.replace("#", "-")}`;
style.innerHTML = `
.color${color.replace("#", "-")} td {
background-color:${color}!important;
.ant-table-selection-column {
background-color:${color}!important;
}
}
`;
document.getElementsByTagName("head")[0].appendChild(style);
}
if (
isRow &&
isRowShow &&
!commonUtils.isEmpty(record[column]) &&
commonUtils.isNotEmptyObject(record[column].toString())
) {
/* 配置行 */
if (condition === "=") {
styleColor =
record[column] === conditionValue
? `SetRow_${color} color${color.replace("#", "-")}`
: "";
} else if (condition === "like") {
if (column.substring(0, 1) === "s") {
styleColor =
record[column].indexOf(conditionValue) > -1
? `SetRow_${color} color${color.replace("#", "-")}`
: "";
}
} else if (condition === ">") {
styleColor =
record[column] > conditionValue
? `SetRow_${color} color${color.replace("#", "-")}`
: "";
} else if (condition === ">=") {
styleColor =
record[column] >= conditionValue
? `SetRow_${color} color${color.replace("#", "-")}`
: "";
} else if (condition === "<") {
styleColor =
record[column] < conditionValue
? `SetRow_${color} color${color.replace("#", "-")}`
: "";
} else if (condition === "<=") {
styleColor =
record[column] <= conditionValue
? `SetRow_${color} color${color.replace("#", "-")}`
: "";
}
}
}
styleColorArr += styleColor;
}
}
styleColorArrTotal += `${styleColorArr} `;
}
}
return styleColorArrTotal;
};
/** 获取单元格颜色配置 */
getCellColorConfig = (text, record, sName) => {
let styleColorArrTotal = ""; /* 单元格文字颜色 */
let styleColorArrTotalB = ""; /* 单元格背景颜色 */
let styleColorArr = "";
let styleColorArrB = "";
const styleColorArrTotalM = {};
const showConfigArr = this.getColorConfig(); /* 拿到颜色配置json */
if (commonUtils.isNotEmptyArr(showConfigArr) && showConfigArr.length > 0) {
for (const showConfig of showConfigArr) {
const colorConditon = commonUtils.isNotEmptyObject(showConfig)
? showConfig.sColorTerms
: null;
if (commonUtils.isNotEmptyObject(colorConditon)) {
let colorConditionArr = "";
try {
colorConditionArr = JSON.parse(colorConditon); /* 转化为json */
} catch (e) {
colorConditionArr = "";
}
colorConditionArr = Array.isArray(colorConditionArr)
? colorConditionArr
: "";
for (const item of colorConditionArr) {
let styleColor = "";
// eslint-disable-next-line no-unused-vars
let styleBackground = "";
const {
column,
condition,
conditionValue,
color,
background,
isRow
} = item;
if (!isRow) {
/* 根据配置设置单元格颜色 */
if (column === sName && column === showConfig.sName) {
/* 只控制该配置的单元格 */
if (condition === "=") {
styleColor = record[column] === conditionValue ? color : "";
styleBackground =
record[column] === conditionValue ? background : "";
} else if (condition === "like") {
if (sName.substring(0, 1) === "s") {
styleColor =
record[column].indexOf(conditionValue) > -1 ? color : "";
styleBackground =
record[column].indexOf(conditionValue) > -1
? background
: "";
}
} else if (condition === "!=") {
styleColor = record[column] !== conditionValue ? color : "";
styleBackground =
record[column] !== conditionValue ? background : "";
} else if (condition === ">") {
styleColor = record[column] > conditionValue ? color : "";
styleBackground =
record[column] > conditionValue ? background : "";
} else if (condition === ">=") {
styleColor = record[column] >= conditionValue ? color : "";
styleBackground =
record[column] >= conditionValue ? background : "";
} else if (condition === "<") {
styleColor = record[column] < conditionValue ? color : "";
styleBackground =
record[column] < conditionValue ? background : "";
} else if (condition === "<=") {
styleColor = record[column] <= conditionValue ? color : "";
styleBackground =
record[column] <= conditionValue ? background : "";
} else if (Array.isArray(condition)) {
/* 通过其他列条件控制该字段的颜色显示 */
if (commonUtils.isNotEmptyArr(condition)) {
for (const itemConditon of condition) {
const {
bFilterName,
bFilterCondition,
bFilterValue,
color,
background
} = itemConditon;
if (bFilterCondition === "=") {
styleColor =
record[bFilterName] === bFilterValue ? color : "";
styleBackground =
record[bFilterName] === bFilterValue
? background
: "";
} else if (bFilterCondition === "like") {
if (sName.substring(0, 1) === "s") {
styleColor =
record[bFilterName].indexOf(bFilterValue) > -1
? color
: "";
styleBackground =
record[bFilterName].indexOf(bFilterValue) > -1
? background
: "";
}
} else if (bFilterCondition === "!=") {
styleColor =
record[bFilterName] !== bFilterValue ? color : "";
styleBackground =
record[bFilterName] !== bFilterValue
? background
: "";
} else if (bFilterCondition === ">") {
styleColor =
record[bFilterName] > bFilterValue ? color : "";
styleBackground =
record[bFilterName] > bFilterValue ? background : "";
} else if (bFilterCondition === ">=") {
styleColor =
record[bFilterName] >= bFilterValue ? color : "";
styleBackground =
record[bFilterName] >= bFilterValue ? background : "";
} else if (bFilterCondition === "<") {
styleColor =
record[bFilterName] < bFilterValue ? color : "";
styleBackground =
record[bFilterName] < bFilterValue ? background : "";
} else if (bFilterCondition === "<=") {
styleColor =
record[bFilterName] <= bFilterValue ? color : "";
styleBackground =
record[bFilterName] <= bFilterValue ? background : "";
}
}
}
}
}
}
styleColorArr += styleColor;
styleColorArrB += styleBackground;
if (styleColor) {
styleColorArr = styleColor;
}
if (styleBackground) {
styleColorArrB = styleBackground;
}
}
}
styleColorArrTotal = styleColorArr;
styleColorArrTotalB = styleColorArrB;
}
}
const iIndex = showConfigArr.findIndex(item => item.sName === sName);
if (iIndex !== -1) {
const { sColorTerms } = showConfigArr[iIndex];
if (sColorTerms && sColorTerms.startsWith("#")) {
styleColorArrTotal = sColorTerms;
}
}
styleColorArrTotalM.styleColorArrTotal = styleColorArrTotal;
styleColorArrTotalM.styleColorArrTotalB = styleColorArrTotalB;
return styleColorArrTotalM;
};
/** 获取table的表头信息(主要是table中的表头信息合并,[{title:1-1},{title:1-2}]变成[{title:1,children:[{title:1},{title:2}]}]) type:是否过滤 */
getTableColumn = (headerColumn, type, props) => {
// this.hasMergeHeader = false;
// 判断是否是表单详情
const isSlaveInfo =
props.name === "slaveInfo" ||
(location.pathname === "/indexPage/commonCostomTabBill" &&
props.name.includes("Info") &&
commonUtils.isNotEmptyObject(this.props.slaveInfo));
const config = isSlaveInfo
? this.props.slaveInfo.config
: this.props.config;
/* 返回值声明 */
const tableColumn = [];
let iIndex = 0;
const specialRoute = commonUtils.isNotEmptyObject(
this.props.app.currentPane
)
? this.props.app.currentPane.route
: ""; /* 获取路由名称 */
/* 遍历每一个表头标题 */
for (const column of headerColumn) {
/* 表头标题 */
const title = column.title;
const width = column.width;
const bNotEmpty = column.bNotEmpty;
/* 带'-'的表头是需要合并滴 */
const index = commonUtils.isNotEmptyObject(title)
? title.indexOf("-")
: -1;
/* 合并走合并的,不合并就直接push */
let columnNew = {};
let sorter;
let search = true;
if (
props.tableProps !== undefined &&
props.tableProps.rowKey !== undefined &&
props.tableProps.rowKey !== "sId" &&
!props.tableProps.sortSelf
) {
sorter = true;
} else {
const firstDataIndex = column.dataIndex.substring(0, 1);
if (firstDataIndex === "d" || firstDataIndex === "i") {
sorter = (a, b) =>
(commonUtils.isEmpty(a[column.dataIndex])
? 0
: a[column.dataIndex]) -
(commonUtils.isEmpty(b[column.dataIndex])
? 0
: b[column.dataIndex]);
} else if (firstDataIndex === "t") {
sorter = (a, b) =>
moment(
commonUtils.isEmpty(a[column.dataIndex])
? "2000-01-01"
: a[column.dataIndex]
).diff(
moment(
commonUtils.isEmpty(b[column.dataIndex])
? "2000-01-01"
: b[column.dataIndex]
)
);
} else {
sorter = (a, b) =>
(commonUtils.isEmpty(a[column.dataIndex])
? "0"
: a[column.dataIndex]
).localeCompare(
commonUtils.isEmpty(b[column.dataIndex])
? "1"
: b[column.dataIndex]
);
}
}
/* 工单、工艺卡、报价单 去掉排序 */
if (
this.props.name === "sParam" ||
specialRoute.includes("workOrder") ||
specialRoute.includes("processCard") ||
specialRoute.includes("quotation")
) {
sorter = false;
}
/* 默认字段是排序的 通过配置bNotSort来设置字段不排序 */
if (
config &&
commonUtils.isNotEmptyStr(
config.gdsconfigformslave.filter(
item => item.sName === column.dataIndex
)
)
) {
if (
config.gdsconfigformslave.filter(
item => item.sName === column.dataIndex
).length > 0 &&
config.gdsconfigformslave.filter(
item => item.sName === column.dataIndex
)[0].bNotSort
) {
sorter = false;
}
}
if (
config &&
commonUtils.isNotEmptyStr(
config.gdsconfigformslave.filter(
item => item.sName === column.dataIndex
)
)
) {
if (
config.gdsconfigformslave.filter(
item => item.sName === column.dataIndex
)[0].bNotSearch
) {
search = false;
}
}
if (
column.dataIndex === "spicture" ||
column.dataIndex === "tableLastEmpty" ||
props.data?.some(item =>
item.costomEnabledList?.includes(column.dataIndex)
)
) {
sorter = false;
}
let sTitleBgColor = commonUtils.isNotEmptyObject(column.sTitleBgColor)
? column.sTitleBgColor
: ""; /* 标题背景颜色 */
let sTitleColor = commonUtils.isNotEmptyObject(column.sTitleColor)
? column.sTitleColor
: ""; /* 标题字体颜色 */
const styleObj = {};
if (commonUtils.isNotEmptyObject(sTitleBgColor)) {
styleObj.background = sTitleBgColor;
}
if (commonUtils.isNotEmptyObject(sTitleColor)) {
styleObj.color = sTitleColor;
}
const renderTitle = () => {
// 树形表格在第一个column上加上全部展开/收起功能
let expandedAllIcon = "";
const columnIndex = headerColumn.findIndex(
item => column.title === item.title
);
let { data } = this.props;
let { expKeys } = this.state;
expKeys = commonUtils.isNotEmptyArr(expKeys) ? expKeys : [];
expKeys = this.currentExpKeys || expKeys;
data = commonUtils.isNotEmptyArr(data) ? data : [];
const childrenList = [];
const getChildrenList = data => {
data.forEach(item => {
if (item && typeof item.children === "object") {
childrenList.push(item);
getChildrenList(item.children);
}
});
};
getChildrenList(data);
if (columnIndex === 0 && childrenList.length) {
// 第一个column并且数据中有children
this.showExpAll = true;
this.tableCollapsed = !expKeys.length;
const marginLeft = this.props.bMutiSelect ? "6px" : "2px";
expandedAllIcon = (
,
{
const checkedObj = commonFileDownloadList.filter(
item => item.checked
);
if (commonUtils.isNotEmptyArrNew(checkedObj)) {
const fileUrl = checkedObj.map(item => item.url).toString();
this.handleFileDownload(fileUrl);
}
}}
>
下载选中
,
关闭
]}
>
{commonFileDownloadList.map(item => {
const { url, checked } = item;
const fileName = url
.split("/")
.pop()
.split("_")
.pop();
const fileType = fileName
.split(".")
.pop()
.toLowerCase();
const previewFileList = [
"jpg",
"png",
"jepg",
"webp",
"svg",
"bmp",
"apng",
"pdf"
];
return (
);
})}
) : (
""
)}
{pdfFileVisible ? (
{
this.setState({
pdfFileVisible: false
});
}}
>
) : (
""
)}
{
this.setState({ sCurrMemoProps: {} });
}}
/>
{officePreviewVisible && }
{labelColorModalVisible && (
{"白粉青蓝橙绿黄红".split("").map((item, index) => {
return (
{
this.props.onDataChange(
this.props.name,
"sLabelColor",
{ sLabelColor: item },
labelColorModalRecord.sId
);
this.setState(
{
labelColorModalVisible: false
},
() => {
const { showName, sOnChangeInstruct } =
this.props.config.gdsconfigformslave.find(
item => item.sName === "sLabelColor"
) || {};
const sInstruct = commonUtils.convertStrToObj(
sOnChangeInstruct,
{}
);
const instructType =
sInstruct.change || sInstruct.blur;
if (this.props.parentProps.onExecInstructSet) {
this.props.parentProps.onExecInstructSet({
btnConfig: {
sInstruct: JSON.stringify(instructType),
showName: `${showName}-选中`
}
});
}
}
);
}}
>
{item}
);
})}
)}
{this.props.getTotalDiv && this.props.getTotalDiv()}
);
}
}
const useCommonTableEvent = props => {
const { data = [] } = props;
let addState = {};
const config =
props.onMergeTableConfig && props.onMergeTableConfig(props.config);
if (commonUtils.isNotEmptyObject(config)) {
addState.config = config;
addState.headerColumn = commonFunc.getHeaderConfig(config);
}
// 当前页面全部数据
const { parentProps = {} } = props;
const allTableData = commonFunc.getAllTableData(parentProps);
// 当前页面所有选中数据(为空时默认获取第一条)
const [
allTableSelectedData,
allTableSelectedOneData,
allTableSelectedOneNoDefaultData
] = Object.keys(allTableData).reduce(
([result, result1, result2], tableName) => {
let tableData = allTableData[tableName] || [];
tableData = Array.isArray(tableData) ? tableData : [tableData];
const {
[`${tableName}SelectedRowKeys`]: selectedRowKeys = []
} = parentProps;
let filterData = tableData.filter(
item =>
selectedRowKeys.includes(item.sSlaveId) ||
selectedRowKeys.includes(item.sId)
);
let bEmptyLine = false;
if (!filterData.length && tableData.length) {
bEmptyLine = true;
filterData = [tableData[0]];
}
result = {
...result,
[tableName]: filterData
};
result1 = {
...result1,
[tableName]: filterData[0] || {}
};
result2 = {
...result2,
[tableName]: bEmptyLine ? {} : filterData[0] || {}
};
return [result, result1, result2];
},
[{}, {}, {}]
);
const getBtnDisabled = params => {
const {
str,
record: recordOld,
defaultValue = false,
noDefaultRow = false
} = params;
const bFirstOne =
props.data?.findIndex(item => item.sId === recordOld.sId) === 0;
const bLastOne =
props.data?.findIndex(item => item.sId === recordOld.sId) ===
props.data?.length - 1;
const globalData = commonUtils.getAppData("globalData");
const commonData = {
userinfo: commonUtils.getAppData("userinfo"),
currentSelectedMachineTask: globalData.currentSelectedMachineTask,
currentStartWorkMachineTask: globalData.currentStartWorkMachineTask,
currentWorkOrderInfo: globalData.currentWorkOrderInfo
};
const record = { ...recordOld, bFirstOne, bLastOne };
let disabled = defaultValue;
if (str) {
const { name } = props;
let strNew = str;
let tempData = {
...(noDefaultRow
? allTableSelectedOneNoDefaultData
: allTableSelectedOneData),
...commonData,
[name]: record,
currentRecord: record,
userface:
props.parentProps &&
commonUtils.isNotEmptyArr(props.parentProps.userfaceData)
? props.parentProps.userfaceData[0]
: {}
};
const allTableNew = {};
// 加放不存在数据集处理,使用 {} 处理。
if (str.includes("@")) {
for (const datasetOld of str.split("@")) {
if (!(datasetOld == str.split("@")[str.split("@").length - 1])) {
const datasetName = datasetOld.split("(")[
datasetOld.split("(").length - 1
];
if (!allTableNew[datasetName]) {
allTableNew[datasetName] =
parentProps[datasetName + "Data"] || [];
}
}
}
const [
allTableSelectedData,
allTableSelectedOneData,
allTableSelectedOneNoDefaultData
] = Object.keys(allTableNew).reduce(
([result, result1, result2], tableName) => {
let tableData = allTableNew[tableName] || [];
tableData = Array.isArray(tableData) ? tableData : [tableData];
const {
[`${tableName}SelectedRowKeys`]: selectedRowKeys = []
} = parentProps;
let filterData = tableData.filter(
item =>
selectedRowKeys.includes(item.sSlaveId) ||
selectedRowKeys.includes(item.sId)
);
let bEmptyLine = false;
if (!filterData.length && tableData.length) {
bEmptyLine = true;
filterData = [tableData[0]];
}
result = {
...result,
[tableName]: filterData
};
result1 = {
...result1,
[tableName]: filterData[0] || {}
};
result2 = {
...result2,
[tableName]: bEmptyLine ? {} : filterData[0] || {}
};
return [result, result1, result2];
},
[{}, {}, {}]
);
tempData = {
...tempData,
...(noDefaultRow
? allTableSelectedOneNoDefaultData
: allTableSelectedOneData)
};
}
if (props.name === "workerOrderBatchMaterial") {
const { parentProps = {} } = props;
if (commonUtils.isNotEmptyArr(parentProps.palletBatchMaterialData)) {
const iIndex = parentProps.palletBatchMaterialData.findIndex(
item =>
item.sMaterialsId === record.sMaterialsId &&
item.sDefineNo === record.sDefineNo
);
return iIndex > -1;
}
}
try {
Object.keys(tempData).forEach(key => {
const reg = new RegExp(`${key}\\.`, "g");
strNew = strNew.replace(reg, `tempData["${key}"].`);
const reg1 = new RegExp(`${key}@`, "g");
strNew = strNew.replace(reg1, `tempData["${key}"]`);
});
const evalStr = eval("`" + strNew + "`");
disabled = !eval(evalStr);
} catch (error) {
if (!str.includes("sTrayId.split")) {
console.log("=====表格行按钮状态错误", {
strNew,
tempData,
str,
error
});
}
}
}
return disabled;
};
// 增加行号iRowNum
const [updateRowNumTime, setUpdateRowNumTime] = useState(0);
addState.updateRowNumTime = updateRowNumTime;
useEffect(
() => {
// if (data?.length === 0) {
// data.push({ sId: commonUtils.createSid() });
// }
handleSetIRowNum(data);
handleSetCheckboxDisabled({ ...props, getBtnDisabled }); // 限制多选框选择
handleSetCostomEnabledList({ ...props, allTableSelectedOneData }, data);
setUpdateRowNumTime(pre => pre + 1);
},
[JSON.stringify(data)]
);
// 获取mes表格通用按钮配置
const mesOpr = useGetTableBtnOprSetting({ ...props, getBtnDisabled });
// 指令巡检/工艺巡检时,处理下参数
const xunjianParams = useGetXunjianParams(props);
// 指令巡检/工艺巡检时,新增数据默认打勾
useGetXunjianDefaultData({
...props,
...xunjianParams
});
addState = { ...addState, ...xunjianParams };
// 选择版材按钮
const choosePlate = () => {
if (props.name !== "plateInfo") return "";
const btnConfig = props.config?.gdsconfigformslave?.find(
item => item.sControlName === "choosePlate"
);
if (!btnConfig) return "";
const { showName } = btnConfig;
return (
{
props.parentProps.onExecInstructSet({
btnConfig
});
}}
>
{showName}
);
};
addState = { ...addState, choosePlate };
// 复制数据到下一行
const handleCopyToNextLine = ({ index, sName, isAll }) => {
const { data = [], name } = props;
// 复制第一行到全部
if (isAll) {
const firstLineRow = data[0];
if (!firstLineRow) return;
const copyData = cloneDeep(data);
copyData.forEach(item => {
item[sName] = firstLineRow[sName];
item.handleType = item.handleType || "update";
});
props.onSaveState({ [`${name}Data`]: copyData });
return;
}
if (!data[index + 1]) return;
const copyData = cloneDeep(data);
copyData[index + 1][sName] = copyData[index][sName];
copyData[index + 1].handleType = copyData[index + 1].handleType || "update";
props.onSaveState({ [`${name}Data`]: copyData });
};
const hanldeKeyDown = (e, record, sName, name) => {
const { data: tableData = [], headerColumn: tableColumn = [] } = props;
const move = (keyCode, cursortPosition, columnIndex) => {
if (keyCode === 37 && columnIndex > 0 && cursortPosition < 1) {
// 左移 则 列下标必须大于0, 且光标在最左侧
const lastId = `${tableColumn[columnIndex - 1].dataIndex}${record.sId}`;
if (!commonUtils.focus(lastId))
move(keyCode, cursortPosition, columnIndex - 1); // 递归
}
if (keyCode === 39 && columnIndex < tableColumn.length - 1) {
// 右移 则 列下标必须小于列数量-1
if (
!record[sName] ||
cursortPosition >= record[sName].toString().length
) {
// 当前列为空 或 光标位置不小于当前值的长度
const nextId = `${tableColumn[columnIndex + 1].dataIndex}${
record.sId
}`;
if (!commonUtils.focus(nextId))
move(keyCode, cursortPosition, columnIndex + 1); // 递归
}
}
};
if (tableData.length > 1 && [38, 40].includes(e.keyCode)) {
// 上键、下键
e.preventDefault();
// 获取当前编辑行的下标
const index = tableData.findIndex(item => item.sId === record.sId);
if (index === -1) return;
if (e.keyCode === 38 && index > 0) {
// 方向键上键 且 当前编辑行下标大于0时,为0时无法向上
const lastSid = tableData[index - 1].sId; // 获取上一个id
// props.onSaveState({ [`${name}SelectedRowKeys`]: [lastSid] }, () =>
commonUtils.focus(`${sName}${lastSid}`);
// );
}
if (e.keyCode === 40 && index < tableData.length - 1) {
// 方向键下键 且 当前编辑行下标小于最大值时,为最大值时无法向下
const nextSid = tableData[index + 1].sId; // 获取下一个id
// props.onSaveState({ [`${name}SelectedRowKeys`]: [nextSid] }, () =>
commonUtils.focus(`${sName}${nextSid}`);
// );
}
} else if ([37, 39].includes(e.keyCode)) {
// 左键、右键
const currentElement = document.getElementById(`${sName}${record.sId}`); // 当前编辑框对象
if (currentElement) {
const cursortPosition = commonUtils.getCursortPosition(currentElement); // 光标位置
const columnIndex = tableColumn.findIndex(
item => item.dataIndex === sName
); // 当前列下标
move(e.keyCode, cursortPosition, columnIndex);
}
}
};
const handleMoveLine = ({ index, direction }) => {
if (direction === "up" && index === 0) {
message.error("当前已是首行,无法上移!");
return;
} else if (direction === "down" && index === data.length - 1) {
message.error("当前已是末行,无法下移!");
return;
}
const indexNew = direction === "up" ? index - 1 : index + 1;
const iOrder1 = data[index].iOrder;
const iOrder2 = data[indexNew].iOrder;
data[index].iOrder = iOrder2;
data[indexNew].iOrder = iOrder1;
const tempItem = data[index];
data[index] = data[indexNew];
data[indexNew] = tempItem;
data[index].handleType = data[index].handleType || "update";
data[indexNew].handleType = data[indexNew].handleType || "update";
props.onSaveState({
[`${props.name}Data`]: data
});
};
function getDecimalPlaces(num) {
const match = num.toString().match(/(?:\.(\d+))?(?:[eE]([+-]?\d+))?$/);
if (!match) return 0;
let decimalPlaces = Math.max(
0,
(match[1] ? match[1].length : 0) - (match[2] ? +match[2] : 0)
);
return decimalPlaces;
}
if (
(["12710101117087404588200", "12710101117260270570210"].includes(
props.formId
) &&
props.name === "table0") ||
(props.formId === "12710101117087371044360" && props.name === "slave0")
) {
addState.getTotalDiv = () => {
const { dWageHour, dTimeHour, dProcessQty, dReportQtySum } = data.reduce(
(pre, item) => {
if (item.dWageHour) {
pre.dWageHour += item.dWageHour;
}
if (item.dTimeHour) {
pre.dTimeHour += item.dTimeHour;
}
if (item.dProcessQty) {
pre.dProcessQty += item.dProcessQty;
}
if (item.dReportQtySum && item.sPlcMachineStatus !== "waitingWork") {
pre.dReportQtySum += item.dReportQtySum;
}
return pre;
},
{
dWageHour: 0,
dTimeHour: 0,
dProcessQty: 0,
dReportQtySum: 0
}
);
return (
已报合计
计件工时:
{dWageHour.toFixed(2)}
计时工时:
{dWageHour.toFixed(2)}
报工产量:
{dProcessQty}
托盘产量:
{dReportQtySum}
);
};
}
if (["12710101117087404588200"].includes(props.formId) && props.name === "table1") {
const headerColumn = props.headerColumn || [];
// 获取需要合计的列配置(bSum=true的列)
const sumColumns = headerColumn?.filter(col => col.dataIndex.indexOf('Report') > -1 && col.bSum === true || col.bSum === 1) || [];
addState.getTotalDiv = () => {
// 初始化合计对象,根据sumColumns动态生成初始值
const initialValues = sumColumns.reduce((obj, col) => {
obj[col.dataIndex] = 0;
return obj;
}, {});
// 动态计算合计值
const totalData = data.reduce((pre, item) => {
sumColumns.forEach(col => {
const dataIndex = col.dataIndex;
if (item[dataIndex] !== undefined && item[dataIndex] !== null) {
pre[dataIndex] += Number(item[dataIndex]) || 0;
}
});
return pre;
}, initialValues);
return (
已报合计
{sumColumns.map((col, index) => {
const value = totalData[col.dataIndex];
// 根据数值类型决定是否保留两位小数
const displayValue = typeof value === 'number' && !Number.isInteger(value)
? value.toFixed(2)
: value;
return (
<>
{col.title}:
{displayValue}
>
);
})}
);
};
}
if (
["12710101117087404588200", "12710101117260270570210"].includes(
props.formId
) &&
props.name === "tableS1"
) {
const { headerColumn = [] } = { ...props, ...addState };
if (headerColumn.find(item => item.dataIndex === "dProductionCount")) {
addState.getTotalDiv = () => {
const { dProductionCount, maxDigits } = data.reduce(
(pre, item) => {
if (item.dProductionCount) {
pre.dProductionCount += item.dProductionCount;
pre.maxDigits = Math.max(
pre.maxDigits,
getDecimalPlaces(item.dProductionCount)
);
}
return pre;
},
{
dProductionCount: 0,
maxDigits: 0
}
);
return (
合计
成品数量(万套):
{commonUtils.convertFixNum(dProductionCount, maxDigits)}
);
};
}
}
if (props.name === "table131") {
addState.getTotalDiv = () => {
const { dProcessCalQty, maxDigits } = data.reduce(
(pre, item) => {
if (item.dProcessCalQty) {
pre.dProcessCalQty += item.dProcessCalQty;
pre.maxDigits = Math.max(
pre.maxDigits,
getDecimalPlaces(item.dProcessCalQty)
);
}
return pre;
},
{
dProcessCalQty: 0,
maxDigits: 0
}
);
return (
合计
上报数量:
{commonUtils.convertFixNum(dProcessCalQty, maxDigits)}
);
};
}
if (props.onGetTotalDiv) {
addState.getTotalDiv = props.onGetTotalDiv;
}
const handleShowSimpleModal = htmlString => {
Modal.info({
title: 详细,
width: "70%",
content: (
),
okText: "关闭"
});
};
return {
...props,
...addState,
allTableSelectedData,
allTableSelectedOneData,
...mesOpr,
getBtnDisabled,
onCopyToNextLine: handleCopyToNextLine,
onKeyDown: hanldeKeyDown,
onMoveLine: handleMoveLine,
onShowSimpleModal: handleShowSimpleModal
};
};
const CommonTable = baseProps => {
if (
baseProps.defaultExpandAllRows !== undefined &&
baseProps.data === undefined
) {
return "";
}
const props = useCommonTableEvent(baseProps);
return ;
};
const handleSetIRowNum = data => {
data.forEach((item, index) => {
item.iRowNum = index + 1;
if (commonUtils.isNotEmptyArr(item.children)) {
handleSetIRowNum(item.children);
}
});
};
const handleSetCheckboxDisabled = props => {
const { config, data = [] } = props;
const checkboxDisabled = config?.gdsconfigformslave?.find(
item =>
item.bVisible && item.sControlName?.toLowerCase() === "checkboxdisabled"
);
if (checkboxDisabled) {
const { sDefault } = checkboxDisabled;
data.forEach(item => {
item.checkboxDisabled = !props.getBtnDisabled({
str: sDefault,
record: item,
defaultValue: true
});
});
}
};
// 自定义每一行可操作字段
const handleSetCostomEnabledList = (props, data) => {
if (!data?.length) return;
const { gdsconfigformslave = [] } = props?.config || {};
const cellEnabledCondition = gdsconfigformslave.find(
item => item.sControlName === "cellEnabledCondition" && item.bVisible
);
if (!cellEnabledCondition) return;
const { sDefault } = cellEnabledCondition;
if (!sDefault) return;
const { headerColumn = [] } = props;
const globalData = commonUtils.getAppData("globalData");
const commonData = {
userinfo: commonUtils.getAppData("userinfo"),
currentSelectedMachineTask: globalData.currentSelectedMachineTask,
currentStartWorkMachineTask: globalData.currentStartWorkMachineTask,
currentWorkOrderInfo: globalData.currentWorkOrderInfo
};
const list = sDefault.split(",,");
data.forEach(record => {
delete record.costomEnabledList;
const costomEnabledList = [];
headerColumn.forEach(item => {
const currentName = item.dataIndex;
const tempData = {
...commonData,
...props.allTableSelectedOneData,
currentName,
currentRecord: record,
userface:
props.parentProps &&
commonUtils.isNotEmptyArr(props.parentProps.userfaceData)
? props.parentProps.userfaceData[0]
: {}
};
list.forEach(str => {
let strNew = str;
try {
Object.keys(tempData).forEach(key => {
const reg = new RegExp(`${key}\\.`, "g");
strNew = strNew.replace(reg, `tempData["${key}"].`);
const reg1 = new RegExp(`${key}@`, "g");
strNew = strNew.replace(reg1, `tempData["${key}"]`);
});
const evalStr = eval("`" + strNew + "`");
const result = eval(evalStr);
if (result) {
costomEnabledList.push(currentName);
}
} catch (error) {
console.log("=====自定义每一行可操作字段错误", {
tempData,
strNew,
str,
error
});
}
});
});
if (costomEnabledList.length) {
record.costomEnabledList = costomEnabledList;
}
});
};
// 获取mes表格通用按钮配置
const useGetTableBtnOprSetting = props => {
let result = {};
const { config = {} } = props;
const { gdsconfigformslave = [] } = config;
const btnTableOprConfig =
gdsconfigformslave.find(
item => item.sControlName?.toLowerCase() === "btntableopr"
) || {};
let { sDefault = "" } = btnTableOprConfig;
const btnTableDelConfig =
gdsconfigformslave.find(
item => item.sControlName?.toLowerCase() === "btntabledel"
) || {};
if (
commonUtils.isNotEmptyObject(btnTableDelConfig) &&
!sDefault?.includes("del")
) {
sDefault = sDefault ? `${sDefault},del` : "del";
}
const btnTableAddConfig =
gdsconfigformslave.find(
item => item.sControlName?.toLowerCase() === "btntableadd"
) || {};
if (
commonUtils.isNotEmptyObject(btnTableAddConfig) &&
!sDefault?.includes("add")
) {
sDefault = sDefault ? `${sDefault},add` : "add";
}
if (location.pathname.includes("indexPad") && sDefault) {
sDefault = "add,del,save";
}
const { bSubmit, bCheck } = props?.parentProps?.masterData || {};
if (location.pathname.includes("indexPad") && sDefault && !props.enabled) {
if (!bSubmit && !bCheck) {
sDefault = "add";
} else {
sDefault = "";
}
}
if (!sDefault) {
return result;
}
// 表格滚动到底部
const scrollToBottom = tableClassName => {
setTimeout(() => {
const oTable = document.querySelectorAll(`.${tableClassName}`)[0];
if (oTable) {
const oBody = oTable.querySelector(".ant-table-body");
oBody && (oBody.scrollTop = 999999);
}
}, 300);
};
// 表格滚动到顶部
const scrollToTop = tableClassName => {
setTimeout(() => {
const oTable = document.querySelectorAll(`.${tableClassName}`)[0];
if (oTable) {
const oBody = oTable.querySelector(".ant-table-body");
oBody && (oBody.scrollTop = 0);
}
}, 300);
};
const resultTemp = {};
const list = sDefault.split(",");
list.forEach(btnType => {
if (btnType === "add") {
resultTemp.mesAdd = params => {
const { sDefault: str } = btnTableAddConfig;
const disabled = props.getBtnDisabled({
str,
defaultValue: false,
record: {}
});
return (
}
onClick={e => {
e.stopPropagation();
props.onMesTableLineAdd &&
props.onMesTableLineAdd({
...params,
callback: props.bAddFirst
? scrollToTop(params.tableClassName)
: scrollToBottom(params.tableClassName),
bAddFirst: props.bAddFirst
});
}}
/>
);
};
} else if (btnType === "del") {
resultTemp.mesDel = params => {
const { record } = params;
const { sDefault: str } = btnTableDelConfig;
const disabled = props.getBtnDisabled({
str,
defaultValue: false,
record
});
return (
}
onClick={e => {
e.stopPropagation();
props.onMesTableLineDel && props.onMesTableLineDel(params);
}}
/>
);
};
} else if (btnType === "copy") {
resultTemp.mesCopy = params => (
}
onClick={e => {
e.stopPropagation();
props.onMesTableLineCopy &&
props.onMesTableLineCopy({
...params,
callback: scrollToBottom(params.tableClassName)
});
}}
/>
);
} else if (btnType === "save") {
resultTemp.mesSave = () => (
}
onClick={e => {
e.stopPropagation();
props.onMesTableLineSave && props.onMesTableLineSave();
}}
/>
);
}
});
result = resultTemp;
return result;
};
// 指令巡检/工艺巡检时,处理下参数
const useGetXunjianParams = props => {
const [params, setParams] = useState({});
// 判断是否指令巡检/工艺巡检
const currentMesPane = commonUtils.convertStrToObj(
localStorage.getItem("xlybusinesscurrentMesPane"),
{}
);
const bXunjian = [
"12710101117089395856660",
"12710101117089396027630"
].includes(currentMesPane.sModelsId);
const bGyXunjian = currentMesPane.sModelsId === "12710101117089395856660";
const getXunBgColor = (record, sName, bLineBgColor) => {
let bgColorDark = "";
let bgColorLight = "";
switch (Number(record.sSReserve1)) {
case 2:
bgColorDark = "#FF7E37";
bgColorLight = "#fce7db";
break;
case 3:
bgColorDark = "#EFB700";
bgColorLight = "#faf1d9";
break;
case 4:
bgColorDark = "#19C2B1";
bgColorLight = "#def2ef";
break;
case 5:
bgColorDark = "#52C41A";
bgColorLight = "#e3f3d9";
break;
case 6:
bgColorDark = "#9A46EA";
bgColorLight = "#e9dbf9";
break;
default:
break;
}
if (sName === "sPollingPerson") {
return bgColorDark;
} else if (bLineBgColor) {
return bgColorLight;
} else {
return "";
}
};
useEffect(
() => {
if (bXunjian) {
const { config } = props;
if (commonUtils.isEmptyObject(config)) return;
const configNew = lodash.cloneDeep(config);
const headerColumn = commonFunc.getHeaderConfig(configNew);
headerColumn.forEach(item => {
item.width1 = item.width;
if ([40, 88].includes(item.width1)) {
item.bXunjianCheck = true;
item.width = item.title.includes("-") ? 120 : 40;
}
if ([77, 88].includes(item.width1)) {
item.bXunjianSpecial = true;
}
if ([66, 77].includes(item.width1)) {
item.width = 120;
}
});
const xunjianList = headerColumn
.filter(item => item.width === 40)
.map(item => item.dataIndex);
setParams({
bXunjian,
xunjianList,
bGyXunjian,
config,
headerColumn,
getXunBgColor
});
}
},
[bXunjian]
);
return params;
};
// 指令巡检/工艺巡检时,新增数据默认打勾
const useGetXunjianDefaultData = props => {
const { data = [] } = props;
useEffect(
() => {
if (!data.length) return;
if (!props.bXunjian) return;
const { headerColumn = [] } = props;
const defaultCheckList = headerColumn
.filter(item => item.width === 40)
.map(item => item.dataIndex);
data.forEach(item => {
defaultCheckList.forEach(sName => {
if (item[sName] === undefined) {
item[sName] = "✓";
}
});
});
},
[data.length]
);
};
const IminutesComponent = ({ record }) => {
const { tStartDate, sFieldMinutes: sFieldMinutesOld, sMinutesType } = record;
if (!moment(tStartDate).isValid()) return "";
const [value, setValue] = useState("");
const sFieldMinutes = sFieldMinutesOld ? sFieldMinutesOld : "tEndDate";
useEffect(() => {
const getTime = () => {
if (record[sFieldMinutes]) {
let temp = moment(record[sFieldMinutes]).diff(
moment(tStartDate),
"minutes"
);
if (sMinutesType === "hour") {
temp = Math.floor((temp / 60) * 100) / 100;
}
setValue(temp);
clearInterval(timer);
} else {
let temp = moment().diff(moment(tStartDate), "minutes");
if (sMinutesType === "hour") {
temp = Math.floor((temp / 60) * 100) / 100;
}
setValue(temp);
}
};
getTime();
const timer = setInterval(() => {
getTime();
}, 1000);
return () => {
clearInterval(timer);
};
}, []);
return {value};
};
const TEndDateComponent = () => {
const [value, setValue] = useState("");
useEffect(() => {
const getTime = () => {
setValue(moment().format("HH:mm"));
};
getTime();
const timer = setInterval(() => {
getTime();
}, 1000);
return () => {
clearInterval(timer);
};
}, []);
return {value};
};
const DqtyComponent = () => {
const oDTrayQty = document.querySelector("#MesDynamicNum_dTrayQty");
if (!oDTrayQty) return 0;
const [value, setValue] = useState("");
useEffect(() => {
const getValue = () => {
const temp = oDTrayQty.innerHTML?.replace(/\,/g, "");
setValue(temp);
};
getValue();
const timer = setInterval(() => {
getValue();
}, 1000);
return () => {
clearInterval(timer);
};
}, []);
return {value};
};
const DmesQualifiedQtyComponent = props => {
const [value, setValue] = useState(0);
useEffect(() => {
const getValue = () => {
const changeExecInfo = commonUtils.getAppData("changeExecInfo");
const { dTrayQty = 0 } = changeExecInfo;
setValue(dTrayQty);
};
getValue();
const timer = setInterval(() => {
getValue();
}, 1000);
return () => {
clearInterval(timer);
};
}, []);
return {value};
};
const DmesUnqualifiedQtyComponent = props => {
const [value, setValue] = useState(0);
useEffect(() => {
const getValue = () => {
const changeExecInfo = commonUtils.getAppData("changeExecInfo");
const { dNoTrayQty = 0 } = changeExecInfo;
setValue(dNoTrayQty);
};
getValue();
const timer = setInterval(() => {
getValue();
}, 1000);
return () => {
clearInterval(timer);
};
}, []);
return {value};
};
export default CommonTable;