diff --git a/frontend/components/screen/InteractiveScreenViewer.tsx b/frontend/components/screen/InteractiveScreenViewer.tsx index aeadcc1f..957f3365 100644 --- a/frontend/components/screen/InteractiveScreenViewer.tsx +++ b/frontend/components/screen/InteractiveScreenViewer.tsx @@ -1382,9 +1382,29 @@ export const InteractiveScreenViewer: React.FC = ( // 편집 액션 const handleEditAction = () => { - console.log("✏️ 편집 모드 활성화"); - // 읽기 전용 모드를 편집 모드로 전환 - alert("편집 모드로 전환되었습니다."); + console.log("✏️ 수정 액션 실행"); + + // 버튼 컴포넌트의 수정 모달 설정 가져오기 + const editModalTitle = config?.editModalTitle || ""; + const editModalDescription = config?.editModalDescription || ""; + + console.log("📝 버튼 수정 모달 설정:", { editModalTitle, editModalDescription }); + + // EditModal 열기 이벤트 발생 + const event = new CustomEvent("openEditModal", { + detail: { + screenId: screenInfo?.id, + modalSize: "lg", + editData: formData, + modalTitle: editModalTitle, + modalDescription: editModalDescription, + onSave: () => { + console.log("✅ 수정 완료"); + // 필요시 폼 새로고침 또는 콜백 실행 + }, + }, + }); + window.dispatchEvent(event); }; // 추가 액션 diff --git a/frontend/components/screen/config-panels/ButtonConfigPanel.tsx b/frontend/components/screen/config-panels/ButtonConfigPanel.tsx index 5216469a..9f90e0da 100644 --- a/frontend/components/screen/config-panels/ButtonConfigPanel.tsx +++ b/frontend/components/screen/config-panels/ButtonConfigPanel.tsx @@ -402,12 +402,15 @@ export const ButtonConfigPanel: React.FC = ({ component, id="edit-modal-title" placeholder="모달 제목을 입력하세요 (예: 데이터 수정)" value={config.action?.editModalTitle || ""} - onChange={(e) => + onChange={(e) => { + const newValue = e.target.value; onUpdateProperty("componentConfig.action", { ...config.action, - editModalTitle: e.target.value, - }) - } + editModalTitle: newValue, + }); + // webTypeConfig에도 저장 + onUpdateProperty("webTypeConfig.editModalTitle", newValue); + }} />

비워두면 기본 제목이 표시됩니다

@@ -418,12 +421,15 @@ export const ButtonConfigPanel: React.FC = ({ component, id="edit-modal-description" placeholder="모달 설명을 입력하세요 (예: 선택한 데이터를 수정합니다)" value={config.action?.editModalDescription || ""} - onChange={(e) => + onChange={(e) => { + const newValue = e.target.value; onUpdateProperty("componentConfig.action", { ...config.action, - editModalDescription: e.target.value, - }) - } + editModalDescription: newValue, + }); + // webTypeConfig에도 저장 + onUpdateProperty("webTypeConfig.editModalDescription", newValue); + }} />

비워두면 설명이 표시되지 않습니다

diff --git a/frontend/types/screen-legacy-backup.ts b/frontend/types/screen-legacy-backup.ts index e952afaf..762d4a8a 100644 --- a/frontend/types/screen-legacy-backup.ts +++ b/frontend/types/screen-legacy-backup.ts @@ -882,6 +882,10 @@ export interface ButtonTypeConfig { navigateScreenId?: number; // 이동할 화면 ID navigateTarget?: "_self" | "_blank"; + // 수정 모달 설정 + editModalTitle?: string; // 수정 모달 제목 + editModalDescription?: string; // 수정 모달 설명 + // 커스텀 액션 설정 customAction?: string; // JavaScript 코드 또는 함수명