100 lines
3.2 KiB
TypeScript
100 lines
3.2 KiB
TypeScript
'use client'
|
|
|
|
import { useState } from 'react'
|
|
import Answer from './Answer'
|
|
|
|
export default function Detail() {
|
|
//todo: 답변 완료 표시를 위해 임시로 추가 해 놓은 state
|
|
// 추후에 api 작업 완료후 삭제
|
|
// 답변 완료 클래스 & 하단 답변내용 출력도
|
|
const [inquiry, setInquiry] = useState<Boolean>(true)
|
|
|
|
return (
|
|
<>
|
|
<div className="inquiry-frame">
|
|
<div className="inquiry-detail-wrap">
|
|
<div className="inquiry-detail-badge">
|
|
<div className={`badge ${inquiry ? 'orange' : 'blue'} block`}>回答完了</div>
|
|
</div>
|
|
<div className="inquiry-detail-data-table">
|
|
<table className="sale-data-table">
|
|
<colgroup>
|
|
<col style={{ width: '80px' }} />
|
|
<col />
|
|
</colgroup>
|
|
<tbody>
|
|
<tr>
|
|
<th>登録日</th>
|
|
<td>2025.04.10</td>
|
|
</tr>
|
|
<tr>
|
|
<th>作者</th>
|
|
<td>Hong gi</td>
|
|
</tr>
|
|
<tr>
|
|
<th>名前</th>
|
|
<td>Kim</td>
|
|
</tr>
|
|
<tr>
|
|
<th>番号</th>
|
|
<td>070-1234-5678</td>
|
|
</tr>
|
|
<tr>
|
|
<th>販売店</th>
|
|
<td>interplug</td>
|
|
</tr>
|
|
<tr>
|
|
<th>施工店</th>
|
|
<td>interplugs</td>
|
|
</tr>
|
|
<tr>
|
|
<th>E-mail</th>
|
|
<td>Hong@interplug.co.kr</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div className="inquiry-detail-data">
|
|
<div className="inquiry-detail-category">
|
|
<span>屋根</span>
|
|
<span>適合性</span>
|
|
<span>屋根材</span>
|
|
</div>
|
|
<div className="inquiry-detail-tit">屋根材適合性確認依頼</div>
|
|
<div className="inquiry-detail-txt">
|
|
入力した内容が表示されます.
|
|
<br />
|
|
インストール可能であることを確認してください.
|
|
<br />
|
|
屋根の写真を添付しました.
|
|
</div>
|
|
</div>
|
|
<div className="file-list-wrap">
|
|
<div className="file-list-tit">ファイル添付</div>
|
|
<ul className="file-list">
|
|
<li className="file-item">
|
|
<button className="file-item-bx">
|
|
<div className="file-item-name">添付ファイル名.jpg </div>
|
|
</button>
|
|
</li>
|
|
<li className="file-item">
|
|
<button className="file-item-bx">
|
|
<div className="file-item-name">添付ファイル名.jpg </div>
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
{inquiry && <Answer />}
|
|
|
|
<div className="sale-edit-btn">
|
|
<button className="btn-frame n-blue icon">
|
|
リスト<i className="btn-arr"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|