From c0d9a47f49a017f40755bdea90e32eb1a2744664 Mon Sep 17 00:00:00 2001 From: 陈鑫涛 <10125295+chen-xintao97@user.noreply.gitee.com> Date: Tue, 1 Jul 2025 14:14:19 +0800 Subject: [PATCH] 排版 --- src/components/Common/Typesetting/typesetting.js | 167 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------------------------------------------------------------------------- src/components/QuickQuote/index.jsx | 3 ++- 2 files changed, 86 insertions(+), 84 deletions(-) diff --git a/src/components/Common/Typesetting/typesetting.js b/src/components/Common/Typesetting/typesetting.js index ac49419..121c123 100644 --- a/src/components/Common/Typesetting/typesetting.js +++ b/src/components/Common/Typesetting/typesetting.js @@ -87,11 +87,10 @@ const Typesetting = props => { // 如果需要自定义排版数 // 确认是竖向排列还是横向排列 - const L = masterData?.dLength || 0; - const W = masterData?.dWidth || 0 ; + const L = Number(masterData?.dLength) || 0; + const W = masterData?.dWidth || 0; const H = masterData?.dWidth || 0; const D = masterData?.dHeight || 0; - // 动态计算公式值 const evaluateFormula = (formula, variables) => { if (!formula) return 0; // 如果公式为空，返回0 @@ -118,8 +117,9 @@ const Typesetting = props => { D, ...props.slaveRowData, }; + const { sStripType = 0 } = props.state.selectedNode; let boxList = []; - if (sColumnNameConfig) { + if (sColumnNameConfig ) { const slaveNewData = JSON.parse(sColumnNameConfig); const tables = [ { name: "盒型类别", value: slaveRowData.sBoxType, type: null }, @@ -142,7 +142,7 @@ const Typesetting = props => { slaveNewData.forEach(x => { let key = 0; if (x.sAssignFormula) { - key = evaluateFormula(x.sAssignFormula, variables); + key = parseFloat(evaluateFormula(x.sAssignFormula, variables)).toFixed(2) || 0; } else { key = slaveRowData[x.sName]; } @@ -176,7 +176,7 @@ const Typesetting = props => { }); } - const result = boxList.reduce((acc, { sCode, value }) => ({ ...acc, [sCode]: value }), {}); + const result = boxList?.reduce((acc, { sCode, value }) => ({ ...acc, [sCode]: value }), {}); // 计算表达式结果 const variabless = { @@ -187,26 +187,6 @@ const Typesetting = props => { ...props.slaveRowData, ...result, }; - const evaluateFormulas = (formula, variables) => { - if (!formula) return ""; // 如果公式为空，返回空字符串 - - 提; //取公式中的变量名 - const variableNames = formula.match(/\b[a-zA-Z_][a-zA-Z0-9_]*\b/g) || []; - - // 替换公式中的变量为实际值 - let modifiedFormula = formula; - variableNames.forEach(name => { - if (variables[name] !== undefined) { - modifiedFormula = modifiedFormula.replace(new RegExp(`\\b${name}\\b`, "g"), variables[name]); - } - }); - - return modifiedFormula; - }; - // const s = `((dYXCW + D) >= dSFHS) && ((dYXCW + D) >= dZSCW) - // ? (dSFHS >= dZSCW ? -(dYXCW + D - dSFHS) * 2 : -((dYXCW + D) - dZSCW)) * 2 - // : dSFHS >= dZSCW ? (dYXCW + D >= dZSCW) ? -(dSFHS - (dYXCW + D)) * 2 : -(dSFHS - dZXCW) * 2 : (dYXCW + D >= dSFHS) ? -(dZSCW - (dYXCW + D)) * 2 : -(dZXCW - dSFHS) * 2` - // const ddd = evaluateFormula(s, variabless); let DisableMateriallIcon = L ? sPackDetailPath : null; // 盒子展长展开公式计算 const innerWidth = slaveRowData.sTypes === "6" ? evaluateFormula(sWidthFormula, variabless) : evaluateFormula(sLengthFormula, variabless); @@ -220,15 +200,16 @@ const Typesetting = props => { const boxWidthOffset = evaluateFormula(sSecondLongitudinalOffset, variabless); // 第二列纵向偏移 const isVertical = sSettingMethod === "从上到下"; // true 表示竖向排列，false 表示横向排列 sSettingMethod === '从上到下' const reference = sSGroupOffset === "首盒"; // 第三列参考 - + console.log(innerWidth,innerHeight,dFWidthOffset,dFLengthOffset,dSWidthOffset,dSLengthOffset,boxLengthOffset,boxWidthOffset,'typeSetting'); + // 计算内层盒子尺寸 加上间距 - let jInnerHeight = innerHeight + dXBJJ * 2; - let jInnerWidth = innerWidth + dYBJJ * 2; + let jInnerHeight = innerHeight; + let jInnerWidth = innerWidth; let dSvgBoxWidth = innerWidth; let dSvgBoxHeight = innerHeight; if (iFAngle === 90 || iFAngle === 270 || iSAngle === 90 || iSAngle === 270) { - jInnerHeight = innerWidth + dYBJJ + dYBJJ; - jInnerWidth = innerHeight + dXBJJ + dXBJJ; + jInnerHeight = innerWidth; + jInnerWidth = innerHeight; // dSvgBoxHeight = jInnerHeight; // dSvgBoxWidth = jInnerWidth; } @@ -301,11 +282,6 @@ const Typesetting = props => { } } } - - // 抵扣盒默认展示 svg - // const isSvg = props.slaveRowData.sName === "扣抵盒"; - // 组装svg数据 - const svgProps = { ...props, boxList, @@ -340,7 +316,7 @@ const Typesetting = props => { ); - + const createBox = (col, row, index, leftPosition, topPosition, offsetZ, icon) => (
{ justifyContent: "center", alignItems: "center", position: "absolute", - left: `${dFLengthOffset + dYBJJ}px`, - top: `${iFAngle === 90 || iFAngle === 270 ? dFLengthOffset : dFWidthOffset + dXBJJ}px`, + left: `${dFLengthOffset}px`, + top: `${iFAngle === 90 || iFAngle === 270 ? dFLengthOffset : dFWidthOffset}px`, }} >
- {!sSvgPath ? : } + {!sSvgPath ? ( + + ) : ( + + )}
+ {/* 次盒 */}
{ justifyContent: "center", alignItems: "center", position: "absolute", - left: `${isVertical ? dSLengthOffset :iSAngle === 90 || iSAngle === 270 ? innerHeight + dFLengthOffset + dSLengthOffset + dYBJJ * 2: innerWidth + dFLengthOffset + dSLengthOffset + dYBJJ * 2}px`, - top: `${ - isVertical ? jInnerHeight + dXBJJ + dFWidthOffset + dSWidthOffset : iSAngle === 90 || iSAngle === 270 ? dSWidthOffset : dSWidthOffset + dXBJJ + left: `${ + isVertical ? dSLengthOffset : iSAngle === 90 || iSAngle === 270 + ? innerHeight + dFLengthOffset + dSLengthOffset + dYBJJ + : innerWidth + dFLengthOffset + dSLengthOffset + dYBJJ }px`, + top: `${isVertical ? jInnerHeight + dFWidthOffset + dSWidthOffset + dXBJJ: iSAngle === 90 || iSAngle === 270 ? dSWidthOffset : dSWidthOffset}px`, }} >
- {!sSvgPath ? : } + {!sSvgPath ? ( + + ) : ( + + )}
@@ -426,8 +421,8 @@ const Typesetting = props => { justifyContent: "center", alignItems: "center", position: "absolute", - left: `${dFLengthOffset + dYBJJ}px`, - top: `${dFWidthOffset + dXBJJ}px`, + left: `${dFLengthOffset}px`, + top: `${dFWidthOffset}px`, }} > {/* */} @@ -486,14 +481,13 @@ const Typesetting = props => { }, [radioValue, slaveRowData, masterData, selectedNode, slaveData]); // 生成里层 div 的数组 const innerDivs = []; - - console.log(cols,rows,'cols'); - + console.log("🚀 ~ typeSetting:",cols, rows,dZBLB,dSBLB) + for (let col = 0; col < cols; col++) { for (let row = 0; row < rows; row++) { - const leftPosition = col * innerWidthCombined; - const topPosition = row * innerHeightCombined; - innerDivs.push(createBox(col, row, 1, leftPosition + dZBLB, topPosition + dSBLB, iFAngle, DisableMateriallIcon)); + const leftPosition = col * (innerWidthCombined + dYBJJ); + const topPosition = row * (innerHeightCombined + dXBJJ); + innerDivs.push(createBox(col, row, 1, leftPosition, topPosition, iFAngle, DisableMateriallIcon)); } // 如果可以放下首盒 if (remaining) { @@ -506,10 +500,10 @@ const Typesetting = props => { leftPosition = col * innerWidthCombined; topPosition = rows * innerHeightCombined; } else { - leftPosition = col * innerWidthCombined; - topPosition = rows * innerHeightCombined; + leftPosition = col * (innerWidthCombined + dYBJJ); ; + topPosition = rows *( innerHeightCombined + dXBJJ); } - innerDivs.push(createBoxOne(col, rows, 3, leftPosition + dZBLB, topPosition + dSBLB, iFAngle, DisableMateriallIcon)); + innerDivs.push(createBoxOne(col, rows, 3, leftPosition, topPosition, iFAngle, DisableMateriallIcon)); } else { for (let index = 0; index < rows; index++) { // 先默认为首盒参考 @@ -522,7 +516,7 @@ const Typesetting = props => { topPosition = index * (innerHeightCombined + boxWidthOffset + dSWidthOffset); leftPosition = cols * (innerWidthCombined + boxLengthOffset + dSLengthOffset); } - innerDivs.push(createDiv(col, index, 3, leftPosition + dZBLB, topPosition + dSBLB, iFAngle, DisableMateriallIcon)); + innerDivs.push(createDiv(col, index, 3, leftPosition + (col * dYBJJ), topPosition + (index * dXBJJ), iFAngle, DisableMateriallIcon)); } } } @@ -533,20 +527,19 @@ const Typesetting = props => { if (maxLength > innerWidth) { let leftPosition = 0; let topPosition = 0; - - innerDivs.push(createBoxOne(0, rows, 3, leftPosition + dZBLB, topPosition + dSBLB, iFAngle, DisableMateriallIcon)); + innerDivs.push(createBoxOne(0, rows, 3, leftPosition , topPosition , iFAngle, DisableMateriallIcon)); } } - // 如果第一列 + // 如果第一列 if (rows === 0) { - const maxWidth = Number(slaveDataDetail?.dMaxWidth) + const maxWidth = Number(slaveDataDetail?.dMaxWidth); if (maxWidth > innerHeight) { - let leftPosition = 0; + let leftPosition = 0; let topPosition = 0; - innerDivs.push(createBoxOne(cols, 0, 3, leftPosition + dZBLB, topPosition + dSBLB, iFAngle, DisableMateriallIcon)); + innerDivs.push(createBoxOne(cols, 0, 3, leftPosition , topPosition, iFAngle, DisableMateriallIcon)); } } - console.log(cols, '列数', rows, '行数'); + // 判断展开长展开宽是否变化 if (dPartsLength !== innerWidth && !innerDivs.length) { setDPartsLength(innerWidth); @@ -562,11 +555,11 @@ const Typesetting = props => { const propsDataHeight = Number(propsData.props.style.height.slice(0, -2)); const propsDataTop = Number(propsData.props.style.top.slice(0, -2)); // 判断列是否是单独的 - const newMaterialLength = propsDataLeft + (remaining ? jInnerWidth : innerWidthCombined) - dYBJJ; // 原纸长 - const newMaterialWidth = propsDataTop + propsDataHeight - dSBLB; + const newMaterialLength = parseFloat(propsDataLeft + (remaining ? jInnerWidth : innerWidthCombined) + dSBLB + dXBLB).toFixed(2); // 原纸长 + const newMaterialWidth = parseFloat(propsDataTop + propsDataHeight + dZBLB + dYBLB).toFixed(2); // 计算开数 - const dSinglePQty = isVertical + let dSinglePQty = isVertical ? remaining ? cols + cols * (rows * 2) : cols * (rows * 2) @@ -574,6 +567,10 @@ const Typesetting = props => { ? rows + rows * (cols * 2) : rows * (cols * 2); // 计算竖版数量 + if ((cols === 1 && rows === 0 )|| (cols === 0 && rows === 1 )) { + dSinglePQty = 1 + } + const dHorizontalType = isVertical ? cols : remaining ? cols * 2 + 1 : cols * 2; const dPortraitType = isVertical ? (remaining ? rows * 2 + 1 : rows * 2) : remaining ? rows : rows; @@ -643,15 +640,15 @@ const Typesetting = props => { setTimeout(() => { if (typesettingBox.current) { typesettingBox.current.style.backgroundColor = "#b7e0ff"; - typesettingBox.current.style.marginTop = dSBLB + "px"; - typesettingBox.current.style.marginLeft = dZBLB + "px"; + // typesettingBox.current.style.margin = [dSBLB, dYBLB, dXBLB, dZBLB].map(item => item + "px").join(" "); typesettingBox.current.style.width = newMaterialLength + dYBLB + "px"; typesettingBox.current.style.height = newMaterialWidth + dXBLB + "px"; + // typesettingBox.current.style.top = dSBLB + "px"; + // typesettingBox.current.style.left = dZBLB + "px"; } if (typesettingBoxs.current) { - typesettingBoxs.current.style.backgroundColor = "#b7e0ff"; - typesettingBoxs.current.style.marginTop = dSBLB + "px"; - typesettingBoxs.current.style.marginLeft = dZBLB + "px"; + typesettingBoxs.current.style.backgroundColor = "#b7e0ff"; + // typesettingBox.current.style.margin = [dSBLB, dYBLB, dXBLB, dZBLB].map(item => item + "px").join(" "); typesettingBoxs.current.style.width = newMaterialLength + dYBLB + "px"; typesettingBoxs.current.style.height = newMaterialWidth + dXBLB + "px"; } @@ -673,11 +670,11 @@ const Typesetting = props => { isShow, "isMax" ); - const confirmParam = commonFunc.showLocalMessage(props, 'confirmParam', '排版尺寸大于上机尺寸，请确认参数!'); + const confirmParam = commonFunc.showLocalMessage(props, "confirmParam", "排版尺寸大于上机尺寸，请确认参数!"); if (isCustomized && !isShow) { if (isMobile) return; - message.error( confirmParam); + message.error(confirmParam); } const onClick = () => { if (isMobile) return; @@ -716,11 +713,13 @@ const Typesetting = props => { right: 0, zIndex: 10, maxHeight: `${clientHeight}`, - padding: `${dSBLB}px ${dYBLB}px ${dXBLB}px ${dZBLB}px`, + // padding: `${dSBLB}px ${dYBLB}px ${dXBLB}px ${dZBLB}px`, }} >
- {boxList.length ? innerDivs : []} +
+ {boxList.length ? innerDivs : []} +
{ transformOrigin: "top left", }} > - {materialLength} + {materialLength}
{ wordBreak: "break-all", // 确保长单词换行 }} > - {confirmParam} + {confirmParam}
)} @@ -1037,7 +1036,9 @@ const Typesetting = props => { }} >
- {boxList.length ? innerDivs : []} +
+ {boxList.length ? innerDivs : []} +
{ color: "#333", }} > - {materialLength} + {materialLength}
{ color: "#333", }} > - {materialWidth} + {materialWidth}
{ height: `${materialWidth * 0.3}px`, position: "absolute", right: "10px", - top: `${materialWidth / 2 - dSBLB + 8}px`, + top: `${materialWidth / 2 + 8}px`, width: "2px", backgroundColor: "#333", }} @@ -1146,7 +1147,7 @@ const Typesetting = props => { width: "30px", backgroundColor: "#333", position: "absolute", - top: `${materialWidth / 2 - dSBLB}px`, + top: `${materialWidth / 2 }px`, right: "-4.5px", }} /> diff --git a/src/components/QuickQuote/index.jsx b/src/components/QuickQuote/index.jsx index 18e4509..d2f6f38 100644 --- a/src/components/QuickQuote/index.jsx +++ b/src/components/QuickQuote/index.jsx @@ -215,6 +215,7 @@ const QuickQuoteEvent = props => { upAbleConfigsExtra: sColumnNameConfig, }; } else { + if(!slaveData[0]) return const sColumnNameConfig = commonUtils.convertStrToObj(slaveData[0].sColumnNameConfig, []).map(item => ({ ...item, iColValue: item.iColValue || 6, @@ -2004,7 +2005,7 @@ const BoxComponent = props => { slaveNewData.forEach(x => { let key = 0; if (x.sAssignFormula) { - key = evaluateFormula(x.sAssignFormula, variables); + key = parseFloat(evaluateFormula(x.sAssignFormula, variables)).toFixed(2); slaveRowData[x.sName] = key; } else { key = slaveRowData[x.sName]; -- libgit2 0.22.2