From 856774da33d3e67ec7c343c7b7789a7a39bc4e46 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=B3=B4=EA=B3=A4?=
 <lightone2017@codebridge-x.com>
Date: Fri, 13 Mar 2026 21:41:14 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20[fire-shutter]=20=EC=85=94=ED=84=B0?=
 =?UTF-8?q?=EB=B0=95=EC=8A=A4=20=EC=B8=A1=EB=A9=B4=EB=8F=84=EB=A5=BC=20?=
 =?UTF-8?q?=EC=8B=A4=EC=A0=9C=20=EC=A0=88=EA=B3=A1=20=EA=B5=AC=EC=A1=B0?=
 =?UTF-8?q?=EB=A1=9C=20=EA=B0=9C=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 단순 사각형 → L자형 실제 판재 구조 (후면/상판/전면/하판 4개 판)
- 절곡도 기준 플랜지 접합부 표시 (20mm, 50mm, 15mm, 13mm, 17mm)
- 전면판 높이(240mm)와 후면판 높이(380mm) 차이 반영
- 가이드레일 진입부 표시 (레일70, 100mm 올라옴)
- 슬랫 출구 개방 영역 표시
- 치수선: 깊이, 전체높이, 전면높이, 하판폭, 레일폭
---
 .../rd/fire-shutter-drawing/index.blade.php   | 123 ++++++++++++++----
 1 file changed, 99 insertions(+), 24 deletions(-)

