1:1 문의 작성 페이지 추가
This commit is contained in:
parent
9477f1a7bf
commit
90a34f11fa
@ -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">
|
||||
|
||||
16
src/app/inquirycreate/page.tsx
Normal file
16
src/app/inquirycreate/page.tsx
Normal 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>
|
||||
)
|
||||
}
|
||||
@ -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>
|
||||
|
||||
64
src/components/inquiry/inquirycreate/InquiryCreateForm.tsx
Normal file
64
src/components/inquiry/inquirycreate/InquiryCreateForm.tsx
Normal 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>
|
||||
)
|
||||
}
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user