팝업 img태그 Image 컴포넌트 변환 및 제출 팝업 추가

This commit is contained in:
김창수 2025-05-15 15:58:53 +09:00
parent 56fbfc1d92
commit ff40cd2666
9 changed files with 128 additions and 16 deletions

View File

@ -0,0 +1,5 @@
<svg width="19" height="22" viewBox="0 0 19 22" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18 8.90909L18 6.81818C18 5.12494 18 4.27832 17.732 3.60214C17.3013 2.5151 16.3902 1.65765 15.2352 1.2522C14.5168 1 13.6173 1 11.8182 0.999999C8.66981 0.999999 7.09563 1 5.83836 1.44135C3.81714 2.15088 2.22282 3.65142 1.46894 5.55375C1 6.73706 1 8.21865 1 11.1818L1 13.7273C1 16.7966 1 18.3313 1.8477 19.3971C2.09058 19.7025 2.37862 19.9736 2.70307 20.2022C3.83546 21 5.46607 21 8.72727 21L9.5 21C10.0347 21 11.0337 21 11.5 20.9972" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M1 11C1 9.15905 2.49238 7.66667 4.33333 7.66667C4.99912 7.66667 5.78404 7.78333 6.43137 7.60988C7.00652 7.45576 7.45576 7.00652 7.60988 6.43136C7.78333 5.78404 7.66667 4.99912 7.66667 4.33333C7.66667 2.49238 9.15905 1 11 1" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M18 15H10.5M18 15C18 15.7002 16.0057 17.0085 15.5 17.5M18 15C18 14.2998 16.0057 12.9915 15.5 12.5" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -14,7 +14,7 @@ export default function MainPage(){
<Footer/>
</div>
{/* 회원정보 팝업 */}
{/* <MemberInformationPop/> */}
<MemberInformationPop/>
</>
)
}

View File

@ -1,20 +1,24 @@
import Footer from "@/components/layouts/Footer";
import Header from "@/components/layouts/Header";
import SaleSubmitPop from "@/components/sale/saledetail/pop/SaleSubmitPop";
import SaleDetailContents from "@/components/sale/saledetail/SaleDetailContents";
import SaleDetailData from "@/components/sale/saledetail/SaleDetailData";
export default function SaleDetailPage(){
return(
<div className="wrap">
<Header name={"調査物件一覧"} backBtn={true}/>
<div className="container">
<div className="sale-contents">
<SaleDetailData/>
<SaleDetailContents/>
<>
<div className="wrap">
<Header name={"調査物件一覧"} backBtn={true}/>
<div className="container">
<div className="sale-contents">
<SaleDetailData/>
<SaleDetailContents/>
</div>
</div>
<Footer/>
<button className="top-btn"></button>
</div>
<Footer/>
<button className="top-btn"></button>
</div>
<SaleSubmitPop/>
</>
)
}

View File

@ -17,7 +17,7 @@ export default function SaleEditPage() {
<button className="top-btn"></button>
</div>
{/* 주소 검색 팝업 */}
{/* <SaleZipCodePop/> */}
<SaleZipCodePop/>
</>
)
}

View File

