qcast3/onsitesurvey
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 조사매물 생성/삭제/제출/수정 시 버튼 비활성화

Browse Source
This commit is contained in:
Dayoung 2025-07-04 16:12:00 +09:00
parent 2db1357558
commit 80b6e3644c
1 changed files with 19 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/components/survey-sale/detail/ButtonForm.tsx
View File

@ -48,10 +48,12 @@ export default function ButtonForm({ mode, setMode, data }: ButtonFormProps) {
const isSubmit = data.basic.submissionStatus
const { deleteSurvey, updateSurvey, isDeletingSurvey, isUpdatingSurvey } = useSurvey(id)
const { deleteSurvey, updateSurvey, isDeletingSurvey, isUpdatingSurvey, isSubmittingSurvey, isLoadingSurveyDetail } = useSurvey(id)
const { validateSurveyDetail, createSurvey, isCreatingSurvey } = useSurvey()
const { showErrorAlert, showSuccessAlert, showConfirm } = useAlertMsg()
const buttonDisabled = isLoadingSurveyDetail || isSubmittingSurvey || isCreatingSurvey || isUpdatingSurvey || isDeletingSurvey
useEffect(() => {
if (!session?.isLoggedIn) return
@ -237,9 +239,9 @@ export default function ButtonForm({ mode, setMode, data }: ButtonFormProps) {
<div className="sale-form-btn-wrap">
<div className="btn-flex-wrap">
<ListButton />
{(permissions.isWriter || permissions.isSubmiter || (permissions.isReceiver && isSubmit)) && <EditButton setMode={setMode} />}
{(permissions.isWriter || (permissions.isReceiver && isSubmit)) && <DeleteButton handleDelete={handleDelete} />}
{!isSubmit && permissions.isSubmiter && <SubmitButton handleSubmit={handleSubmit} />}
{(permissions.isWriter || permissions.isSubmiter || (permissions.isReceiver && isSubmit)) && <EditButton setMode={setMode} disabled={buttonDisabled} />}
{(permissions.isWriter || (permissions.isReceiver && isSubmit)) && <DeleteButton handleDelete={handleDelete} disabled={buttonDisabled} />}
{!isSubmit && permissions.isSubmiter && <SubmitButton handleSubmit={handleSubmit} disabled={buttonDisabled} />}
</div>
</div>
)}
@ -252,9 +254,9 @@ export default function ButtonForm({ mode, setMode, data }: ButtonFormProps) {
<div className="sale-form-btn-wrap">
<div className="btn-flex-wrap">
<ListButton />
<TempButton handleSave={() => handleSave(true, false)} />
<SaveButton handleSave={() => handleSave(false, false)} />
{!isSubmit && permissions.isSubmiter && <SubmitButton handleSubmit={handleSubmit} />}
<TempButton handleSave={() => handleSave(true, false)} disabled={buttonDisabled} />
<SaveButton handleSave={() => handleSave(false, false)} disabled={buttonDisabled} />
{!isSubmit && permissions.isSubmiter && <SubmitButton handleSubmit={handleSubmit} disabled={buttonDisabled} />}
</div>
</div>
)}
@ -274,7 +276,7 @@ const ListButton = () => {
)
}
const EditButton = ({ setMode }: { setMode: (mode: Mode) => void }) => {
const EditButton = ({ setMode, disabled }: { setMode: (mode: Mode) => void; disabled: boolean }) => {
return (
<div className="btn-bx">
<button
@ -282,6 +284,7 @@ const EditButton = ({ setMode }: { setMode: (mode: Mode) => void }) => {
onClick={() => {
setMode('EDIT')
}}
disabled={disabled}
>
修正<i className="btn-arr"></i>
</button>
@ -289,33 +292,33 @@ const EditButton = ({ setMode }: { setMode: (mode: Mode) => void }) => {
)
}
const SubmitButton = ({ handleSubmit }: { handleSubmit: () => void }) => (
const SubmitButton = ({ handleSubmit, disabled }: { handleSubmit: () => void; disabled: boolean }) => (
<div className="btn-bx">
<button className="btn-frame red icon" onClick={handleSubmit}>
<button className="btn-frame red icon" onClick={handleSubmit} disabled={disabled}>
提出<i className="btn-arr"></i>
</button>
</div>
)
const DeleteButton = ({ handleDelete }: { handleDelete: () => void }) => (
const DeleteButton = ({ handleDelete, disabled }: { handleDelete: () => void; disabled: boolean }) => (
<div className="btn-bx">
<button className="btn-frame n-blue icon" onClick={handleDelete}>
<button className="btn-frame n-blue icon" onClick={handleDelete} disabled={disabled}>
削除<i className="btn-arr"></i>
</button>
</div>
)
const SaveButton = ({ handleSave }: { handleSave: () => void }) => (
const SaveButton = ({ handleSave, disabled }: { handleSave: () => void; disabled: boolean }) => (
<div className="btn-bx">
<button className="btn-frame n-blue icon" onClick={handleSave}>
<button className="btn-frame n-blue icon" onClick={handleSave} disabled={disabled}>
保存<i className="btn-arr"></i>
</button>
</div>
)
const TempButton = ({ handleSave }: { handleSave: () => void }) => (
const TempButton = ({ handleSave, disabled }: { handleSave: () => void; disabled: boolean }) => (
<div className="btn-bx">
<button className="btn-frame n-blue icon" onClick={handleSave}>
<button className="btn-frame n-blue icon" onClick={handleSave} disabled={disabled}>
一時保存<i className="btn-arr"></i>
</button>
</div>