From 40e4bc68ee1926207322ad38b4b87fae790f05da Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B9=80=EC=B0=BD=EC=88=98?= Date: Tue, 29 Apr 2025 17:42:54 +0900 Subject: [PATCH] =?UTF-8?q?=EB=A7=A4=EB=AC=BC=20=EC=A0=84=EA=B8=B0=20?= =?UTF-8?q?=EC=A7=80=EB=B6=95=EC=A0=95=EB=B3=B4=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/saledefault/page.tsx | 10 +- src/app/saledetail/page.tsx | 10 +- src/app/saleroof/page.tsx | 28 ++ src/components/PublishList/PublishList.tsx | 13 +- src/components/sale/saleroof/SaleRoofForm.tsx | 71 +++++ .../sale/saleroof/SaleRoofForm02.tsx | 271 ++++++++++++++++++ src/styles/base/_check-radio.scss | 4 +- src/styles/base/_utilities.scss | 5 +- src/styles/components/_sub.scss | 53 +++- src/styles/layout/_layout.scss | 1 + src/styles/layout/_pop-common.scss | 2 +- 11 files changed, 448 insertions(+), 20 deletions(-) create mode 100644 src/app/saleroof/page.tsx create mode 100644 src/components/sale/saleroof/SaleRoofForm.tsx create mode 100644 src/components/sale/saleroof/SaleRoofForm02.tsx diff --git a/src/app/saledefault/page.tsx b/src/app/saledefault/page.tsx index c95ab7c..5d9a103 100644 --- a/src/app/saledefault/page.tsx +++ b/src/app/saledefault/page.tsx @@ -11,10 +11,12 @@ export default function SaleDefaultPage(){
-
-
- - +
+
+
+ + +
diff --git a/src/app/saledetail/page.tsx b/src/app/saledetail/page.tsx index 188394e..9742782 100644 --- a/src/app/saledetail/page.tsx +++ b/src/app/saledetail/page.tsx @@ -10,10 +10,12 @@ export default function SaleDetailPage(){
-
-
- - +
+
+
+ + +
diff --git a/src/app/saleroof/page.tsx b/src/app/saleroof/page.tsx new file mode 100644 index 0000000..26fc74c --- /dev/null +++ b/src/app/saleroof/page.tsx @@ -0,0 +1,28 @@ +import Footer from "@/components/layouts/Footer"; +import Header from "@/components/layouts/Header"; +import SaleRoofForm from "@/components/sale/saleroof/SaleRoofForm"; +import SaleRoofForm02 from "@/components/sale/saleroof/SaleRoofForm02"; + +export default function SaleRoofPage() { + return( +
+
+
+
+
+
+
+ + +
+
+
+ + +
+
+
+ +
+ ) +} \ No newline at end of file diff --git a/src/components/PublishList/PublishList.tsx b/src/components/PublishList/PublishList.tsx index 03e591f..7fc8869 100644 --- a/src/components/PublishList/PublishList.tsx +++ b/src/components/PublishList/PublishList.tsx @@ -86,7 +86,7 @@ export default function PublishList (){ 2025/04/29 - 매물 + 매물 매물 목록 SaleListPage.tsx @@ -120,6 +120,17 @@ export default function PublishList (){ 2025/04/29 + + 매물 전기∙지붕정보 + + SaleRoofPage.tsx + + + + + + 2025/04/29 +
diff --git a/src/components/sale/saleroof/SaleRoofForm.tsx b/src/components/sale/saleroof/SaleRoofForm.tsx new file mode 100644 index 0000000..6d9cad7 --- /dev/null +++ b/src/components/sale/saleroof/SaleRoofForm.tsx @@ -0,0 +1,71 @@ +export default function SaleRoofForm(){ + return( +
+
電気関係
+
+
+
電気契約容量
+
+ +
+
+ +
+
+
+
電気小売会社
+ +
+
+
電気袋設備※複数選択可能
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
+ +
+
+
+
設置希望システム
+
+ +
+
+ +
+
+
+
+ ) +} \ No newline at end of file diff --git a/src/components/sale/saleroof/SaleRoofForm02.tsx b/src/components/sale/saleroof/SaleRoofForm02.tsx new file mode 100644 index 0000000..2dee7aa --- /dev/null +++ b/src/components/sale/saleroof/SaleRoofForm02.tsx @@ -0,0 +1,271 @@ +export default function SaleRoofForm02(){ + return( +
+
屋根関係
+
+
+
建築研修
+
+ +
+
+ + 年 +
+
+
+
屋根材※最大2個まで選択可能
+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
+ +
+
+
+
建築研修
+
+ +
+
+ +
+
+
+
屋根の斜面
+
+ + 寸 +
+
+
+
住宅構造
+
+ + +
+
+ + +
+
+ +
+
+
+
垂木材質
+
+
+ + +
+
+ + +
+
+ + +
+
+
+ +
+
+
+
垂木サイズ
+
+ +
+
+ +
+
+
+
垂木サイズ
+
+ +
+
+ +
+
+
+
垂木の方向
+
+
+ + +
+
+ + +
+
+
+
+
路地板の種類
+
+ +
+
+ +
+
+
+
路地板厚※小幅板を選択した場合, 厚さ. 小幅板間の間隔寸法を記載
+
+ + mm +
+
+
+
垂木の方向
+
+
+ + +
+
+ + +
+
+
+
+
住宅構造
+
+ + +
+
+ + +
+
+ +
+
+
+
断熱材の有無
+
+ + +
+
+ +
+
+ + +
+
+
+
路地板の種類
+
+ +
+
+ +
+
+
+
屋根製品名 設置可否確認
+
+ +
+
+ +
+
+
+
メモ
+
+ +
+
+ +
+
+
+
+
+ +
+
+ +
+
+ +
+
+
+ ) +} \ No newline at end of file diff --git a/src/styles/base/_check-radio.scss b/src/styles/base/_check-radio.scss index f6ed8ae..bbecd6f 100644 --- a/src/styles/base/_check-radio.scss +++ b/src/styles/base/_check-radio.scss @@ -102,7 +102,7 @@ position: absolute; width: 22px; height: 22px; - top: -2px; + top: -1px; left: 0; margin-left: 0; border: 1px solid #A8B6C7; @@ -118,7 +118,7 @@ content: ""; display: inline-block; position: absolute; - top: 4px; + top: 5px; left: 6px; width: 10px; height: 10px; diff --git a/src/styles/base/_utilities.scss b/src/styles/base/_utilities.scss index 8ef8031..256d7c8 100644 --- a/src/styles/base/_utilities.scss +++ b/src/styles/base/_utilities.scss @@ -33,4 +33,7 @@ .ml15{margin-left: 15px !important;} .ml20{margin-left: 20px !important;} .ml25{margin-left: 25px !important;} -.ml30{margin-left: 30px !important;} \ No newline at end of file +.ml30{margin-left: 30px !important;} + +// color +.red-f{color: #FF5656 !important;} \ No newline at end of file diff --git a/src/styles/components/_sub.scss b/src/styles/components/_sub.scss index 54c2816..e9cec63 100644 --- a/src/styles/components/_sub.scss +++ b/src/styles/components/_sub.scss @@ -9,6 +9,10 @@ .data-input-form-tit{ @include defaultFont($font-s-13, $font-w-500, $font-c); margin-bottom: 10px; + span{ + display: block; + @include defaultFont($font-s-13, $font-w-400, #A8B6C7); + } } } @@ -58,18 +62,23 @@ } } } -.sale-detail-tab-wrap{ +.sale-detail-tab-relative{ height: 40px; margin-bottom: 10px; - z-index: 100000; +} +.sale-detail-tab-wrap{ + position: fixed; + top: 66px; + left: 0; + width: 100%; + height: 40px; + background-color: $white-fff; + z-index: 98000; .sale-detail-tab-inner{ - position: fixed; - top: 66px; - left: 0; - width: 100%; + position: relative; @include flex(0px); align-items: center; - height: 40px; + height: 100%; .sale-detail-tab{ flex: 1; height: 100%; @@ -219,4 +228,34 @@ } .form-btn{ margin-top: 12px; +} + +// 매물 전기 지붕정보 +.sale-roof-title{ + @include defaultFont($font-s-15, $font-w-500, $font-c); + padding-bottom: 10px; + margin-bottom: 20px; + border-bottom: 1px solid #2E3A59; +} +.data-check-wrap{ + @include flex(10px); + flex-wrap: wrap; + margin-bottom: 12px; + .radio-form-box, + .check-form-box{ + width: calc(50% - 5px); + } + &.mb0{ + margin-bottom: 0; + } +} +.data-input{ + &.flex{ + @include flex(8px); + align-items: center; + span{ + flex: none; + @include defaultFont($font-s-13, $font-w-400, $font-c); + } + } } \ No newline at end of file diff --git a/src/styles/layout/_layout.scss b/src/styles/layout/_layout.scss index ae46baa..6d1e7c4 100644 --- a/src/styles/layout/_layout.scss +++ b/src/styles/layout/_layout.scss @@ -24,6 +24,7 @@ header{ width: 100%; height: 66px; background-color: $white-fff; + z-index: 100000; .header-inner{ position: relative; @include flex(0px); diff --git a/src/styles/layout/_pop-common.scss b/src/styles/layout/_pop-common.scss index 4930f4e..365d2b3 100644 --- a/src/styles/layout/_pop-common.scss +++ b/src/styles/layout/_pop-common.scss @@ -13,7 +13,6 @@ .modal-dialog { position: relative; display: flex; - align-items: center; min-height: calc(100% - (14px * 2)); max-width: 860px; z-index:111000; @@ -88,6 +87,7 @@ &.alert{ .modal-dialog{ max-width: 237px; + align-items: center; .modal-content{ padding: 20px; .alert-tit{