refactor: 수정화면 리스트 버튼 로직 및 문구 수정

- 수정화면에서 リスト(리스트) 에서 戻る (뒤로) 버튼 문구 수정
- 버튼 클릭 시 목록 화면이 아닌 상세화면으로 이동하도록 수정

src/components/Login.tsx

@@ -205,7 +205,7 @@ export default function Login() {
         </div>
         <div className="login-btn-wrap">
           <button className="btn-frame icon login" onClick={handleLogin}>
-            お問い合わせ <i className="btn-arr"></i>
+            LOGIN <i className="btn-arr"></i>
           </button>
         </div>
       </div>

src/components/popup/SuitableDetailPopupButton.tsx

@@ -35,7 +35,7 @@ export default function SuitableDetailPopupButton() {
         </div>
         <div className="btn-bx">
           <button className="btn-frame n-blue icon" onClick={() => handleRedirectPage('/inquiry/regist')}>
-            1：1お問い合わせ<i className="btn-arr"></i>
+            お問い合わせ<i className="btn-arr"></i>
           </button>
         </div>
       </div>

src/components/suitable/SuitableList.tsx

@@ -74,11 +74,11 @@ export default function SuitableList() {
             <div className={`check-form-box ${isMainIndeterminate(item.id, item.detailCnt) ? 'space' : ''}`}>
               <input
                 type="checkbox"
-                id={`ch${item.id}`}
+                id={`main_ch${item.id}`}
                 checked={isItemSelected(item.id)}
                 onChange={() => handleItemClick(item.id, undefined, toSuitableDetailIds(item.detail))}
               />
-              <label htmlFor={`ch${item.id}`}>{item.productName}</label>
+              <label htmlFor={`main_ch${item.id}`}>{item.productName}</label>
             </div>
             <div className="check-name-btn">
               <button className="bx-btn" onClick={() => toggleItemOpen(item.id)}></button>
@@ -91,11 +91,11 @@ export default function SuitableList() {
                   <div className="check-form-box light">
                     <input
                       type="checkbox"
-                      id={`ch${subItem.id}`}
+                      id={`sub_ch${subItem.id}`}
                       checked={isItemSelected(item.id, subItem.id)}
                       onChange={() => handleItemClick(item.id, subItem.id)}
                     />
-                    <label htmlFor={`ch${subItem.id}`}>{toCodeName(SUITABLE_HEAD_CODE.TRESTLE_MFPC_CD, subItem.trestleMfpcCd)}</label>
+                    <label htmlFor={`sub_ch${subItem.id}`}>{toCodeName(SUITABLE_HEAD_CODE.TRESTLE_MFPC_CD, subItem.trestleMfpcCd)}</label>
                   </div>
                   <div className="compliance-icon-wrap">
                     <div className="compliance-icon">
@@ -114,7 +114,7 @@ export default function SuitableList() {
         </div>
       )
     },
-    [isItemSelected, openItems, handleItemClick, toggleItemOpen, toCodeName, toSuitableDetail],
+    [isItemSelected, openItems, handleItemClick, toggleItemOpen, toCodeName, toSuitableDetail, toSuitableDetailIds],
   )
 
   /* 조회 데이터 리스트 */

src/components/survey-sale/detail/BasicForm.tsx

@@ -53,7 +53,7 @@ export default function BasicForm({ basicInfo, setBasicInfo, mode, session }: Ba
                 />
               </div>
               {/* 페이지 모드 별, 권한 별 판매점, 시공점 입력 여부 처리 */}
-              {mode === 'READ' || session?.role === 'Builder' ? (
+              {session?.role === 'Builder'? (
                 <>
                   {storeInput(basicInfo, setBasicInfo, mode)}
                   {builderInput(basicInfo, setBasicInfo, mode)}

src/components/survey-sale/detail/ButtonForm.tsx

@@ -215,7 +215,7 @@ export default function ButtonForm({ mode, setMode, data }: ButtonFormProps) {
     return (
       <div className="sale-form-btn-wrap">
         <div className="btn-flex-wrap">
-          <ListButton />
+          <ListButton mode={mode} setMode={setMode} />
         </div>
       </div>
     )
@@ -230,10 +230,14 @@ export default function ButtonForm({ mode, setMode, data }: ButtonFormProps) {
       {mode === 'READ' && (
         <div className="sale-form-btn-wrap">
           <div className="btn-flex-wrap">
-            <ListButton />
+            <ListButton mode={mode} setMode={setMode} />
-            {(permissions.isWriter || permissions.isSubmiter || (permissions.isReceiver && isSubmit)) && <EditButton setMode={setMode} disabled={buttonDisabled} />}
+            {(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 && !data.basic.srlNo?.includes('一時保存') && <SubmitButton handleSubmit={handleSubmit} disabled={buttonDisabled} />}
+            {!isSubmit && permissions.isSubmiter && !data.basic.srlNo?.includes('一時保存') && (
+              <SubmitButton handleSubmit={handleSubmit} disabled={buttonDisabled} />
+            )}
           </div>
         </div>
       )}
@@ -242,11 +246,14 @@ export default function ButtonForm({ mode, setMode, data }: ButtonFormProps) {
       {/* 작성자 - 임시저장, 저장, 제출(미제출인 매물) 버튼 표시 */}
       {/* 제출권한자 - 임시저장, 저장, 제출(미제출인 매물) 버튼 표시 */}
       {/* 제출수신자 - 임시저장, 저장 버튼 표시 */}
+      {/* 수정화면에서는 리스트 버튼 클릭 시 READ 모드로 이동 */}
       {(mode === 'CREATE' || mode === 'EDIT') && (
         <div className="sale-form-btn-wrap">
           <div className="btn-flex-wrap">
-            <ListButton />
+            <ListButton mode={mode} setMode={setMode} />
-            {(data.basic.srlNo?.includes('一時保存') || mode === 'CREATE') && <TempButton handleSave={() => handleSave(true)} disabled={buttonDisabled} />}
+            {(data.basic.srlNo?.includes('一時保存') || mode === 'CREATE') && (
+              <TempButton handleSave={() => handleSave(true)} disabled={buttonDisabled} />
+            )}
             <SaveButton handleSave={() => handleSave(false)} disabled={buttonDisabled} />
           </div>
         </div>
@@ -256,12 +263,25 @@ export default function ButtonForm({ mode, setMode, data }: ButtonFormProps) {
 }
 
 /** Button Components */
-const ListButton = () => {
+const ListButton = ({ mode, setMode }: { mode: Mode; setMode: (mode: Mode) => void }) => {
   const router = useRouter()
+  const { showConfirm } = useAlertMsg()
   return (
     <div className="btn-bx">
-      <button className="btn-frame n-blue icon" onClick={() => router.push('/survey-sale')}>
+      <button
-        リスト<i className="btn-arr"></i>
+        className="btn-frame n-blue icon"
+        onClick={() => {
+          if (mode === 'READ' || mode === 'CREATE') {
+            router.push('/survey-sale')
+          } else {
+            showConfirm(CONFIRM_MESSAGE.EDIT_CANCEL_CONFIRM, () => {
+              setMode('READ')
+            })
+          }
+        }}
+      >
+        {mode === 'READ' || mode === 'CREATE' ? 'リスト' : '戻る'}
+        <i className="btn-arr"></i>
       </button>
     </div>
   )

src/hooks/useAlertMsg.ts

@@ -39,6 +39,9 @@ export const CONFIRM_MESSAGE = {
 
   /** 문의 저장 확인 메세지 - "문의를 등록 하시겠습니까? 한화재팬 담당자에게 문의 메일이 발송됩니다." */
   SAVE_INQUIRY_CONFIRM: 'お問い合わせを登録しますか？ Hanwha Japanの担当者にお問い合わせメールが送信されます。',
+
+  /** 작성 / 수정 취소 확인 메세지 - "변경 내용이 저장되지 않았습니다. 돌아가도 되겠습니까?" */
+  EDIT_CANCEL_CONFIRM: '変更内容が保存されていません。戻ってもよろしいですか？',
 }
 
 export const WARNING_MESSAGE = {