同步盒型设计

陈鑫涛
1 parent ba58beaa
Showing 4 changed files with 276 additions and 364 deletions
src/components/Common/BoxDesign/createAirplaneBox.js
src/components/Common/BoxDesignCompontent/index.js
src/components/Common/BoxDesignCompontent/svg.js
src/components/QuickQuote/index.jsx
@@ -107,7 +107,7 @@ export const createPathElements = (x, y, width, height, id, wrapperId) =&gt; {
   return svg;
 };
 export const createPathElementTrapezoid = (x, y, width, height) => {
-  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} `;
+  const d = `M ${x + width * 0.2} ${y} L ${x} ${y + height} L ${x + width} ${y + height} L ${x + width * 0.8} ${y} L ${x + width * 0.2} ${y} `;
   const svg = document.createElementNS("http://www.w3.org/2000/svg", "path");
   svg.setAttribute("d", d);
   svg.setAttribute("fill", "transparent");
@@ -126,6 +126,16 @@ export const createPathElementTrapezoids = (x, y, width, height) =&gt; {
   // svg.setAttribute("stroke-dasharray", "4"); // 添加虚线效果
   return svg;
 };
+export const createPathElementTrapezoidBottom = (x, y, width, height) => {
+  const d = `M ${x } ${y} L ${x + width * 0.1} ${y + height} L ${x + width * 0.9} ${y + height} L ${x + width} ${y} L ${x } ${y}`;
+  const svg = document.createElementNS("http://www.w3.org/2000/svg", "path");
+  svg.setAttribute("d", d);
+  svg.setAttribute("fill", "transparent");
+  svg.setAttribute("stroke", "#7588B9");
+  svg.setAttribute("stroke-width", "1");
+  // svg.setAttribute("stroke-dasharray", "4"); // 添加虚线效果
+  return svg;
+};
 export const createPathElementTrapezoidRight = (x, y, width, height) => {
   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}`;
   const svg = document.createElementNS("http://www.w3.org/2000/svg", "path");
@@ -136,6 +146,7 @@ export const createPathElementTrapezoidRight = (x, y, width, height) =&gt; {
   // svg.setAttribute("stroke-dasharray", "4"); // 添加虚线效果
   return svg;
 };
+
 //
 // 左边斜线贴边
 export const createTrapezoid = (height, offsetX, offsetY, size) => {
 /* eslint-disable */
 import React, { useRef, useState, useEffect } from "react";
-import { Select, Button, message, Input, Spin } from "antd-v4";
+import { Select, Button, message, Input, Spin } from "antd";
 import { CompressOutlined, ExpandOutlined } from "@ant-design/icons";
 import * as commonUtils from "@/utils/utils";
 import * as commonFunc from "@/components/Common/commonFunc";
@@ -65,7 +65,6 @@ const BoxDesignEvent = props =&gt; {
         }
         return 0; // 其他元素保持原顺序
       });
-      console.log(data.data.dataset.rows, "data.data.dataset.rows");
  
       setOptions(data.data.dataset.rows);
     }
@@ -108,8 +107,6 @@ const BoxDesignCompontent = baseProps =&gt; {
   const [boxKey, setBoxKey] = useState(new Date().getTime());
   const [doubleLayerList, setDoubleLayerList] = useState([]);
   if (!boxVisible) return "";
-  console.log(baseProps, "baseProps");
-
   // 1️⃣ 只负责 tableColum
   useEffect(() => {
     if (!tableData?.length) return;
@@ -284,18 +281,18 @@ const BoxDesignCompontent = baseProps =&gt; {
             sName: titleList1[i].name,
             sAssignFormula: item.sAssignFormula,
             bVisible: item.bVisible,
-            sLength: item.sLength,
-            sWidth: item.sWidth,
-            sType: item.sType,
-            sTypeName: item.sTypeName,
-            sOffset: item.sOffset,
-            sQuantity: item.sQuantity,
-            cLength: item.cLength,
-            cWidth: item.cWidth,
-            cType: item.cType,
-            cTypeName: item.cTypeName,
-            cOffset: item.cOffset,
-            cQuantity: item.cQuantity,
+            sLength: item.iSLength,
+            sWidth: item.iSWidth,
+            sType: item.iSType,
+            sTypeName: item.iSType !== null ? (Number(item.iSType) === 0 ? "矩形" : Number(item.iSType) === 1 ? "梯形" : null) : null,
+            sOffset: item.sSOffset,
+            sQuantity: item.iSQuantity,
+            cLength: item.iCLength,
+            cWidth: item.iCWidth,
+            cType: item.iCType,
+            cTypeName: item.iCType !== null ? (Number(item.iCType) === 0 ? "矩形" : Number(item.iCType) === 1 ? "梯形" : null) : null,
+            cOffset: item.sCOffset,
+            cQuantity: item.iCQuantity,
           });
         }
       });
@@ -534,12 +531,24 @@ const BoxDesignCompontent = baseProps =&gt; {
     }
     setBoxList(updatedBoxList);
   };
