Commit 74147346ea1d3d9f1b108c82b98597f7b13feaad

Authored by 陈鑫涛
1 parent d7224e72

盒型双盒

Too many changes to show.

To preserve performance only 2 of 6 files are displayed.

src/components/Common/BoxDesign/createAirplaneBox.js
... ... @@ -106,6 +106,36 @@ export const createPathElements = (x, y, width, height, id, wrapperId) => {
106 106 // svg.setAttribute("stroke-dasharray", "4"); // 添加虚线效果
107 107 return svg;
108 108 };
  109 +export const createPathElementTrapezoid = (x, y, width, height) => {
  110 + const d = `M ${x + width * 0.1} ${y} L ${x} ${y + height} L ${x + width} ${y + height} L ${x + width * 0.9} ${y} L ${x + width * 0.2} ${y} `;
  111 + const svg = document.createElementNS("http://www.w3.org/2000/svg", "path");
  112 + svg.setAttribute("d", d);
  113 + svg.setAttribute("fill", "transparent");
  114 + svg.setAttribute("stroke", "#7588B9");
  115 + svg.setAttribute("stroke-width", "1");
  116 + // svg.setAttribute("stroke-dasharray", "4"); // 添加虚线效果
  117 + return svg;
  118 +};
  119 +export const createPathElementTrapezoids = (x, y, width, height) => {
  120 + const d = `M ${x} ${y + height * 0.1} L ${x + width} ${y} L ${x + width} ${y + height} L ${x} ${y + height * 0.9} L ${x} ${y + height * 0.1}`;
  121 + const svg = document.createElementNS("http://www.w3.org/2000/svg", "path");
  122 + svg.setAttribute("d", d);
  123 + svg.setAttribute("fill", "transparent");
  124 + svg.setAttribute("stroke", "#7588B9");
  125 + svg.setAttribute("stroke-width", "1");
  126 + // svg.setAttribute("stroke-dasharray", "4"); // 添加虚线效果
  127 + return svg;
  128 +};
  129 +export const createPathElementTrapezoidRight = (x, y, width, height) => {
  130 + const d = `M ${x} ${y} L ${x + width} ${y + height * 0.1} L ${x + width} ${y + height * 0.9} L ${x} ${y + height} L ${x} ${y}`;
  131 + const svg = document.createElementNS("http://www.w3.org/2000/svg", "path");
  132 + svg.setAttribute("d", d);
  133 + svg.setAttribute("fill", "transparent");
  134 + svg.setAttribute("stroke", "#7588B9");
  135 + svg.setAttribute("stroke-width", "1");
  136 + // svg.setAttribute("stroke-dasharray", "4"); // 添加虚线效果
  137 + return svg;
  138 +};
