Files
sam-react-prod/claudedocs/settings/[IMPL-2025-12-19] account-info.md
byeongcheolryu c6b605200d feat: 신규 페이지 구현 및 HR/설정 기능 개선
신규 페이지:
- 회계관리: 거래처, 예상비용, 청구서, 발주서
- 게시판: 공지사항, 자료실, 커뮤니티
- 고객센터: 문의/FAQ
- 설정: 계정, 알림, 출퇴근, 팝업, 구독, 결제내역
- 리포트 (차트 시각화)
- 개발자 테스트 URL 페이지

기능 개선:
- HR 직원관리/휴가관리/카드관리 강화
- IntegratedListTemplateV2 확장
- AuthenticatedLayout 패딩 표준화
- 로그인 페이지 UI 개선

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-19 19:12:34 +09:00

2.7 KiB

계정정보 페이지 구현

생성일: 2025-12-19 URL: /ko/settings/account-info

📋 체크리스트

Phase 1: 기본 구조

  • page.tsx 생성 (/settings/account-info/page.tsx)
  • AccountInfoClient 컴포넌트 생성

Phase 2: 계정 정보 섹션

  • 프로필 사진 영역 (1250x250px, 10MB 이하 PNG/JPEG/GIF)
  • 아이디 표시 (읽기 전용)
  • 비밀번호 영역 + "변경" 버튼
  • 권한 표시
  • 상태 표시

Phase 3: 약관 동의 정보 섹션

  • [필수] 서비스 이용약관 동의 + 동의일시
  • [필수] 개인정보 취급방침 + 동의일시
  • [선택] 마케팅 정보 수신 동의
    • 이메일 수신 동의 + 동의일시
    • SMS 수신 동의 + 동의철회일시

Phase 4: 액션 버튼

  • 탈퇴 버튼 (테넌트 마스터 아닌 경우만 활성화)
    • 확인 Alert: "정말 탈퇴하시겠습니까?"
    • 탈퇴 처리 API 연동 (Mock 구현)
  • 사용중지 버튼 (테넌트 마스터인 경우만 활성화)
    • 확인 Alert: "정말 사용중지하시겠습니까?"
    • 사용중지 처리 API 연동 (Mock 구현)
  • 수정 버튼
  • 비밀번호 변경 버튼 → 비밀번호 설정 화면 이동

Phase 5: 마무리

  • URL 목록 문서 업데이트
  • 테스트 및 확인

📝 Description (스크린샷 기준)

탈퇴 버튼

  • 테넌트 마스터가 아닌 경우에만 버튼 활성화
  • 클릭: "정말 탈퇴하시겠습니까?" 확인 Alert 표시
  • 확인 버튼 클릭 시 탈퇴 처리 (모든 테넌트에서 탈퇴 처리, SAM 탈퇴 처리)

사용중지 버튼

  • 테넌트 마스터인 이면서 경우에만 버튼 활성화
  • 클릭: "정말 사용중지하시겠습니까?" 확인 Alert 표시
  • 확인 버튼 클릭 시 사용중지 처리 (해당 테넌트의 사용중지 처리)

변경 버튼

  • 클릭: 비밀번호 설정 화면으로 이동

🎨 UI 참고

계정 정보 섹션

필드 타입 비고
프로필 사진 이미지 업로드 1250x250px, 10MB 이하, PNG/JPEG/GIF
아이디 텍스트 (읽기전용) abc@email.com
비밀번호 버튼 "변경" + 숨김 아이콘
권한 텍스트 (읽기전용) 권한명
상태 텍스트 (읽기전용) 정상

약관 동의 정보 섹션

항목 타입 동의일시/철회일시
[필수] 서비스 이용약관 동의 텍스트 동의일시 표시
[필수] 개인정보 취급방침 텍스트 동의일시 표시
[선택] 이메일 수신 동의 체크박스 동의일시 표시
[선택] SMS 수신 동의 체크박스 동의철회일시 표시