卡牌默认展示图片

陈鑫涛
1 parent 7ee391e2
Showing 7 changed files with 187 additions and 111 deletions
src/components/Common/Typesetting/typesetting.js
src/components/QuickQuote/index.jsx
src/mobile/components/SelectInput.jsx
src/mobile/quotation/detailNew.jsx
src/mobile/quotation/index.css
src/mobile/quotation/index.jsx
src/mobile/quotation/index.less
@@ -241,9 +241,9 @@ const Typesetting = props =&gt; {
   let cols = dSWidthOffsetCombined === 0 ? 0 : Math.floor(outerWidth / dSWidthOffsetCombined);
   const rowsCombined = innerHeightCombined + boxWidthOffset + (reference ? 0 : dSWidthOffset);
   let rows = rowsCombined === 0 ? 0 : Math.floor(outerHeight / rowsCombined);
-  let colsMaxLength = (cols) * (innerWidthCombined + boxLengthOffset + (reference ? 0 : dSLengthOffset) + dYBJJ) + dZBLB + dYBLB - dSLengthOffset;
+  let colsMaxLength = (cols) * (innerWidthCombined + boxLengthOffset + (reference ? 0 : dSLengthOffset) + dYBJJ) + dZBLB + dYBLB - (reference ? 0 : dSLengthOffset);
  
-  let rowsMaxLength = rows * (innerHeightCombined + boxWidthOffset + (reference ? 0 : dSWidthOffset) + dXBJJ)  + dSBLB + dXBLB - dSWidthOffset;
+  let rowsMaxLength = rows * (innerHeightCombined + boxWidthOffset + (reference ? 0 : dSWidthOffset) + dXBJJ)  + dSBLB + dXBLB - (reference ? 0 : dSWidthOffset) ;
   while (colsMaxLength  >= outerWidth && cols > 0) {
     cols = cols - 1;
     colsMaxLength = (cols) * (innerWidthCombined + boxLengthOffset + (reference ? 0 : dSLengthOffset) + dYBJJ);
@@ -15,7 +15,7 @@ import AntdDraggableModal from &quot;@/components/Common/AntdDraggableModal&quot;;
 import styles from "./index.less";
 import Typesetting from "@/components/Common/Typesetting/typesetting";
 import DynamicSVG from "@/components/Common/BoxDesignCompontent/svg";
-import KapaiJson from './kapai.json'
+import KapaiJson from "./kapai.json";
 // 事件
 const QuickQuoteEvent = props => {
   const addState = {};
@@ -263,6 +263,7 @@ const QuickQuoteEvent = props =&gt; {
       }
  
       const iIndex = slaveData.findIndex(item => item.sTreeNodeName === sTreeNodeName && item.sBoxModel === boxModel);
+      console.log("🚀 ~ iIndex:", iIndex);
       if (name.includes("slaveDown")) {
         const dropDownDataSelected = dropDownData.find(item => item.sId === changeValue[sFieldName]);
         const extraRowData = {};
@@ -1242,10 +1243,9 @@ const TreeComponent = props =&gt; {
         masterData: { ...props.masterData, sFormId: props.masterData.sOldFormId || props.masterData.sFormId },
       });
     }
-
     getDropDownData(props);
   }, [selectedNode.sId, commonUtils.isEmptyObject(slaveConfig)]);
