From a9b2764af5aa8685a9f909bd53d85619846d490a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=B0=BD=EC=88=98?= <chang9811@interplug.co.kr>
Date: Mon, 4 Nov 2024 14:24:01 +0900
Subject: [PATCH] =?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=EC=9D=B4=EB=AF=B8=EC=A7=80=20?=
 =?UTF-8?q?=EB=B6=88=EB=9F=AC=EC=98=A4=EA=B8=B0=20=EC=98=81=EC=97=AD=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/canvas/page.jsx                       |  2 +-
 .../placementsetting/PlacementSettingPop.jsx  | 42 +++++++++++++++----
 src/components/publishpage/PublishPage.jsx    |  6 ++-
 src/styles/_modal.scss                        | 27 ++++++++++--
 4 files changed, 65 insertions(+), 12 deletions(-)

diff --git a/src/app/canvas/page.jsx b/src/app/canvas/page.jsx
index 147c3f9..351a6fd 100644
--- a/src/app/canvas/page.jsx
+++ b/src/app/canvas/page.jsx
@@ -87,7 +87,7 @@ export default function CanvasPage() {
                     {/* <Penal04/> */}
 
                     {/* 배치면 초기 설정 */}
-                    {/* <PlacementSettingPop/> */}
+                    <PlacementSettingPop/>
 
                     {/* 캔버스 기본 셋팅 */}
                     {/* {modalOption.option && <SettingModal01/>} */}
diff --git a/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx b/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx
index d28e9be..81a08cc 100644
--- a/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx
+++ b/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx
@@ -36,7 +36,11 @@ export default function PlacementSettingPop(){
                                     <td>寸法入力による物品作成</td>
                                 </tr>
                                 <tr>
-                                    <th>寸法入力方法 <button className="tooltip"></button></th>
+                                    <th>
+                                        <div className="tip-wrap">
+                                            寸法入力方法 <button className="tooltip"></button>
+                                        </div>
+                                    </th>
                                     <td>
                                         <div className="pop-form-radio">
                                             <div className="d-check-radio pop">
@@ -71,12 +75,14 @@ export default function PlacementSettingPop(){
                                 </tr>
                                 <tr>
                                     <th>
-                                        屋根材の選択(単位:mm) 
-                                        <button className="tooltip"></button>
+                                        <div className="tip-wrap">
+                                            屋根材の選択(単位:mm) 
+                                            <button className="tooltip"></button>
+                                        </div>
                                     </th>
                                     <td>
                                         {/* case01 */}
-                                        {/* <div className="placement-option">
+                                        <div className="placement-option">
                                             <div className="grid-select no-flx" style={{width: '171px'}}>
                                                 <Qselect title={'瓦53A'} option={SelectOption01}/>
                                             </div>
@@ -98,10 +104,10 @@ export default function PlacementSettingPop(){
                                                     <Qselect title={'455'} option={SelectOption04}/>
                                                 </div>
                                             </div>
-                                        </div> */}
+                                        </div>
 
                                         {/* case02 */}
-                                        <div className="placement-option">
+                                        {/* <div className="placement-option">
                                             <div className="grid-select no-flx" style={{width: '171px'}}>
                                                 <Qselect title={'瓦53A'} option={SelectOption01}/>
                                             </div>
@@ -117,7 +123,7 @@ export default function PlacementSettingPop(){
                                                     <Qselect title={'455'} option={SelectOption04}/>
                                                 </div>
                                             </div>
-                                        </div>
+                                        </div> */}
 
                                         {/* case03 */}
                                         {/* <div className="placement-option">
@@ -155,6 +161,18 @@ export default function PlacementSettingPop(){
                                 <tr>
                                     <th>ファイルを読み込む</th>
                                     <td>
+                                        <div className="pop-form-radio mb10">
+                                            <div className="d-check-radio pop">
+                                                <input type="radio" name="radio03" id="ra06" />
+                                                <label htmlFor="ra06">ファイルを読み込む</label>
+                                            </div>
+                                            <div className="d-check-radio pop">
+                                                <input type="radio" name="radio03" id="ra07" />
+                                                <label htmlFor="ra07">アドレスを読み込む</label>
+                                            </div>
+                                        </div>
+
+                                        {/* 파일 불러오기 */}
                                         <div className="flex-box">
                                             <div className="img-edit-wrap">
                                                 <label className="img-edit-btn" htmlFor="img_file">
@@ -168,6 +186,16 @@ export default function PlacementSettingPop(){
                                                 <button className="img-check"></button>
                                             </div>
                                         </div>
+
+                                        {/* 주소 불러오기 */}
+                                        <div className="flex-box for-address">
+                                            <input type="text" className="input-origin al-l mr10" placeholder={'住所入力'}/>
+                                            <div className="img-edit-wrap mr5">
+                                                <button className="img-edit-btn">完了</button>
+                                            </div>
+                                            <span className="check-address fail"></span>
+                                            <span className="check-address success"></span>
+                                        </div>
                                     </td>
                                 </tr>
                             </tbody>
diff --git a/src/components/publishpage/PublishPage.jsx b/src/components/publishpage/PublishPage.jsx
index 4b3dca0..aef5259 100644
--- a/src/components/publishpage/PublishPage.jsx
+++ b/src/components/publishpage/PublishPage.jsx
@@ -159,10 +159,14 @@ export default function PublishPage() {
                     <li>*견적서 img 업로드 버튼 수정</li>
                     <li>*면형상 배치 pop 수정</li>
                   </ul>
-                  <ul>
+                  <ul className='mb10'>
                     <li>2024-10-31</li>
                     <li>*그리드 이동, 보조선 이동, 보조선 복사 pop 수정</li>
                   </ul>
+                  <ul>
+                    <li>2024-11-04</li>
+                    <li>*배치면 초기설정 pop 이미지 불러오기 영역 수정</li>
+                  </ul>
                 </td>
                 <td className="t-center">2024-10-28</td>
               </tr>
diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss
index 7c40ab1..da421f1 100644
--- a/src/styles/_modal.scss
+++ b/src/styles/_modal.scss
@@ -391,19 +391,22 @@ $alert-color: #101010;
         table-layout: fixed;
         tr{
             th{
-                display: flex;
-                align-items: center;
                 font-size: $pop-normal-size;
                 color: $pop-color;
                 font-weight: $pop-bold-weight;
                 padding: 18px 0;
                 border-bottom: 1px solid #424242;
+                vertical-align: middle;
+                .tip-wrap{
+                    display: flex;
+                    align-items: center;
+                }
             }
             td{
                 font-size: $pop-normal-size;
                 color: $pop-color;
                 border-bottom: 1px solid #424242;
-                padding-left: 20px;
+                padding: 18px 0 18px 20px;
                 vertical-align: middle;
                 .flex-box{
                     display: flex;
@@ -479,6 +482,7 @@ $alert-color: #101010;
         color: $pop-color;
         font-weight: $pop-normal-weight;
     }
+
 }
 
 .img-edit-wrap{
@@ -528,6 +532,23 @@ $alert-color: #101010;
     }
 }
 
+.for-address{
+    input{
+        flex: 1;
+    }
+    .check-address{
+        flex: none;
+        width: 18px;
+        height: 18px;
+        margin-left: 5px;
+        background-repeat: no-repeat;
+        background-position: center;
+        background-size: cover;
+        &.fail{background-image: url(../../public/static/images/canvas/img_check_fail.svg);}
+        &.success{background-image: url(../../public/static/images/canvas/img_check_success.svg);}
+    }
+}
+
 // 외벽선 그리기
 .outline-wrap{
     padding: 24px 0;