-  const getImage = fileName => {
-    // const imageUrl = `${commonConfig.file_host}file/download?savePathStr=${fileName}&sModelsId=100&token=${props.token}`;
-    const imageUrl = `${commonConfig.file_host}file/download?savePathStr=${fileName}&scale=0.1&sModelsId=100&token=${props.token}`;
-    return imageUrl;
+  // const getImage = fileName => {
+  //   // const imageUrl = `${commonConfig.file_host}file/download?savePathStr=${fileName}&sModelsId=100&token=${props.token}`;
+  //   const imageUrl = `${commonConfig.file_host}file/download?savePathStr=${fileName}&scale=0.1&sModelsId=100&token=${props.token}`;
+  //   return imageUrl;
+  // };
+  const removeExtension = filename => {
+    const lastDotIndex = filename.lastIndexOf(".");
+    if (lastDotIndex === -1) {
+      // 如果字符串中没有点，则返回原字符串
+      return filename;
+    }
+    return filename.substring(0, lastDotIndex);
+  };
+  const getImage = sName => {
+    const fileName = removeExtension(sName);
+    const imageUrlNew = `${commonConfig.server_host}file/downloadPrice?sLogoName=${fileName}&date=${new Date().getTime()}`;
+    return imageUrlNew;
   };
-
   // 下来框
   const renderOptionWithImage = option => {
     return (
@@ -581,6 +590,16 @@ const BoxDesignCompontent = baseProps =&gt; {
     // 存储子表数据
     const boxTypes = boxList.find(item => item.sName === "盒身")?.type;
     const findList = boxTypes === "8" ? doubleTitlieList1 : titleList1;
+    // boxList.forEach(item=>{
+    //   if (item.type && item.type.includes('09')) {
+    //     if (item.sName === "左贴边位" || item.sName === "右贴边位" ) {
+    //       item.value = (item.sLength ? Number(item.sLength) : 0) + (item.cLength ? Number(item.cLength) : 0)
+    //     } else {
+    //       item.value = (item.sLength ? Number(item.sWidth) : 0 )+ (item.cLength ? Number(item.cWidth) : 0)
+    //     }
+
+    //   }
+    // })
     boxList.forEach((item, index) => {
       const i = findList.findIndex(i => i.name === item.sName);
       const slave = slaveData.find(z => z.sCode === findList[i]?.value);
@@ -599,18 +618,18 @@ const BoxDesignCompontent = baseProps =&gt; {
           bVisible: item.value ? true : false,
           sParentId: masterData.sId,
           sAssignFormula: item.sAssignFormula,
-          sLength: item.sLength,
-          sWidth: item.sWidth,
-          sType: item.sType,
-          sTypeName: Number(item.sType) === 0 ? "矩形" : "梯形",
-          sOffset: item.sOffset,
-          sQuantity: item.sQuantity,
-          cLength: item.cLength,
-          cWidth: item.cWidth,
-          cType: item.cType,
-          cTypeName: item.cTypeName,
-          cOffset: item.cOffset,
-          cQuantity: item.cQuantity,
+          iSLength: item.sLength === undefined ? 0 : item.sLength,
+          iSWidth: item.sWidth === undefined ? 0 : item.sWidth,
+          iSType: item.sType === undefined ? 0 : item.sType,
+          iSTypeName: item.sType !== null ? (Number(item.sType) === 0 ? "矩形" : Number(item.sType) === 1 ? "梯形" : null) : null,
+          sSOffset: item.sOffset === undefined ? 0 : item.sOffset,
+          iSQuantity: item.sQuantity === undefined ? 0 : item.sQuantity,
+          iCLength: item.cLength === undefined ? 0 : item.cLength,
+          iCWidth: item.cWidth === undefined ? 0 : item.cWidth,
+          iCType: item.cType === undefined ? 0 : item.cType,
+          iCTypeName: item.cType !== null ? (Number(item.cType) === 0 ? "矩形" : Number(item.cType) === 1 ? "梯形" : null) : null,
+          sCOffset: item.cOffset === undefined ? 0 : item.cOffset,
+          iCQuantity: item.cQuantity === undefined ? 0 : item.cQuantity,
         };
         // if (item.value !== "") {
         newSlaveData.push(data);
@@ -1036,7 +1055,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                 <Select
                   optionLabelProp="label"
                   className="mySelects"
-                  style={{ width: 180 }}
+                  style={{ width: 180, height: 40 }}
                   defaultValue={options.length ? options[0].value : ""}
                   onSelect={(value, option) => handleSelect(value, option, index, 0)}
                   onDropdownVisibleChange={async open => {
@@ -1076,7 +1095,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                       <Select
                         optionLabelProp="label"
                         className="mySelectsDouble"
-                        style={{ width: 180, color: "#000" }}
+                        style={{ width: 180, color: "#000", height: 40 }}
                         defaultValue={options.length ? options[0].value : ""}
                         value={topItem?.sTypeName || ""}
                         onSelect={(value, option) => handleSelects(value, option, findIndexBySname(topItem.sName), 0, 0)}
@@ -1134,7 +1153,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                       <Select
                         optionLabelProp="label"
                         className="mySelectsDouble"
-                        style={{ width: 180, color: "#000" }}
+                        style={{ width: 180, color: "#000", height: 40 }}
                         defaultValue={options.length ? options[0].value : ""}
                         value={topItem?.cTypeName || ""}
                         onSelect={(value, option) => handleSelects(value, option, findIndexBySname(topItem.sName), 0, 1)}
@@ -1206,7 +1225,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                 <Select
                   optionLabelProp="label"
                   className="mySelects"
-                  style={{ width: 180 }}
+                  style={{ width: 180, height: 40 }}
                   defaultValue={options.length ? options[0].value : ""}
                   onSelect={(value, option) => handleSelect(value, option, findIndexBySname(item.sName), 0)}
                   onDropdownVisibleChange={async open => {
@@ -1247,7 +1266,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                 <Select
                   optionLabelProp="label"
                   className="mySelects"
-                  style={{ width: 180 }}
+                  style={{ width: 180, height: 40 }}
                   defaultValue={options.length ? options[0].value : ""}
                   onSelect={(value, option) => handleSelect(value, option, findIndexBySname(item.sName), 0)}
                   onDropdownVisibleChange={async open => {
@@ -1305,7 +1324,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                         <Select
                           optionLabelProp="label"
                           className="mySelectsDouble"
-                          style={{ width: 180, color: "#000" }}
+                          style={{ width: 180, color: "#000", height: 40 }}
                           defaultValue={options.length ? options[0].value : ""}
                           value={item?.sTypeName || ""}
                           onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 0)}
@@ -1363,7 +1382,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                         <Select
                           optionLabelProp="label"
                           className="mySelectsDouble"
-                          style={{ width: 180, color: "#000" }}
+                          style={{ width: 180, color: "#000", height: 40 }}
                           defaultValue={options.length ? options[0].value : ""}
                           value={item?.cTypeName || ""}
                           onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 1)}
@@ -1427,7 +1446,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                   <Select
                     optionLabelProp="label"
                     className="mySelects"
-                    style={{ width: 180 }}
+                    style={{ width: 180, height: 40 }}
                     defaultValue={options.length ? options[0].value : ""}
                     onSelect={(value, option) => handleSelect(value, option, findIndexBySname(item.sName), 0)}
                     onDropdownVisibleChange={async open => {
@@ -1488,7 +1507,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                 <Select
                   optionLabelProp="label"
                   className="mySelects"
-                  style={{ width: 180 }}
+                  style={{ width: 180, height: 40 }}
                   defaultValue={options.length ? options[0].value : ""}
                   onSelect={(value, option) => handleSelect(value, option, findIndexBySname(item.sName), 0)}
                   onDropdownVisibleChange={async open => {
@@ -1499,164 +1518,6 @@ const BoxDesignCompontent = baseProps =&gt; {
                 >
                   {!loading ? options.map(option => renderOptionWithImage(option)) : ""}
                 </Select>
-
-                {/* {item?.type && item?.type.includes("09") ? (
-                  <div className={styles.boxInput}>
-                    <div className={styles.boxInput}>
-                      <div className={styles.text} style={{ width: " 100%" }}>
-                        层1{" "}
-                      </div>
-                      <Input
-                        value={item?.sLength}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "sLength")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="长"
-                      />
-                      <Input
-                        value={item?.sWidth}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "sWidth")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="宽"
-                      />
-                    </div>
-                    <div className={styles.boxInput}>
-                      <Select
-                        optionLabelProp="label"
-                        className="mySelectsDouble"
-                        style={{ width: 180, color: "#000" }}
-                        defaultValue={options.length ? options[0].value : ""}
-                        value={item?.sTypeName || ""}
-                        onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 0)}
-                        onDropdownVisibleChange={async open => {
-                          if (open) {
-                            props.getSqlOptions(null); // 在下拉菜单打开时调用 getSqlOptions
-                          }
-                        }}
-                      >
-                        {!loading ? options.map(option => renderOptionWithText(option)) : ""}
-                      </Select>
-                      <Input
-                        value={item?.sQuantity}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "sQuantity")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="个数"
-                      />
-                      <Input
-                        value={item?.sOffset}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "sOffset")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="偏移"
-                      />
-                    </div>
-                    <div className={styles.boxInput}>
-                      <div className={styles.text} style={{ width: " 100%" }}>
-                        层2{" "}
-                      </div>
-                      <Input
-                        value={item?.cLength}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "cLength")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="长"
-                      />
-                      <Input
-                        value={item?.cWidth}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "cWidth")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="宽"
-                      />
-                    </div>
-                    <div className={styles.boxInput}>
-                      <Select
-                        optionLabelProp="label"
-                        className="mySelectsDouble"
-                        style={{ width: 180, color: "#000" }}
-                        defaultValue={options.length ? options[0].value : ""}
-                        value={item?.cTypeName || ""}
-                        onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 1)}
-                        onDropdownVisibleChange={async open => {
-                          if (open) {
-                            props.getSqlOptions(null); // 在下拉菜单打开时调用 getSqlOptions
-                          }
-                        }}
-                      >
-                        {!loading ? options.map(option => renderOptionWithText(option)) : ""}
-                      </Select>
-                      <Input
-                        value={item?.cQuantity}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "cQuantity")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="个数"
-                      />
-                      <Input
-                        value={item?.cOffset}
-                        onChange={e => handleChange(e, findIndexBySname(item.sName), "cOffset")}
-                        onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                        onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                        readOnly={!item?.isEditable}
-                        style={{ width: " 80%" }}
-                        placeholder="偏移"
-                      />
-                    </div>
-                  </div>
-                ) : (
-                  <div className={styles.boxInput}>
-                    {item?.selectImage ? (
-                      <img
-                        src={item?.selectImage}
-                        alt={item.value}
-                        style={{
-                          width: 40,
-                          height: 30,
-                          marginRight: 8,
-                          position: "absolute",
-                          left: 20,
-                          top: -35,
-                          zIndex: 10,
-                        }}
-                      />
-                    ) : (
-                      ""
-                    )}
-
-                    <Input
-                      value={item?.showName}
-                      onChange={e => handleChangeName(e, findIndexBySname(item.sName))}
-                      onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                      onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                      readOnly={!item?.isEditable}
-                      className={styles.text}
-                    />
-                    <Input
-                      value={item?.value}
-                      onChange={e => handleChange(e, findIndexBySname(item.sName))}
-                      onFocus={e => handleFocus(e, findIndexBySname(item.sName))}
-                      onBlur={e => handleBlur(e, findIndexBySname(item.sName))}
-                      readOnly={!item?.isEditable}
-                      style={{ width: " 80%" }}
-                    />
-                  </div>
-                )} */}
                 <div className={styles.boxInput}>
                   {item?.selectImage ? (
                     <img
@@ -1704,7 +1565,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                         <Select
                           optionLabelProp="label"
                           className="mySelectsDouble"
-                          style={{ width: 180, color: "#000" }}
+                          style={{ width: 180, color: "#000", height: 40 }}
                           defaultValue={options.length ? options[0].value : ""}
                           value={item?.sTypeName || ""}
                           onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 0)}
@@ -1762,7 +1623,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                         <Select
                           optionLabelProp="label"
                           className="mySelectsDouble"
-                          style={{ width: 180, color: "#000" }}
+                          style={{ width: 180, color: "#000", height: 40 }}
                           defaultValue={options.length ? options[0].value : ""}
                           value={item?.cTypeName || ""}
                           onSelect={(value, option) => handleSelects(value, option, findIndexBySname(item.sName), 0, 1)}
@@ -1826,7 +1687,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                   <Select
                     optionLabelProp="label"
                     className="mySelects"
-                    style={{ width: 180 }}
+                    style={{ width: 180, height: 40 }}
                     defaultValue={options.length ? options[0].value : ""}
                     onSelect={(value, option) => handleSelect(value, option, findIndexBySname(item.sName), 0)}
                     onDropdownVisibleChange={async open => {
@@ -1929,7 +1790,7 @@ const BoxDesignCompontent = baseProps =&gt; {
                         <Select
                           optionLabelProp="label"
                           className="mySelects"
-                          style={{ width: "80%" }}
+                          style={{ width: "80%", height: 40 }}
                           defaultValue={boxList[uniqueIndex]?.value}
                           onSelect={(value, option) => handleSelect(value, option, uniqueIndex, 1)}
                           onDropdownVisibleChange={async open => {
@@ -52,6 +52,7 @@ import {
   createPathElementTrapezoid,
   createPathElementTrapezoids,
   createPathElementTrapezoidRight,
+  createPathElementTrapezoidBottom,
 } from "../BoxDesign/createAirplaneBox";
 const SvgBox = props => {
   const svgContainerRef = useRef(null);
@@ -140,13 +141,17 @@ const SvgBox = props =&gt; {
     }
  
     let viewBoxHeight = Number(boxHeight) + max;
+    const doubleTotal = 0
+    // const doubleTotal =
+    //     (zbtb?.type === "8009" ? Number(zbtb.sLength !== undefined ? zbtb.sLength : 0) + Number(zbtb.cLength !== undefined ? zbtb.cLength : 0) : 0) +
+    //     (ybtb?.type === "9009" ? Number(ybtb.sLength !== undefined ? ybtb.sLength : 0) + Number(ybtb.cLength !== undefined ? ybtb.cLength : 0) : 0);
     if (Number(svgType) === 1) {
       // 四面盒身
-      viewBoxWidth = Number(boxLength) * 2 + Number(boxWidth) * 2 + dZTBW + dYTBW;
+      viewBoxWidth = Number(boxLength) * 2 + Number(boxWidth) * 2 + dZTBW + dYTBW + doubleTotal;
     } else if (Number(svgType) === 2) {
-      viewBoxWidth = boxLength * 2 + boxWidth + dYTBW + dZTBW;
+      viewBoxWidth = boxLength * 2 + boxWidth + dYTBW + dZTBW + doubleTotal
     } else if (Number(svgType) === 3) {
-      viewBoxWidth = boxLength + boxWidth * 2 + dYTBW + dZTBW;
+      viewBoxWidth = boxLength + boxWidth * 2 + dYTBW + dZTBW + doubleTotal
     } else if (Number(svgType) === 4) {
       // 天地盒
  
@@ -213,7 +218,7 @@ const SvgBox = props =&gt; {
       viewBoxWidth = Number(boxLength) + leftValue + rightValue;
       viewBoxHeight = Number(boxWidth) + topValue + bottomValue;
     } else if (Number(svgType) === 5) {
-      viewBoxWidth = (boxHeight + boxWidth) * 2 + dYTBW + dZTBW;
+      viewBoxWidth = (boxHeight + boxWidth) * 2 + dYTBW + dZTBW +doubleTotal
       viewBoxHeight = boxLength + max;
     } else if (Number(svgType) === 6) {
       viewBoxWidth = boxWidth + 2;
@@ -387,14 +392,16 @@ const SvgBox = props =&gt; {
           const bottomLength = headLength / 2 - orderLength + -bottomLeft - Number(leftOffect);
           xSvg = Math.max(Math.abs(bottomLength), Math.abs(topLength));
         } else if (Number(svgType) === 4) {
-          xSvg = 100 * scale;
+           xSvg = (scaledDeep * 2 + scaledWidth) / 2;
         } else {
           xSvg = zbtb?.value;
         }
+        if (zbtb?.type === "8009") {
+          xSvg = doubleTotal * scale;
+        }
         svg.setAttribute(
           "viewBox",
-          `${-(xSvg * scale)} ${dSvgBoxWidth ? (dSvgBoxWidth === 100 ? -ySvg : 0) : -ySvg} ${dSvgBoxWidth ? dSvgBoxWidth + ySvg : 500} ${
-            dSvgBoxHeight ? dSvgBoxHeight - ySvg - bottom * scale : 250 + ySvg
+          `${-(xSvg * scale)} ${dSvgBoxWidth ? (dSvgBoxWidth === 100 ? -ySvg : 0) : -ySvg} ${dSvgBoxWidth ? dSvgBoxWidth + ySvg : 500} ${dSvgBoxHeight ? dSvgBoxHeight - ySvg - bottom * scale : 250 + ySvg
           }`
         );
         svg.setAttribute("width", `${dSvgBoxWidth ? dSvgBoxWidth : 500}px`);
@@ -454,12 +461,13 @@ const SvgBox = props =&gt; {
           const bottomLength = headLength / 2 - orderLength + -bottomLeft - Number(leftOffect);
           xSvg = Math.max(Math.abs(bottomLength), Math.abs(topLength));
         } else if (Number(svgType) === 4) {
-          xSvg = 100;
+          xSvg = (scaledDeep * 2 + scaledWidth) / 2;
         } else {
           xSvg = zbtb?.value;
         }
+
         if (!dSvgBoxWidth) {
-          xSvg = viewBoxWidth / 2 + 100 * scale;
+          xSvg = (viewBoxWidth / 2 + 200) * scale;
         }
         svg.setAttribute(
           "viewBox",
@@ -471,8 +479,6 @@ const SvgBox = props =&gt; {
         svgContainerRef.current.style.height = `${dSvgBoxHeight ? dSvgBoxHeight : 250}px`;
       }
     } else if (props.showNew === 1) {
-      console.log("props.showNew === 1");
-      
       let ySvg = topOffect(boxList, boxLength, boxWidth, boxHeight) * scale;
       let leftSize = 0;
       let topSize = 0;
@@ -544,11 +550,12 @@ const SvgBox = props =&gt; {
         ySvg = topOffect(boxList, headLength, headWidth);
       } else {
         leftSize = zbtb?.value;
-         if (zbtb?.type === "8009") {
-          leftSize = (Number(zbtb?.sLength) + Number(zbtb?.cLength) * scale) || 0;
+        if (zbtb?.type === "8009") {
+          leftSize = (zbtb?.type === "8009" ? Number(zbtb.sLength !== undefined ? zbtb.sLength : 0) + Number(zbtb.cLength !== undefined ? zbtb.cLength : 0) : 0);
         }
       }
  
+
       svg.setAttribute("viewBox", `${-(leftSize * scale) || 0} ${-ySvg} ${viewBoxWidth + 2} ${viewBoxHeight + 2}`);
       svg.setAttribute("width", `${viewBoxWidth}px`);
       svg.setAttribute("height", `${viewBoxHeight}px`);
@@ -828,7 +835,7 @@ const SvgBox = props =&gt; {
             const numOffset = Number(offset) * scale;
  
             // 选择绘制函数
-            const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+            const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
             let rectangles = [];
  
@@ -875,7 +882,7 @@ const SvgBox = props =&gt; {
             const numOffset = Number(offset) * scale;
  
             // 选择绘制函数
-            const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+            const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
             let rectangles = [];
  
@@ -1684,7 +1691,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -2134,7 +2141,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -2233,7 +2240,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -2519,7 +2526,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -2566,7 +2573,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -2833,7 +2840,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -3201,7 +3208,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -3248,7 +3255,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -3652,7 +3659,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -3928,7 +3935,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -3975,7 +3982,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
@@ -4453,7 +4460,7 @@ const SvgBox = props =&gt; {
             const numOffset = Number(offset) * scale;
  
             // 选择绘制函数
-            const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+            const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
             let rectangles = [];
  
@@ -4556,7 +4563,7 @@ const SvgBox = props =&gt; {
             const numOffset = Number(offset) * scale;
  
             // 选择绘制函数
-            const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+            const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
             let rectangles = [];
  
@@ -4797,7 +4804,7 @@ const SvgBox = props =&gt; {
           const numOffset = Number(offset) * scale;
  
           // 选择绘制函数
-          const createFunc = isTrapezoid ? createPathElementTrapezoid : createPathElements;
+          const createFunc = isTrapezoid ? createPathElementTrapezoidBottom : createPathElements;
  
           let rectangles = [];
  
 /* eslint-disable */
 import { useRef, useEffect, useState, useCallback, useMemo } from "react";
-import { Button, Divider, Tabs, Tree, Radio, Image, Modal, Input, message, Badge, Checkbox, Carousel } from "antd-v4";
+import { Button, Divider, Tabs, Tree, Radio, Image, Modal, Input, message, Badge, Checkbox, Carousel } from "antd";
 import { ArrowLeftOutlined, FolderFilled, FolderOpenFilled, FileTextFilled, PlusOutlined, MinusOutlined, UploadOutlined } from "@ant-design/icons";
 import { cloneDeep } from "lodash";
 import commonConfig from "@/utils/config";
@@ -53,21 +53,21 @@ const QuickQuoteEvent = props =&gt; {
     ];
     const slaveDataNew = bInit
       ? slaveData.map(item => {
-          const { materialsInfo = [], sMaterialsName } = item;
-          if (!materialsInfo.length && sMaterialsName) {
-            return {
-              ...item,
-              materialsInfo: [
-                materialInfoFields.reduce((pre, cur) => {
-                  pre[cur] = item[cur];
-                  return pre;
-                }, {}),
-              ],
-            };
-          } else {
-            return item;
-          }
-        })
+        const { materialsInfo = [], sMaterialsName } = item;
+        if (!materialsInfo.length && sMaterialsName) {
+          return {
+            ...item,
+            materialsInfo: [
+              materialInfoFields.reduce((pre, cur) => {
+                pre[cur] = item[cur];
+                return pre;
+              }, {}),
+            ],
+          };
+        } else {
+          return item;
+        }
+      })
       : slaveData;
  
     const manyDataNew = manyData.map(item => {
@@ -317,6 +317,8 @@ const QuickQuoteEvent = props =&gt; {
       const boxModel = name.replace("slaveUp", "").replace("slaveDown", "");
  
       if (sFieldName === "sName") {
+        let upAbleConfigsList = []
+
         if (!changeValue.sName) return;
         const dropDownDataSelected = dropDownData.find(item => item.sName === changeValue.sName);
         const { sColumnNameConfig, sColumnNameConfigExclusion, sColumnNameConfigPic } = dropDownDataSelected;
@@ -327,11 +329,31 @@ const QuickQuoteEvent = props =&gt; {
         const defaultData = commonFunc.getDefaultData({ gdsconfigformslave: upAbleConfigsExtra });
         delete defaultData.sId;
         delete dropDownDataSelected.sId;
+        upAbleConfigsExtra?.forEach(item => {
+          if (item.sTypes && item.sTypes.includes('09')) {
+            const list = ['iSLength', 'iSWidth', 'iCLength', 'iCWidth']
+            const nameList = ['层1长', '层1宽', '层2长', '层2宽']
+            for (let index = 0; index < 4; index++) {
+              upAbleConfigsList.push({
+                ...item,
+                sName: item.sName + list[index],
+                sDefault: item[list[index]],
+                showName: item.showName + nameList[index]
+              })
+            }
+          } else {
+            upAbleConfigsList.push(item)
+          }
+        })
         changeValue = {
           ...changeValue,
           ...defaultData,
           ...dropDownDataSelected,
           upAbleConfigsExtra,
+          ...upAbleConfigsList.reduce((acc, item) => {
+            acc[item.sName] = item.sDefault;
+            return acc;
+          }, {}),
           calcMethodData: commonUtils.convertStrToObj(sColumnNameConfigExclusion, []),
           boxPicData: commonUtils.convertStrToObj(sColumnNameConfigPic, []),
         };
@@ -369,13 +391,13 @@ const QuickQuoteEvent = props =&gt; {
               return !sParamDefault
                 ? ""
                 : {
-                    sId: commonUtils.createSid(),
-                    value: sParamDefault,
-                    sParam: sParam,
-                    [`sParam${iOrder}`]: sParamDefault,
-                    ...(sFieldName ? { [sFieldName]: sParamDefault } : {}),
-                    sParamKey: sFieldName || `sParam${iOrder}`,
-                  };
+                  sId: commonUtils.createSid(),
+                  value: sParamDefault,
+                  sParam: sParam,
+                  [`sParam${iOrder}`]: sParamDefault,
+                  ...(sFieldName ? { [sFieldName]: sParamDefault } : {}),
+                  sParamKey: sFieldName || `sParam${iOrder}`,
+                };
             })
             .filter(item => item !== "");
           dropDownDataSelected.sBackendParams = sBackendParams;
@@ -424,12 +446,12 @@ const QuickQuoteEvent = props =&gt; {
           slaveData[iIndex] = {
             ...(sFieldName === "sName"
               ? {
-                  sId: slaveData[iIndex].sId,
-                  sBoxModel: boxModel,
-                  sTreeNodeName,
-                  ...commonFunc.getDefaultData(slaveConfig, { tree: selectedNode }),
-                  sBackProcessData: slaveData[iIndex].sBackProcessData,
-                }
+                sId: slaveData[iIndex].sId,
+                sBoxModel: boxModel,
+                sTreeNodeName,
+                ...commonFunc.getDefaultData(slaveConfig, { tree: selectedNode }),
+                sBackProcessData: slaveData[iIndex].sBackProcessData,
+              }
               : slaveData[iIndex]),
             ...changeValue,
             handleType: slaveData[iIndex].handleType || "update",
@@ -439,6 +461,8 @@ const QuickQuoteEvent = props =&gt; {
       const saveIndex = slaveData.findIndex(item => item.sTreeNodeName === selectedNode.showName && item.sBoxModel === boxModel);
       const materialStyleLength = slaveData[saveIndex].materialLength || 0;
       const materialStyleWidth = slaveData[saveIndex].materialWidth || 0;
+
+
       slaveData[saveIndex] = {
         ...slaveData[saveIndex],
         sMachineStyle: materialStyleLength + "*" + materialStyleWidth,
@@ -511,13 +535,13 @@ const QuickQuoteEvent = props =&gt; {
             return !sParamDefault
               ? ""
               : {
-                  sId: commonUtils.createSid(),
-                  value: sParamDefault,
-                  sParam: sParam,
-                  [`sParam${iOrder}`]: sParamDefault,
-                  ...(sFieldName ? { [sFieldName]: sParamDefault } : {}),
-                  sParamKey: sFieldName || `sParam${iOrder}`,
-                };
+                sId: commonUtils.createSid(),
+                value: sParamDefault,
+                sParam: sParam,
+                [`sParam${iOrder}`]: sParamDefault,
+                ...(sFieldName ? { [sFieldName]: sParamDefault } : {}),
+                sParamKey: sFieldName || `sParam${iOrder}`,
+              };
           })
           .filter(item => item !== "");
         dropDownDataSelected.sBackendParams = sBackendParams;
@@ -1503,8 +1527,6 @@ const TreeComponent = props =&gt; {
         masterData: { ...props.masterData, sFormId: "101251240115016076506222050" },
       });
     }
-    console.log(selectedNode, "selectedNode");
-
     getDropDownData(props);
   }, [selectedNode.sId, commonUtils.isEmptyObject(slaveConfig)]);
   const { slaveData } = props.state;
@@ -1539,10 +1561,10 @@ const TreeComponent = props =&gt; {
  
 // 内容组件
 const ContentComponent = props => {
-  const { selectedNode = {}, extraParts = {} } = props.state;
+  const { selectedNode = {}, extraParts = {}, slaveData } = props.state;
   const manyqtysInfo = props.getI18nName("manyqtysInfo", "多数量报价");
   const selectProduct = commonFunc.showLocalMessage(props, "selectProduct", "请先选择产品");
-  const { showName ,sAllPartsNameDefault} = selectedNode;
+  const { showName, sAllPartsNameDefault } = selectedNode;
   const extraPartsList = extraParts[showName] || [];
   let { sAllPartsName = "" } = selectedNode;
   let bEmpty = false;
@@ -1585,8 +1607,7 @@ const ContentComponent = props =&gt; {
                     ...itemBox,
                     iOrder: indexBox + 1,
                   }));
-                  if (box) {
-                    // Check if 'box' exists before using it
+                  if (box) { // Check if 'box' exists before using it
                     props.onDataChange("slaveUp" + sPartName, "sName", { sName: box.sName }, box.sId, boxData);
                   }
                 });
@@ -1594,10 +1615,13 @@ const ContentComponent = props =&gt; {
             });
           }
         };
-        getSqlDropDownData({ sId: "17428091410008594700322758474000", sSqlCondition: { sProductClassifyId: selectedNode.sId } });
+        getSqlDropDownData(
+          { sId: '17428091410008594700322758474000', sSqlCondition: { sProductClassifyId: selectedNode.sId } }
+        );
       }
     }
   }, [sAllPartsNameDefaultRef.current, props.state.slaveData]);
+
   const boxModelList = sAllPartsName.split(",");
   const [activeKey, setActiveKey] = useState(0);
  
@@ -1648,7 +1672,7 @@ const ContentComponent = props =&gt; {
           }));
           setActiveKey(boxModelList.length - 1 + extraPartsList.length);
         },
-        onCancel() {},
+        onCancel() { },
       });
     } else {
       extraPartsList.splice(targetKey - boxModelList.length, 1);
@@ -1813,7 +1837,7 @@ const BoxComponent = props =&gt; {
   const { bBox } = selectedNode;
   const [boxTypeList, setBoxTypeList] = useState([]);
   // 卡牌类卷筒类默认使用矩形 当是核价保存过的需要在主表数据加载完后在赋值
-  const slaveRowData = slaveData.find(item => item.sTreeNodeName === selectedNode.showName && item.sBoxModel === boxModel) || {};
+  let slaveRowData = slaveData.find(item => item.sTreeNodeName === selectedNode.showName && item.sBoxModel === boxModel) || {};
   const { sBillNo } = slaveRowData;
   useEffect(() => {
     if (selectedNode.sTypeKey === "kapai" || selectedNode.sTypeKey === "juantong") {
@@ -1840,15 +1864,44 @@ const BoxComponent = props =&gt; {
     ...slaveConfig.gdsconfigformslave.filter(item => item.iTag === 10).filter(item => (bBox ? true : item.sName !== "sName")),
     ...showUpAbleConfigsExtra,
   ];
+  showUpAbleConfigsExtra.forEach(item => {
+    if (item.sTypes && item.sTypes.includes('09')) {
+      if (item.sName === 'dZTBW' || item.sName === 'dYTBW') {
+        slaveRowData[item.sName] = (item.iSLength ? Number(item.iSLength) : 0) + (item.iCLength ? Number(item.iCLength) : 0)
+        item.sDefault = (item.iSLength ? Number(item.iSLength) : 0) + (item.iCLength ? Number(item.iCLength) : 0)
+      } else {
+        slaveRowData[item.sName] = (item.iSWidth ? Number(item.iSWidth) : 0) + (item.iCWidth ? Number(item.iCWidth) : 0)
+        item.sDefault = (item.iSWidth ? Number(item.iSWidth) : 0) + (item.iCWidth ? Number(item.iCWidth) : 0)
+      }
+    }
+  })
+  const upAbleConfigsList = upAbleConfigs
+    .map(item =>
+      item.sTypes?.includes('09')
+        ? ['iSLength', 'iSWidth', 'iCLength', 'iCWidth'].map((key, idx) => ({
+          ...item,
+          sName: item.sName + key,
+          sDefault: item[key],
+          showName: item.showName + ['1长', '1宽', '2长', '2宽'][idx],
+          sId:item.sId + idx
+        }))
+        : [item] // 非 '09' 也要包一层数组，保持结构一致
+    )
+    .flat();   // 把二维数组拍平成一维
+  const type = upAbleConfigs.find(item =>
+    item?.sTypes && item.sTypes.includes('09')
+  );
   const upViewProps = {
     ...props,
-    viewConfigs: upAbleConfigs,
-    tableConfig: { ...slaveConfig, gdsconfigformslave: upAbleConfigs },
+    viewConfigs: upAbleConfigsList,
+    tableConfig: { ...slaveConfig, gdsconfigformslave: upAbleConfigsList },
     iColValueView: 24,
     viewRow: slaveRowData,
     tableName: `slaveUp${boxModel}`,
   };
  
+  console.log(upAbleConfigs,upAbleConfigsList,'upAbleConfigs');
+  
   const getUpViewPropsByITag = iTag => {
     const config = slaveConfig.gdsconfigformslave
       .filter(item => !["sPrint", "sColor", "iPrintModePo"].includes(item.sName))
@@ -2350,7 +2403,6 @@ const BoxComponent = props =&gt; {
       { name: "盒宽", value: slaveRowData.dW ? slaveRowData.dW : masterData.dWidth ? Number(masterData.dWidth) : 0, type: null },
       { name: "盒高", value: masterData.dHeight ? Number(masterData.dHeight) : 0, type: null },
     ];
-    const boxTypes = slaveRowData.sTypes;
     const titleList1 = [
       { name: "上方盒舌", value: "dSFHS" },
       { name: "盒底组件", value: "dHDC" },
@@ -2362,22 +2414,6 @@ const BoxComponent = props =&gt; {
       { name: "右贴边位", value: "dYTBW" },
       { name: "右(下)插位组件", value: "dYXCW" },
     ];
-    const doubleTitlieList1 = [
-      { name: "左上插位组件", value: "dZSCW" },
-      { name: "上插位组件", value: "dSCW" },
-      { name: "右上插位组件", value: "dYSCW" },
-      { name: "左偏移", value: "dZPY" },
-      { name: "左插位组件", value: "dZCW" },
-      { name: "左下插位组件", value: "dZXCW" },
-      { name: "右偏移", value: "dYPY" },
-      { name: "右插位组件", value: "dYCW" },
-      { name: "右下插位组件", value: "dYXCW" },
-      { name: "首盒长", value: "dSHC" },
-      { name: "首盒宽", value: "dSHK" },
-      { name: "次盒长", value: "dCHC" },
-      { name: "次盒宽", value: "dCHK" },
-    ];
-    const srcList = Number(boxTypes) === 8 ? doubleTitlieList1 : titleList1;
     const evaluateFormula = (formula, variables) => {
       if (!formula) return 0; // 如果公式为空，返回0
       try {
@@ -2409,18 +2445,31 @@ const BoxComponent = props =&gt; {
       D,
       ...slaveRowData,
     };
-
+    slaveNewData.forEach(item => {
+      item.iSLength = slaveRowData[item.sName + 'iSLength']
+      item.iCLength = slaveRowData[item.sName + 'iCLength']
+      item.iSWidth = slaveRowData[item.sName + 'iSWidth']
+      item.iCWidth = slaveRowData[item.sName + 'iCWidth']
+    })
     slaveNewData.forEach(x => {
       let key = 0;
       if (x.sAssignFormula) {
         key = evaluateFormula(x.sAssignFormula, variables);
         slaveRowData[x.sName] = key;
       } else {
-        key = slaveRowData[x.sName];
+        if (x.sTypes && x.sTypes.includes('09')) {
+          if (x.sName === 'dZTBW' || x.sName === 'dYTBW') {
+            key = (x.iSLength ? Number(x.iSLength) : 0) + (x.iCLength ? Number(x.iCLength) : 0)
+          } else {
+            key = (x.iSWidth ? Number(x.iSWidth) : 0) + (x.iCWidth ? Number(x.iCWidth) : 0)
+          }
+        } else {
+          key = slaveRowData[x.sName];
+        }
       }
       boxList.push({
         value: key,
-        sName: srcList.find(item => item.value === x.sName)?.name || "",
+        sName: titleList1.find(item => item.value === x.sName)?.name || "",
         isEditable: true,
         isSelect: false,
         selectValue: null,
@@ -2429,6 +2478,18 @@ const BoxComponent = props =&gt; {
         type: x.sTypes || null,
         show: true,
         showName: x.showName, // 参数名称
+        sLength: x.iSLength,
+        sWidth: x.iSWidth,
+        sType: x.iSType,
+        sTypeName: Number(x.iSType) === 0 ? "矩形" : "梯形",
+        sOffset: x.sSOffset,
+        sQuantity: x.iSQuantity,
+        cLength: x.iCLength,
+        cWidth: x.iCWidth,
+        cType: x.iCType,
+        cTypeName: Number(x.iCType) === 0 ? "矩形" : "梯形",
+        cOffset: x.sCOffset,
+        cQuantity: x.iCQuantity,
       });
     });
     tables.forEach(x => {
@@ -2446,6 +2507,7 @@ const BoxComponent = props =&gt; {
       });
     });
   }
+
   const svgProps = {
     ...props,
     boxList,
@@ -2453,6 +2515,7 @@ const BoxComponent = props =&gt; {
     dSvgBoxHeight: 200,
     showNew: 1,
   };
+  console.log("🚀 ~ svgProps:", svgProps)
  
   // upViewProps.viewRow =
  
@@ -2463,20 +2526,19 @@ const BoxComponent = props =&gt; {
   const ImpositionInformation = commonFunc.showLocalMessage(props, "ImpositionInformation", "拼版信息");
  
   const noImage = commonFunc.showLocalMessage(props, "ImpositionInformation", "暂无图片");
-
-  const removeExtension = filename => {
-    if (!filename) return;
-    const lastDotIndex = filename.lastIndexOf(".");
+  const removeExtension = (filename) => {
+    if (!filename) return
+    const lastDotIndex = filename.lastIndexOf('.');
     if (lastDotIndex === -1) {
       // 如果字符串中没有点，则返回原字符串
       return filename;
     }
     return filename.substring(0, lastDotIndex);
-  };
-  const getImageUrl = sName => {
+  }
+  const getImageUrl = (sName) => {
     const imageUrlNew = `${commonConfig.server_host}file/downloadPrice?sLogoName=${sName}&date=${new Date().getTime()}`;
-    return imageUrlNew;
-  };
+    return imageUrlNew
+  }
   let imagesData = [
     { src: getImageUrl(removeExtension(slaveRowData.sPackDetailPathUpLoad)), alt: "展开图" },
     { src: getImageUrl(removeExtension(slaveRowData.sPackPath)), alt: "立体图" },
@@ -2561,7 +2623,9 @@ const BoxComponent = props =&gt; {
                   <div className={styles.boxPart1}>
                     <div className={styles.boxPart1Left}>
                       <div className={styles.viewTable1}>
-                        {!(selectedNode.sTypeKey === "kapai" || selectedNode.sTypeKey === "juantong") ? <CommonViewTable {...upViewProps} /> : ""}
+                        {!(selectedNode.sTypeKey === "kapai" || selectedNode.sTypeKey === "juantong") ? <div>
+                          <CommonViewTable {...upViewProps} />
+                        </div> : ""}
                       </div>
                       {cailiaoyinshuaDiv}
                     </div>
@@ -3304,26 +3368,10 @@ const BoxModelSelectedModal = props =&gt; {
       { name: "右贴边位", value: "dYTBW" },
       { name: "右(下)插位组件", value: "dYXCW" },
     ];
-    const doubleTitlieList1 = [
-      { name: "左上插位组件", value: "dZSCW" },
-      { name: "上插位组件", value: "dSCW" },
-      { name: "右上插位组件", value: "dYSCW" },
-      { name: "左偏移", value: "dZPY" },
-      { name: "左插位组件", value: "dZCW" },
-      { name: "左下插位组件", value: "dZXCW" },
-      { name: "右偏移", value: "dYPY" },
-      { name: "右插位组件", value: "dYCW" },
-      { name: "右下插位组件", value: "dYXCW" },
-      { name: "首盒长", value: "dSHC" },
-      { name: "首盒宽", value: "dSHK" },
-      { name: "次盒长", value: "dCHC" },
-      { name: "次盒宽", value: "dCHK" },
-    ];
-    const srcList = Number(sTypes) === 8 ? doubleTitlieList1 : titleList1;
     slaveData.forEach(x => {
       boxList.push({
         value: x.iValue || x.sDefault,
-        sName: srcList.find(item => item.value === x.sCode || item.value === x.sName)?.name || "",
+        sName: titleList1.find(item => item.value === x.sCode || item.value === x.sName)?.name || "",
         isEditable: true,
         isSelect: false,
         selectValue: null,
@@ -3355,7 +3403,6 @@ const BoxModelSelectedModal = props =&gt; {
       dSvgBoxHeight: 100,
       showNew: 1,
     };
-
     return svgProps;
   };
   const selectBoxList = boxData.filter(item => (boxTypeSelected === "全部" ? true : (item.sBoxType || "其它") === boxTypeSelected));
@@ -3381,16 +3428,17 @@ const BoxModelSelectedModal = props =&gt; {
         .forEach(column => {
           // (value ? (column.dataIndex === 'sPackDetailPath' ? (boxData[index].sPackPath ? <img src={value} alt="" width={270} height={270} /> : '') : <img src={value} alt="" width={270} height={270} />)  : "暂无图片");
           column.render = (value, record, index) =>
+
             column.dataIndex === "sPackDetailPathUpLoad" ? (
               !value ? (
                 <div style={{ width: "auto", height: 100 }}>
                   <DynamicSVG {...getSvgProps(selectBoxList[index])} />
                 </div>
               ) : (
-                <img src={value} alt="" width={100} height={100} />
+                <img src={getImageUrl(value)} alt="" width={100} height={100} />
               )
             ) : value ? (
-              <img src={value} alt="" width={100} height={100} />
+              <img src={getImageUrl(value)} alt="" width={100} height={100} />
             ) : (
               noImage
             );
@@ -3416,6 +3464,10 @@ const BoxModelSelectedModal = props =&gt; {
         });
     },
   };
+  const getImageUrl = (sName) => {
+    const imageUrlNew = `${commonConfig.server_host}file/downloadPrice?sLogoName=${sName}&date=${new Date().getTime()}`;
+    return imageUrlNew
+  }
   const BoxSelection = commonFunc.showLocalMessage(props, "Box-TypeSelection", "盒型选择");
   const BtnClose = commonFunc.showLocalMessage(props, "BtnClose", "关闭");
   return (
@@ -3555,11 +3607,11 @@ const BackendParamsExtraComponent = props =&gt; {
       const dropDownDataSelected = dropDownData?.length
         ? dropDownData.find(item => item.sId === changeValue[sFieldName])
         : {
-            sId: commonUtils.createSid(),
-            value: changeValue[sFieldName],
-            sParam: showConfig.sParam,
-            sParamKey: sFieldName,
-          };
+          sId: commonUtils.createSid(),
+          value: changeValue[sFieldName],
+          sParam: showConfig.sParam,
+          sParamKey: sFieldName,
+        };
       if (!dropDownDataSelected) return;
       dropDownDataSelected[sFieldName] = dropDownDataSelected.value;
       const { sParam } = dropDownDataSelected;
@@ -3678,7 +3730,6 @@ const GetBestAlgorithm = props =&gt; {
       { name: "盒宽", value: W, type: null },
       { name: "盒高", value: D, type: null },
     ];
-    const boxTypes = slaveRowData.sTypes;
     const titleList1 = [
       { name: "上方盒舌", value: "dSFHS" },
       { name: "盒底组件", value: "dHDC" },
@@ -3690,22 +3741,6 @@ const GetBestAlgorithm = props =&gt; {
       { name: "右贴边位", value: "dYTBW" },
       { name: "右(下)插位组件", value: "dYXCW" },
     ];
-    const doubleTitlieList1 = [
-      { name: "左上插位组件", value: "dZSCW" },
-      { name: "上插位组件", value: "dSCW" },
-      { name: "右上插位组件", value: "dYSCW" },
-      { name: "左偏移", value: "dZPY" },
-      { name: "左插位组件", value: "dZCW" },
-      { name: "左下插位组件", value: "dZXCW" },
-      { name: "右偏移", value: "dYPY" },
-      { name: "右插位组件", value: "dYCW" },
-      { name: "右下插位组件", value: "dYXCW" },
-      { name: "首盒长", value: "dSHC" },
-      { name: "首盒宽", value: "dSHK" },
-      { name: "次盒长", value: "dCHC" },
-      { name: "次盒宽", value: "dCHK" },
-    ];
-    const srcList = Number(boxTypes) === 8 ? doubleTitlieList1 : titleList1;
     slaveNewData.forEach(x => {
       let key = 0;
       if (x.sAssignFormula) {
@@ -3715,7 +3750,7 @@ const GetBestAlgorithm = props =&gt; {
       }
       boxList.push({
         value: key,
-        sName: srcList.find(item => item.value === x.sName)?.name || "",
+        sName: titleList1.find(item => item.value === x.sName)?.name || "",
         isEditable: true,
         isSelect: false,
         selectValue: null,
@@ -3723,7 +3758,7 @@ const GetBestAlgorithm = props =&gt; {
         selectImage: null,
         type: x.sTypes || null,
         show: true,
-        sCode: srcList.find(item => item.value === x.sName)?.value || "",
+        sCode: titleList1.find(item => item.value === x.sName)?.value || "",
         showName: x.showName, // 参数名称
       });
     });
@@ -3910,16 +3945,14 @@ const GetBestAlgorithm = props =&gt; {
             justifyContent: "center",
             alignItems: "center",
             position: "absolute",
-            left: `${
-              isVertical
-                ? dSLengthOffset
-                : iSAngle === 90 || iSAngle === 270
+            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`,
+              }px`,
+            top: `${isVertical ? jInnerHeight + dFWidthOffset + dSWidthOffset + dXBJJ : iSAngle === 90 || iSAngle === 270 ? dSWidthOffset : dSWidthOffset
+              }px`,
           }}
         ></div>
       </div>
@@ -4068,8 +4101,8 @@ const GetBestAlgorithm = props =&gt; {
         ? cols + cols * (rows * 2)
         : cols * (rows * 2)
       : remaining
-      ? rows + rows * (cols * 2)
-      : rows * (cols * 2);
+        ? rows + rows * (cols * 2)
+        : rows * (cols * 2);
  
     let dHorizontalType = isVertical ? cols : remaining ? cols * 2 + 1 : cols * 2;
     let dPortraitType = isVertical ? (remaining ? rows * 2 + 1 : rows * 2) : remaining ? rows : rows;