109 139 //
110 140 // 左边斜线贴边
111 141 export const createTrapezoid = (height, offsetX, offsetY, size) => {
... ... @@ -917,9 +947,13 @@ export const createWelt1 = (height, size, offsetX, offsetY) => {
917 947 };
918 948 // 贴边2
919 949 export const createWelt2 = (height, size, offsetX, offsetY) => {
920   - const d = `M ${offsetX} ${offsetY} L ${offsetX + size} ${offsetY} A ${size *0.3} ${size * 0.3} 0 0 1 ${offsetX } ${offsetY } L ${offsetX} ${offsetY + height} L
921   - ${offsetX + size} ${offsetY + height} A ${size *0.3} ${size * 0.3} 0 0 0 ${offsetX} ${offsetY + height} L ${offsetX + size} ${offsetY + height} L ${offsetX + size} ${offsetY}
922   - `
  950 + const d = `M ${offsetX} ${offsetY} L ${offsetX + size} ${offsetY} A ${size * 0.3} ${size * 0.3} 0 0 1 ${offsetX} ${offsetY} L ${offsetX} ${
  951 + offsetY + height
  952 + } L
  953 + ${offsetX + size} ${offsetY + height} A ${size * 0.3} ${size * 0.3} 0 0 0 ${offsetX} ${offsetY + height} L ${offsetX + size} ${
  954 + offsetY + height
  955 + } L ${offsetX + size} ${offsetY}
  956 + `;
923 957 // A ${ size * 0.5 } ${size} 0 0 1 ${offsetX} ${offsetY} L ${offsetX} ${offsetY + height} A ${size * 0.5} ${size} 0 0 1 ${offsetX + size * 0.5} ${
924 958 // offsetY + height + Math.abs(size)
925 959 // } A ${size * 0.5} ${size} 0 0 1 ${offsetX + size} ${offsetY + height} L ${offsetX + size} ${offsetY} L ${offsetX + size} ${
... ... @@ -928,8 +962,12 @@ export const createWelt2 = (height, size, offsetX, offsetY) => {
928 962 return createSvg(d);
929 963 };
930 964 export const createWelt2Right = (height, size, offsetX, offsetY) => {
931   - const d = `M ${offsetX} ${offsetY} L ${offsetX + size} ${offsetY} A ${size * 0.3} ${size * 0.3} 0 0 0 ${offsetX} ${offsetY} L ${offsetX} ${offsetY + height}
932   - L ${offsetX + size} ${offsetY + height} A ${size *0.3} ${size * 0.3} 0 0 1 ${offsetX} ${offsetY + height} L ${offsetX + size} ${offsetY + height} L ${offsetX + size} ${offsetY} `
  965 + const d = `M ${offsetX} ${offsetY} L ${offsetX + size} ${offsetY} A ${size * 0.3} ${size * 0.3} 0 0 0 ${offsetX} ${offsetY} L ${offsetX} ${
  966 + offsetY + height
  967 + }
  968 + L ${offsetX + size} ${offsetY + height} A ${size * 0.3} ${size * 0.3} 0 0 1 ${offsetX} ${offsetY + height} L ${offsetX + size} ${
  969 + offsetY + height
  970 + } L ${offsetX + size} ${offsetY} `;
933 971 // A ${
934 972 // size * 0.5
935 973 // } ${size} 0 0 0 ${offsetX} ${offsetY} L ${offsetX} ${offsetY + height} A ${size * 0.5} ${size} 0 0 0 ${offsetX + size * 0.5} ${
... ... @@ -946,8 +984,10 @@ export const createWelt3 = (height, size, offsetX, offsetY) => {
946 984 return createSvg(d);
947 985 };
948 986 export const createWelt4 = (height, size, offsetX, offsetY, dSFHS, dXFHS) => {
949   - const d = `M ${offsetX} ${offsetY} L ${offsetX} ${offsetY - dSFHS} L ${offsetX + size} ${offsetY - dSFHS} L ${offsetX + size} ${offsetY + height+dXFHS}
950   - L ${offsetX} ${offsetY + height+dXFHS} L ${offsetX} ${offsetY + height}`;
  987 + const d = `M ${offsetX} ${offsetY} L ${offsetX} ${offsetY - dSFHS} L ${offsetX + size} ${offsetY - dSFHS} L ${offsetX + size} ${
  988 + offsetY + height + dXFHS
  989 + }
  990 + L ${offsetX} ${offsetY + height + dXFHS} L ${offsetX} ${offsetY + height}`;
951 991 return createSvg(d);
952 992 };
953 993 export const createWelt3Right = (height, size, offsetX, offsetY) => {
... ... @@ -958,7 +998,7 @@ export const createWelt3Right = (height, size, offsetX, offsetY) => {
958 998 };
959 999 export const createWelt4Right = (height, size, offsetX, offsetY, dSFHS, dXFHS) => {
960 1000 const d = `M ${offsetX} ${offsetY} L ${offsetX} ${offsetY - dSFHS} L ${offsetX + size} ${offsetY - dSFHS}
961   - L ${offsetX + size} ${offsetY + height + dXFHS} L ${offsetX } ${offsetY + height + dXFHS} L ${offsetX} ${offsetY + height}`;
  1001 + L ${offsetX + size} ${offsetY + height + dXFHS} L ${offsetX} ${offsetY + height + dXFHS} L ${offsetX} ${offsetY + height}`;
962 1002 return createSvg(d);
963 1003 };
964 1004 // 天地盒
... ...
src/components/Common/BoxDesignCompontent/index.js
... ... @@ -8,9 +8,6 @@ import * as commonBusiness from "@/components/Common/commonBusiness";
8 8 import * as commonServices from "@/services/services";
9 9 import CommonBase from "@/components/Common/CommonBase";
10 10 import AntdDraggableModal from "@/components/Common/AntdDraggableModal";
11   -import CommonViewTable from "@/components/Common/CommonViewTable";
12   -import StaticEditTable from "@/components/Common/CommonTable";
13   -import jsPreviewPdf from "@js-preview/pdf";
14 11 import commonConfig from "@/utils/config";
15 12 import SvgBox from "./svg";
16 13 import styles from "./index.less";
... ... @@ -494,7 +491,7 @@ const BoxDesignCompontent = baseProps => {
494 491 updatedBoxList[index].selectImage = selectConfig.image;
495 492 // 选择盒身数据全部清空
496 493  
497   - const typeList = [1, 2, 3, 4];
  494 + const typeList = [1, 2, 3, 4, 5, 6, 7, 8, 9];
498 495 if (typeList.includes(type)) {
499 496 const table1 = tableColum.map(x => x.showName);
500 497 const table2 = boxBodyList.map(x => x.showName);
... ... @@ -506,6 +503,18 @@ const BoxDesignCompontent = baseProps => {
506 503 x.type = null;
507 504 x.selectValue = null;
508 505 x.selectImage = null;
  506 + x.sLength = null;
  507 + x.sWidth = null;
  508 + x.sType = null;
  509 + x.sTypeName = null;
  510 + x.sOffset = null;
  511 + x.sQuantity = null;
  512 + x.cLength = null;
  513 + x.cWidth = null;
  514 + x.cType = null;
  515 + x.cTypeName = null;
  516 + x.cOffset = null;
  517 + x.cQuantity = null;
509 518 // x.showName =
510 519 }
511 520 });
... ... @@ -518,10 +527,10 @@ const BoxDesignCompontent = baseProps => {
518 527 let updatedBoxList = [...boxList];
519 528 if (doubleType === 0) {
520 529 updatedBoxList[index].sTypeName = Number(name) === 0 ? "矩形" : "梯形";
521   - updatedBoxList[index].sType = Number(name)
  530 + updatedBoxList[index].sType = Number(name);
522 531 } else {
523 532 updatedBoxList[index].cTypeName = Number(name) === 0 ? "矩形" : "梯形";
524   - updatedBoxList[index].cType = Number(name)
  533 + updatedBoxList[index].cType = Number(name);
525 534 }
526 535 setBoxList(updatedBoxList);
527 536 };
... ... @@ -593,7 +602,7 @@ const BoxDesignCompontent = baseProps => {
593 602 sLength: item.sLength,
594 603 sWidth: item.sWidth,
595 604 sType: item.sType,
596   - sTypeName: item.sTypeName,
  605 + sTypeName: Number(item.sType) === 0 ? "矩形" : "梯形",
597 606 sOffset: item.sOffset,
598 607 sQuantity: item.sQuantity,
599 608 cLength: item.cLength,
... ... @@ -1490,8 +1499,9 @@ const BoxDesignCompontent = baseProps => {
1490 1499 >
1491 1500 {!loading ? options.map(option => renderOptionWithImage(option)) : ""}
1492 1501 </Select>
1493   - {item?.type && item?.type.includes("09") ? (
1494   - <div>
  1502 +
  1503 + {/* {item?.type && item?.type.includes("09") ? (
  1504 + <div className={styles.boxInput}>
1495 1505 <div className={styles.boxInput}>
1496 1506 <div className={styles.text} style={{ width: " 100%" }}>
1497 1507 层1{" "}
... ... @@ -1646,7 +1656,165 @@ const BoxDesignCompontent = baseProps =&gt; {
1646 1656 style={{ width: " 80%" }}
1647 1657 />
1648 1658 </div>
1649   - )}
  1659 + )} */}
  1660 + <div className={styles.boxInput}>
  1661 + {item?.selectImage ? (
  1662 + <img
  1663 + src={item?.selectImage}
  1664 + alt={item.value}
  1665 + style={{
  1666 + width: 40,
  1667 + height: 30,
  1668 + marginRight: 8,
  1669 + position: "absolute",
  1670 + left: 20,
  1671 + top: -35,
  1672 + zIndex: 10,
  1673 + }}
  1674 + />
  1675 + ) : (
  1676 + ""
  1677 + )}
  1678 + {item.type && item.type.includes("09") ? (
  1679 + <div>
  1680 + <div className={styles.boxInput}>
  1681 + <div className={styles.text} style={{ width: " 100%" }}>
  1682 + 层1{" "}
  1683 + </div>
  1684 + <Input
  1685 + value={item?.sLength}
  1686 + onChange={e => handleChange(e, findIndexBySname(item.sName), "sLength")}
  1687 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1688 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1689 + readOnly={!item?.isEditable}
  1690 + style={{ width: " 80%" }}
  1691 + placeholder="长"
  1692 + />
  1693 + <Input
  1694 + value={item?.sWidth}
  1695 + onChange={e => handleChange(e, findIndexBySname(item.sName), "sWidth")}
  1696 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1697 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1698 + readOnly={!item?.isEditable}
  1699 + style={{ width: " 80%" }}
  1700 + placeholder="宽"
  1701 + />
  1702 + </div>
  1703 + <div className={styles.boxInput}>
  1704 + <Select
  1705 + optionLabelProp="label"
  1706 + className="mySelectsDouble"
  1707 + style={{ width: 180, color: "#000" }}
  1708 + defaultValue={options.length ? options[0].value : ""}
  1709 + value={item?.sTypeName || ""}
  1710 + onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 0)}
  1711 + onDropdownVisibleChange={async open => {
  1712 + if (open) {
  1713 + props.getSqlOptions(null); // 在下拉菜单打开时调用 getSqlOptions
  1714 + }
  1715 + }}
  1716 + >
  1717 + {!loading ? options.map(option => renderOptionWithText(option)) : ""}
  1718 + </Select>
  1719 + <Input
  1720 + value={item?.sQuantity}
  1721 + onChange={e => handleChange(e, findIndexBySname(item.sName), "sQuantity")}
  1722 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1723 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1724 + readOnly={!item?.isEditable}
  1725 + style={{ width: " 80%" }}
  1726 + placeholder="个数"
  1727 + />
  1728 + <Input
  1729 + value={item?.sOffset}
  1730 + onChange={e => handleChange(e, findIndexBySname(item.sName), "sOffset")}
  1731 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1732 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1733 + readOnly={!item?.isEditable}
  1734 + style={{ width: " 80%" }}
  1735 + placeholder="偏移"
  1736 + />
  1737 + </div>
  1738 + <div className={styles.boxInput}>
  1739 + <div className={styles.text} style={{ width: " 100%" }}>
  1740 + 层2{" "}
  1741 + </div>
  1742 + <Input
  1743 + value={item?.cLength}
  1744 + onChange={e => handleChange(e, findIndexBySname(item.sName), "cLength")}
  1745 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1746 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1747 + readOnly={!item?.isEditable}
  1748 + style={{ width: " 80%" }}
  1749 + placeholder="长"
  1750 + />
  1751 + <Input
  1752 + value={item?.cWidth}
  1753 + onChange={e => handleChange(e, findIndexBySname(item.sName), "cWidth")}
  1754 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1755 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1756 + readOnly={!item?.isEditable}
  1757 + style={{ width: " 80%" }}
  1758 + placeholder="宽"
  1759 + />
  1760 + </div>
  1761 + <div className={styles.boxInput}>
  1762 + <Select
  1763 + optionLabelProp="label"
  1764 + className="mySelectsDouble"
  1765 + style={{ width: 180, color: "#000" }}
  1766 + defaultValue={options.length ? options[0].value : ""}
  1767 + value={item?.cTypeName || ""}
  1768 + onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 1)}
  1769 + onDropdownVisibleChange={async open => {
  1770 + if (open) {
  1771 + props.getSqlOptions(null); // 在下拉菜单打开时调用 getSqlOptions
  1772 + }
  1773 + }}
  1774 + >
  1775 + {!loading ? options.map(option => renderOptionWithText(option)) : ""}
  1776 + </Select>
  1777 + <Input
  1778 + value={item?.cQuantity}
  1779 + onChange={e => handleChange(e, findIndexBySname(item.sName), "cQuantity")}
  1780 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1781 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1782 + readOnly={!item?.isEditable}
  1783 + style={{ width: " 80%" }}
  1784 + placeholder="个数"
  1785 + />
  1786 + <Input
  1787 + value={item?.cOffset}
  1788 + onChange={e => handleChange(e, findIndexBySname(item.sName), "cOffset")}
  1789 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1790 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1791 + readOnly={!item?.isEditable}
  1792 + style={{ width: " 80%" }}
  1793 + placeholder="偏移"
  1794 + />
  1795 + </div>
  1796 + </div>
  1797 + ) : (
  1798 + <div className={styles.boxInput}>
  1799 + <Input
  1800 + value={item?.showName}
  1801 + onChange={e => handleChangeName(e, findIndexBySname(item.sName))}
  1802 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1803 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1804 + readOnly={!item?.isEditable}
  1805 + className={styles.text}
  1806 + />
  1807 + <Input
  1808 + value={item?.value}
  1809 + onChange={e => handleChange(e, findIndexBySname(item.sName))}
  1810 + onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
  1811 + onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
  1812 + readOnly={!item?.isEditable}
  1813 + style={{ width: " 80%" }}
  1814 + />
  1815 + </div>
  1816 + )}
  1817 + </div>
1650 1818 </div>
1651 1819 ))}
1652 1820 {boxType === "8" &&
... ...