From 0da38fef7f1ecc25960770efa6fec44598494cf7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=B0=BD=EC=88=98?= Date: Tue, 18 Mar 2025 09:21:31 +0900 Subject: [PATCH] =?UTF-8?q?=EC=A7=80=EB=B6=95=EB=AA=A8=EB=93=88=20?= =?UTF-8?q?=ED=8C=9D=EC=97=85=20=EB=B0=8F=20=EC=9C=A1=EC=A7=80=EB=B6=95=20?= =?UTF-8?q?=EB=AA=A8=EB=93=88=20=ED=8C=9D=EC=97=85=20=EC=88=98=EC=A0=95=20?= =?UTF-8?q?=EB=A9=94=EB=89=B4=20=EC=95=9E=20=EB=8D=B0=EC=9D=B4=ED=84=B0?= =?UTF-8?q?=EB=AA=85=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/canvas/page.jsx | 4 +- src/components/canvas/CanvasLayout.jsx | 1 + .../HexagonalRoofOption.jsx | 10 +- .../HexagonalRoofTab01.jsx | 156 +++++++++---- .../HexagonalRoofTab02.jsx | 208 +++++++++++++----- .../HexagonalRoofTab03.jsx | 137 ------------ .../RoofModuleOptionTab01.jsx | 178 +++++++++++---- .../RoofModuleOptionTab02.jsx | 153 +++---------- .../RoofModuleOptionTab03.jsx | 8 +- src/components/publishpage/PublishPage.jsx | 5 + src/styles/_contents.scss | 8 + src/styles/_modal.scss | 2 +- src/styles/_reset.scss | 8 +- 13 files changed, 469 insertions(+), 409 deletions(-) delete mode 100644 src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab03.jsx diff --git a/src/app/canvas/page.jsx b/src/app/canvas/page.jsx index 8987d29..ba2d22a 100644 --- a/src/app/canvas/page.jsx +++ b/src/app/canvas/page.jsx @@ -89,7 +89,7 @@ export default function CanvasPage() { {/* */} {/* 배치면 초기 설정 */} - + {/* */} {/* 캔버스 기본 셋팅 */} {/* {modalOption.option && } */} @@ -161,7 +161,7 @@ export default function CanvasPage() { {/* 육지붕모듈 선택 */} - {/* */} + {/* 회로 및 가대설정 */} {/* */} diff --git a/src/components/canvas/CanvasLayout.jsx b/src/components/canvas/CanvasLayout.jsx index c8d4c92..d7a69fa 100644 --- a/src/components/canvas/CanvasLayout.jsx +++ b/src/components/canvas/CanvasLayout.jsx @@ -25,6 +25,7 @@ export default function CanvasLayout ({menuValue}) { return(
+
RT01250306004
{plans.map((plan, idx) => (
-
防衛設定
- -
モジュール設定
- -
モジュールの配置
+
防衛設定
+ +
モジュールの配置
{tabNum === 1 && } {tabNum === 2 && } - {tabNum === 3 && }
diff --git a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx index 451c3e4..a52e927 100644 --- a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx +++ b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx @@ -1,60 +1,136 @@ +import Qselect from "@/components/common/select/Qselect"; import { useState } from "react"; +const SelectOption01 = [ + {name: '0',}, {name: '0'}, {name: '0'}, {name: '0'} +] + + export default function HexagonalRoofTab01({setTabNum}){ const [compasDeg, setCompasDeg] = useState(0); return( <>
-
※シミュレーション計算用方位を指定します。南の方位を設定してください。
-
-
-
-
setCompasDeg(180)}>180°
-
setCompasDeg(195)}>
-
setCompasDeg(210)}>
-
setCompasDeg(225)}>
-
setCompasDeg(240)}>
-
setCompasDeg(255)}>
-
setCompasDeg(270)}>-90°
-
setCompasDeg(285)}>
-
setCompasDeg(300)}>
-
setCompasDeg(315)}>
-
setCompasDeg(330)}>
-
setCompasDeg(345)}>
-
setCompasDeg(0)}>
-
setCompasDeg(15)}>
-
setCompasDeg(30)}>
-
setCompasDeg(45)}>
-
setCompasDeg(60)}>
-
setCompasDeg(75)}>
-
setCompasDeg(90)}>90°
-
setCompasDeg(105)}>
-
setCompasDeg(120)}>
-
setCompasDeg(135)}>
-
setCompasDeg(150)}>
-
setCompasDeg(165)}>
-
-
+
+
+
※シミュレーション計算用方位を指定します。南の方位を設定してください。
+
+
+
+
setCompasDeg(180)}>180°
+
setCompasDeg(195)}>
+
setCompasDeg(210)}>
+
setCompasDeg(225)}>
+
setCompasDeg(240)}>
+
setCompasDeg(255)}>
+
setCompasDeg(270)}>-90°
+
setCompasDeg(285)}>
+
setCompasDeg(300)}>
+
setCompasDeg(315)}>
+
setCompasDeg(330)}>
+
setCompasDeg(345)}>
+
setCompasDeg(0)}>
+
setCompasDeg(15)}>
+
setCompasDeg(30)}>
+
setCompasDeg(45)}>
+
setCompasDeg(60)}>
+
setCompasDeg(75)}>
+
setCompasDeg(90)}>90°
+
setCompasDeg(105)}>
+
setCompasDeg(120)}>
+
setCompasDeg(135)}>
+
setCompasDeg(150)}>
+
setCompasDeg(165)}>
+
+
+
+
+
+
+
+
+
+ + +
+
+ +
+ ° + ( -180 〜 180 )
-
-
-
- - -
-
-
- +
+
+
+ モジュールの選択 +
+ +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
モジュール高さ (mm)幅 (mm)出力 (W)
+
+ + Re.RISE-G3 440 +
+
11341722440
+
+ + Re.RISE MS-G3 290 +
+
11341722440
+
+ + Re.RISE MS-G3 290 +
+
11341722440
+
+
+ モジュール配置領域 : +
+ +
+ mm +
- °
+
diff --git a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab02.jsx b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab02.jsx index 5167e41..ab55920 100644 --- a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab02.jsx +++ b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab02.jsx @@ -1,67 +1,165 @@ -import Qselect from "@/components/common/select/Qselect"; -const SelectOption01 = [ - {name: '0',}, {name: '0'}, {name: '0'}, {name: '0'} -] - -export default function HexagonalRoofTab02({setTabNum}){ +export default function HexagonalRoofTab03({setTabNum}){ return( <> -
+
-
- モジュールの選択 -
- -
-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
モジュール高さ
(mm)

(mm)
出力
(W)
-
- - Re.RISE-G3 440 -
-
11341722440
-
- - Re.RISE MS-G3 290 -
-
11341722440
-
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ + +
+
モジュールMax単数混合Max単数単数熱水
+
+ + +
+
+
+ + Re.RISE-G3 440 +
+
0000 +
+ +
+
+
+ +
+
+
+ + +
+
+
+ + Re.RISE MS-G3 290 +
+
0000 +
+ +
+
+
+ +
+
+
+
+
+
+
+
配置基準の設定
+
+
+
+
+ + +
+
+ + +
+
+
+
+
+
+ {/*
+
+
+
+
割り当て設定
+
+
+
+
+ 単数 +
+ +
+ mm +
+
+ 上下間隔 +
+ +
+ mm +
+
+ 熱水 +
+ +
+ mm +
+
+ 左右間隔 +
+ +
+ mm +
+
+
+
+
+
※バッチパネルの種類が1種類の場合にのみ使用できます。
+ +
+
+
+
+
*/}
- + + +
) diff --git a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab03.jsx b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab03.jsx deleted file mode 100644 index 6c81d2d..0000000 --- a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab03.jsx +++ /dev/null @@ -1,137 +0,0 @@ - -export default function HexagonalRoofTab03({setTabNum}){ - return( - <> -
-
-
- - - - - - - - - - - - - - - - - - - - - - - - - -
-
- - -
-
モジュール出力 (W)
-
- - -
-
-
- - Re.RISE-G3 440 -
-
430
-
- - -
-
-
- - Re.RISE MS-G3 290 -
-
290
-
-
-
-
-
-
-
-
配置基準の設定
-
-
-
-
- - -
-
- - -
-
-
-
-
-
- {/*
-
-
-
-
割り当て設定
-
-
-
-
- 単数 -
- -
- mm -
-
- 上下間隔 -
- -
- mm -
-
- 熱水 -
- -
- mm -
-
- 左右間隔 -
- -
- mm -
-
-
-
-
-
※バッチパネルの種類が1種類の場合にのみ使用できます。
- -
-
-
-
-
*/} -
- - - -
- - ) -} \ No newline at end of file diff --git a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx index 5c58e13..43a434b 100644 --- a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx +++ b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx @@ -1,60 +1,158 @@ +import Qselect from "@/components/common/select/Qselect"; import { useState } from "react"; +const SelectOption01 = [ + {name: '0',}, {name: '0'}, {name: '0'}, {name: '0'} +] + export default function RoofModuleOptionTab01({setTabNum}){ const [compasDeg, setCompasDeg] = useState(0); return( <>
-
※シミュレーション計算用方位を指定します。南の方位を設定してください。
-
-
-
-
setCompasDeg(180)}>180°
-
setCompasDeg(195)}>
-
setCompasDeg(210)}>
-
setCompasDeg(225)}>
-
setCompasDeg(240)}>
-
setCompasDeg(255)}>
-
setCompasDeg(270)}>-90°
-
setCompasDeg(285)}>
-
setCompasDeg(300)}>
-
setCompasDeg(315)}>
-
setCompasDeg(330)}>
-
setCompasDeg(345)}>
-
setCompasDeg(0)}>
-
setCompasDeg(15)}>
-
setCompasDeg(30)}>
-
setCompasDeg(45)}>
-
setCompasDeg(60)}>
-
setCompasDeg(75)}>
-
setCompasDeg(90)}>90°
-
setCompasDeg(105)}>
-
setCompasDeg(120)}>
-
setCompasDeg(135)}>
-
setCompasDeg(150)}>
-
setCompasDeg(165)}>
-
-
+
+
+
※シミュレーション計算用方位を指定します。南の方位を設定してください。
+
+
+
+
setCompasDeg(180)}>180°
+
setCompasDeg(195)}>
+
setCompasDeg(210)}>
+
setCompasDeg(225)}>
+
setCompasDeg(240)}>
+
setCompasDeg(255)}>
+
setCompasDeg(270)}>-90°
+
setCompasDeg(285)}>
+
setCompasDeg(300)}>
+
setCompasDeg(315)}>
+
setCompasDeg(330)}>
+
setCompasDeg(345)}>
+
setCompasDeg(0)}>
+
setCompasDeg(15)}>
+
setCompasDeg(30)}>
+
setCompasDeg(45)}>
+
setCompasDeg(60)}>
+
setCompasDeg(75)}>
+
setCompasDeg(90)}>90°
+
setCompasDeg(105)}>
+
setCompasDeg(120)}>
+
setCompasDeg(135)}>
+
setCompasDeg(150)}>
+
setCompasDeg(165)}>
+
+
+
+
+
+
+
+
+
+ + +
+
+ +
+ ° + ( -180 〜 180 )
-
-
-
- - -
-
-
- +
+
+
+ モジュールの選択 +
+ +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
モジュール高さ (mm)幅 (mm)出力 (W)
+
+ + Re.RISE-G3 440 +
+
11341722440
+
+ + Re.RISE MS-G3 290 +
+
11341722440
+
+ + Re.RISE MS-G3 290 +
+
11341722440
+
+
+
+
+
+ 綿調道区分 +
+ +
+
+
+ 設置高さ +
+ +
+ m +
+
+ 基準風速 +
+ +
+
+
+ 垂直積雪量 +
+ +
+ cm +
+
- °
+
diff --git a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab02.jsx b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab02.jsx index f74dabc..17f2761 100644 --- a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab02.jsx +++ b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab02.jsx @@ -9,112 +9,6 @@ export default function RoofModuleOptionTab02({setTabNum}){ return( <>
-
-
-
-
- モジュールの選択 -
- -
-
- -
- - - - - - - - - - - - - - - - - - - - - - - -
モジュール高さ (mm)幅 (mm)出力 (W)
-
- - Re.RISE-G3 440 -
-
11341722440
-
- - Re.RISE MS-G3 290 -
-
11341722440
-
-
-
-
-
-
-
-
- 綿調道区分 -
-
-
-
- -
-
-
-
-
-
- 設置高さ -
-
-
-
- -
- m -
-
-
-
-
- 基準風速 -
-
-
-
- -
- m/s -
-
-
-
-
- 基準積雪量 -
-
-
-
- -
- cm -
-
-
-
-
-
-
@@ -123,9 +17,12 @@ export default function RoofModuleOptionTab02({setTabNum}){
+
+
屋根材:スレーツ(4寸)
+ +
-
屋根材:スレーツ(4寸)
{/*
@@ -145,16 +42,6 @@ export default function RoofModuleOptionTab02({setTabNum}){
*/} -
-
- マンドンピッチ -
-
-
- -
-
-
垂木の間隔 @@ -208,17 +95,45 @@ export default function RoofModuleOptionTab02({setTabNum}){
- +
- +
+
+
+
+
モジュール配置領域
+
+ 軒側 +
+ +
+ mm +
+
+ 棟側 +
+ +
+ mm +
+
+ けらぱ +
+ +
+ mm +
+
+
+
diff --git a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab03.jsx b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab03.jsx index 87fe5bc..c6865d4 100644 --- a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab03.jsx +++ b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab03.jsx @@ -91,12 +91,12 @@ export default function RoofModuleOptionTab03({setTabNum}){
-
設置形態を選択してくださ
+
設置形態を選択してください。
- + @@ -118,11 +118,11 @@ export default function RoofModuleOptionTab03({setTabNum}){
- +
- +
diff --git a/src/components/publishpage/PublishPage.jsx b/src/components/publishpage/PublishPage.jsx index e381855..97eb182 100644 --- a/src/components/publishpage/PublishPage.jsx +++ b/src/components/publishpage/PublishPage.jsx @@ -284,6 +284,11 @@ export default function PublishPage() {
  • 2025-03-14
  • * 회로설정 팝업 마지막 셀렉트 추가
  • +
      +
    • 2025-03-18
    • +
    • * 지붕모듈 팝업 및 육지붕 모듈 팝업 수정
    • +
    • * 캔버스 메뉴 앞 데이터 명 추가
    • +
    diff --git a/src/styles/_contents.scss b/src/styles/_contents.scss index 10a0463..4112f4c 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: #777777; + } .canvas-plane-wrap{ display: flex; align-items: center; diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index f2b6503..a0d1f96 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -2326,7 +2326,7 @@ $alert-color: #101010; grid-template-columns: repeat(2, 1fr); .outline-form{ span{ - width: 60px; + width: 65px; &.thin{ width: 20px; } diff --git a/src/styles/_reset.scss b/src/styles/_reset.scss index 34dcaf3..0f6320a 100644 --- a/src/styles/_reset.scss +++ b/src/styles/_reset.scss @@ -222,7 +222,7 @@ 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{ @@ -245,9 +245,9 @@ button{ } &:hover{ font-weight: 400; - background-color: transparent; - border: 1px solid #484848; - color: #fff; + background-color: #fff; + border: 1px solid #fff; + color: #101010; } } &.self{
    水鳥の配置千鳥配置 配置基準
    2024-10-28