From 30e2f49aaaeb99e5d29b859b43c24bf50dba800c Mon Sep 17 00:00:00 2001 From: 陈鑫涛 <10125295+chen-xintao97@user.noreply.gitee.com> Date: Thu, 26 Jun 2025 13:43:58 +0800 Subject: [PATCH] 卷筒类单独配置 --- src/components/Common/Typesetting/typesetting.js | 9 ++++++++- src/components/QuickQuote/index.css | 173 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++--------------------------------------------- src/components/QuickQuote/index.jsx | 46 +++++++++++++++++++++++++++++++++++++++++----- src/components/QuickQuote/index.less | 29 ++++++++++++++--------------- 4 files changed, 191 insertions(+), 66 deletions(-) diff --git a/src/components/Common/Typesetting/typesetting.js b/src/components/Common/Typesetting/typesetting.js index 1e376f2..d73cf80 100644 --- a/src/components/Common/Typesetting/typesetting.js +++ b/src/components/Common/Typesetting/typesetting.js @@ -23,7 +23,7 @@ const Typesetting = props => { isMobile, } = props; if (!slaveRowData) return; - const { + let { dSBLB, // 上边留白 dXBLB, // 下边留白 dZBLB, // 左边留白 @@ -38,7 +38,14 @@ const Typesetting = props => { sColumnNameConfig, bAdvancedSetting, // 高级设置 } = slaveRowData; + const { masterData, selectedNode, slaveData } = state; + // 如果是卷筒类 那么上下左右留白等于左留白 + if (selectedNode && selectedNode.sTypeKey === 'juantong') { + dSBLB = dZBLB + dXBLB = dZBLB + dYBLB = dZBLB + } // 生成盒子图片 const [boxKey, setBoxKey] = useState(new Date().getTime()); const [boxKeys, setBoxKeys] = useState(new Date().getTime()); diff --git a/src/components/QuickQuote/index.css b/src/components/QuickQuote/index.css index a76b19d..472d87d 100644 --- a/src/components/QuickQuote/index.css +++ b/src/components/QuickQuote/index.css @@ -12,38 +12,16 @@ .quickQuote .content :global .ant-btn-primary { border-radius: 5px; } +.quickQuote .content :global .ant-col-23 { + display: flex !important; +} .quickQuote .content .back { position: absolute; - top: 16px; - left: 360px; + top: 5px; + left: 218px; z-index: 10; -} -.quickQuote .content .leftTree { - width: 250px; - height: 100%; - background: #3274b7; - padding: 10px 0 0 10px; - overflow: hidden; -} -.quickQuote .content .leftTree :global .ant-tree { - background: transparent; -} -.quickQuote .content .leftTree :global .ant-tree .ant-tree-treenode { - padding-bottom: 10px; -} -.quickQuote .content .leftTree :global .ant-tree .ant-tree-title { - color: #fff; - font-size: 16px; - font-weight: bold; -} -.quickQuote .content .leftTree :global .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected { - background-color: #00a183; -} -.quickQuote .content .leftTree :global .ant-tree .ant-tree-node-content-wrapper:hover { - background-color: #009688; -} -.quickQuote .content .overFlow { - overflow: auto; + border: 1px solid #d7d7d7; + border-right-width: 0; } .quickQuote .content .rightContent { flex: 1; @@ -101,46 +79,65 @@ .quickQuote .content .rightContent .viewTable1 :global .viewStyle .ant-col { margin-bottom: 2px; } -.quickQuote .content .rightContent .viewTable .subViewTable, -.quickQuote .content .rightContent .viewTable1 .subViewTable { +.quickQuote .content .rightContent .viewTableDownView :global .viewStyle, +.quickQuote .content .rightContent .viewTableDownView1 :global .viewStyle { + padding-right: 14px; +} +.quickQuote .content .rightContent .viewTableDownView :global .viewStyle .ant-form-item-label, +.quickQuote .content .rightContent .viewTableDownView1 :global .viewStyle .ant-form-item-label { + flex: 0 0 70px !important; + max-width: 70px !important; +} +.quickQuote .content .rightContent .viewTableDownView :global .viewStyle .ant-form-item-control, +.quickQuote .content .rightContent .viewTableDownView1 :global .viewStyle .ant-form-item-control { + max-width: calc(100% - 95px); +} +.quickQuote .content .rightContent .viewTableDownView .subViewTable, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable { width: 100%; height: auto; } -.quickQuote .content .rightContent .viewTable .subViewTable :global .ant-form-item-row, -.quickQuote .content .rightContent .viewTable1 .subViewTable :global .ant-form-item-row { +.quickQuote .content .rightContent .viewTableDownView .subViewTable :global .ant-form-item-row, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable :global .ant-form-item-row { flex-direction: row-reverse; } -.quickQuote .content .rightContent .viewTable .subViewTable :global .ant-form-item-label, -.quickQuote .content .rightContent .viewTable1 .subViewTable :global .ant-form-item-label { +.quickQuote .content .rightContent .viewTableDownView .subViewTable :global .ant-form-item-label, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable :global .ant-form-item-label { flex: 0 0 25px !important; max-width: 25px !important; } -.quickQuote .content .rightContent .viewTable .subViewTable :global .ant-form-item-label > label, -.quickQuote .content .rightContent .viewTable1 .subViewTable :global .ant-form-item-label > label { +.quickQuote .content .rightContent .viewTableDownView .subViewTable :global .ant-form-item-label > label, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable :global .ant-form-item-label > label { display: flex; width: 100%; align-items: center; justify-content: center; } -.quickQuote .content .rightContent .viewTable .subViewTable :global .ant-form-item-label > label::before, -.quickQuote .content .rightContent .viewTable1 .subViewTable :global .ant-form-item-label > label::before { +.quickQuote .content .rightContent .viewTableDownView .subViewTable :global .ant-form-item-label > label::before, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable :global .ant-form-item-label > label::before { content: none; width: 0; } -.quickQuote .content .rightContent .viewTable .subViewTable :global .ant-form-item-label > label::after, -.quickQuote .content .rightContent .viewTable1 .subViewTable :global .ant-form-item-label > label::after { +.quickQuote .content .rightContent .viewTableDownView .subViewTable :global .ant-form-item-label > label::after, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable :global .ant-form-item-label > label::after { content: none; width: 0; } -.quickQuote .content .rightContent .viewTable .subViewTable :global .ant-form-item-control, -.quickQuote .content .rightContent .viewTable1 .subViewTable :global .ant-form-item-control { +.quickQuote .content .rightContent .viewTableDownView .subViewTable :global .ant-form-item-control, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable :global .ant-form-item-control { flex: 1; max-width: calc(100% - 25px); } -.quickQuote .content .rightContent .viewTable .subViewTable :global .viewStyle > .ant-col-24, -.quickQuote .content .rightContent .viewTable1 .subViewTable :global .viewStyle > .ant-col-24 { +.quickQuote .content .rightContent .viewTableDownView .subViewTable :global .viewStyle > .ant-col-24, +.quickQuote .content .rightContent .viewTableDownView1 .subViewTable :global .viewStyle > .ant-col-24 { padding-left: 100px; } +.quickQuote .content .rightContent .viewTableDownView1 :global .viewStyle .ant-form-item-control { + max-width: calc(100% - 60px); +} +.quickQuote .content .rightContent .viewTableDownView2 { + background-color: #3275b734; +} .quickQuote .content .rightContent .viewTable1 { padding: 0 20px 0 0; } @@ -290,3 +287,89 @@ background-color: #53b637; border-color: #53b637; } +.leftTree, +.boxTree { + width: 250px; + height: 100%; + background: var(--xly-skin-header-color, #383d41); + padding: 10px 0 0 10px; + overflow: hidden; +} +.leftTree :global .ant-tree, +.boxTree :global .ant-tree { + background: transparent; +} +.leftTree :global .ant-tree .ant-tree-treenode, +.boxTree :global .ant-tree .ant-tree-treenode { + padding-bottom: 10px; +} +.leftTree :global .ant-tree .ant-tree-title, +.boxTree :global .ant-tree .ant-tree-title { + color: #fff; + font-size: 14px; + font-family: Monospaced Number, Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif !important; +} +.leftTree :global .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected, +.boxTree :global .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected { + background-color: #00a183; +} +.leftTree :global .ant-tree .ant-tree-node-content-wrapper:hover, +.boxTree :global .ant-tree .ant-tree-node-content-wrapper:hover { + background-color: #009688; +} +.boxTree { + background: transparent; +} +.boxTree :global .ant-tree .ant-tree-title, +.boxTree :global .ant-tree .ant-badge { + color: #5c6374; + font-size: 16px; + font-weight: bold; +} +.boxTree :global .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected { + background-color: #bae7ff; +} +.boxTree :global .ant-tree .ant-tree-node-content-wrapper:hover { + background-color: #bae7ff; +} +.overFlow { + overflow: auto; +} +.boxModal { + width: 100%; + height: calc(100vh - 335px); + display: flex; +} +.boxModal .boxTree { + width: 200px; + height: 100%; +} +.boxModal .boxTable { + width: calc(100% - 200px); + height: 100%; +} +.downOperations { + position: absolute; + top: 6px; + right: 6px; + display: flex; + flex-direction: column; + z-index: 1; +} +.downOperations :global button { + padding: 0; + width: 16px; + height: 16px; +} +.downOperations :global button > span { + font-size: 10px; +} +.sParamConfig :global .ant-form-item-label label::before { + content: ""; + display: block; + width: 5px; + height: 5px; + border-radius: 50%; + background-color: #ff4d4f; + margin-right: 2px; +} diff --git a/src/components/QuickQuote/index.jsx b/src/components/QuickQuote/index.jsx index 98a024b..ac3ce65 100644 --- a/src/components/QuickQuote/index.jsx +++ b/src/components/QuickQuote/index.jsx @@ -84,6 +84,7 @@ const QuickQuoteEvent = props => { const { bLinkFieledClick } = props; const [hideBackBtn, setHideBackBtn] = useState(false); const [enabled, setEnabled] = useState(props.enabled); + useEffect(() => { setHideBackBtn(!bLinkFieledClick); setEnabled(!bLinkFieledClick || props.enabled); @@ -1297,9 +1298,10 @@ const MasterComponent = props => { const ableConfigs = masterConfig.gdsconfigformslave.filter(item => item.sName && item.bVisible); // 处理长宽样式 - const viewConfigs = ((selectedNode?.bBox && selectedNode.sTypeKey !== "kapai" && selectedNode?.bBox && selectedNode.sTypeKey !== "juantong") ) - ? ableConfigs - : ableConfigs.filter(x => x.sName !== "dHeight"); + const viewConfigs = + selectedNode?.bBox && selectedNode.sTypeKey !== "kapai" && selectedNode?.bBox && selectedNode.sTypeKey !== "juantong" + ? ableConfigs + : ableConfigs.filter(x => x.sName !== "dHeight"); if (selectedNode?.bBox && selectedNode.sTypeKey !== "kapai" && selectedNode?.bBox && selectedNode.sTypeKey !== "juantong") { viewConfigs.forEach(item => { if (item.sName === "dLength" || item.sName === "dWidth") { @@ -1437,8 +1439,24 @@ const BoxComponent = props => { }); let boxConfigList = []; if (iTag === 20) { - const showNameKeyList = ["dZBLB", "dSBLB", "dYBLB", "dXBLB", "dZBJJ", "dYBJJ", "dSBJJ", "dXBJJ"]; + let showNameKeyList = ["dZBLB", "dSBLB", "dYBLB", "dXBLB", "dZBJJ", "dYBJJ", "dSBJJ", "dXBJJ"]; + if (selectedNode.sTypeKey === "juantong") { + showNameKeyList = ["dZBLB", "dZBJJ", "dYBJJ", "dSBJJ", "dXBJJ"]; + } boxConfigList = boxConfig?.gdsconfigformslave?.filter(item => item.bVisible && showNameKeyList.includes(item.sName)) || []; + if (selectedNode.sTypeKey === "juantong") { + const mappings = { + dZBLB: "留边", + dXBJJ: "跳距", + dYBJJ: "间距", + }; + + boxConfigList.forEach(item => { + if (mappings[item.sName]) { + item.showName = mappings[item.sName]; + } + }); + } } const newConfig = [...boxConfigList, ...config]; return { @@ -1474,6 +1492,7 @@ const BoxComponent = props => { } // 拼板信息表单 const upViewProps20 = getUpViewPropsByITag(20); + // 如果是卷筒类需要单独处理 const { sBackProcessData = [] } = slaveRowData; @@ -1742,10 +1761,27 @@ const BoxComponent = props => { dHorizontalType: dHorizontalType, // 判断 dPortraitType: dPortraitType, }; + let juantongConfig = { + + } + if (selectedNode.sTypeKey === 'juantong') { + const {dYBJJ,dXBJJ,dZBLB} = slaveData[index] + juantongConfig = { + dColGap:dYBJJ, + dRowGap:dXBJJ, + iCol:dPortraitType, + iRow:dHorizontalType, + dCutEdge:dZBLB + } + } + const newSlaveData = { + ...juantongConfig, + ...updatedProduct + } // 更新状态 props.setState(prevState => ({ ...prevState, - slaveData: slaveData.map((item, i) => (i === index ? updatedProduct : item)), + slaveData: slaveData.map((item, i) => (i === index ? newSlaveData : item)), })); } diff --git a/src/components/QuickQuote/index.less b/src/components/QuickQuote/index.less index 3ba41f9..e09ecac 100644 --- a/src/components/QuickQuote/index.less +++ b/src/components/QuickQuote/index.less @@ -100,7 +100,6 @@ } } } - } .viewTableDownView, @@ -133,7 +132,7 @@ flex: 0 0 25px !important; max-width: 25px !important; - >label { + > label { display: flex; width: 100%; align-items: center; @@ -156,7 +155,7 @@ max-width: calc(100% - 25px); } - .viewStyle>.ant-col-24 { + .viewStyle > .ant-col-24 { padding-left: 100px; } } @@ -247,13 +246,13 @@ display: flex; position: relative; - >div:first-child { + > div:first-child { flex: 1; border-right: 1px solid #d7d7d7; } - >div:nth-child(2) { - >div:first-child { + > div:nth-child(2) { + > div:first-child { display: flex; } } @@ -293,7 +292,6 @@ position: relative; overflow: hidden; } - } .boxPinbanBtn { @@ -374,7 +372,7 @@ .boxTree { width: 250px; height: 100%; - background: #3274b7; + background: var(--xly-skin-header-color, #383d41); padding: 10px 0 0 10px; overflow: hidden; @@ -388,8 +386,11 @@ .ant-tree-title { color: #fff; - font-size: 16px; - font-weight: bold; + font-size: 14px; + font-family: Monospaced Number, Chinese Quote, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, + Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif !important; + + // font-weight: bold; } .ant-tree-node-content-wrapper.ant-tree-node-selected { @@ -400,7 +401,6 @@ background-color: #009688; } } - } } @@ -409,7 +409,6 @@ :global { .ant-tree { - .ant-tree-title, .ant-badge { color: #5c6374; @@ -462,7 +461,7 @@ width: 16px; height: 16px; - >span { + > span { font-size: 10px; } } @@ -474,7 +473,7 @@ .ant-form-item-label { label { &::before { - content: ''; + content: ""; display: block; width: 5px; height: 5px; @@ -485,4 +484,4 @@ } } } -} \ No newline at end of file +} -- libgit2 0.22.2