diff --git a/resources/views/rd/fire-shutter-drawing/index.blade.php b/resources/views/rd/fire-shutter-drawing/index.blade.php
index 985f4295..cf0bf42b 100644
--- a/resources/views/rd/fire-shutter-drawing/index.blade.php
+++ b/resources/views/rd/fire-shutter-drawing/index.blade.php
@@ -1218,26 +1218,73 @@ function renderSbFront() {
 
     function renderSbSide() {
         const b = S.sb;
-        const sc = Math.min(500 / b.depth, 600 / b.height);
-        const sd = b.depth * sc, sh = b.height * sc;
+        const p = PRODUCTS[S.productType];
+        const D = b.depth, H = b.height;
+        const fH = p.sb.frontH;        // 전면 높이 (screen:240, steel:410)
+        const sc = Math.min(480 / D, 520 / H);
         const pad = 80;
-        const svgW = sd + pad * 2 + 100, svgH = sh + pad * 2 + 60;
-        const ox = pad + 50, oy = pad;
-        const shaftR = (b.shaftDia / 2) * sc;
-        const shaftCx = ox + sd / 2;
-        const shaftCy = oy + sh * 0.45;
-        const rollR = shaftR + 20 * sc;
+        const sD = D*sc, sH = H*sc, sfH = fH*sc;
+        const svgW = sD + pad*2 + 150, svgH = sH + pad*2 + 100;
+        const ox = pad + 65, oy = pad + 30;
+        const vt = Math.max(5, (b.thickness||1.6)*sc*3); // 판 두께 (표시용 확대)
+        const bpW = Math.min(fH, D-50)*sc; // 하판 폭 (≒ frontH, 절곡도 기준 240mm)
+        const railW = (S.productType==='screen' ? 70 : 120)*sc;
+        const railUp = 100*sc;
+        const shaftR = (b.shaftDia/2)*sc;
+        // 샤프트: 상판~하판 사이 공간 중앙에 배치
+        const shaftCx = ox + sD*0.48;
+        const shaftCy = oy + sfH*0.5;
+        const rollR = shaftR + 20*sc;
+        const pf='#4b5563', ps='#6b7280', ff='#374151';
+
+        // 절곡 치수 (절곡도 기준)
+        const f20=20*sc, f50=50*sc, f55=55*sc, f15=15*sc, f13=13*sc, f17=17*sc;
 
         const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${svgW} ${svgH}" style="max-width:100%;max-height:100%;">
-            <text x="${svgW/2}" y="25" fill="#94a3b8" font-size="14" font-weight="900" text-anchor="middle" font-family="Pretendard">셔터박스 측면 단면도 (Side Cross-Section)</text>
-            <!-- Case outer -->
-            <rect x="${ox}" y="${oy}" width="${sd}" height="${sh}" fill="#374151" opacity="0.3" stroke="#94a3b8" stroke-width="2.5" rx="4"/>
-            <!-- Shaft -->
+            <text x="${svgW/2}" y="22" fill="#94a3b8" font-size="14" font-weight="900" text-anchor="middle" font-family="Pretendard">셔터박스 측면 단면도 (Side Cross-Section)</text>
+
+            <!-- L자형 내부 공간 (연한 배경) -->
+            <path d="M${ox+vt},${oy+vt} L${ox+sD-vt},${oy+vt} L${ox+sD-vt},${oy+sfH-vt} L${ox+sD-bpW+vt},${oy+sfH-vt} L${ox+sD-bpW+vt},${oy+sH} L${ox+vt},${oy+sH} Z" fill="rgba(55,65,81,0.12)"/>
+
+            <!-- ━━━ 4개 주요 판재 ━━━ -->
+            <!-- 후면판 (벽측, 전체높이 ${H}mm) -->
+            <rect x="${ox}" y="${oy}" width="${vt}" height="${sH}" fill="${pf}" stroke="${ps}" stroke-width="1"/>
+            <!-- 상판 (전체깊이 ${D}mm) -->
+            <rect x="${ox}" y="${oy}" width="${sD}" height="${vt}" fill="${pf}" stroke="${ps}" stroke-width="1"/>
+            <!-- 전면판 (개구부, ${fH}mm) -->
+            <rect x="${ox+sD-vt}" y="${oy}" width="${vt}" height="${sfH}" fill="${pf}" stroke="${ps}" stroke-width="1"/>
+            <!-- 하판 (${Math.round(bpW/sc)}mm) -->
+            <rect x="${ox+sD-bpW}" y="${oy+sfH-vt}" width="${bpW}" height="${vt}" fill="${pf}" stroke="${ps}" stroke-width="1"/>
+
+            <!-- ━━━ 절곡 플랜지 (접합부) ━━━ -->
+            <!-- 후면 상부: 20mm 내향 플랜지 (상판 연결) -->
+            <rect x="${ox+vt}" y="${oy+vt}" width="${f20}" height="${vt*0.6}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1"/>
+            <!-- 후면 상부: 55mm+15mm 립 (고정 브라켓) -->
+            <rect x="${ox+vt}" y="${oy+vt+f55}" width="${f15}" height="${vt*0.6}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1"/>
+            <!-- 전면 상부: 50mm 내향 플랜지 (상판 연결) -->
+            <rect x="${ox+sD-vt-f50}" y="${oy+vt}" width="${f50}" height="${vt*0.6}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1"/>
+            <!-- 전면 상부: 15mm+20mm 이중 접합 -->
+            <rect x="${ox+sD-vt-f50}" y="${oy+vt+f15}" width="${f20}" height="${vt*0.5}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1" opacity="0.7"/>
+            <!-- 후면 하부: 50mm 선반 (레일 지지) -->
+            <rect x="${ox+vt}" y="${oy+sH-vt}" width="${f50}" height="${vt}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1"/>
+            <!-- 하판 좌측: 13mm 절곡 플랜지 -->
+            <rect x="${ox+sD-bpW-f13}" y="${oy+sfH-vt}" width="${f13}" height="${vt}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1"/>
+            <!-- 하판 하부: 17mm 탭 (좌/우) -->
+            <rect x="${ox+sD-bpW}" y="${oy+sfH}" width="${f17}" height="${vt*0.5}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1"/>
+            <rect x="${ox+sD-f17}" y="${oy+sfH}" width="${f17}" height="${vt*0.5}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1"/>
+            <!-- 전면 하부: 17mm+13mm 접합부 -->
+            <rect x="${ox+sD-vt-f17}" y="${oy+sfH-f13}" width="${f17}" height="${f13}" fill="${ff}" stroke="${ps}" stroke-width="0.5" rx="1" opacity="0.6"/>
+
+            <!-- ━━━ 가이드레일 진입부 (하단 좌측) ━━━ -->
+            <rect x="${ox}" y="${oy+sH-railUp}" width="${railW}" height="${railUp}" fill="rgba(100,116,139,0.15)" stroke="#64748b" stroke-width="1.5" stroke-dasharray="4 2" rx="2"/>
+            <text x="${ox+railW/2}" y="${oy+sH-railUp/2}" fill="#64748b" font-size="9" font-weight="700" text-anchor="middle" font-family="Pretendard">레일 ${Math.round(railW/sc)}</text>
+            <text x="${ox+railW/2}" y="${oy+sH-railUp/2+12}" fill="#64748b" font-size="7" text-anchor="middle" font-family="Pretendard" opacity="0.7">↑ 100mm 진입</text>
+
+            <!-- ━━━ 내부 구성품 ━━━ -->
             ${b.showShaft ? `
                 <circle cx="${shaftCx}" cy="${shaftCy}" r="${shaftR}" fill="#475569" stroke="#64748b" stroke-width="2"/>
                 <circle cx="${shaftCx}" cy="${shaftCy}" r="4" fill="#94a3b8"/>
             ` : ''}
-            <!-- Slat roll -->
             ${b.showSlatRoll ? `
                 <circle cx="${shaftCx}" cy="${shaftCy}" r="${rollR}" fill="none" stroke="#f59e0b" stroke-width="3" opacity="0.5" stroke-dasharray="6 3"/>
                 ${Array.from({length:5},(_,i) => {
@@ -1245,19 +1292,47 @@ function renderSbSide() {
                     return r < rollR ? `<circle cx="${shaftCx}" cy="${shaftCy}" r="${r}" fill="none" stroke="#f59e0b" stroke-width="0.5" opacity="0.3"/>` : '';
                 }).join('')}
             ` : ''}
-            <!-- Motor (side view = circle) -->
             ${b.showMotor ? `
-                <circle cx="${shaftCx}" cy="${shaftCy}" r="${shaftR * 0.6}" fill="#2563eb" opacity="0.5" stroke="#3b82f6" stroke-width="1.5"/>
-                <text x="${shaftCx}" y="${shaftCy + 3}" fill="white" font-size="8" font-weight="900" text-anchor="middle" font-family="Pretendard">M</text>
+                <circle cx="${shaftCx}" cy="${shaftCy}" r="${shaftR*0.6}" fill="#2563eb" opacity="0.5" stroke="#3b82f6" stroke-width="1.5"/>
+                <text x="${shaftCx}" y="${shaftCy+3}" fill="white" font-size="8" font-weight="900" text-anchor="middle" font-family="Pretendard">M</text>
             ` : ''}
-            <!-- Slat exit -->
-            <rect x="${ox + sd * 0.2}" y="${oy + sh - 5}" width="${sd * 0.6}" height="5" fill="#f59e0b" opacity="0.6" rx="1"/>
-            <!-- Slat curtain going down -->
-            <line x1="${ox + sd * 0.5}" y1="${oy + sh}" x2="${ox + sd * 0.5}" y2="${oy + sh + 30}" stroke="#9ca3af" stroke-width="2" stroke-dasharray="4 2"/>
-            <text x="${ox + sd * 0.5 + 10}" y="${oy + sh + 20}" fill="#94a3b8" font-size="9" font-weight="700" font-family="Pretendard">↓ 슬랫</text>
-            <!-- Dimensions -->
-            <text x="${ox + sd/2}" y="${oy + sh + 50}" fill="#3b82f6" font-size="11" font-weight="900" text-anchor="middle" font-family="Pretendard">깊이 ${b.depth} mm</text>
-            <text x="${ox + sd + 25}" y="${oy + sh/2 + 4}" fill="#3b82f6" font-size="11" font-weight="900" text-anchor="start" font-family="Pretendard">${b.height} mm</text>
+
+            <!-- 슬랫 출구 (하판~후면 사이 개방부) -->
+            <line x1="${ox+sD-bpW+vt}" y1="${oy+sfH}" x2="${ox+sD-bpW+vt}" y2="${oy+sH+15}" stroke="#9ca3af" stroke-width="2" stroke-dasharray="4 2"/>
+            <text x="${ox+sD-bpW+vt+10}" y="${oy+sH+8}" fill="#94a3b8" font-size="9" font-weight="700" font-family="Pretendard">↓ 슬랫</text>
+            <!-- 개방 영역 표시 -->
+            <text x="${ox+(sD-bpW)*0.5+vt}" y="${oy+sfH+(sH-sfH)*0.5}" fill="rgba(148,163,184,0.3)" font-size="10" text-anchor="middle" font-family="Pretendard">개방</text>
+
+            <!-- ━━━ 치수선 ━━━ -->
+            <!-- 깊이 (상단) -->
+            <line x1="${ox}" y1="${oy-15}" x2="${ox+sD}" y2="${oy-15}" stroke="#3b82f6" stroke-width="1"/>
+            <line x1="${ox}" y1="${oy-20}" x2="${ox}" y2="${oy-5}" stroke="#3b82f6" stroke-width="0.5"/>
+            <line x1="${ox+sD}" y1="${oy-20}" x2="${ox+sD}" y2="${oy-5}" stroke="#3b82f6" stroke-width="0.5"/>
+            <text x="${ox+sD/2}" y="${oy-22}" fill="#3b82f6" font-size="11" font-weight="900" text-anchor="middle" font-family="Pretendard">깊이 ${D} mm</text>
+            <!-- 전체 높이 (우측) -->
+            <line x1="${ox+sD+15}" y1="${oy}" x2="${ox+sD+15}" y2="${oy+sH}" stroke="#3b82f6" stroke-width="1"/>
+            <line x1="${ox+sD+10}" y1="${oy}" x2="${ox+sD+20}" y2="${oy}" stroke="#3b82f6" stroke-width="0.5"/>
+            <line x1="${ox+sD+10}" y1="${oy+sH}" x2="${ox+sD+20}" y2="${oy+sH}" stroke="#3b82f6" stroke-width="0.5"/>
+            <text x="${ox+sD+25}" y="${oy+sH/2+4}" fill="#3b82f6" font-size="11" font-weight="900" text-anchor="start" font-family="Pretendard">${H} mm</text>
+            <!-- 전면 높이 (우측 외곽) -->
+            <line x1="${ox+sD+45}" y1="${oy}" x2="${ox+sD+45}" y2="${oy+sfH}" stroke="#22c55e" stroke-width="1"/>
+            <line x1="${ox+sD+40}" y1="${oy}" x2="${ox+sD+50}" y2="${oy}" stroke="#22c55e" stroke-width="0.5"/>
+            <line x1="${ox+sD+40}" y1="${oy+sfH}" x2="${ox+sD+50}" y2="${oy+sfH}" stroke="#22c55e" stroke-width="0.5"/>
+            <text x="${ox+sD+55}" y="${oy+sfH/2+4}" fill="#22c55e" font-size="10" font-weight="700" text-anchor="start" font-family="Pretendard">${fH} mm</text>
+            <!-- 하판 폭 (하단) -->
+            <line x1="${ox+sD-bpW}" y1="${oy+sfH+18}" x2="${ox+sD}" y2="${oy+sfH+18}" stroke="#64748b" stroke-width="0.8"/>
+            <line x1="${ox+sD-bpW}" y1="${oy+sfH+13}" x2="${ox+sD-bpW}" y2="${oy+sfH+23}" stroke="#64748b" stroke-width="0.5"/>
+            <line x1="${ox+sD}" y1="${oy+sfH+13}" x2="${ox+sD}" y2="${oy+sfH+23}" stroke="#64748b" stroke-width="0.5"/>
+            <text x="${ox+sD-bpW/2}" y="${oy+sfH+32}" fill="#64748b" font-size="9" font-weight="700" text-anchor="middle" font-family="Pretendard">하판 ${Math.round(bpW/sc)} mm</text>
+            <!-- 레일 폭 (하단 좌측) -->
+            <line x1="${ox}" y1="${oy+sH+15}" x2="${ox+railW}" y2="${oy+sH+15}" stroke="#64748b" stroke-width="0.8"/>
+            <line x1="${ox}" y1="${oy+sH+10}" x2="${ox}" y2="${oy+sH+20}" stroke="#64748b" stroke-width="0.5"/>
+            <line x1="${ox+railW}" y1="${oy+sH+10}" x2="${ox+railW}" y2="${oy+sH+20}" stroke="#64748b" stroke-width="0.5"/>
+            <text x="${ox+railW/2}" y="${oy+sH+28}" fill="#64748b" font-size="8" font-weight="700" text-anchor="middle" font-family="Pretendard">${Math.round(railW/sc)} mm</text>
+
+            <!-- 측면 라벨 -->
+            <text x="${ox-12}" y="${oy+sH/2}" fill="#94a3b8" font-size="9" font-weight="700" text-anchor="middle" font-family="Pretendard" transform="rotate(-90,${ox-12},${oy+sH/2})">벽측 (후면)</text>
+            <text x="${ox+sD+8}" y="${oy+sfH/2}" fill="#94a3b8" font-size="9" font-weight="700" text-anchor="middle" font-family="Pretendard" transform="rotate(90,${ox+sD+8},${oy+sfH/2})">개구부 (전면)</text>
         </svg>`;
 
         displaySvg(svg);