1:1 문의 작성 페이지 추가

This commit is contained in:
김창수 2025-04-30 13:40:02 +09:00
parent 9477f1a7bf
commit 90a34f11fa
5 changed files with 153 additions and 16 deletions

View File

@ -16,8 +16,7 @@ export default function InputCommonPage() {
<input className="input-frame" type="text" placeholder="Input Frame Disabled" defaultValue={'defaultValue'} disabled/>
<input className="input-frame" type="text" placeholder="Input Frame ReadOnly" readOnly/>
<div className="filebox">
<input className="input-frame" placeholder="Input Frame File" defaultValue={fileName?.name} readOnly />
<label className="file-upload" htmlFor="file">Upload File</label>
<label className="btn-frame l-blue icon" htmlFor="file"><i className="btn-clip"></i>Upload File</label>
<input type="file" id="file" onChange={(e) => setFileName(e.target.files?.[0] ?? null)}/>
</div>
<div className="search-input">

View File

@ -0,0 +1,16 @@
import InquiryCreateForm from "@/components/inquiry/inquirycreate/InquiryCreateForm";
import Footer from "@/components/layouts/Footer";
import Header from "@/components/layouts/Header";
export default function InquiryCreatePage(){
return(
<div className="wrap">
<Header name={"1:1お問い合わせ"} backBtn={true}/>
<div className="container">
<InquiryCreateForm/>
</div>
<Footer/>
<button className="top-btn"></button>
</div>
)
}

View File

@ -143,6 +143,17 @@ export default function PublishList (){
</td>
<td className='c red'>2025/04/30</td>
</tr>
<tr>
<td>1:1 </td>
<td>
<Link href={'inquirycreate'}>InquiryCreatePage.tsx</Link>
</td>
<td className='c'>
</td>
<td className='c'>
</td>
<td className='c red'>2025/04/30</td>
</tr>
</tbody>
</table>
</div>

View File

@ -0,0 +1,64 @@
export default function InquiryCreateForm(){
return(
<div className="inquiry-frame">
<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="">
<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">
<select className="select-form" name="" id="">
<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">
<textarea className="textarea-form" rows={6} name="" id="" placeholder="TextArea Filed"></textarea>
</div>
</div>
</div>
<div className="inquiry-file-wrap">
<div className="filebox">
<label className="btn-frame l-blue icon" htmlFor="file"><i className="btn-clip"></i>Attach </label>
<input type="file" id="file"/>
</div>
<div className="file-list-wrap">
<div className="file-list-tit"><span>2</span></div>
<ul className="file-list">
<li className="file-item">
<div className="file-item-bx">
<div className="file-item-name">.jpg </div>
<button className="file-del"></button>
</div>
</li>
<li className="file-item">
<div className="file-item-bx">
<div className="file-item-name">.jpg </div>
<button className="file-del"></button>
</div>
</li>
</ul>
</div>
<div className="sale-edit-btn">
<button className="btn-frame n-blue icon"><i className="btn-arr"></i></button>
</div>
</div>
</div>
)
}

View File

@ -9,6 +9,9 @@
.data-input-form-tit{
@include defaultFont($font-s-13, $font-w-500, $font-c);
margin-bottom: 10px;
.import{
color: #F00;
}
span{
display: block;
@include defaultFont($font-s-13, $font-w-400, #A8B6C7);
@ -261,20 +264,10 @@
}
}
// 1:1 문의 목록
.inquiry-table-filter{
margin-bottom: 24px;
.filter-check{
margin-bottom: 12px;
}
}
.inquiry-list-tit{
padding-bottom: 10px;
border-bottom: 1px solid #2E3A59;
@include defaultFont($font-s-13, $font-w-400, $font-c);
span{
font-weight: $font-w-500;
}
// 1:1 문의 common
.inquiry-frame{
padding: 0 20px;
}
.badge{
min-width: 60px;
@ -298,6 +291,21 @@
}
}
// 1:1 문의 목록
.inquiry-table-filter{
margin-bottom: 24px;
.filter-check{
margin-bottom: 12px;
}
}
.inquiry-list-tit{
padding-bottom: 10px;
border-bottom: 1px solid #2E3A59;
@include defaultFont($font-s-13, $font-w-400, $font-c);
span{
font-weight: $font-w-500;
}
}
.inquiry-list{
.inquiry-item{
padding: 10px 0;
@ -330,3 +338,42 @@
}
}
}
// 1:1문의 작성
.inquiry-file-wrap{
margin-top: 20px;
.file-list-wrap{
margin-top: 14px;
.file-list-tit{
@include defaultFont($font-s-13, $font-w-500, $font-c);
}
.file-list{
margin-top: 14px;
}
.file-item{
border-top: 1px solid #EDEDED;
cursor: default;
.file-item-bx{
padding: 14px 0;
@include flex(0px);
align-items: center;
.file-item-name{
@include defaultFont($font-s-13, $font-w-400, $font-c);
}
.file-del{
display: block;
margin-left: auto;
width: 16px;
height: 16px;
background: url(/assets/images/common/id_delete_icon.svg)no-repeat center;
background-size: cover;
}
}
&:last-child{
.file-item-bx{
padding-bottom: 0;
}
}
}
}
}