-
+  const { slaveData } = props.state;
   return (
     <Tree
       className={"hide-file-icon"}
@@ -1466,54 +1466,20 @@ const BoxComponent = props =&gt; {
  
   const { bBox } = selectedNode;
   const [boxTypeList, setBoxTypeList] = useState([]);
-  const [boxData, setBoxData] = useState([]);
   useEffect(() => {
     if (selectedNode.sTypeKey === "kapai" || selectedNode.sTypeKey === "juantong") {
-      // const getSqlDropDownData = async ({ sId }, cb) => {
-      //   const url = `${commonConfig.server_host}business/getSelectLimit/${sId}`;
-      //   const body = {
-      //     sKeyUpFilterName: "",
-      //     pageNum: 1,
-      //     pageSize: 1000,
-      //     sSqlCondition: {
-      //       sProductClassifyId: selectedNode.sId,
-      //     },
-      //   };
-      //   const retrunData = await commonServices.postValueService(props.app.token, body, url);
-      //   const dropDownData = retrunData.data?.dataset?.rows;
-      //   console.log("🚀 ~ getSqlDropDownData ~ dropDownData:", dropDownData)
-      // };
-
-      // getSqlDropDownData({ sId: "17428091410008594700322758474000" }, dropDownData => {
-      //   const boxTypeList = Array.from(new Set((dropDownData || []).map(item => item.sBoxType || "其它")));
-      //   setBoxTypeList(boxTypeList);
-      //   setBoxData(
-      //     (dropDownData || []).map((item, index) => ({
-      //       ...item,
-      //       iOrder: index + 1,
-      //     }))
-      //   );
-      // });
-        let dropDownData = []
-        dropDownData.push(KapaiJson)
-        const boxTypeList = Array.from(new Set((dropDownData || []).map(item => item.sBoxType || "其它")));
-        setBoxTypeList(boxTypeList);
-        setBoxData(
-          (dropDownData || []).map((item, index) => ({
-            ...item,
-            iOrder: index + 1,
-          }))
-        );
+      let dropDownData = [];
+      dropDownData.push(KapaiJson);
+      const boxData = (dropDownData || []).map((item, index) => ({
+        ...item,
+        iOrder: index + 1,
+      }));
+      props.onDataChange("slaveUp" + boxModel, "sName", { sName: KapaiJson.sName }, KapaiJson.sId, boxData);
     }
   }, [boxModel]);
-  useEffect(() => {
-    const kapaiData = boxData.find(x => x.sTypes === "6");
-    if (!kapaiData) return;
-    props.onDataChange("slaveUp" + boxModel, "sName", { sName: kapaiData.sName }, kapaiData.sId, boxData);
-  }, [boxData]);
+
   const slaveRowData = slaveData.find(item => item.sTreeNodeName === selectedNode.showName && item.sBoxModel === boxModel) || {};
   const { upAbleConfigsExtra = [], calcMethodData = [], boxPicData = [], radioValue = calcMethodData[0]?.sCode } = slaveRowData;
-
   const calcMethod = calcMethodData.map(item => ({
     value: item.sCode,
     label: item.showName,
@@ -2182,7 +2148,15 @@ const BoxComponent = props =&gt; {
                           {bBox ? (
                             <>
                               {svgProps.boxList.length ? (
-                                <div style={{ width: " 300px", height: "290px",lineHeight:'290px', backgroundColor: "#fff", borderRight: "1px solid #ccc" }}>
+                                <div
+                                  style={{
+                                    width: " 300px",
+                                    height: "290px",
+                                    lineHeight: "290px",
+                                    backgroundColor: "#fff",
+                                    borderRight: "1px solid #ccc",
+                                  }}
+                                >
                                   <DynamicSVG {...svgProps} />
                                 </div>
                               ) : (
@@ -2202,6 +2176,12 @@ const BoxComponent = props =&gt; {
                                 ))}
                               </Carousel>
                             </div>
+                          ) : selectedNode.sTypeKey === "kapai" || selectedNode.sTypeKey === "juantong" ? (
+                            <Carousel dots style={{ width: "300px", height: "300px" }}>
+                              <div key={0} className="carousel-item">
+                                <Image src={KapaiJson.sPackDetailPathUpLoad} style={{ width: "300px", height: "290px" }} />
+                              </div>
+                            </Carousel>
                           ) : (
                             <div className={styles.noImg}>{noImage}</div>
                           )}
@@ -40,6 +40,9 @@ const SelectInput = props =&gt; {
     } else {
       setValue(viewRowNew || ""); // 动态更新 value
     }
+    // 处理默认数据
+    console.log("🚀 ~ useEffect ~ itemDetail:", itemDetail)
+    
   }, [itemDetail, itemDetail?.sName, viewRow]);
   const [columns, setColumns] = useState([]);
   const [coplyColumns, setCopyColumns] = useState(columns);
@@ -103,7 +106,6 @@ const SelectInput = props =&gt; {
   useEffect(() => {
     if (!visible) return;
     let { sDropDownType, sVisColumnName } = itemDetail;
-    console.log("🚀 ~ useEffect ~ itemDetail:", itemDetail)
     if (sVisColumnName && sVisColumnName === "sProcessName") {
       if (sDropDownType === "sql") {
         if (itemDetail.sParamDropDown) {
@@ -151,9 +151,6 @@ const QuickQuoteEvent = props =&gt; {
  
     if (name === "master") {
       const { showName: sTreeNodeName } = selectedNode;
-      const boxModel = name.replace("slaveUp", "").replace("slaveDown", "");
-      const iIndex = slaveData.findIndex(item => item.sTreeNodeName === sTreeNodeName && item.sBoxModel === boxModel);
-      console.log("🚀 ~ iIndex:", iIndex, boxModel, props);
       let masterDataNew = { ...masterData, ...changeValue };
       masterDataNew.handleType = masterDataNew.handleType || "update";
       masterDataNew.sId = commonUtils.createSid();
@@ -166,16 +163,30 @@ const QuickQuoteEvent = props =&gt; {
       if (sFieldName === "sCustomerName") {
         masterDataNew = { ...masterDataNew, sCustomerId: changeValue.sId };
       }
-      // if ((sFieldName === "dLength" || sFieldName === "dWidth" || sFieldName === "dHeight")) {
-      //   const sColumnNameConfig = commonUtils.convertStrToObj(slaveData[iIndex].sColumnNameConfig, []).map(item => ({
-      //     ...item,
-      //     iColValue: item.iColValue || 6,
-      //   }));
-      //   slaveData[iIndex] = {
-      //     ...slaveData[iIndex],
-      //     upAbleConfigsExtra: sColumnNameConfig,
-      //   };
-      // }
+      if (sFieldName === "dLength" || sFieldName === "dWidth" || sFieldName === "dHeight") {
+        if (props.currentBoxModel) {
+          const boxModel = props.currentBoxModel.replace("slaveUp", "").replace("slaveDown", "");
+          const iIndex = slaveData.findIndex(item => item.sTreeNodeName === sTreeNodeName && item.sBoxModel === boxModel);
+          const sColumnNameConfig = commonUtils.convertStrToObj(slaveData[iIndex].sColumnNameConfig, []).map(item => ({
+            ...item,
+            iColValue: item.iColValue || 6,
+          }));
+          slaveData[iIndex] = {
+            ...slaveData[iIndex],
+            upAbleConfigsExtra: sColumnNameConfig,
+          };
+        } else {
+          if (!slaveData[0]) return;
+          const sColumnNameConfig = commonUtils.convertStrToObj(slaveData[0].sColumnNameConfig, []).map(item => ({
+            ...item,
+            iColValue: item.iColValue || 6,
+          }));
+          slaveData[0] = {
+            ...slaveData[0],
+            upAbleConfigsExtra: sColumnNameConfig,
+          };
+        }
+      }
       setState(pre => ({ ...pre, masterData: masterDataNew, ...extraState }));
     } else if (name.includes("slave")) {
       const boxModel = name.replace("slaveUp", "").replace("slaveDown", "");
@@ -203,6 +214,13 @@ const QuickQuoteEvent = props =&gt; {
       const { selectedNode = {}, slaveConfig } = state;
       const { showName: sTreeNodeName } = selectedNode;
       const iIndex = slaveData.findIndex(item => item.sTreeNodeName === sTreeNodeName && item.sBoxModel === boxModel);
+      if (sFieldName === "dSumPQty" && (sTreeNodeName.includes("骑马") || sTreeNodeName.includes("锁线"))) {
+        if (!changeValue.dSumPQty || changeValue.dSumPQty % 4 !== 0) {
+          message.info("P数要为4的倍数!");
+          changeValue.dSumPQty = 4;
+          extraState.slaveUpKey = `key_${commonUtils.createSid()}`;
+        }
+      }
       if (name.includes("slaveDown")) {
         const dropDownDataSelected = dropDownData.find(item => item.sId === changeValue.sId);
         dropDownDataSelected && (dropDownDataSelected[sFieldName] = dropDownDataSelected.sProcessName);
@@ -227,6 +245,8 @@ const QuickQuoteEvent = props =&gt; {
                     value: sParamDefault,
                     sParam: sParam,
                     [`sParams${index}`]: sParamDefault,
+                    sParamKey: `sParam${iOrder}`,
+                    sParamKeyNew: sFieldName || `sParam${iOrder}`,
                   };
             })
             .filter(item => item !== "");
@@ -312,23 +332,46 @@ const QuickQuoteEvent = props =&gt; {
         };
       }
  
-      if (sFieldName === "sPrint") {
+      // if (sFieldName === "sPrint") {
+      //   slaveData[saveIndex] = {
+      //     ...slaveData[saveIndex],
+      //     sProcessId: changeValue.sId,
+      //     sPrintProcessId: changeValue.sId,
+      //     dMachineWidth: slaveData[saveIndex].dWlkd,
+      //     dMachineLength: slaveData[saveIndex].dWlcd,
+      //   };
+      // }
+
+      // if (sFieldName === "dMaxLength") {
+      //   slaveData[saveIndex] = {
+      //     ...slaveData[saveIndex],
+      //     dMaxLength: changeValue.dMachineLength,
+      //     dMaxWidth: changeValue.dMachineWidth,
+      //   };
+      // }
+      if (sFieldName === "bFlap") {
         slaveData[saveIndex] = {
           ...slaveData[saveIndex],
-          sProcessId: changeValue.sId,
-          sPrintProcessId: changeValue.sId,
-          dMachineWidth: slaveData[saveIndex].dWlkd,
-          dMachineLength: slaveData[saveIndex].dWlcd,
+          bFold: false,
+          sFold: "",
+          dFold: "",
+          dAdhesive: "",
         };
       }
-
-      if (sFieldName === "dMaxLength") {
+      if (sFieldName === "bFold") {
         slaveData[saveIndex] = {
           ...slaveData[saveIndex],
-          dMaxLength: changeValue.dMachineLength,
-          dMaxWidth: changeValue.dMachineWidth,
+          bFlap: false,
+          dFlap: "",
         };
       }
+      const { upAbleConfigsExtra = [] } = slaveData[saveIndex] || {};
+
+      upAbleConfigsExtra.forEach(item => {
+        if (item.sName === sFieldName) {
+          item.sAssignFormula = null;
+        }
+      });
       setState(pre => ({ ...pre, slaveData, ...extraState }));
     } else if (name === "finished") {
       const { productProcessInfo = [] } = masterData;
@@ -715,10 +758,10 @@ const QuickQuoteEvent = props =&gt; {
         delete partsDataRow.dMaterialsKQty;
         delete partsDataRow.dMaterialsLength;
         delete partsDataRow.dMaterialsWidth;
-        if (productClassify.bSpecialRules) {
-          partsDataRow.dMachineLength = partsDataRow.dMaxMachineLength;
-          partsDataRow.dMachineWidth = partsDataRow.dMaxMachineWidth;
-        }
+        // if (productClassify.bSpecialRules) {
+        //   partsDataRow.dMachineLength = partsDataRow.dMaxMachineLength;
+        //   partsDataRow.dMachineWidth = partsDataRow.dMaxMachineWidth;
+        // }
         controlData.push(partsDataRow);
         // 材料信息
         for (let i = 0; i < partInfo.materialsInfo.length; i++) {
@@ -1060,7 +1103,7 @@ const QuotationAllprogressDetail = baseProps =&gt; {
         };
       });
     };
-    if (selectedNode.sProductType === "不干胶") {
+    if (selectedNode.sTypeKey === "juantong") {
       props.onSaveState({
         masterData: { ...props.masterData, sFormId: "101251240115016002356125200" },
       });
@@ -1457,11 +1500,11 @@ const BoxComponent = props =&gt; {
   }));
   const showUpAbleConfigsExtra = upAbleConfigsExtra.filter(x => x.bVisible === 1);
   let boxList = [];
+  const { sStripType = 0 } = selectedNode;
   // if(!masterData) return
   if (
-    (slaveRowData && slaveRowData.sColumnNameConfig && masterData?.dLength && masterData?.dWidth && masterData?.dHeight) ||
-    (selectedNode.sTypeKey === "kapai" && slaveRowData.sColumnNameConfig && masterData.dLength && masterData.dWidth) ||
-    (selectedNode.sProductType === "不干胶" && slaveRowData.sColumnNameConfig && masterData.dLength && masterData.dWidth)
+    (slaveRowData.sColumnNameConfig && masterData.dLength && masterData.dWidth && masterData.dHeight) ||
+    (Number(sStripType) === 1 && slaveRowData.sColumnNameConfig && masterData.dLength && masterData.dWidth)
   ) {
     const slaveNewData = slaveRowData.upAbleConfigsExtra;
     const tables = [
@@ -1600,12 +1643,15 @@ const BoxComponent = props =&gt; {
         if (!selectedNode.bBleed && item.sName === "dBleed") {
           return false;
         }
+        if (selectedNode.sTypeKey !== "juantong" && item.sName === "sPaperDirection") {
+          return false;
+        }
         return item.iTag === iTag;
       });
     let boxConfigList = [];
     if (iTag === 20) {
       let showNameKeyList = ["dZBLB", "dSBLB", "dYBLB", "dXBLB", "dZBJJ", "dYBJJ", "dSBJJ", "dXBJJ"];
-      if (selectedNode.sProductType === "不干胶") {
+      if (selectedNode.sTypeKey === "juantong") {
         showNameKeyList = ["dZBLB", "dZBJJ", "dYBJJ", "dSBJJ", "dXBJJ"];
       }
       const UlToolPosition = commonFunc.showLocalMessage(props, "UlToolPosition", "上下刀位");
@@ -1613,7 +1659,7 @@ const BoxComponent = props =&gt; {
       const LeftMargin = commonFunc.showLocalMessage(props, "LeftMargin", "左右刀位");
  
       boxConfigList = boxConfig?.gdsconfigformslave?.filter(item => item.bVisible && showNameKeyList.includes(item.sName)) || [];
-      if (selectedNode.sProductType === "不干胶") {
+      if (selectedNode.sTypeKey === "juantong") {
         const mappings = {
           dZBLB: "留边",
           dXBJJ: "跳距",
@@ -1660,15 +1706,21 @@ const BoxComponent = props =&gt; {
       x.sName === "dPartsWidth" ||
       x.sName === "dRowGap" ||
       x.sName === "dColGap" ||
+      x.sName === "dBleed" ||
       x.sName === "sPaperDirection",
     default: x =>
-      x.sName === "dBleed" || x.sName === "sMagnification" || x.sName === "dPartsLength" || x.sName === "dPartsWidth" || x.sName === "dSumPQty",
+      x.sName === "sPaperDirection" ||
+      x.sName === "dBleed" ||
+      x.sName === "sMagnification" ||
+      x.sName === "dPartsLength" ||
+      x.sName === "dPartsWidth" ||
+      x.sName === "dSumPQty",
   };
-  if (upViewProps12 && selectedNode.sProductType === "不干胶") {
+  if (upViewProps12 && selectedNode.sTypeKey === "juantong") {
     upViewProps12.viewConfigs = upViewProps12?.viewConfigs.filter(filterConditions.juantong);
   }
   if (upViewProps12 && !(selectedNode.sTypeKey === "huace" && slaveRowData.sBoxModel === "封面")) {
-    upViewProps12.viewConfigs = upViewProps12?.viewConfigs.filter(filterConditions.default);
+    upViewProps12.viewConfigs = upViewProps12.viewConfigs.filter(filterConditions.default);
   }
   // 拼板信息表单
   const upViewProps20 = getUpViewPropsByITag(20);
@@ -1819,7 +1871,7 @@ const BoxComponent = props =&gt; {
       };
       let juantongConfig = {};
  
-      if (selectedNode.sProductType === "不干胶") {
+      if (selectedNode.sTypeKey === "juantong") {
         const { dYBJJ, dXBJJ, dZBLB } = slaveData[index];
         juantongConfig = {
           dColGap: dYBJJ,
@@ -1996,7 +2048,7 @@ const BoxComponent = props =&gt; {
   };
  
   useEffect(() => {
-    if (selectedNode.sTypeKey === "kapai" || selectedNode.sProductType === "不干胶") {
+    if (selectedNode.sTypeKey === "kapai" || selectedNode.sTypeKey === "juantong") {
       const data = selectList.find(x => x.sTypes === "6");
       if (!data) return;
       const currentBoxModel = "slaveUp" + props.boxModel;
@@ -2318,13 +2370,15 @@ const PrintParamsComponent = props =&gt; {
       };
     });
   console.log("🚀 ~ printParamsConfig:", printParamsConfig);
-  // printParamsConfig.forEach(item=>{
-  //   const showDropDown = commonUtils.isNotEmptyArr(item.dropDownData)
-  //           ? this.props.showConfig.dropDownData
-  //           : typeof this.props.showConfig.showDropDown === "object"
-  //           ? this.props.showConfig.showDropDown
-  //           : commonUtils.objectToArr(commonUtils.convertStrToObj(this.props.showConfig.showDropDown));
-  // })
+  printParamsConfig.forEach(item => {
+    // const showDropDown = commonUtils.isNotEmptyArr(item.dropDownData)
+    //         ? props.showConfig.dropDownData
+    //         : typeof props.showConfig.showDropDown === "object"
+    //         ? props.showConfig.showDropDown
+    //         : commonUtils.objectToArr(commonUtils.convertStrToObj(props.showConfig.showDropDown));
+    const showDropDown = item.showDropDown;
+    console.log("🚀 ~ showDropDown:", showDropDown,props.showConfig);
+  });
   const result = [];
   for (let i = 0; i < printParams.length + 1; i++) {
     const printParamsItem = printParams[i - 1];
@@ -2621,7 +2675,7 @@ const ManyComponent = props =&gt; {
   useEffect(() => {
     if (calcPriceLoading) {
       setProcessPercent(0);
-    } 
+    }
   }, [calcPriceLoading]);
  
   // 监听确认下单数量结束
@@ -2774,12 +2828,11 @@ const ManyComponent = props =&gt; {
               fill="solid"
               size="small"
               onClick={() => {
-              
-                console.log(data,changeValue, value,'asdasdasd');
+                console.log(data, changeValue, value, "asdasdasd");
                 const i = data.findIndex(item => item.sId === changeValue.sId);
                 if (i !== -1) {
                   data[i].dManyQty = Number(value);
-                  handleRadioChange(data[i])
+                  handleRadioChange(data[i]);
                 }
                 setVisible(false);
                 setValue("");
@@ -12,7 +12,7 @@
   height: 100%;
 }
 .quotationBox .quotationNavigation :global .adm-side-bar {
-  background-color: #EBF2FD;
+  background-color: #ebf2fd;
 }
 .quotationBox .quotationContent {
   width: 70%;
@@ -40,3 +40,6 @@
   margin-left: 0.625rem;
   font-weight: 700;
 }
+.quotationBox .quotationContent .nestedItems .contentItem {
+  background-color: '#333';
+}
@@ -22,7 +22,7 @@ const QuotationAllprogress = baseProps =&gt; {
     };
     const dataUrl = `${commonConfig.server_host}filterTree/getFilterTree/${configDataId}?sModelsId=${sModelsId}&sName=${formSrcRoute}`;
     const dataReturn = (await commonServices.postValueService(token, condition, dataUrl)).data;
-    // if (dataReturn.dataset.rows) return 
+    // if (dataReturn.dataset.rows) return
     const treeDataList = dataReturn.dataset.rows[0].children.map(item => {
       return item;
     });
@@ -96,9 +96,11 @@ const TreeComponent = props =&gt; {
 };
 // 内容
 const ContentComponent = props => {
-  const { contentList = [] ,selectedKey} = props.state || {};
+  const { contentList = [], selectedKey } = props.state || {};
+  console.log("🚀 ~ contentList:", contentList);
   // 路由
   const handleGridClick = item => () => {
+    if (item.children && item.children.length > 0) return;
     props.dispatch({
       type: "content/onRouterMobile",
       payload: {
@@ -108,21 +110,53 @@ const ContentComponent = props =&gt; {
         sModelType: props.sModelType,
         quotationData: {
           ...item,
-          sProductClassifyId:selectedKey
+          sProductClassifyId: selectedKey,
         },
-        
       },
     });
   };
+
   return (
     <div className={styles.content}>
-      {contentList.map(item => (
-        <div key={item.key} className={styles.contentItem} onClick={handleGridClick(item)}>
-          <img src={'http://8.130.144.93:8088/xlyEntry/file/downloadLogo?sLogoName=logosPackPath%E9%A3%9E%E6%9C%BA%E7%9B%92&date=1747049329258'} alt="" className={styles.contentItemImg} />
-          <span className={styles.contentItemTitle}>{item.showName}</span>
-        </div>
-      ))}
+      <RecursiveItemList items={contentList} handleGridClick={handleGridClick} />
     </div>
   );
 };
+const RecursiveItemList = ({ items, handleGridClick }) => {
+  const renderItems = (list, level = 0) => {
+    return list.map(item => (
+      <div
+        key={item.key}
+      
+        onClick={handleGridClick(item)}
+        style={{ marginLeft: level * 20 }} // 根据层级添加缩进
+      >
+        {/* {
+        item.children && item.children.length > 0 ? 
+        <div style={{width:'2rem',}}>{item.showName}</div>
+        :
+        <div>
+           <img
+          src={'http://8.130.144.93:8088/xlyEntry/file/downloadLogo?sLogoName=logosPackPath%E9%A3%9E%E6%9C%BA%E7%9B%92&date=1747049329258'}
+          alt=""
+            className={styles.contentItemImg}
+          />
+          <span className={styles.contentItemTitle}>{item.showName}</span>
+        </div>
+       } */}
+        <div   className={styles.contentItem}>
+          <img
+            src={"http://8.130.144.93:8088/xlyEntry/file/downloadLogo?sLogoName=logosPackPath%E9%A3%9E%E6%9C%BA%E7%9B%92&date=1747049329258"}
+            alt=""
+            className={styles.contentItemImg}
+          />
+          <span className={styles.contentItemTitle}>{item.showName}</span>
+        </div>
+        {item.children && item.children.length > 0 ? <div className={styles.nestedItems}>{renderItems(item.children, level + 1)}</div> : null}
+      </div>
+    ));
+  };
+
+  return <div>{renderItems(items)}</div>;
+};
 export default QuotationAllprogress;
-
 .quotationBox {
   width: 100%;
   height: 100%;
@@ -10,8 +9,8 @@
   .quotationNavigation {
     width: 30%;
     height: 100%;
-   :global .adm-side-bar {
-      background-color: #EBF2FD;
+    :global .adm-side-bar {
+      background-color: #ebf2fd;
     }
   }
   .quotationContent {
@@ -39,5 +38,10 @@
         font-weight: 700;
       }
     }
+    .nestedItems {
+      .contentItem {
+        background-color: '#333';
+      }
+    }
   }
 }