@ -66,8 +66,11 @@ export default function PublishList (){
<td className='c'>
</td>
<td className='c'>
<td className='c red'>
<ul>
<li>2025/05/15</li>
<li>* img태그 Image </li>
</ul>
</td>
<td className='c red'>2025/04/29</td>
</tr>
@ -103,11 +106,14 @@ export default function PublishList (){
<Link href={'sale/saledetail'}>SaleDetailPage.tsx</Link>
</td>
<td className='c'>
</td>
<td className='c red'>
<ul>
<li>2025/05/15</li>
<li>* </li>
<li>* </li>
<li>* img태그 Image </li>
</ul>
</td>
<td className='c red'>2025/04/29</td>
@ -126,6 +132,7 @@ export default function PublishList (){
<ul>
<li>2025/05/15</li>
<li>* </li>
<li>* img태그 Image </li>
</ul>
</td>
<td className='c red'>2025/05/15</td>
@ -218,6 +225,10 @@ export default function PublishList (){
<li>2025/05/13</li>
<li>* Search Input </li>
</ul>
<ul className='mt5'>
<li>2025/05/15</li>
<li>* img태그 Image </li>
</ul>
</td>
<td className='c red'>2025/05/08</td>
</tr>

View File

@ -1,3 +1,5 @@
import Image from "next/image";
export default function MemberInformationPop(){
return(
<div className="modal-popup">
@ -7,7 +9,7 @@ export default function MemberInformationPop(){
<div className="modal-header-inner">
<div className="modal-name-wrap">
<div className="modal-img">
<img src="/assets/images/layout/modal_header_icon.svg" alt="" />
<Image src="/assets/images/layout/modal_header_icon.svg" width={18} height={20} alt="" />
</div>
<div className="modal-name"></div>
</div>

View File

@ -9,7 +9,7 @@ export default function RoofComplianceDetailPop(){
<div className="modal-header-inner">
<div className="modal-name-wrap">
<div className="modal-img">
<img src="/assets/images/layout/modal_header_icon03.svg" alt="" />
<Image src="/assets/images/layout/modal_header_icon03.svg" width={22} height={22} alt="" />
</div>
<div className="modal-name"> </div>
</div>

View File

@ -0,0 +1,89 @@
import Image from "next/image";
export default function SaleSubmitPop() {
return(
<div className="modal-popup">
<div className="modal-dialog">
<div className="modal-content">
<div className="modal-header">
<div className="modal-header-inner">
<div className="modal-name-wrap">
<div className="modal-img">
<Image src="/assets/images/layout/modal_header_icon04.svg" width={19} height={22} alt="" />
</div>
<div className="modal-name">調</div>
</div>
<button className="modal-close"></button>
</div>
</div>
<div className="modal-body">
<div className="data-form-wrap">
<div className="data-input-form-bx">
<div className="data-input-form-tit"> <i className="import">*</i></div>
<div className="data-input">
<select className="select-form" name="" id="" disabled>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
<option value=""></option>
</select>
</div>
</div>
<div className="data-input-form-bx">
<div className="data-input-form-tit"> <i className="import">*</i></div>
<div className="data-input">
<input className="input-frame" type="text" defaultValue={'Interplug'} disabled/>
</div>
</div>
<div className="data-input-form-bx">
<div className="data-input-form-tit"> <i className="import">*</i></div>
<div className="data-input">
<input className="input-frame" type="text" defaultValue={'HG@interplug2.co.kr'} disabled/>
</div>
</div>
<div className="data-input-form-bx">
<div className="data-input-form-tit"> <i className="import">*</i></div>
<div className="data-input">
<input className="input-frame" type="text" defaultValue={'GI@Interplug.co.kr, Kim@interplug.co.kr'} disabled/>
</div>
</div>
<div className="data-input-form-bx">
<div className="data-input-form-tit"> </div>
<div className="data-input">
<input className="input-frame" type="text" defaultValue={'KimG@Interplug.co.kr'} disabled/>
</div>
</div>
<div className="data-input-form-bx">
<div className="data-input-form-tit"> <i className="import">*</i></div>
<div className="data-input">
<input className="input-frame" type="text" defaultValue={'[HANASYS現地調査] 調査物件が提出.'} disabled/>
</div>
</div>
<div className="data-input-form-bx">
<div className="data-input-form-tit"> <i className="import">*</i></div>
<div className="data-input">
<textarea className="textarea-form" name="" id="" defaultValue={'漏れの兆候があるため、正確な点検が必要です.'} disabled></textarea>
</div>
</div>
<div className="data-input-form-bx">
<div className="data-input-form-tit"> <i className="import">*</i></div>
<div className="data-input">
<input className="input-frame" type="text" defaultValue={'HWJ現地調査表.pdf'} disabled/>
</div>
</div>
</div>
<div className="btn-flex-wrap">
<div className="btn-bx">
<button className="btn-frame n-blue icon"><i className="btn-arr"></i></button>
</div>
<div className="btn-bx">
<button className="btn-frame red icon"><i className="btn-arr"></i></button>
</div>
</div>
</div>
</div>
</div>
</div>
)
}

View File

@ -1,4 +1,5 @@
'use client'
import Image from "next/image";
import { useState } from "react"
export default function SaleZipCodePop() {
@ -17,7 +18,7 @@ export default function SaleZipCodePop() {
<div className="modal-header-inner">
<div className="modal-name-wrap">
<div className="modal-img">
<img src="/assets/images/layout/modal_header_icon02.svg" alt="" />
<Image src="/assets/images/layout/modal_header_icon02.svg" width={20} height={20} alt="" />
</div>
<div className="modal-name"></div>
</div>