From 8ca01757c966f44bb0e626c6f8426877f04f3ece Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?= <43837214+Minsiki@users.noreply.github.com> Date: Mon, 17 Mar 2025 15:43:37 +0900 Subject: [PATCH 1/8] =?UTF-8?q?=F0=9F=9A=A8chore:=20Sync=20Sass?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/_modal.scss | 112 +++++++++++++++++++++++++++++++++++++---- 1 file changed, 103 insertions(+), 9 deletions(-) diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index 65b104b7..f2b6503c 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -2172,17 +2172,13 @@ $alert-color: #101010; &.tab2{ margin-top: 10px; gap: 15px; - + .eaves-keraba-table{ + margin-top: 0; + } } .module-flex-item{ flex: 1; - .module-flex-item-tit{ - font-size: 12px; - font-weight: 500; - color: #fff; - padding-bottom: 10px; - border-bottom: 1px solid #4D4D4D; - } + .flex-item-btn-wrap{ display: grid; grid-template-columns: repeat(2, 1fr); @@ -2194,11 +2190,24 @@ $alert-color: #101010; flex-direction: column; justify-content: flex-start; flex: none; - padding-top: 27.5px; width: 260px; } } } +.module-flex-item-tit-wrap{ + display: flex; + align-items: center; + padding-bottom: 10px; + border-bottom: 1px solid #4D4D4D; + .module-flex-item-tit{ + font-size: 12px; + font-weight: 500; + color: #fff; + } + button{ + margin-left: auto; + } +} .module-table-box{ .module-table-inner{ @@ -2277,4 +2286,89 @@ $alert-color: #101010; box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2), 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2), 2.5em 0em 0 0em rgba(255, 255, 255, 0.2), 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2), 0em 2.5em 0 0em rgba(255, 255, 255, 0.2), -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5), -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #fff; } } +} + +.roof-module-inner{ + display: flex; + .compas-wrapper{ + position: relative; + flex: none; + width: 300px; + padding-right: 15px; + &:before{ + content: ''; + position: absolute; + top: 0; + right: 10px; + width: 1px; + height: 100%; + background-color: #424242; + } + } + .compas-table-wrap{ + display: flex; + flex-direction: column; + flex: 1; + + + } + .compas-table-box{ + background-color: #3D3D3D; + padding: 10px; + .outline-form{ + span{ + width: auto; + } + } + .compas-grid-table{ + display: grid; + gap: 10px; + grid-template-columns: repeat(2, 1fr); + .outline-form{ + span{ + width: 60px; + &.thin{ + width: 20px; + } + } + } + } + } +} + +.module-table-block-wrap{ + .roof-module-table{ + &.self{ + table{ + table-layout: fixed; + } + } + } + .self-table-radio{ + display: flex; + align-items: center; + justify-content: center; + } +} + +.module-area{ + display: flex; + align-items: center; + .module-area-title{ + flex: none; + font-size: 12px; + color: #fff; + font-weight: 500; + margin-right: 20px; + } + .outline-form{ + flex: 1; + } +} + +.placement-name-guide{ + font-size: 11px; + margin-left: 10px; + color: #53a7eb; + font-weight: 500; } \ No newline at end of file From e99a1a38548a0292174f0e96d3933a7fb0352667 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?= <43837214+Minsiki@users.noreply.github.com> Date: Mon, 17 Mar 2025 15:43:57 +0900 Subject: [PATCH 2/8] =?UTF-8?q?=EB=B0=B0=EC=B9=98=EB=A9=B4=20=EC=B4=88?= =?UTF-8?q?=EA=B8=B0=EC=84=A4=EC=A0=95=20=ED=99=94=EB=A9=B4=20=EB=8B=A4?= =?UTF-8?q?=EA=B5=AD=EC=96=B4=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/locales/ja.json | 1 + src/locales/ko.json | 1 + 2 files changed, 2 insertions(+) diff --git a/src/locales/ja.json b/src/locales/ja.json index 0028a047..e142119b 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -18,6 +18,7 @@ "plan.menu.placement.surface.initial.setting": "配置面初期設定", "modal.placement.initial.setting.plan.drawing": "図面の作成方法", "modal.placement.initial.setting.plan.drawing.size.stuff": "寸法入力による物件作成", + "modal.placement.initial.setting.plan.drawing.size.info": "※数字は[半角]入力のみ可能です。", "modal.placement.initial.setting.size": "寸法入力方法", "modal.placement.initial.setting.size.info": "寸法入力方法案内", "modal.placement.initial.setting.size.roof": "伏図入力", diff --git a/src/locales/ko.json b/src/locales/ko.json index 4c051305..94b5e52e 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -18,6 +18,7 @@ "plan.menu.placement.surface.initial.setting": "배치면 초기설정", "modal.placement.initial.setting.plan.drawing": "도면 작성방법", "modal.placement.initial.setting.plan.drawing.size.stuff": "치수 입력에 의한 물건 작성", + "modal.placement.initial.setting.plan.drawing.size.info": "※숫자는 [반각] 입력만 가능합니다.", "modal.placement.initial.setting.size": "치수 입력방법", "modal.placement.initial.setting.size.info": "치수 입력방법 안내", "modal.placement.initial.setting.size.roof": "복시도 입력", From 16423de079bbe5de6f84182a2e0c6ce9ecd0bdf9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?= <43837214+Minsiki@users.noreply.github.com> Date: Mon, 17 Mar 2025 15:44:12 +0900 Subject: [PATCH 3/8] =?UTF-8?q?=EB=B0=B0=EC=B9=98=EB=A9=B4=20=EC=B4=88?= =?UTF-8?q?=EA=B8=B0=EC=84=A4=EC=A0=95=20=EB=8B=A4=EA=B5=AD=EC=96=B4=20?= =?UTF-8?q?=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../modal/placementShape/PlacementShapeSetting.jsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx index a70a8c65..364526fb 100644 --- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx +++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx @@ -271,7 +271,12 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla {getMessage('modal.placement.initial.setting.plan.drawing')} - {getMessage('modal.placement.initial.setting.plan.drawing.size.stuff')} + +
+ {getMessage('modal.placement.initial.setting.plan.drawing.size.stuff')}{' '} + {getMessage('modal.placement.initial.setting.plan.drawing.size.info')} +
+ From ced0eb9fc6d646ea98d172947405d2395b13818c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?= <43837214+Minsiki@users.noreply.github.com> Date: Wed, 2 Apr 2025 13:53:24 +0900 Subject: [PATCH 4/8] =?UTF-8?q?=F0=9F=9A=A8chore:=20Sync=20Sass?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../static/images/canvas/hide-check-arr.svg | 3 + src/styles/_contents.scss | 8 ++ src/styles/_modal.scss | 91 +++++++++++++++---- src/styles/_reset.scss | 12 ++- src/styles/_table.scss | 10 ++ 5 files changed, 99 insertions(+), 25 deletions(-) create mode 100644 public/static/images/canvas/hide-check-arr.svg diff --git a/public/static/images/canvas/hide-check-arr.svg b/public/static/images/canvas/hide-check-arr.svg new file mode 100644 index 00000000..f2a16099 --- /dev/null +++ b/public/static/images/canvas/hide-check-arr.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/styles/_contents.scss b/src/styles/_contents.scss index 10a04637..bfd7b1f8 100644 --- a/src/styles/_contents.scss +++ b/src/styles/_contents.scss @@ -340,6 +340,14 @@ &.active{ top: calc(92.8px + 50px); } + .canvas-id{ + display: flex; + align-items: center; + padding: 9.6px 20px; + font-size: 12px; + color: #fff; + background-color: #1083E3; + } .canvas-plane-wrap{ display: flex; align-items: center; diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index f2b6503c..fef7c2fd 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -279,10 +279,11 @@ $alert-color: #101010; border-bottom: 1px solid #424242; } } -.grid-check-form-block{ - display: block; - > div{ - margin-bottom: 10px; +.grid-check-form-flex{ + display: flex; + gap: 10px; + .d-check-box{ + flex: 1; } } .grid-option-overflow{ @@ -1313,13 +1314,13 @@ $alert-color: #101010; .circle { position: absolute; - width: 12px; - height: 12px; + width: 10px; + height: 10px; border: 1px solid #fff; border-radius: 50%; - top: 95%; + top: 88%; left: 50%; - transform-origin: 0 -90px; /* 중심에서 반지름 거리만큼 떨어져 위치 */ + transform-origin: 0 -76px; /* 중심에서 반지름 거리만큼 떨어져 위치 */ cursor:pointer; z-index: 3; /* 0번을 180도 위치(아래)에, 13번을 0도 위치(위)에 배치 */ @@ -1366,8 +1367,8 @@ $alert-color: #101010; top: 50%; left: 50%; transform: translate(-50%, -50%); - width: 5px; - height: 5px; + width: 4px; + height: 4px; background-color: #fff; border-radius: 50%; } @@ -1381,15 +1382,15 @@ $alert-color: #101010; top: 50%; left: 50%; transform: translate(-50%, -50%); - width: 148px; - height: 148px; + width: 121px; + height: 121px; border: 4px solid #fff; border-radius: 50%; .compas-arr{ width: 100%; height: 100%; background: url(../../public/static/images/canvas/compas.svg)no-repeat center; - background-size: 122px 122px; + background-size: 100px 100px; } } } @@ -1441,10 +1442,10 @@ $alert-color: #101010; .roof-module-compas{ margin-bottom: 24px; .compas-box-inner{ - width: 280px; - height: 253px; + width: 235px; + height: 215px; .circle{ - top: 86%; + top: 85%; // &:nth-child(1), // &:nth-child(7), // &:nth-child(13), @@ -1461,7 +1462,7 @@ $alert-color: #101010; // } // } i{ - top: 22px; + top: 19px; } &.act{ i{color: #8B8B8B;} @@ -1482,6 +1483,10 @@ $alert-color: #101010; .outline-form{ flex: 1; } + .non-flex{ + min-width: 300px; + flex: none; + } } .module-box-tab{ @@ -2183,14 +2188,20 @@ $alert-color: #101010; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; - margin-bottom: 24px; + margin-bottom: 10px; } &.non-flex{ display: flex; flex-direction: column; justify-content: flex-start; flex: none; - width: 260px; + width: 340px; + } + .flex-item-button{ + margin-top: 10px; + button{ + width: 100%; + } } } } @@ -2326,7 +2337,7 @@ $alert-color: #101010; grid-template-columns: repeat(2, 1fr); .outline-form{ span{ - width: 60px; + width: 65px; &.thin{ width: 20px; } @@ -2336,6 +2347,7 @@ $alert-color: #101010; } } + .module-table-block-wrap{ .roof-module-table{ &.self{ @@ -2371,4 +2383,43 @@ $alert-color: #101010; margin-left: 10px; color: #53a7eb; font-weight: 500; +} + +.hexagonal-flex-wrap{ + display: flex; + gap: 10px; + .non-flex{ + flex: none; + } +} + +.hexagonal-radio-wrap{ + padding: 17px 10px; +} + +.hide-check-guide{ + display: flex; + align-items: center; + font-size: 12px; + color: #fff; + margin-top: 10px; + font-weight: 500; + .arr{ + width: 13px; + height: 13px; + margin-left: 10px; + background: url(../../public/static/images/canvas/hide-check-arr.svg) no-repeat center; + background-size: contain; + transform: rotate(180deg); + &.act{ + transform: rotate(0deg); + } + } +} + +.module-table-box{ + &.hide{ + overflow: hidden; + height: 0; + } } \ No newline at end of file diff --git a/src/styles/_reset.scss b/src/styles/_reset.scss index 34dcaf33..fab3eb04 100644 --- a/src/styles/_reset.scss +++ b/src/styles/_reset.scss @@ -222,15 +222,16 @@ button{ padding: 0 10px; line-height: 28px; font-family: 'Noto Sans JP', sans-serif; - background-color: transparent; + background-color: #353535; border: 1px solid #484848; color: #fff; &.blue{ background-color: #4C6FBF; border: 1px solid #4C6FBF; &:hover{ - background-color: #414E6C; - border: 1px solid #414E6C; + background-color: #4C6FBF; + border: 1px solid #4C6FBF; + font-weight: normal; } } &.white{ @@ -241,13 +242,14 @@ button{ background-color: #fff; border: 1px solid #fff; color: #101010; + font-weight: normal; } } &:hover{ - font-weight: 400; - background-color: transparent; + background-color: #353535; border: 1px solid #484848; color: #fff; + font-weight: normal; } } &.self{ diff --git a/src/styles/_table.scss b/src/styles/_table.scss index 5efacd7c..5fe69afe 100644 --- a/src/styles/_table.scss +++ b/src/styles/_table.scss @@ -236,6 +236,16 @@ table{ .d-check-box{ opacity: 0.5; } + .color-wrap{ + display: flex; + align-items: center; + justify-content: center; + .color-box{ + width: 14px; + height: 14px; + margin-right: 8px; + } + } } } tbody{ From 8354508a2bf1e0afa06a50fcc6f887683942a85a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?= <43837214+Minsiki@users.noreply.github.com> Date: Wed, 2 Apr 2025 13:53:34 +0900 Subject: [PATCH 5/8] =?UTF-8?q?=EB=8B=A4=EA=B5=AD=EC=96=B4=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/locales/ja.json | 17 +++++++++++++---- src/locales/ko.json | 15 ++++++++++++--- 2 files changed, 25 insertions(+), 7 deletions(-) diff --git a/src/locales/ja.json b/src/locales/ja.json index e142119b..7055cab8 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -89,13 +89,17 @@ "plan.menu.module.circuit.setting.default": "モジュール/架台設定", "modal.module.basic.setting.orientation.setting": "方位設定", "modal.module.basic.setting.orientation.setting.info": "※シミュレーション計算用方位を指定します。南の方位を設定してください。", - "modal.module.basic.setting.orientation.setting.angle.passivity": "勾配を直接入力", + "modal.module.basic.setting.orientation.setting.angle.passivity": "角度変更", "modal.module.basic.setting.module.roof.material": "屋根材", "modal.module.basic.setting.module.trestle.maker": "架台メーカー", "modal.module.basic.setting.module.rafter.margin": "垂木の間隔", "modal.module.basic.setting.module.construction.method": "工法", "modal.module.basic.setting.module.under.roof": "屋根の下", "modal.module.basic.setting.module.setting": "モジュールの選択", + "modal.module.basic.setting.module.placement.area": "モジュール配置領域", + "modal.module.basic.setting.module.placement.area.eaves": "軒側", + "modal.module.basic.setting.module.placement.area.ridge": "棟側", + "modal.module.basic.setting.module.placement.area.keraba": "けらぱ", "modal.module.basic.setting.module.hajebichi": "ハゼピッチ", "modal.module.basic.setting.module.setting.info1": "※勾配の範囲には制限があります。屋根傾斜が2.5値未満10値を超える場合は、施工が可能かどうか施工マニュアルを確認してください。", "modal.module.basic.setting.module.setting.info2": "※モジュール配置時は、施工マニュアルに記載されている＜モジュール配置条件＞を必ずご確認ください。", @@ -113,12 +117,16 @@ "modal.module.basic.setting.module.placement": "モジュールの配置", "modal.module.basic.setting.module.placement.select.fitting.type": "設置形態を選択してください。", "modal.module.basic.setting.module.placement.waterfowl.arrangement": "千鳥配置", + "modal.module.basic.setting.module.placement.max.row.amount": "Max単数", + "modal.module.basic.setting.module.placement.mix.max.row.amount": "混合Max単数", + "modal.module.basic.setting.module.placement.row.amount": "単数", + "modal.module.basic.setting.module.placement.column.amount": "熱水", "modal.module.basic.setting.module.placement.do": "する", "modal.module.basic.setting.module.placement.do.not": "しない", "modal.module.basic.setting.module.placement.arrangement.standard": "配置基準", "modal.module.basic.setting.module.placement.arrangement.standard.center": "中央", - "modal.module.basic.setting.module.placement.arrangement.standard.eaves": "軒", - "modal.module.basic.setting.module.placement.arrangement.standard.ridge": "棟", + "modal.module.basic.setting.module.placement.arrangement.standard.eaves": "軒の側", + "modal.module.basic.setting.module.placement.arrangement.standard.ridge": "龍丸側", "modal.module.basic.setting.module.placement.maximum": "最大配置", "modal.module.basic.setting.pitch.module.placement.standard.setting": "配置基準設定", "modal.module.basic.setting.pitch.module.placement.standard.setting.south": "南向き設置", @@ -130,8 +138,9 @@ "modal.module.basic.setting.pitch.module.column.amount": "列数", "modal.module.basic.setting.pitch.module.column.margin": "左右間隔", "modal.module.basic.setting.prev": "移転", + "modal.module.basic.setting.row.batch": "単数指定配置", "modal.module.basic.setting.passivity.placement": "手動配置", - "modal.module.basic.setting.auto.placement": "設定値に自動配置", + "modal.module.basic.setting.auto.placement": "自動配置", "plan.menu.module.circuit.setting.circuit.trestle.setting": "回路設定", "modal.circuit.trestle.setting": "回路設定", "modal.circuit.trestle.setting.alloc.trestle": "架台配置", diff --git a/src/locales/ko.json b/src/locales/ko.json index 94b5e52e..93801850 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -89,13 +89,17 @@ "plan.menu.module.circuit.setting.default": "모듈/가대설정", "modal.module.basic.setting.orientation.setting": "방위 설정", "modal.module.basic.setting.orientation.setting.info": "※시뮬레이션 계산용 방위를 지정합니다. 남쪽의 방위를 설정해주세요.", - "modal.module.basic.setting.orientation.setting.angle.passivity": "각도를 직접 입력", + "modal.module.basic.setting.orientation.setting.angle.passivity": "각도 입력", "modal.module.basic.setting.module.roof.material": "지붕재", "modal.module.basic.setting.module.trestle.maker": "가대메이커", "modal.module.basic.setting.module.rafter.margin": "서까래 간격", "modal.module.basic.setting.module.construction.method": "공법", "modal.module.basic.setting.module.under.roof": "지붕밑바탕", "modal.module.basic.setting.module.setting": "모듈 선택", + "modal.module.basic.setting.module.placement.area": "모듈 배치 영역", + "modal.module.basic.setting.module.placement.area.eaves": "처마쪽", + "modal.module.basic.setting.module.placement.area.ridge": "용마루쪽", + "modal.module.basic.setting.module.placement.area.keraba": "케라바쪽", "modal.module.basic.setting.module.hajebichi": "망둥어 피치", "modal.module.basic.setting.module.setting.info1": "※ 구배의 범위에는 제한이 있습니다. 지붕경사가 2.5치 미만 10치를 초과하는 경우에는 시공이 가능한지 시공 매뉴얼을 확인해주십시오.", "modal.module.basic.setting.module.setting.info2": "※ 모듈 배치 시에는 시공 매뉴얼에 기재된 <모듈 배치 조건>을 반드시 확인해주십시오.", @@ -113,12 +117,16 @@ "modal.module.basic.setting.module.placement": "모듈 배치", "modal.module.basic.setting.module.placement.select.fitting.type": "설치형태를 선택합니다.", "modal.module.basic.setting.module.placement.waterfowl.arrangement": "물떼새 배치", + "modal.module.basic.setting.module.placement.max.row.amount": "Max 단수", + "modal.module.basic.setting.module.placement.mix.max.row.amount": "혼합Max 단수", + "modal.module.basic.setting.module.placement.row.amount": "단수", + "modal.module.basic.setting.module.placement.column.amount": "열수", "modal.module.basic.setting.module.placement.do": "한다", "modal.module.basic.setting.module.placement.do.not": "하지 않는다", "modal.module.basic.setting.module.placement.arrangement.standard": "배치 기준", "modal.module.basic.setting.module.placement.arrangement.standard.center": "중앙", - "modal.module.basic.setting.module.placement.arrangement.standard.eaves": "처마", - "modal.module.basic.setting.module.placement.arrangement.standard.ridge": "용마루", + "modal.module.basic.setting.module.placement.arrangement.standard.eaves": "처마쪽", + "modal.module.basic.setting.module.placement.arrangement.standard.ridge": "용마루쪽", "modal.module.basic.setting.module.placement.maximum": "최대배치", "modal.module.basic.setting.pitch.module.placement.standard.setting": "배치기준 설정", "modal.module.basic.setting.pitch.module.placement.standard.setting.south": "남향설치", @@ -130,6 +138,7 @@ "modal.module.basic.setting.pitch.module.column.amount": "열수", "modal.module.basic.setting.pitch.module.column.margin": "좌우간격", "modal.module.basic.setting.prev": "이전", + "modal.module.basic.setting.row.batch": "단수지정 배치", "modal.module.basic.setting.passivity.placement": "수동 배치", "modal.module.basic.setting.auto.placement": "설정값으로 자동 배치", "plan.menu.module.circuit.setting.circuit.trestle.setting": "회로설정", From 9df16cad02ba0bce3000661cc3e12285fb97c8d4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?= <43837214+Minsiki@users.noreply.github.com> Date: Wed, 2 Apr 2025 13:54:06 +0900 Subject: [PATCH 6/8] =?UTF-8?q?=EB=AA=A8=EB=93=88=20=EC=97=B4/=EB=8B=A8=20?= =?UTF-8?q?=EB=B2=84=ED=8D=BC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/module/useModule.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/hooks/module/useModule.js b/src/hooks/module/useModule.js index 51cffd65..aa856a67 100644 --- a/src/hooks/module/useModule.js +++ b/src/hooks/module/useModule.js @@ -991,14 +991,14 @@ export function useModule() { const getRowModules = (target) => { return canvas .getObjects() - .filter((obj) => target.surfaceId === obj.surfaceId && obj.name === POLYGON_TYPE.MODULE && obj.top === target.top) + .filter((obj) => target.surfaceId === obj.surfaceId && obj.name === POLYGON_TYPE.MODULE && Math.abs(obj.top - target.top) < 1) .sort((a, b) => a.left - b.left) } const getColumnModules = (target) => { return canvas .getObjects() - .filter((obj) => target.surfaceId === obj.surfaceId && obj.name === POLYGON_TYPE.MODULE && obj.left === target.left) + .filter((obj) => target.surfaceId === obj.surfaceId && obj.name === POLYGON_TYPE.MODULE && Math.abs(obj.left - target.left) < 1) .sort((a, b) => a.top - b.top) } From 4b6f0b1b06c36eda26ca78db25d31b23575a7c9b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?= <43837214+Minsiki@users.noreply.github.com> Date: Wed, 2 Apr 2025 13:54:44 +0900 Subject: [PATCH 7/8] =?UTF-8?q?plan=20tab=20=EC=A2=8C=EC=B8=A1=20objectNo?= =?UTF-8?q?=20=EC=98=81=EC=97=AD=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/floor-plan/CanvasLayout.jsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/floor-plan/CanvasLayout.jsx b/src/components/floor-plan/CanvasLayout.jsx index 43e4388a..059e96aa 100644 --- a/src/components/floor-plan/CanvasLayout.jsx +++ b/src/components/floor-plan/CanvasLayout.jsx @@ -31,6 +31,7 @@ export default function CanvasLayout({ children }) { return (
+
{objectNo}
{plans.map((plan, index) => ( } */} + {tabNum !== 1 && ( @@ -189,6 +318,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) { )} {basicSetting.roofSizeSet && basicSetting.roofSizeSet == '3' && ( <> + diff --git a/src/components/floor-plan/modal/basic/step/Orientation.jsx b/src/components/floor-plan/modal/basic/step/Orientation.jsx index 4e279f04..59ff4f37 100644 --- a/src/components/floor-plan/modal/basic/step/Orientation.jsx +++ b/src/components/floor-plan/modal/basic/step/Orientation.jsx @@ -1,35 +1,153 @@ -import { forwardRef, useContext, useEffect, useImperativeHandle, useState } from 'react' +import { forwardRef, use, useContext, useEffect, useImperativeHandle, useState } from 'react' import { useMessage } from '@/hooks/useMessage' import { useOrientation } from '@/hooks/module/useOrientation' import { getDegreeInOrientation } from '@/util/canvas-util' import { numberCheck } from '@/util/common-utils' import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController' +import { addedRoofsState, basicSettingState } from '@/store/settingAtom' +import { useRecoilState, useRecoilValue } from 'recoil' +import QSelectBox from '@/components/common/select/QSelectBox' +import { moduleSelectionDataState } from '@/store/selectedModuleOptions' -export const Orientation = forwardRef(({ tabNum }, ref) => { +export const Orientation = forwardRef((props, ref) => { const { getMessage } = useMessage() - - const { trigger: canvasPopupStatusTrigger } = useCanvasPopupStatusController(1) - - const { nextStep, compasDeg, setCompasDeg } = useOrientation() - const [hasAnglePassivity, setHasAnglePassivity] = useState(false) + const basicSetting = useRecoilValue(basicSettingState) + const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState) //지붕재 선택 + const [roofTab, setRoofTab] = useState(0) //지붕재 탭 + const { + roofs, + setRoofs, + tabNum, + setTabNum, + compasDeg, + setCompasDeg, + moduleSelectionInitParams, + selectedModules, + roughnessCodes, + windSpeedCodes, + managementState, + setManagementState, + moduleList, + moduleSelectionData, + setModuleSelectionData, + setSelectedModules, + selectedSurfaceType, + setSelectedSurfaceType, + installHeight, + setInstallHeight, + standardWindSpeed, + setStandardWindSpeed, + verticalSnowCover, + setVerticalSnowCover, + orientationTrigger, + nextStep, + currentCanvasPlan, + loginUserState, + updateObjectDataApi, + } = props + const [inputCompasDeg, setInputCompasDeg] = useState(compasDeg ?? 0) + const [inputInstallHeight, setInputInstallHeight] = useState('0') + const [inputVerticalSnowCover, setInputVerticalSnowCover] = useState('0') + const [inputRoughness, setInputRoughness] = useState(selectedSurfaceType) + const [inputStandardWindSpeed, setInputStandardWindSpeed] = useState(standardWindSpeed) + const moduleData = { + header: [ + { name: getMessage('module'), width: 150, prop: 'module', type: 'color-box' }, + { + name: `${getMessage('height')} (mm)`, + prop: 'height', + }, + { name: `${getMessage('width')} (mm)`, prop: 'width' }, + { name: `${getMessage('output')} (W)`, prop: 'output' }, + ], + } + + useEffect(() => { + if (selectedSurfaceType) { + console.log(roughnessCodes, selectedSurfaceType) + setInputRoughness(roughnessCodes.find((code) => code.clCode === moduleSelectionData.common.illuminationTp)) + } + }, [selectedSurfaceType]) + + useEffect(() => { + if (standardWindSpeed) setInputStandardWindSpeed(windSpeedCodes.find((code) => code.clCode === moduleSelectionData.common.stdWindSpeed)) + }, [standardWindSpeed]) + + useEffect(() => { + if (managementState?.installHeight && managementState?.installHeight) { + console.log('🚀 ~ useEffect ~ managementState:', managementState) + setSelectedSurfaceType(roughnessCodes.find((code) => code.clCode === managementState?.surfaceTypeValue)) + setInputInstallHeight(managementState?.installHeight) + setStandardWindSpeed(windSpeedCodes.find((code) => code.clCode === managementState?.standardWindSpeedId)) + setInputVerticalSnowCover(managementState?.verticalSnowCover) + } + }, [managementState]) + + useEffect(() => { + if (moduleSelectionData) { + console.log('moduleSelectionData', moduleSelectionData) + } + }, [moduleSelectionData]) useImperativeHandle(ref, () => ({ handleNextStep, })) const handleNextStep = () => { - nextStep() - canvasPopupStatusTrigger(compasDeg) + if (isComplete()) { + const common = { + illuminationTp: inputRoughness.clCode, + illuminationTpNm: inputRoughness.clCodeNm, + instHt: inputInstallHeight, + stdWindSpeed: inputStandardWindSpeed.clCode, + stdSnowLd: inputVerticalSnowCover, + saleStoreNorthFlg: managementState?.saleStoreNorthFlg, + moduleTpCd: selectedModules.itemTp, + moduleItemId: selectedModules.itemId, + } + setCompasDeg(inputCompasDeg) + setInstallHeight(inputInstallHeight) + setVerticalSnowCover(inputVerticalSnowCover) + setSelectedSurfaceType(inputRoughness) + setStandardWindSpeed(inputStandardWindSpeed) + nextStep() + setManagementState({ + ...managementState, + installHeight: inputInstallHeight, + verticalSnowCover: inputVerticalSnowCover, + standardWindSpeedId: inputStandardWindSpeed.clCode, + surfaceType: inputRoughness.clCodeNm, + surfaceTypeValue: inputRoughness.clCode, + }) + setModuleSelectionData({ + ...moduleSelectionData, + module: { + ...selectedModules, + }, + }) + orientationTrigger({ + compasDeg: inputCompasDeg, + common: common, + module: { + ...selectedModules, + }, + }) + updateObjectDataApi({ + objectNo: currentCanvasPlan.objectNo, //오브젝트_no + standardWindSpeedId: inputStandardWindSpeed.clCode, //기준풍속코드 + verticalSnowCover: inputVerticalSnowCover, //적설량 + surfaceType: inputRoughness.clCodeNm, //면조도구분 + installHeight: inputInstallHeight, //설치높이 + userId: loginUserState.userId, //작성자아아디 + }) + setTabNum(2) + } } - useEffect(() => { - checkDegree(compasDeg) - }, [compasDeg]) - const checkDegree = (e) => { if (e === '-0' || e === '-') { - setCompasDeg('-') + setInputCompasDeg('-') return } if (e === '0-') { @@ -45,71 +163,256 @@ export const Orientation = forwardRef(({ tabNum }, ref) => { } } + const isComplete = () => { + if (basicSetting && basicSetting.roofSizeSet !== '3') { + if (inputInstallHeight <= 0) { + return false + } + + if (+inputVerticalSnowCover <= 0) { + return false + } + + if (!inputStandardWindSpeed) return false + if (!inputRoughness) return false + } + + return true + } + + const handleChangeModule = (e) => { + const newRoofs = addedRoofs.map((roof) => { + return { + ...roof, + lengthBase: null, + raftBaseCd: null, + trestleMkrCd: null, + constMthdCd: null, + constTp: null, + roofBaseCd: null, + ridgeMargin: null, + kerabaMargin: null, + eavesMargin: null, + roofPchBase: null, + cvrYn: 'N', + snowGdPossYn: 'N', + cvrChecked: false, + snowGdChecked: false, + } + }) + setRoofs(newRoofs) + setSelectedModules(e) + } + return ( <>
-
{getMessage('modal.module.basic.setting.orientation.setting.info')}
-
-
-
- {Array.from({ length: 180 / 15 }).map((dot, index) => ( -
= 172 && index === 0 && compasDeg <= 180) || (compasDeg === -180 && index === 0) ? 'act' : ''}`} - onClick={() => { - if (index === 0) { - setCompasDeg(180) - return - } - setCompasDeg(-1 * (-15 * index + 180)) - }} - > - {index === 0 && 180°} - {index === 6 && -90°} +
+
+
{getMessage('modal.module.basic.setting.orientation.setting.info')}
+
+
+
+ {Array.from({ length: 180 / 15 }).map((dot, index) => ( +
= 172 && index === 0 && inputCompasDeg <= 180) || (inputCompasDeg === -180 && index === 0) ? 'act' : ''}`} + onClick={() => { + if (index === 0) { + setInputCompasDeg(180) + return + } + setInputCompasDeg(-1 * (-15 * index + 180)) + }} + > + {index === 0 && 180°} + {index === 6 && -90°} +
+ ))} + {Array.from({ length: 180 / 15 }).map((dot, index) => ( +
setInputCompasDeg(15 * index)} + > + {index === 0 && 0°} + {index === 6 && 90°} +
+ ))} +
+
+
- ))} - {Array.from({ length: 180 / 15 }).map((dot, index) => ( -
setCompasDeg(15 * index)} - > - {index === 0 && 0°} - {index === 6 && 90°} +
+
+
+
+
+ setHasAnglePassivity(!hasAnglePassivity)} /> +
- ))} -
-
+
+ checkDegree(e.target.value)} + /> +
+ ° + （ -180 〜 180 ）
-
-
-
- setHasAnglePassivity(!hasAnglePassivity)} /> - -
-
-
- checkDegree(e.target.value) - // setCompasDeg( - - // e.target.value === '-' || (e.target.value !== '' && parseInt(e.target.value) <= 180 && parseInt(e.target.value) >= -180) - // ? e.target.value - // : 0, - // ) - } - /> +
+
+
+ {getMessage('modal.module.basic.setting.module.setting')} +
+ {moduleList && ( + handleChangeModule(e)} + /> + )} +
+
+
+ + + + {moduleData.header.map((header) => { + return ( + + ) + })} + + + + {Array.from({ length: 2 }).map((_, index) => { + return selectedModules && selectedModules?.itemList && selectedModules?.itemList?.length >= index + 1 ? ( + + + + + + + ) : ( + + + + + + + ) + })} + +
+ {header.name} +
+
+ + {selectedModules.itemList[index].itemNm} +
+ 		{Number(selectedModules.itemList[index].shortAxis).toFixed(0)}{Number(selectedModules.itemList[index].longAxis).toFixed(0)}{Number(selectedModules.itemList[index].wpOut).toFixed(0)}
+
+
+
+ {basicSetting && basicSetting.roofSizeSet === '3' && ( +
+ {getMessage('modal.module.basic.setting.module.placement.area')} +
+ setInputInstallHeight(e.target.value)} + /> +
+ m +
+ )}
- ° + + {basicSetting && basicSetting.roofSizeSet !== '3' && ( +
+
+
+ {getMessage('modal.module.basic.setting.module.surface.type')} +
+ {roughnessCodes.length > 0 && managementState && ( + { + console.log('🚀 ~ handleChangeModule ~ inputRoughness:', e) + setInputRoughness(e) + }} + /> + )} +
+
+
+ {getMessage('modal.module.basic.setting.module.fitting.height')} +
+ setInputInstallHeight(e.target.value)} + /> +
+ m +
+
+ {getMessage('modal.module.basic.setting.module.standard.wind.speed')} +
+ {windSpeedCodes.length > 0 && managementState && ( + { + console.log('🚀 ~ handleChangeModule ~ inputStandardWindSpeed:', e) + setInputStandardWindSpeed(e) + }} + /> + )} +
+
+
+ {getMessage('modal.module.basic.setting.module.standard.snowfall.amount')} +
+ setInputVerticalSnowCover(e.target.value)} + /> +
+ cm +
+
+
+ )}
diff --git a/src/components/floor-plan/modal/basic/step/Trestle.jsx b/src/components/floor-plan/modal/basic/step/Trestle.jsx new file mode 100644 index 00000000..a6c62750 --- /dev/null +++ b/src/components/floor-plan/modal/basic/step/Trestle.jsx @@ -0,0 +1,532 @@ +import { GlobalDataContext } from '@/app/GlobalDataProvider' +import QSelectBox from '@/components/common/select/QSelectBox' +import { useModuleTrestle } from '@/hooks/module/useModuleTrestle' +import { useMessage } from '@/hooks/useMessage' +import { currentAngleTypeSelector, pitchTextSelector } from '@/store/canvasAtom' +import { roofsState } from '@/store/roofAtom' +import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' +import { isObjectNotEmpty } from '@/util/common-utils' +import { forwardRef, useContext, useEffect, useImperativeHandle, useState } from 'react' +import { useRecoilState, useRecoilValue } from 'recoil' + +const Trestle = forwardRef((props, ref) => { + const { setTabNum, trestleTrigger, roofs, setRoofs, moduleSelectionData, setModuleSelectionData } = props + const { getMessage } = useMessage() + // const [selectedTrestle, setSelectedTrestle] = useState() + const currentAngleType = useRecoilValue(currentAngleTypeSelector) + const pitchText = useRecoilValue(pitchTextSelector) + const [selectedRoof, setSelectedRoof] = useState() + const { + trestleState, + dispatch, + raftBaseList, + trestleList, + constMthdList, + roofBaseList, + constructionList, + eavesMargin, + ridgeMargin, + kerabaMargin, + setEavesMargin, + setRidgeMargin, + setKerabaMargin, + cvrYn, + cvrChecked, + snowGdPossYn, + snowGdChecked, + setCvrYn, + setCvrChecked, + setSnowGdPossYn, + setSnowGdChecked, + } = useModuleTrestle({ + selectedRoof, + }) + const selectedModules = useRecoilValue(selectedModuleState) //선택된 모듈 + // const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) + const [lengthBase, setLengthBase] = useState(0) + const [hajebichi, setHajebichi] = useState(0) + const [selectedRaftBase, setSelectedRaftBase] = useState(null) + const [selectedTrestle, setSelectedTrestle] = useState(null) + const [selectedConstMthd, setSelectedConstMthd] = useState(null) + const [selectedConstruction, setSelectedConstruction] = useState(null) + const [selectedRoofBase, setSelectedRoofBase] = useState(null) + const { managementState } = useContext(GlobalDataContext) + + useEffect(() => { + if (roofs && !selectedRoof) { + setSelectedRoof(roofs[0]) + } + }, [roofs]) + + useEffect(() => { + if (selectedRoof) { + dispatch({ type: 'SET_INITIALIZE', roof: { ...selectedRoof, moduleTpCd: selectedModules.itemTp } }) + } + }, [selectedRoof]) + + useEffect(() => { + if (raftBaseList.length > 0) setSelectedRaftBase(raftBaseList.find((raft) => raft.clCode === trestleState?.raftBaseCd) ?? null) + }, [raftBaseList]) + + useEffect(() => { + if (trestleList.length > 0) setSelectedTrestle(trestleList.find((trestle) => trestle.trestleMkrCd === trestleState?.trestleMkrCd) ?? null) + }, [trestleList]) + + useEffect(() => { + if (roofBaseList.length > 0) setSelectedRoofBase(roofBaseList.find((roofBase) => roofBase.roofBaseCd === trestleState?.roofBaseCd) ?? null) + }, [roofBaseList]) + + useEffect(() => { + if (constMthdList.length > 0) setSelectedConstMthd(constMthdList.find((constMthd) => constMthd.constMthdCd === trestleState?.constMthdCd) ?? null) + }, [constMthdList]) + + useEffect(() => { + if (constructionList.length > 0) { + setSelectedConstruction(constructionList.find((construction) => construction.constTp === trestleState?.constTp) ?? null) + } + }, [constructionList]) + + const getConstructionState = (index) => { + if (constructionList && constructionList.length > 0) { + if (constructionList[index].constPossYn === 'Y') { + if (trestleState && trestleState.constTp === constructionList[index].constTp) { + return 'blue' + } + return 'white' + } + return 'no-click' + } + return 'no-click' + } + + const onChangeRaftBase = (e) => { + setSelectedRaftBase(e) + dispatch({ + type: 'SET_RAFT_BASE', + roof: { + moduleTpCd: selectedModules.itemTp ?? '', + roofMatlCd: selectedRoof?.roofMatlCd ?? '', + raftBaseCd: e.clCode, + }, + }) + } + + const onChangeTrestleMaker = (e) => { + setSelectedTrestle(e) + dispatch({ + type: 'SET_TRESTLE_MAKER', + roof: { + moduleTpCd: selectedModules.itemTp ?? '', + roofMatlCd: selectedRoof?.roofMatlCd ?? '', + raftBaseCd: trestleState.raftBaseCd ?? '', + trestleMkrCd: e.trestleMkrCd, + }, + }) + } + + const onChangeConstMthd = (e) => { + setSelectedConstMthd(e) + dispatch({ + type: 'SET_CONST_MTHD', + roof: { + moduleTpCd: selectedModules.itemTp ?? '', + roofMatlCd: selectedRoof?.roofMatlCd ?? '', + raftBaseCd: trestleState.raftBaseCd ?? '', + trestleMkrCd: trestleState.trestleMkrCd, + constMthdCd: e.constMthdCd, + }, + }) + } + + const onChangeRoofBase = (e) => { + setSelectedRoofBase(e) + dispatch({ + type: 'SET_ROOF_BASE', + roof: { + moduleTpCd: selectedModules.itemTp ?? '', + roofMatlCd: selectedRoof?.roofMatlCd ?? '', + raftBaseCd: trestleState.raftBaseCd ?? '', + trestleMkrCd: trestleState.trestleMkrCd, + constMthdCd: trestleState.constMthdCd, + roofBaseCd: e.roofBaseCd, + illuminationTp: managementState?.surfaceTypeValue ?? '', + instHt: managementState?.installHeight ?? '', + stdWindSpeed: managementState?.standardWindSpeedId ?? '', + stdSnowLd: managementState?.verticalSnowCover ?? '', + inclCd: selectedRoof?.pitch ?? 0, + roofPitch: Math.round(selectedRoof?.roofPchBase ?? 0), + }, + }) + } + const handleChangeRoofMaterial = (index) => { + const newAddedRoofs = roofs.map((roof, i) => { + if (i === selectedRoof.index) { + return { + ...selectedRoof, + ...trestleState, + eavesMargin, + ridgeMargin, + kerabaMargin, + cvrYn, + snowGdPossYn, + cvrChecked, + snowGdChecked, + } + } + return { ...roof } + }) + setRoofs(newAddedRoofs) + setSelectedRoof(newAddedRoofs[index]) + } + + const handleConstruction = (index) => { + if (constructionList[index]?.constPossYn === 'Y') { + dispatch({ + type: 'SET_CONSTRUCTION', + roof: { + moduleTpCd: selectedModules.itemTp ?? '', + roofMatlCd: selectedRoof?.roofMatlCd ?? '', + raftBaseCd: trestleState.raftBaseCd ?? '', + trestleMkrCd: trestleState.trestleMkrCd, + constMthdCd: trestleState.constMthdCd, + roofBaseCd: trestleState.roofBaseCd, + illuminationTp: managementState?.surfaceTypeValue ?? '', + instHt: managementState?.installHeight ?? '', + stdWindSpeed: managementState?.standardWindSpeedId ?? '', + stdSnowLd: +managementState?.verticalSnowCover ?? '', + inclCd: selectedRoof?.pitch.toString() ?? 0, + roofPitch: Math.round(selectedRoof?.roofPchBase ?? 0), + constTp: constructionList[index].constTp, + mixMatlNo: selectedModules.mixMatlNo, + workingWidth: selectedRoof?.length.toString() ?? '', + // snowGdPossYn: constructionList[index].snowGdPossYn, + // cvrYn: constructionList[index].cvrYn, + }, + }) + + setCvrYn(constructionList[index].cvrYn) + setSnowGdPossYn(constructionList[index].snowGdPossYn) + setCvrChecked(false) + setSnowGdChecked(false) + } + } + + const isComplete = () => { + const newAddedRoofs = roofs.map((roof, i) => { + if (i === selectedRoof?.index) { + return { + ...selectedRoof, + ...trestleState, + eavesMargin, + ridgeMargin, + kerabaMargin, + cvrYn, + snowGdPossYn, + cvrChecked, + snowGdChecked, + } + } + return { ...roof } + }) + + let result = true + newAddedRoofs.forEach((roof) => { + if (roof.eavesMargin && roof.ridgeMargin && roof.kerabaMargin) { + return true + } + + if (!roof.trestleMkrCd) result = false + if (!roof.constMthdCd) result = false + if (!roof.roofBaseCd) result = false + if (!roof.constTp) result = false + + if (selectedRoof.lenAuth === 'C') { + if (!trestleState?.lengthBase) result = false + } + if (['C', 'R'].includes(selectedRoof.raftAuth)) { + if (!roof.raftBaseCd) result = false + } + + if (['C', 'R'].includes(selectedRoof.roofPchAuth)) { + if (!roof.roofPchBase) result = false + } + }) + + console.log('newAddedRoofs', newAddedRoofs) + + if (result) { + setRoofs(newAddedRoofs) + setModuleSelectionData({ + ...moduleSelectionData, + roofConstruction: { + ...newAddedRoofs, + }, + }) + trestleTrigger({ + roofConstruction: newAddedRoofs.map((roof) => { + return { + roofIndex: roof.index, + addRoof: { + ...roof, + }, + trestle: { + ...selectedTrestle, + raftBaseCd: roof.raftBaseCd, + }, + construction: { + ...constructionList.find((construction) => trestleState.constTp === construction.constTp), + roofIndex: roof.index, + setupCover: roof.cvrYn === 'Y', + setupSnowCover: roof.snowGdYn === 'Y', + selectedIndex: roof.index, + }, + } + }), + }) + } + + return result + } + + useImperativeHandle(ref, () => ({ + isComplete, + })) + + return ( +
+
+
+ {roofs && + roofs.map((roof, index) => ( + + ))} +
+
+
+
+
+ {selectedRoof && selectedRoof.lenAuth === 'C' && ( + <> +
+
L
+
+
+ setLengthBase(e.target.value)} + disabled={selectedRoof.lenAuth === 'R'} + /> +
+
+
+ + )} + {selectedRoof && ['C', 'R'].includes(selectedRoof.raftAuth) && ( + <> +
+
{getMessage('modal.module.basic.setting.module.rafter.margin')}
+
+
+ {raftBaseList.length > 0 && ( + onChangeRaftBase(e)} + /> + )} +
+
+
+ + )} + {selectedRoof && ['C', 'R'].includes(selectedRoof.roofPchAuth) && ( + <> +
+
{getMessage('modal.module.basic.setting.module.hajebichi')}
+
+
+ handleHajebichiAndLength(e, 'hajebichi')} + value={hajebichi} + /> +
+
+
+ + )} +
+
{getMessage('modal.module.basic.setting.module.trestle.maker')}
+
+
+ {trestleList && ( + onChangeTrestleMaker(e)} + /> + )} +
+
+
+
+
{getMessage('modal.module.basic.setting.module.construction.method')}
+
+
+ {constMthdList && ( + onChangeConstMthd(e)} + /> + )} +
+
+
+
+
{getMessage('modal.module.basic.setting.module.under.roof')}
+
+
+ {roofBaseList && ( + onChangeRoofBase(e)} + /> + )} +
+
+
+
+
+
+
+ + + + + +
+
+
+ dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, cvrChecked: !trestleState.cvrChecked } })} + onChange={() => setCvrChecked(!cvrChecked)} + /> + +
+
+ dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, snowGdChecked: !trestleState.snowGdChecked } })} + onChange={() => setSnowGdChecked(!snowGdChecked)} + /> + +
+
+
+
+ +
+
{getMessage('modal.module.basic.setting.module.placement.area')}
+
+ {getMessage('modal.module.basic.setting.module.placement.area.eaves')} +
+ dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, eavesMargin: e.target.value } })} + onChange={(e) => setEavesMargin(e.target.value)} + /> +
+ mm +
+
+ {getMessage('modal.module.basic.setting.module.placement.area.ridge')} +
+ dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, ridgeMargin: e.target.value } })} + onChange={(e) => setRidgeMargin(e.target.value)} + /> +
+ mm +
+
+ {getMessage('modal.module.basic.setting.module.placement.area.keraba')} +
+ dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, kerabaMargin: e.target.value } })} + onChange={(e) => setKerabaMargin(e.target.value)} + /> +
+ mm +
+
+
+
+
+
+
+
+ {getMessage('modal.module.basic.setting.module.setting.info1')} +
+ {getMessage('modal.module.basic.setting.module.setting.info2')} +
+
+
+
+
+ ) +}) + +export default Trestle diff --git a/src/hooks/common/useCanvasPopupStatusController.js b/src/hooks/common/useCanvasPopupStatusController.js index a31bd0ed..4a6ed6dd 100644 --- a/src/hooks/common/useCanvasPopupStatusController.js +++ b/src/hooks/common/useCanvasPopupStatusController.js @@ -1,6 +1,6 @@ 'use client' -import { useRecoilState, useRecoilValue } from 'recoil' +import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' import useSWRMutation from 'swr/mutation' import { useAxios } from '../useAxios' import { unescapeString } from '@/util/common-utils' @@ -10,6 +10,8 @@ import { canvasState, currentCanvasPlanState } from '@/store/canvasAtom' import { POLYGON_TYPE } from '@/common/common' import { useCircuitTrestle } from '../useCirCuitTrestle' import { useEffect } from 'react' +import { addedRoofsState } from '@/store/settingAtom' +import { roofsState } from '@/store/roofAtom' /** * 캔버스 팝업 상태 관리 @@ -19,13 +21,14 @@ import { useEffect } from 'react' export function useCanvasPopupStatusController(param = 1) { const popupType = parseInt(param) - const [compasDeg, setCompasDeg] = useRecoilState(compasDegAtom) - const [moduleSelectionDataStore, setModuleSelectionDataStore] = useRecoilState(moduleSelectionDataState) - const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState) + const setCompasDeg = useSetRecoilState(compasDegAtom) + const setModuleSelectionDataStore = useSetRecoilState(moduleSelectionDataState) + const setSelectedModules = useSetRecoilState(selectedModuleState) const { get, promiseGet, getFetcher, postFetcher } = useAxios() const canvas = useRecoilValue(canvasState) const currentCanvasPlan = useRecoilValue(currentCanvasPlanState) - + const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState) + const [roofs, setRoofs] = useRecoilState(roofsState) /** * 팝업 상태 조회 * @param {number} popupTypeParam @@ -53,19 +56,27 @@ export function useCanvasPopupStatusController(param = 1) { const handleModuleSelectionTotal = async () => { for (let i = 1; i < 3; i++) { const result = await getModuleSelection(i) - console.log('🚀 ~ handleModuleSelectionTotal ~ result:', result) if (!result.objectNo) return if (i === 1) { - setCompasDeg(result.popupStatus) + if (result.popupStatus && unescapeString(result.popupStatus)) { + const data = JSON.parse(unescapeString(result.popupStatus)) + + if (data?.compasDeg) setCompasDeg(data.compasDeg) + if (data?.module) setSelectedModules(data.module) + setModuleSelectionDataStore(data) + } } else if (i === 2) { const data = JSON.parse(unescapeString(result.popupStatus)) - setModuleSelectionDataStore(data) const roofSurfaceList = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE) roofSurfaceList.forEach((surface) => { surface.modules = modules.filter((module) => module.surfaceId === surface.id) }) - if (data.module) setSelectedModules(data.module) + if (data.roofConstruction) { + setRoofs(data.roofConstruction) + // setManagementState({ ...managementState, roofs: data.roofConstruction.map((roof) => roof.construction.managementState) }) + } + // if (data?.module) setManagementState(data.common.managementState) } } } @@ -80,7 +91,8 @@ export function useCanvasPopupStatusController(param = 1) { objectNo: currentCanvasPlan.objectNo, planNo: parseInt(currentCanvasPlan.planNo), popupType: popupType.toString(), - popupStatus: popupType === 1 ? arg : JSON.stringify(arg).replace(/"/g, '\"'), + // popupStatus: popupType === 1 ? arg : JSON.stringify(arg).replace(/"/g, '\"'), + popupStatus: JSON.stringify(arg).replace(/"/g, '\"'), } postFetcher(`/api/v1/canvas-popup-status`, params) }, diff --git a/src/hooks/module/useModuleSelection.js b/src/hooks/module/useModuleSelection.js index 8fa274a4..1373ea05 100644 --- a/src/hooks/module/useModuleSelection.js +++ b/src/hooks/module/useModuleSelection.js @@ -19,9 +19,9 @@ export function useModuleSelection(props) { const [moduleList, setModuleList] = useState([{}]) //모듈 목록 const [selectedSurfaceType, setSelectedSurfaceType] = useState({}) //선택된 면조도 - const [installHeight, setInstallHeight] = useState() //설치 높이 - const [standardWindSpeed, setStandardWindSpeed] = useState({}) //기준풍속 - const [verticalSnowCover, setVerticalSnowCover] = useState() //수직적설량 + const [installHeight, setInstallHeight] = useState(managementState?.installHeight) //설치 높이 + const [standardWindSpeed, setStandardWindSpeed] = useState() //기준풍속 + const [verticalSnowCover, setVerticalSnowCover] = useState(managementState?.verticalSnowCover) //수직적설량 const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState) //선택된 모듈 const [moduleSelectionInitParams, setModuleSelectionInitParams] = useRecoilState(moduleSelectionInitParamsState) //모듈 기본 데이터 ex) 면조도, 높이등등 @@ -32,6 +32,7 @@ export function useModuleSelection(props) { const { restoreModuleInstArea } = useModuleBasicSetting() const bindInitData = () => { + console.log('bindInitData', managementState) setInstallHeight(managementState?.installHeight) setStandardWindSpeed(managementState?.standardWindSpeedId) setVerticalSnowCover(managementState?.verticalSnowCover) @@ -184,14 +185,6 @@ export function useModuleSelection(props) { }) } - useEffect(() => { - // console.log('installHeight', installHeight) - }, [installHeight]) - - useEffect(() => { - // console.log('verticalSnowCover', verticalSnowCover) - }, [verticalSnowCover]) - //TODO: 설치높이, 기준적설량 debounce 적용해서 추가해야됨 // useEffect(() => { @@ -226,11 +219,17 @@ export function useModuleSelection(props) { roughnessCodes, windSpeedCodes, managementState, + setManagementState, moduleList, + setSelectedModules, selectedSurfaceType, + setSelectedSurfaceType, installHeight, + setInstallHeight, standardWindSpeed, + setStandardWindSpeed, verticalSnowCover, + setVerticalSnowCover, handleChangeModule, handleChangeSurfaceType, handleChangeWindSpeed,