67 lines
2.0 KiB
TypeScript
67 lines
2.0 KiB
TypeScript
'use client'
|
|
|
|
import { usePopupController } from '@/store/popupController'
|
|
import { useSuitable } from '@/hooks/useSuitable'
|
|
import { useSuitableStore } from '@/store/useSuitableStore'
|
|
|
|
export default function SuitableButton() {
|
|
const popupController = usePopupController()
|
|
const { getSuitableIds, clearSuitableStore, downloadSuitablePdf, suitableErrorAlert } = useSuitable()
|
|
const { selectedItems, addAllSelectedItem } = useSuitableStore()
|
|
|
|
/* 데이터 전체 선택 */
|
|
const handleSelectAll = async () => {
|
|
try {
|
|
addAllSelectedItem(await getSuitableIds())
|
|
} catch (error) {
|
|
suitableErrorAlert()
|
|
}
|
|
}
|
|
|
|
/* 상세 팝업 열기 */
|
|
const handleOpenPopup = () => {
|
|
if (selectedItems.size === 0) {
|
|
alert('屋根材を選択してください。')
|
|
return
|
|
}
|
|
popupController.setSuitableDetailPopup(true)
|
|
}
|
|
|
|
/* pdf 다운로드 */
|
|
const handleRedirectPdfDownload = () => {
|
|
if (selectedItems.size === 0) {
|
|
alert('屋根材を選択してください。')
|
|
return
|
|
}
|
|
downloadSuitablePdf()
|
|
}
|
|
|
|
return (
|
|
<div className="float-btn-wrap">
|
|
<div className="btn-flex-wrap com">
|
|
<div className="btn-bx">
|
|
{selectedItems.size === 0 ? (
|
|
<button className="btn-frame n-blue icon" onClick={handleSelectAll}>
|
|
全選択<i className="btn-arr"></i>
|
|
</button>
|
|
) : (
|
|
<button className="btn-frame n-blue icon" onClick={() => clearSuitableStore({ items: true })}>
|
|
全て解除<i className="btn-arr"></i>
|
|
</button>
|
|
)}
|
|
</div>
|
|
<div className="btn-bx">
|
|
<button className="btn-frame red icon" onClick={handleOpenPopup}>
|
|
詳細を見る<i className="btn-arr"></i>
|
|
</button>
|
|
</div>
|
|
<div className="btn-bx">
|
|
<button className="btn-frame n-blue icon" onClick={handleRedirectPdfDownload}>
|
|
選択ダウンロード<i className="btn-arr"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|