103 lines
3.8 KiB
TypeScript
103 lines
3.8 KiB
TypeScript
'use client'
|
|
|
|
import Answer from './Answer'
|
|
import { useInquiry } from '@/hooks/useInquiry'
|
|
import { useParams, useRouter } from 'next/navigation'
|
|
import { useSessionStore } from '@/store/session'
|
|
|
|
export default function Detail() {
|
|
const params = useParams()
|
|
const id = params.id
|
|
|
|
const { inquiryDetail, downloadFile, commonCodeList } = useInquiry(Number(id), false)
|
|
const router = useRouter()
|
|
|
|
const { session } = useSessionStore()
|
|
|
|
const isBuilderOrPartner = session?.role === 'Builder' || session?.role === 'Partner'
|
|
|
|
return (
|
|
<>
|
|
<div className="inquiry-frame">
|
|
<div className="inquiry-detail-wrap">
|
|
<div className="inquiry-detail-badge">
|
|
<div className={`badge ${inquiryDetail?.answerYn === 'Y' ? 'orange' : 'blue'} block`}>
|
|
{inquiryDetail?.answerYn === 'Y' ? '回答完了' : '回答待ち'}
|
|
</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>{inquiryDetail?.regDt.split(' ')[0]}</td>
|
|
</tr>
|
|
<tr>
|
|
<th>顧客名</th>
|
|
<td>
|
|
{session?.userNm} {session?.builderNm ? `[${session?.builderNm}]` : ''}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<th>販売店</th>
|
|
<td>{isBuilderOrPartner ? '-' : inquiryDetail?.storeNm}</td>
|
|
</tr>
|
|
<tr>
|
|
<th>E-mail</th>
|
|
<td>{inquiryDetail?.regEmail ? inquiryDetail?.regEmail : '-'}</td>
|
|
</tr>
|
|
<tr>
|
|
<th>名前</th>
|
|
<td>{inquiryDetail?.regUserNm}</td>
|
|
</tr>
|
|
<tr>
|
|
<th>お問い合わせ</th>
|
|
<td>{inquiryDetail?.regUserTelNo ? inquiryDetail?.regUserTelNo : '-'}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div className="inquiry-detail-data">
|
|
<div className="inquiry-detail-category">
|
|
<span>{commonCodeList.find((code) => code.code === inquiryDetail?.qnaClsLrgCd)?.name}</span>
|
|
<span>{commonCodeList.find((code) => code.code === inquiryDetail?.qnaClsMidCd)?.name}</span>
|
|
<span>{commonCodeList.find((code) => code.code === inquiryDetail?.qnaClsSmlCd)?.name}</span>
|
|
</div>
|
|
<div className="inquiry-detail-tit">{inquiryDetail?.qstTitle}</div>
|
|
<div className="inquiry-detail-txt">{inquiryDetail?.qstContents}</div>
|
|
</div>
|
|
<div className="file-list-wrap">
|
|
<div className="file-list-tit">ファイル添付</div>
|
|
<ul className="file-list">
|
|
{inquiryDetail?.listFile?.map((file) => (
|
|
<li className="file-item" key={file.fileNo}>
|
|
<button
|
|
className="file-item-bx"
|
|
onClick={() => {
|
|
downloadFile(Number(file.encodeFileNo), file.srcFileNm)
|
|
}}
|
|
>
|
|
<div className="file-item-name">{file.srcFileNm} </div>
|
|
</button>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
{inquiryDetail?.answerYn === 'Y' && inquiryDetail && <Answer inquiryDetail={inquiryDetail} downloadFile={downloadFile} />}
|
|
|
|
<div className="sale-edit-btn">
|
|
<button className="btn-frame n-blue icon" onClick={() => router.push('/inquiry/list')}>
|
|
リスト<i className="btn-arr"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|