@axboot-mcp/mcp-server 1.0.0

package/src/docs//354/202/254/354/232/251/353/262/225//355/231/225/354/236/245/355/231/224/353/251/264/355/203/200/354/236/205/353/263/204-/354/203/201/354/204/270-/355/224/204/353/241/254/355/224/204/355/212/270/352/260/200/354/235/264/353/223/234.md

@@ -0,0 +1,2422 @@
+# 확장 화면 타입별 상세 프롬프트 가이드 (27가지)
+
+AXBoot 프로젝트의 확장 화면 타입 27가지에 대한 매우 상세한 개발 프롬프트 템플릿입니다. 각 타입별로 실제 프로젝트 구조와 DTO를 활용한 완성도 높은 개발이 가능하도록 구성했습니다.
+
+---
+
+## 📋 URL 패턴 및 프로젝트 구조 가이드
+
+### URL 구성 규칙
+프로젝트의 URL은 다음과 같은 패턴을 따릅니다:
+
+1. **기본 URL 패턴**: `/{serviceGroup}/{domain}.{feature}`
+   - serviceGroup: NH (나비엔하우스), OP (온라인파트너), NIP (인터페이스 포털)
+   - domain: member, product, order, system, benefit 등
+   - feature: list, dashboard, mng, history 등
+
+2. **파일 경로 매핑**:
+   ```
+   URL: /NH/member.dashboard
+   파일: src/pages/resources/NH/member.dashboard/App.tsx
+   ```
+
+3. **프로그램 등록**:
+   - `src/router/@programData.ts`에 PROGRAM_TYPES 등록
+   - PAGE_RESOURCES에 type과 name 매핑
+
+### 디렉토리 구조
+```
+src/pages/resources/{serviceGroup}/{domain}.{feature}/
+├── App.tsx                 # 메인 페이지 컴포넌트
+├── ListDataGrid.tsx        # 목록 그리드 컴포넌트
+├── FormSet.tsx            # 폼 컴포넌트 (수정/등록)
+├── use{Domain}{Feature}Store.ts # Zustand 스토어
+├── modal/                 # 모달 컴포넌트들
+└── components/            # 하위 컴포넌트들
+```
+
+---
+
+## 🔧 DTO 및 API 활용 상세 가이드
+
+### 1. Repository Pattern
+모든 API는 Repository 패턴을 따르며, 다음 구조를 가집니다:
+
+```typescript
+// 1. Interface 정의 (src/services/@interface/interface/{Domain}Interface.ts)
+export abstract class {Domain}Interface {
+  abstract post{Domain}List{Feature}(
+    params: Post{Domain}List{Feature}Request,
+    config?: ApiRequestConfig
+  ): Promise<Post{Domain}List{Feature}Response>;
+}
+
+// 2. Repository 구현 (src/services/@interface/repository/{Domain}Repository.ts)
+export class {Domain}Repository extends APIRepository implements {Domain}Interface {
+  post{Domain}List{Feature}(params, config) {
+    return this.api.post(`/{domain}/list{Feature}`, params, config);
+  }
+}
+
+// 3. Service 등록 (src/services/index.ts)
+export const {Domain}Service = new {Domain}Repository(apiWrapper);
+```
+
+### 2. DTO 네이밍 컨벤션
+
+#### Request DTO
+```typescript
+// 기본 패턴: Post{Domain}{Action}Request
+interface PostMemberListMemberRequest {
+  // 페이징 정보
+  pageNumber: number;
+  pageSize: number;
+
+  // 검색 조건
+  searchKeyword?: string;
+  searchType?: string;
+  dateRange?: [string, string];
+  status?: string;
+
+  // 기타 필터
+  orderBy?: string;
+  orderDirection?: 'ASC' | 'DESC';
+}
+
+// 저장/수정 패턴: Post{Domain}Save{Entity}Request
+interface PostMemberSaveMemberRequest {
+  memberNo?: number;  // 수정 시
+  memberName: string;
+  memberEmail: string;
+  memberStatus: string;
+  __status__: 'C' | 'U' | 'D';  // Create/Update/Delete
+}
+```
+
+#### Response DTO
+```typescript
+// 목록 조회 패턴: Post{Domain}List{Entity}Response
+interface PostMemberListMemberResponse {
+  page: {
+    totalElements: number;
+    totalPages: number;
+    number: number;
+    size: number;
+  };
+  ds: Member[];  // 데이터 배열
+}
+
+// 상세/저장 패턴: Post{Domain}Get{Entity}Response
+interface PostMemberGetMemberResponse {
+  ds: Member;  // 단일 객체
+}
+```
+
+### 3. Entity DTO
+```typescript
+// src/services/@interface/dto/{Entity}.ts
+export interface Member {
+  memberNo: number;
+  memberName: string;
+  memberEmail: string;
+  memberPhone?: string;
+  memberStatus: string;
+  createdAt: string;
+  updatedAt?: string;
+
+  // 관계 데이터
+  memberGroup?: MemberGroup;
+  memberPoints?: number;
+}
+```
+
+### 4. API 호출 패턴
+
+#### Store에서의 API 호출
+```typescript
+// Zustand 스토어 패턴
+interface Store {
+  // 데이터 상태
+  listResponse: PostMemberListMemberResponse;
+  listRequestValue: PostMemberListMemberRequest;
+
+  // 로딩 상태
+  listSpinning: boolean;
+  formSpinning: boolean;
+
+  // API 함수
+  callListApi: (params?: Partial<PostMemberListMemberRequest>) => Promise<void>;
+  callSaveApi: (params: PostMemberSaveMemberRequest) => Promise<void>;
+}
+
+const callListApi = async (params) => {
+  set({ listSpinning: true });
+  try {
+    const response = await MemberService.postMemberListMember({
+      ...get().listRequestValue,
+      ...params,
+    });
+    set({ listResponse: response });
+  } finally {
+    set({ listSpinning: false });
+  }
+};
+```
+
+### 5. 실제 사용 예시
+
+#### 회원 목록 조회
+```typescript
+// Request
+const request: PostMemberListMemberRequest = {
+  pageNumber: 1,
+  pageSize: 50,
+  searchKeyword: "김",
+  searchType: "memberName",
+  memberStatus: "ACTIVE",
+  dateRange: ["2024-01-01", "2024-12-31"]
+};
+
+// API 호출
+const response = await MemberService.postMemberListMember(request);
+
+// Response 활용
+const { page, ds: memberList } = response;
+console.log(`총 ${page.totalElements}명의 회원 중 ${memberList.length}명 조회`);
+```
+
+#### 회원 저장
+```typescript
+// 신규 등록
+const createRequest: PostMemberSaveMemberRequest = {
+  memberName: "홍길동",
+  memberEmail: "hong@example.com",
+  memberStatus: "ACTIVE",
+  __status__: "C"
+};
+
+// 수정
+const updateRequest: PostMemberSaveMemberRequest = {
+  memberNo: 123,
+  memberName: "홍길동",
+  memberEmail: "hong.updated@example.com",
+  memberStatus: "INACTIVE",
+  __status__: "U"
+};
+
+await MemberService.postMemberSaveMember(createRequest);
+```
+
+---
+
+## 7. 🖼️ 이미지 썸네일 그리드 + 모달형 (Image Grid Modal)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 이미지 썸네일 그리드 + 모달 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service, UploadService
+   - 목록 조회: post{도메인명}List{기능명}
+   - 이미지 등록: post{도메인명}Save{기능명}
+   - 이미지 업로드: postUploadImageFile
+   - 순서 변경: post{도메인명}UptOrder
+   - Request DTO: Post{도메인명}List{기능명}Request
+   - Response DTO: Post{도메인명}List{기능명}Response { page, ds: {도메인DTO}[] }
+
+2. **탭 기반 카테고리 구성**
+   - 탭 데이터: {카테고리명}List (예: bannerLocTp)
+   - 활성 탭 상태: active{카테고리명}
+   - 탭별 독립적 데이터 로딩
+   - 탭 변경 시 목록 새로고침
+
+3. **검색 조건 구성**
+   - SearchParams 컴포넌트 사용
+   - 카테고리 선택: {카테고리 필드명} (SELECT)
+   - 채널 선택: {채널 필드명} (RADIO)
+   - 상태 필터: {상태 필드명} (SELECT)
+   - 날짜 범위: {날짜 필드명} (DATE_RANGE)
+
+4. **썸네일 그리드 구성**
+   - 기본 정보 컬럼: 제목, 설명, 상태
+   - 이미지 컬럼: PC/모바일 썸네일 표시
+   - 노출기간 컬럼: 시작일~종료일 표시
+   - ThumbPreview 컴포넌트: 80x60 크기 썸네일
+   - 이미지 미리보기: 클릭 시 원본 이미지 모달
+   - 더블클릭: 수정 모달 오픈
+
+5. **이미지 등록/수정 모달**
+   - 모달 크기: large (1000px)
+   - 기본 정보 섹션: 제목, 설명, 노출기간
+   - 이미지 업로드 섹션: PC/모바일 이미지 분리
+   - 파일 선택: accept="image/*", 최대 10MB
+   - 미리보기: 업로드 즉시 썸네일 표시
+   - 크롭 기능: 비율 조정 (16:9, 1:1 등)
+   - 유효성 검증: 필수 이미지, 파일 크기, 형식
+
+6. **순서 관리 모달**
+   - 드래그 앤 드롭: react-beautiful-dnd
+   - 썸네일 리스트: 작은 썸네일 + 제목
+   - 순서 번호 표시: 1, 2, 3...
+   - 저장 버튼: 변경된 순서 일괄 저장
+   - 취소 버튼: 원래 순서로 복원
+
+7. **파일 업로드 처리**
+   - 이미지 업로드: FormData로 multipart 전송
+   - 진행률 표시: 업로드 프로그레스바
+   - 에러 처리: 파일 크기, 형식 체크
+   - 썸네일 생성: 서버에서 자동 생성
+   - CDN 연동: 업로드 후 CDN URL 반환
+
+**DTO 활용 정보:**
+- 기본 DTO: {도메인명} interface
+- 이미지 정보: { pcImageFlInfo, moImageFlInfo }
+- 파일 정보: { fileId, fileName, fileSize, prevewUrlCtnts }
+- 순서 정보: sortOrder, displayOrder
+
+**화면 경로:** /{도메인경로}/image-grid
+**참고 화면:** 배너 관리, 상품 이미지 관리
+
+**요청사항:**
+- 반응형 썸네일 그리드 (4-6-8 컬럼)
+- 이미지 지연 로딩 (IntersectionObserver)
+- 대용량 이미지 최적화 (WebP 변환)
+- 접근성 고려 (alt 텍스트, 키보드 내비게이션)
+- 에러 상황 우아한 처리 (이미지 로드 실패 시 대체 이미지)
+```
+
+### 실제 사용 예시
+
+```
+배너 관리 이미지 썸네일 그리드 + 모달 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: BannerSerevice, UploadService
+   - 목록 조회: postBannerListBanner
+   - 배너 등록: postBannerSaveBanner
+   - 이미지 업로드: postUploadBannerImage
+   - 순서 변경: postBannerUptDisplayOrder
+   - Request DTO: PostBannerListBannerRequest extends BannerSearch
+   - Response DTO: PostBannerListBannerResponse { page: DataGridPageResponse, ds: Banner[] }
+
+2. **탭 기반 카테고리 구성**
+   - 탭 데이터: bannerLocTpList (배너 위치 타입)
+   - 활성 탭 상태: activeBannerLocTp
+   - 탭별 독립적 데이터 로딩
+   - 탭 변경 시 목록 새로고침
+
+3. **검색 조건 구성**
+   - 카테고리 선택: ctgrNo (상품 카테고리)
+   - 채널 선택: mdiaClcd (미디어 구분코드) - RADIO
+   - 상태 필터: useYn (사용여부) - SELECT
+   - 노출기간: expsrBgnDtm ~ expsrEndDtm (DATE_RANGE)
+
+4. **썸네일 그리드 구성**
+   - 배너명 컬럼: bannerNm (200px)
+   - 이미지 컬럼: PC(pcImageFlInfo)/모바일(moImageFlInfo) 썸네일
+   - 노출기간 컬럼: expsrBgnDtm ~ expsrEndDtm 표시
+   - ThumbPreview: 80x60 크기, border-radius: 4px
+   - 순서 컬럼: displayOrder 표시
+
+5. **배너 등록/수정 모달**
+   - 기본 정보: bannerNm, bannerDesc, linkUrl
+   - 노출 설정: expsrBgnDtm, expsrEndDtm, useYn
+   - PC 이미지: 권장 크기 1920x800, 최대 5MB
+   - 모바일 이미지: 권장 크기 750x400, 최대 5MB
+   - 링크 설정: linkUrl, linkTrgtYn (새창여부)
+
+6. **순서 관리 모달**
+   - 현재 탭의 배너들만 표시
+   - 썸네일 + 배너명 표시
+   - displayOrder 필드로 순서 관리
+   - 드래그 앤 드롭으로 순서 변경
+
+**DTO 활용 정보:**
+- 기본 DTO: Banner interface
+- 이미지 정보: { pcImageFlInfo: AtchflInfo, moImageFlInfo: AtchflInfo }
+- 파일 정보: AtchflInfo { fileId, fileName, fileSize, prevewUrlCtnts }
+- 탭 정보: BannerLocTp { bannerLocTpcd, bannerLocTpnm }
+
+**화면 경로:** /display/banner/image-grid
+**참고 화면:** 기존 배너 관리
+
+**요청사항:**
+- 반응형 썸네일 그리드 (4-6-8 컬럼)
+- 이미지 지연 로딩 (IntersectionObserver)
+- WebP 이미지 최적화
+- 드래그 앤 드롭 순서 변경
+- 배너 미리보기 기능
+```
+
+---
+
+## 8. 📝 일반 그리드 목록 + 모달형 (Grid Modal)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 일반 그리드 목록 + 모달 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 목록 조회: post{도메인명}List{기능명}
+   - 상세 조회: post{도메인명}Dtl{기능명}
+   - 등록/수정: post{도메인명}Save{기능명}
+   - 삭제: post{도메인명}Del{기능명}
+   - 엑셀 다운: post{도메인명}ListExcel{기능명}
+   - Request DTO: Post{도메인명}List{기능명}Request
+   - Response DTO: Post{도메인명}List{기능명}Response
+
+2. **검색 조건 구성**
+   - SearchParams 컴포넌트 활용
+   - 텍스트 검색: {검색 필드명} (INPUT)
+   - 상태 필터: {상태 필드명} (SELECT)
+   - 카테고리 필터: {카테고리 필드명} (SELECT)
+   - 날짜 범위: {날짜 필드명} (DATE_RANGE)
+   - 조회 버튼: 검색 실행
+   - 초기화 버튼: 검색 조건 리셋
+
+3. **데이터 그리드 구성**
+   - ListDataGrid 컴포넌트 사용
+   - 체크박스 선택: 다중 선택 지원
+   - 정렬 기능: 주요 컬럼별 정렬
+   - 페이지네이션: 기본 20개씩
+   - 컬럼 정의: {구체적인 컬럼 리스트}
+   - 더블클릭: 수정 모달 오픈
+   - 행 선택: 단일 선택으로 상세보기
+
+4. **액션 버튼 구성**
+   - 등록 버튼: 새 항목 등록 모달
+   - 수정 버튼: 선택 항목 수정 모달
+   - 삭제 버튼: 선택 항목 삭제 (확인 다이얼로그)
+   - 엑셀 다운로드: 검색 결과 엑셀 다운
+   - 일괄 처리: 체크된 항목들 일괄 작업
+
+5. **등록/수정 모달 구성**
+   - 모달 크기: {small/medium/large}
+   - 폼 레이아웃: {단일/2컬럼/탭형}
+   - 필수 입력 필드: {필수 필드 리스트}
+   - 선택 입력 필드: {선택 필드 리스트}
+   - 유효성 검증: 실시간 검증 + 저장 시 검증
+   - 저장 버튼: 데이터 저장 후 목록 새로고침
+   - 취소 버튼: 변경사항 확인 후 닫기
+
+6. **데이터 흐름 관리**
+   - Store 패턴: use{도메인명}Store
+   - 목록 데이터: listData, listSpinning
+   - 모달 상태: {기능명}ModalProps
+   - 선택 상태: selectedRowKeys, selectedRows
+   - API 호출: callListApi, callSaveApi, callDeleteApi
+
+7. **에러 처리 및 피드백**
+   - 로딩 상태: Spin 컴포넌트로 로딩 표시
+   - 성공 메시지: message.success()
+   - 에러 메시지: errorHandling() 함수 활용
+   - 유효성 검증: Form.Item rules 활용
+   - 확인 다이얼로그: Modal.confirm() 사용
+
+**DTO 활용 정보:**
+- 기본 DTO: {도메인명} interface
+- 검색 DTO: {도메인명}Search interface
+- 목록 응답: { page: DataGridPageResponse, ds: {도메인명}[] }
+- 저장 요청: {도메인명} (전체 필드 포함)
+- 삭제 요청: { {키필드명}: number[] }
+
+**화면 경로:** /{도메인경로}/grid-modal
+**권한 관리:** programFn으로 버튼 권한 제어
+
+**요청사항:**
+- 반응형 그리드 레이아웃
+- 키보드 단축키 지원 (Ctrl+N: 신규, Delete: 삭제)
+- 무한 스크롤 또는 가상 스크롤 (대용량 데이터)
+- 컬럼 너비 조정 가능
+- 필터링 및 정렬 상태 URL 동기화
+```
+
+### 실제 사용 예시
+
+```
+FAQ 관리 일반 그리드 목록 + 모달 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: FaqService
+   - 목록 조회: postFaqListFaq
+   - 상세 조회: postFaqDtlFaq
+   - 등록/수정: postFaqSaveFaq
+   - 삭제: postFaqDelFaq
+   - 엑셀 다운: postFaqListFaqExcel
+   - Request DTO: PostFaqListFaqRequest extends FaqSearch
+   - Response DTO: PostFaqListFaqResponse { page, ds: Faq[] }
+
+2. **검색 조건 구성**
+   - 키워드 검색: searchKeyword (제목+내용 통합 검색)
+   - 카테고리: faqCtgrCd (FAQ 카테고리 코드)
+   - 상태: useYn (사용여부)
+   - 등록일: creatDtm (DATE_RANGE)
+   - 조회 수: viewCnt 범위 검색
+
+3. **데이터 그리드 구성**
+   - 컬럼: 번호, 카테고리, 제목, 조회수, 등록일, 상태
+   - 제목 컬럼: 클릭 시 내용 미리보기 툴팁
+   - 조회수 컬럼: 숫자 포맷팅 (1,000)
+   - 상태 컬럼: Badge 컴포넌트 (사용중/중지)
+   - 정렬: 등록일, 조회수, 제목 정렬 가능
+
+4. **FAQ 등록/수정 모달**
+   - 모달 크기: large (900px)
+   - 기본 정보: faqTitle, faqCtgrCd, useYn
+   - 내용 영역: faqContent (Rich Text Editor)
+   - 태그: faqTags (다중 태그 입력)
+   - 첨부파일: atchFileList (파일 업로드)
+   - 미리보기: 저장 전 미리보기 기능
+
+5. **특수 기능**
+   - 순서 관리: displayOrder로 표시 순서 조정
+   - 복사 기능: 기존 FAQ 복사하여 새 FAQ 생성
+   - 연관 FAQ: 관련 FAQ 연결 기능
+   - 통계: 카테고리별, 기간별 조회 통계
+
+**DTO 활용 정보:**
+- 기본 DTO: Faq { faqNo, faqTitle, faqContent, faqCtgrCd, viewCnt, useYn }
+- 검색 DTO: FaqSearch { searchKeyword, faqCtgrCd, useYn, creatDtmRange }
+- 카테고리: FaqCategory { faqCtgrCd, faqCtgrNm, sortOrder }
+- 첨부파일: AtchflInfo[]
+
+**화면 경로:** /cs/faq/grid-modal
+**권한 관리:** CS 관리 권한 (읽기/쓰기/삭제)
+
+**요청사항:**
+- 반응형 그리드 레이아웃
+- Rich Text Editor 연동 (Quill.js)
+- 파일 첨부 기능
+- FAQ 미리보기 모달
+- 검색 하이라이팅
+```
+
+---
+
+## 9. ☑️ 체크박스 그리드 + 인라인 에디터형 (Checkbox Inline Editor)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 체크박스 그리드 + 인라인 에디터 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 목록 조회: post{도메인명}List{기능명}
+   - 인라인 수정: post{도메인명}UptInline{기능명}
+   - 벌크 수정: post{도메인명}UptBulk{기능명}
+   - 벌크 삭제: post{도메인명}DelBulk{기능명}
+   - Request DTO: Post{도메인명}List{기능명}Request
+   - Response DTO: Post{도메인명}List{기능명}Response
+
+2. **체크박스 그리드 구성**
+   - ListDataGrid 컴포넌트 사용
+   - 전체 선택 체크박스: 헤더에 전체 선택/해제
+   - 개별 선택 체크박스: 각 행별 선택
+   - 선택 상태 표시: 선택된 행 하이라이트
+   - 선택 개수 표시: "n개 선택됨" 상태 표시
+   - 페이지 간 선택 유지: 페이지 이동해도 선택 상태 유지
+
+3. **인라인 에디터 구성**
+   - 편집 가능 컬럼: {편집 대상 컬럼 리스트}
+   - 편집 모드 진입: 더블클릭 또는 F2 키
+   - 편집 컨트롤:
+     * 텍스트: Input 컴포넌트
+     * 숫자: InputNumber 컴포넌트
+     * 선택: Select 컴포넌트
+     * 날짜: DatePicker 컴포넌트
+     * 스위치: Switch 컴포넌트
+   - 편집 상태 표시: 테두리 하이라이트, 아이콘 표시
+
+4. **편집 기능 상세**
+   - 실시간 유효성 검증: 입력 중 즉시 검증
+   - 저장 트리거: Enter키, Tab키, 포커스 아웃
+   - 취소 기능: ESC키 또는 취소 아이콘
+   - 변경 감지: 수정된 셀 시각적 표시
+   - 키보드 내비게이션: Tab/Shift+Tab으로 셀 이동
+   - 편집 로그: 변경 내역 추적
+
+5. **벌크 작업 기능**
+   - 선택 항목 일괄 수정: 공통 값 적용
+   - 선택 항목 일괄 삭제: 확인 후 삭제
+   - 선택 항목 상태 변경: 사용/중지 토글
+   - 선택 항목 내보내기: 엑셀 다운로드
+   - 진행률 표시: 대량 작업 시 프로그레스바
+
+6. **변경사항 관리**
+   - 임시 저장: 로컬 상태로 변경사항 보관
+   - 자동 저장: 설정 가능한 자동 저장 간격
+   - 되돌리기: Ctrl+Z로 변경사항 취소
+   - 저장 확인: 미저장 변경사항 있을 때 페이지 이탈 방지
+   - 충돌 방지: 낙관적 잠금으로 동시 편집 방지
+
+7. **사용자 경험 향상**
+   - 편집 가능 셀 표시: 호버 시 편집 가능 표시
+   - 단축키 지원: Ctrl+A(전체선택), Ctrl+S(저장)
+   - 상태 표시: 저장 중, 저장 완료, 에러 상태
+   - 되돌리기 히스토리: 최근 10개 변경사항 히스토리
+   - 성능 최적화: 가상 스크롤로 대용량 데이터 처리
+
+**DTO 활용 정보:**
+- 기본 DTO: {도메인명} interface
+- 인라인 수정: { {키필드명}, {수정필드명}, {수정값} }
+- 벌크 수정: { {키필드명}[], {수정필드명}, {적용값} }
+- 변경 로그: { {키필드명}, fieldName, oldValue, newValue, timestamp }
+
+**화면 경로:** /{도메인경로}/checkbox-inline
+**권한 관리:** 읽기/인라인수정/벌크수정/삭제 권한 분리
+
+**요청사항:**
+- 대용량 데이터 처리 (1000개 이상)
+- 실시간 유효성 검증
+- 키보드 친화적 UI
+- 접근성 준수 (스크린 리더 지원)
+- 모바일 대응 (터치 편집)
+```
+
+### 실제 사용 예시
+
+```
+상품 가격 관리 체크박스 그리드 + 인라인 에디터 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: ProductService
+   - 목록 조회: postProductListPrice
+   - 인라인 수정: postProductUptInlinePrice
+   - 벌크 수정: postProductUptBulkPrice
+   - 벌크 상태변경: postProductUptBulkSaleStatus
+   - Request DTO: PostProductListPriceRequest extends ProductSearch
+   - Response DTO: PostProductListPriceResponse { page, ds: Product[] }
+
+2. **체크박스 그리드 구성**
+   - 컬럼: 체크박스, 상품코드, 상품명, 판매가, 할인가, 할인율, 판매상태
+   - 읽기전용: 상품코드, 상품명
+   - 편집가능: salePrice, discountPrice, discountRate, saleStatus
+   - 전체 선택: 현재 페이지 전체 상품 선택
+   - 조건부 선택: 특정 브랜드, 카테고리별 선택
+
+3. **인라인 에디터 상세**
+   - 판매가(salePrice): InputNumber, 최소값 0, 천원 단위
+   - 할인가(discountPrice): InputNumber, 판매가보다 작아야 함
+   - 할인율(discountRate): InputNumber, 0-100%, 자동 계산
+   - 판매상태(saleStatus): Select, [판매중/일시중지/품절]
+   - 실시간 계산: 할인가 입력시 할인율 자동 계산
+
+4. **유효성 검증 규칙**
+   - 판매가: 필수, 0 이상, 최대 1억원
+   - 할인가: 판매가 이하, 음수 불가
+   - 할인율: 0-100%, 소수점 둘째자리까지
+   - 상호 연동: 할인가/할인율 중 하나 변경시 다른 하나 자동 계산
+
+5. **벌크 작업 기능**
+   - 일괄 할인율 적용: 선택 상품에 동일 할인율 적용
+   - 일괄 가격 인상: 선택 상품에 % 또는 금액 인상
+   - 일괄 상태 변경: 판매중지, 품절 처리
+   - 일괄 삭제: 선택 상품 삭제 (확인 필요)
+
+6. **특수 기능**
+   - 가격 히스토리: 가격 변경 이력 추적
+   - 경쟁사 가격: 외부 API 연동으로 경쟁사 가격 표시
+   - 가격 알림: 설정된 임계값 도달시 알림
+   - 엑셀 업로드: 대량 가격 변경을 위한 엑셀 업로드
+
+**DTO 활용 정보:**
+- 기본 DTO: Product { productId, productCode, productName, salePrice, discountPrice, discountRate, saleStatus }
+- 인라인 수정: { productId, fieldName, fieldValue, version }
+- 벌크 수정: { productIds: number[], updateData: Partial<Product> }
+- 가격 히스토리: PriceHistory { productId, oldPrice, newPrice, changedBy, changedAt }
+
+**화면 경로:** /product/price/checkbox-inline
+**권한 관리:** 상품관리 권한 + 가격수정 권한
+
+**요청사항:**
+- 대용량 데이터 처리 (10,000개 상품)
+- 실시간 가격 계산
+- 가격 변경 이력 관리
+- 엑셀 업로드/다운로드
+- 모바일 터치 편집 지원
+```
+
+---
+
+## 10. 📄 타이틀 셀병합 그리드 + 모달 + 에디터형 (Title Merged Grid Modal Editor)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 타이틀 셀병합 그리드 + 모달 + 에디터 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 그룹 목록 조회: post{도메인명}ListGroup{기능명}
+   - 상세 목록 조회: post{도메인명}ListDetail{기능명}
+   - 그룹 저장: post{도메인명}SaveGroup{기능명}
+   - 상세 저장: post{도메인명}SaveDetail{기능명}
+   - Request DTO: Post{도메인명}ListGroup{기능명}Request
+   - Response DTO: Post{도메인명}ListGroup{기능명}Response
+
+2. **셀 병합 그리드 구성**
+   - 그룹 타이틀 셀: rowSpan으로 세로 병합
+   - 그룹별 상세 데이터: 하위 행들로 표시
+   - 병합 규칙: {그룹키 필드명}별로 병합
+   - 그룹 헤더: 볼드 처리, 배경색 다르게
+   - 그룹 접기/펼치기: 확장/축소 기능
+   - 그룹별 합계: 숫자 컬럼 합계 표시
+
+3. **그리드 컬럼 구성**
+   - 그룹 컬럼: {그룹명} (병합, 편집 불가)
+   - 상세 컬럼들: {상세 컬럼 리스트}
+   - 액션 컬럼: 수정/삭제 버튼
+   - 체크박스: 그룹 단위 선택 가능
+   - 정렬: 그룹 내에서만 정렬
+   - 필터: 그룹별 필터링 지원
+
+4. **모달 에디터 구성**
+   - 그룹 편집 모달: 그룹 정보 수정
+   - 상세 편집 모달: 개별 항목 수정
+   - 일괄 편집 모달: 그룹 내 여러 항목 동시 수정
+   - 모달 크기: {크기} (그룹/상세에 따라 다름)
+   - 탭 구성: 기본정보/상세정보/설정 탭
+   - 리치 에디터: {에디터 사용 필드}
+
+5. **에디터 기능 상세**
+   - Rich Text Editor: Quill.js 또는 TinyMCE
+   - 이미지 업로드: 에디터 내 이미지 삽입
+   - 링크 삽입: URL 유효성 검증
+   - 표 삽입: 테이블 생성/편집
+   - 코드 블록: 코드 하이라이팅
+   - 미리보기: 실시간 미리보기
+   - 자동 저장: 30초마다 임시 저장
+
+6. **그룹 관리 기능**
+   - 그룹 추가: 새 그룹 생성
+   - 그룹 삭제: 하위 항목 포함 삭제 확인
+   - 그룹 순서: 드래그 앤 드롭으로 순서 변경
+   - 그룹 복사: 그룹 전체 복사
+   - 그룹 병합: 여러 그룹을 하나로 병합
+   - 그룹 분할: 하나의 그룹을 여러 그룹으로 분할
+
+7. **상세 항목 관리**
+   - 항목 추가: 그룹 내 새 항목 추가
+   - 항목 이동: 다른 그룹으로 이동
+   - 항목 복사: 같은/다른 그룹으로 복사
+   - 항목 순서: 그룹 내 순서 변경
+   - 일괄 작업: 선택 항목들 일괄 처리
+
+8. **UI/UX 최적화**
+   - 가상 스크롤: 대량 데이터 최적화
+   - 지연 로딩: 그룹 펼칠 때 상세 데이터 로딩
+   - 검색 하이라이팅: 검색어 강조 표시
+   - 키보드 단축키: 자주 사용하는 기능
+   - 툴팁: 셀 데이터가 길 때 전체 내용 표시
+
+**DTO 활용 정보:**
+- 그룹 DTO: {그룹도메인명} interface
+- 상세 DTO: {상세도메인명} interface
+- 병합 데이터: { groupData: {그룹DTO}[], detailData: {상세DTO}[] }
+- 에디터 내용: { content: string, htmlContent: string, attachments: FileInfo[] }
+
+**화면 경로:** /{도메인경로}/merged-grid-modal
+**권한 관리:** 그룹 관리/상세 관리 권한 분리
+
+**요청사항:**
+- 셀 병합 렌더링 최적화
+- Rich Text Editor 성능 최적화
+- 대용량 데이터 지원 (1000+ 그룹)
+- 접근성 고려 (스크린 리더 지원)
+- 모바일 대응 (터치 인터페이스)
+```
+
+### 실제 사용 예시
+
+```
+상품 상세 정보 관리 타이틀 셀병합 그리드 + 모달 + 에디터 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: ProductService, ProductSpecService
+   - 그룹 목록: postProductListSpecGroup
+   - 상세 목록: postProductSpecListSpecDetail
+   - 그룹 저장: postProductSpecSaveGroup
+   - 상세 저장: postProductSpecSaveDetail
+   - Request DTO: PostProductListSpecGroupRequest extends ProductSearch
+   - Response DTO: PostProductListSpecGroupResponse { ds: ProductSpecGroup[] }
+
+2. **셀 병합 그리드 구성**
+   - 스펙 그룹명: specGroupName (rowSpan 병합)
+   - 스펙 항목명: specItemName
+   - 스펙 값: specValue
+   - 단위: specUnit
+   - 표시순서: displayOrder
+   - 사용여부: useYn
+   - 그룹별 색상: 그룹마다 다른 배경색
+
+3. **모달 에디터 구성**
+   - 그룹 편집: specGroupName, groupDescription, displayOrder
+   - 상세 편집: specItemName, specValue, specUnit, detailDescription
+   - 상세 설명 에디터: Rich Text Editor (상품 스펙 상세 설명)
+   - 이미지 업로드: 스펙 관련 이미지 첨부
+   - 테이블 에디터: 복잡한 스펙 표 작성
+
+4. **에디터 상세 기능**
+   - Quill.js Rich Text Editor
+   - 이미지 업로드: 드래그 앤 드롭 지원
+   - 표 삽입: 스펙 비교표 생성
+   - 수식 입력: MathJax로 수학 공식
+   - 코드 블록: 기술 스펙 코드
+   - 자동 저장: 변경 감지시 자동 저장
+
+5. **특수 기능**
+   - 스펙 템플릿: 카테고리별 기본 스펙 템플릿
+   - 스펙 복사: 유사 상품에서 스펙 복사
+   - 스펙 비교: 여러 상품 스펙 비교 테이블
+   - 스펙 검색: 전체 스펙에서 키워드 검색
+   - 스펙 히스토리: 스펙 변경 이력 관리
+
+**DTO 활용 정보:**
+- 그룹 DTO: ProductSpecGroup { groupId, specGroupName, groupDescription, displayOrder, productId }
+- 상세 DTO: ProductSpecDetail { detailId, groupId, specItemName, specValue, specUnit, detailDescription }
+- 에디터 DTO: SpecEditorContent { content, htmlContent, images: FileInfo[] }
+- 템플릿 DTO: SpecTemplate { templateId, categoryId, templateName, specGroups: ProductSpecGroup[] }
+
+**화면 경로:** /product/spec/merged-grid-modal
+**권한 관리:** 상품 관리 권한 + 스펙 편집 권한
+
+**요청사항:**
+- 복잡한 스펙 표 렌더링
+- Rich Text Editor 이미지 최적화
+- 스펙 템플릿 시스템
+- 스펙 변경 이력 추적
+- 모바일에서도 편집 가능
+```
+
+---
+
+## 11. ↔️ 좌우 그리드 목록형 (Dual Grid Layout)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 좌우 그리드 목록 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 좌측 목록: post{도메인명}List{좌측기능명}
+   - 우측 목록: post{도메인명}List{우측기능명}
+   - 연관 조회: post{도메인명}ListRelated{기능명}
+   - 데이터 이동: post{도메인명}Move{기능명}
+   - Request DTO: Post{도메인명}List{기능명}Request
+   - Response DTO: Post{도메인명}List{기능명}Response
+
+2. **레이아웃 구성**
+   - Split Layout: 좌우 분할 레이아웃
+   - 크기 조절: ColResizer로 좌우 크기 조절 가능
+   - 최소 너비: 좌측 300px, 우측 400px
+   - 기본 비율: 40:60 또는 50:50
+   - 전체화면: 한쪽 그리드 전체화면 모드
+   - 반응형: 모바일에서는 탭으로 전환
+
+3. **좌측 그리드 구성**
+   - 제목: {좌측 그리드 제목}
+   - 데이터: {좌측 데이터 타입}
+   - 주요 컬럼: {좌측 컬럼 리스트}
+   - 선택 모드: 단일 선택 (라디오)
+   - 검색: 간단한 키워드 검색
+   - 정렬: {주요 정렬 컬럼}
+   - 클릭 이벤트: 우측 데이터 자동 로딩
+
+4. **우측 그리드 구성**
+   - 제목: {우측 그리드 제목}
+   - 데이터: 좌측 선택 항목과 연관된 데이터
+   - 주요 컬럼: {우측 컬럼 리스트}
+   - 선택 모드: 다중 선택 (체크박스)
+   - 필터링: 상세 필터 조건
+   - 액션: 등록/수정/삭제 버튼
+   - 의존성: 좌측 선택 없으면 비활성화
+
+5. **데이터 연동**
+   - 마스터-디테일: 좌측(마스터) → 우측(디테일)
+   - 자동 로딩: 좌측 선택 변경시 우측 자동 새로고침
+   - 로딩 상태: 우측 로딩 중 Spin 표시
+   - 빈 상태: 선택 없을 때 EmptyMsg 표시
+   - 에러 처리: 연관 데이터 로딩 실패 처리
+
+6. **데이터 이동/연결 기능**
+   - 드래그 앤 드롭: 좌측 → 우측 또는 우측 → 좌측
+   - 이동 버튼: 선택 항목 이동 버튼
+   - 연결 생성: 새로운 연관 관계 생성
+   - 연결 해제: 기존 연관 관계 제거
+   - 일괄 처리: 여러 항목 동시 이동/연결
+
+7. **검색 및 필터**
+   - 좌측 검색: {좌측 검색 조건}
+   - 우측 검색: {우측 검색 조건}
+   - 연관 필터: 연관 정도별 필터링
+   - 동기화 옵션: 좌우 검색 조건 동기화
+   - 즐겨찾기: 자주 사용하는 조합 저장
+
+8. **상태 관리**
+   - 좌측 선택 상태: selectedLeftItem
+   - 우측 선택 상태: selectedRightItems
+   - 레이아웃 상태: leftWidth, rightWidth
+   - 검색 상태: leftSearchParams, rightSearchParams
+   - 로딩 상태: leftLoading, rightLoading
+
+**DTO 활용 정보:**
+- 좌측 DTO: {좌측도메인명} interface
+- 우측 DTO: {우측도메인명} interface
+- 연관 DTO: {연관관계도메인명} interface
+- 이동 요청: { from{도메인명}Ids: number[], to{도메인명}Id: number }
+
+**화면 경로:** /{도메인경로}/dual-grid
+**권한 관리:** 좌측 읽기/우측 읽기/연관 관리 권한
+
+**요청사항:**
+- 원활한 좌우 데이터 연동
+- 드래그 앤 드롭 인터랙션
+- 레이아웃 상태 유지 (새로고침 후에도)
+- 키보드 내비게이션 (Tab, 방향키)
+- 성능 최적화 (가상 스크롤)
+```
+
+### 실제 사용 예시
+
+```
+사용자 권한 관리 좌우 그리드 목록 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: SystemUserService, SystemRoleService
+   - 좌측 목록: postSystemUserListUser (사용자 목록)
+   - 우측 목록: postSystemRoleListUserRole (사용자별 권한 목록)
+   - 권한 부여: postSystemUserGrantRole
+   - 권한 해제: postSystemUserRevokeRole
+   - Request DTO: PostSystemUserListUserRequest extends UserSearch
+   - Response DTO: PostSystemUserListUserResponse { page, ds: SystemUser[] }
+
+2. **레이아웃 구성**
+   - 좌측 40%, 우측 60% 기본 분할
+   - ColResizer로 크기 조절
+   - 최소 너비: 좌측 350px, 우측 450px
+   - 모바일: 탭 전환 (사용자/권한)
+
+3. **좌측 그리드 (사용자 목록)**
+   - 컬럼: 사용자ID, 사용자명, 부서, 상태, 최종로그인
+   - 검색: 사용자ID, 사용자명, 부서별 검색
+   - 정렬: 사용자명, 최종로그인일 정렬
+   - 상태 필터: 활성/비활성 사용자
+   - 단일 선택: 라디오 버튼
+
+4. **우측 그리드 (권한 목록)**
+   - 컬럼: 권한명, 권한유형, 부여일, 만료일, 상태
+   - 권한 유형: 시스템권한/메뉴권한/데이터권한
+   - 체크박스: 다중 선택으로 일괄 관리
+   - 만료 알림: 만료 임박 권한 하이라이트
+   - 상속 표시: 그룹에서 상속받은 권한 표시
+
+5. **권한 관리 기능**
+   - 권한 부여: 사용 가능한 권한 목록에서 선택
+   - 권한 해제: 선택된 권한 해제
+   - 임시 권한: 기간 한정 권한 부여
+   - 권한 복사: 다른 사용자 권한 복사
+   - 권한 템플릿: 역할별 권한 템플릿 적용
+
+6. **특수 기능**
+   - 권한 트리: 계층적 권한 구조 표시
+   - 권한 상속: 상위 권한 자동 상속
+   - 권한 충돌: 상충되는 권한 탐지
+   - 권한 히스토리: 권한 변경 이력 추적
+   - 대량 권한 부여: 엑셀로 대량 권한 관리
+
+**DTO 활용 정보:**
+- 사용자 DTO: SystemUser { userId, userName, userLoginId, departmentName, userStatus }
+- 권한 DTO: SystemRole { roleId, roleName, roleType, grantDate, expireDate, isInherited }
+- 권한 부여: UserRoleGrant { userId, roleIds: number[], grantPeriod, grantReason }
+- 권한 이력: UserRoleHistory { userId, roleId, action, grantedBy, grantedAt }
+
+**화면 경로:** /system/user/dual-grid
+**권한 관리:** 시스템 관리자 권한 + 사용자 권한 관리
+
+**요청사항:**
+- 실시간 권한 상태 반영
+- 권한 충돌 방지 로직
+- 대용량 사용자 지원 (10,000+)
+- 권한 변경 이력 추적
+- 모바일 권한 관리 UI
+```
+
+---
+
+## 12. 📊 StatDataGrid 사용형 (Statistical Grid)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 통계 데이터 그리드 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 통계 조회: post{도메인명}Stats{기능명}
+   - 상세 조회: post{도메인명}Detail{기능명}
+   - 엑셀 다운: post{도메인명}StatsExcel{기능명}
+   - Request DTO: Post{도메인명}Stats{기능명}Request
+   - Response DTO: Post{도메인명}Stats{기능명}Response
+
+2. **StatDataGrid 설정**
+   - 컴포넌트: StatDataGrid 사용
+   - 통계 타입: {SUM/AVG/COUNT/MAX/MIN}
+   - 그룹핑 필드: {그룹핑 기준 필드}
+   - 집계 필드: {집계 대상 필드들}
+   - 소계/총계: 자동 계산 및 표시
+   - 퍼센트: 비율 계산 및 표시
+
+3. **그리드 컬럼 구성**
+   - 그룹 컬럼: {그룹핑 컬럼명}
+   - 통계 컬럼들: {통계 데이터 컬럼들}
+   - 포맷팅:
+     * 숫자: 천단위 구분자 (1,000)
+     * 통화: ₩ 표시
+     * 퍼센트: % 표시
+     * 소수점: 둘째자리까지
+   - 정렬: 통계값 기준 정렬
+   - 색상 코딩: 값 범위별 배경색
+
+4. **필터 및 검색**
+   - 기간 선택: {기간 필드명} (필수)
+   - 그룹 필터: {그룹 선택 옵션}
+   - 범위 필터: 통계값 범위 필터
+   - 상위/하위 N: Top N, Bottom N 필터
+   - 임계값: 설정 값 이상/이하 필터
+   - 비교 기간: 전년 동기 대비
+
+5. **차트 연동**
+   - 차트 라이브러리: Recharts 또는 Chart.js
+   - 차트 타입: {Bar/Line/Pie/Area}
+   - 데이터 연동: 그리드 데이터와 실시간 동기화
+   - 차트 토글: 차트 보기/숨기기
+   - 차트 설정: 축, 범례, 색상 커스터마이징
+   - 차트 내보내기: PNG, PDF 내보내기
+
+6. **드릴다운 기능**
+   - 클릭 이벤트: 통계 셀 클릭시 상세 데이터
+   - 상세 모달: 집계 대상 상세 목록 표시
+   - 브레드크럼: 드릴다운 경로 표시
+   - 뒤로가기: 상위 레벨로 돌아가기
+   - 즐겨찾기: 자주 보는 드릴다운 경로 저장
+
+7. **실시간 업데이트**
+   - 자동 새로고침: 설정 간격으로 자동 업데이트
+   - 실시간 알림: 임계값 초과시 알림
+   - 변화량 표시: 전 기간 대비 증감률
+   - 트렌드 표시: 상승/하락/보합 아이콘
+   - 실시간 차트: 실시간 데이터 차트 업데이트
+
+8. **대시보드 위젯**
+   - 위젯화: 대시보드에 배치 가능한 위젯
+   - 크기 조절: 위젯 크기 조절 가능
+   - 설정 저장: 사용자별 위젯 설정 저장
+   - 공유: 위젯 설정 다른 사용자와 공유
+   - 알림 설정: 위젯별 알림 임계값 설정
+
+**DTO 활용 정보:**
+- 통계 요청: { groupBy: string[], aggregateFields: string[], period: DateRange }
+- 통계 응답: { stats: StatData[], summary: SummaryData, chart: ChartData }
+- 상세 조회: { groupValue: string, period: DateRange, page: PageInfo }
+- 드릴다운: { path: string[], filters: FilterInfo[] }
+
+**화면 경로:** /{도메인경로}/stats-grid
+**권한 관리:** 통계 조회 권한 + 상세 조회 권한
+
+**요청사항:**
+- 대용량 통계 데이터 처리
+- 실시간 차트 업데이트
+- 커스터마이징 가능한 통계 뷰
+- 모바일 통계 대시보드
+- 통계 데이터 캐싱 최적화
+```
+
+### 실제 사용 예시
+
+```
+매출 통계 분석 StatDataGrid 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: OrderService, ProductService
+   - 매출 통계: postOrderStatsSales
+   - 상품별 통계: postOrderStatsProduct
+   - 고객별 통계: postOrderStatsCustomer
+   - 상세 주문: postOrderDetailByStats
+   - Request DTO: PostOrderStatsSalesRequest { period, groupBy, aggregateBy }
+   - Response DTO: PostOrderStatsSalesResponse { stats: SalesStats[], chart: ChartData }
+
+2. **StatDataGrid 설정**
+   - 그룹핑: 일별/월별/상품별/고객별/지역별
+   - 집계 필드: 매출액(orderAmount), 주문수(orderCount), 평균주문액(avgAmount)
+   - 소계: 카테고리별, 브랜드별 소계
+   - 총계: 전체 매출액, 주문수 총계
+   - 비율: 전체 대비 퍼센트
+
+3. **그리드 컬럼 구성**
+   - 기간/카테고리: 그룹핑 기준
+   - 매출액: ₩ 표시, 천단위 구분
+   - 주문수: 개 단위, 천단위 구분
+   - 평균주문액: ₩ 표시
+   - 전년 대비: 증감률 %, 색상 코딩
+   - 목표 달성률: 진행률 바
+
+4. **고급 필터**
+   - 기간: 일/주/월/분기/년 선택
+   - 상품 카테고리: 다중 선택
+   - 고객 등급: VIP/일반/신규
+   - 주문 채널: 온라인/오프라인/모바일
+   - 지역: 시/도별 선택
+   - 매출 범위: 최소/최대 매출액
+
+5. **차트 연동**
+   - 매출 트렌드: 라인 차트 (시계열)
+   - 카테고리별: 파이 차트
+   - 지역별: 막대 차트
+   - 실시간 업데이트: 5분마다 자동 새로고침
+   - 차트 상호작용: 클릭시 해당 데이터 필터링
+
+6. **드릴다운 상세**
+   - 일별 매출: 시간별 상세 분석
+   - 상품별 매출: 개별 주문 내역
+   - 고객별 매출: 고객 주문 히스토리
+   - 지역별 매출: 상세 지역별 분석
+   - 브레드크럼: 현재 분석 경로 표시
+
+7. **대시보드 위젯**
+   - 오늘 매출: 실시간 매출 현황
+   - 월 매출 목표: 목표 대비 달성률
+   - 베스트 상품: 매출 상위 10개 상품
+   - 신규 고객: 신규 고객 유입 현황
+   - 지역별 매출: 지도 시각화
+
+**DTO 활용 정보:**
+- 매출 통계: SalesStats { date, category, orderAmount, orderCount, avgAmount, growth }
+- 차트 데이터: ChartData { labels: string[], datasets: ChartDataset[] }
+- 드릴다운: SalesDetail { orderId, customerId, productName, orderAmount, orderDate }
+- 위젯 설정: WidgetConfig { type, size, position, filters, refreshInterval }
+
+**화면 경로:** /sales/stats/stats-grid
+**권한 관리:** 매출 분석 권한 + 상세 조회 권한
+
+**요청사항:**
+- 실시간 매출 모니터링
+- 대용량 매출 데이터 처리 (년간 100만+ 주문)
+- 모바일 매출 대시보드
+- 매출 예측 기능 (머신러닝)
+- 매출 알림 시스템 (목표 달성/미달성)
+```
+
+---
+
+## 13. 🔐 좌그리드 + 우상세폼 + 하단상세형 (Grid Form Detail)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 좌그리드 + 우상세폼 + 하단상세 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 마스터 목록: post{도메인명}List{마스터기능명}
+   - 마스터 상세: post{도메인명}Dtl{마스터기능명}
+   - 마스터 저장: post{도메인명}Save{마스터기능명}
+   - 하위 목록: post{도메인명}List{하위기능명}
+   - 하위 저장: post{도메인명}Save{하위기능명}
+   - Request DTO: Post{도메인명}List{기능명}Request
+   - Response DTO: Post{도메인명}List{기능명}Response
+
+2. **3분할 레이아웃 구성**
+   - 좌측 그리드: 30% 너비, 마스터 데이터 목록
+   - 우상단 폼: 35% 너비, 선택된 마스터 상세 정보
+   - 우하단 상세: 35% 너비, 선택된 마스터의 하위 데이터
+   - 크기 조절: ResizeObserver로 각 영역 크기 조절
+   - 최소 크기: 각 영역 최소 250px
+   - 접기/펼치기: 각 영역 숨기기/보이기 토글
+
+3. **좌측 마스터 그리드**
+   - 컴포넌트: ListDataGrid
+   - 선택 모드: 단일 선택 (라디오)
+   - 주요 컬럼: {마스터 주요 컬럼들}
+   - 검색: 간단한 키워드 검색
+   - 정렬: {기본 정렬 컬럼}
+   - 신규 버튼: 새 마스터 데이터 생성
+   - 삭제 버튼: 선택된 마스터 삭제
+
+4. **우상단 상세 폼**
+   - 컴포넌트: Form 컴포넌트
+   - 편집 모드: 읽기/수정 모드 토글
+   - 필드 구성: {상세 폼 필드들}
+   - 유효성 검증: 실시간 validation
+   - 저장 버튼: 변경사항 저장
+   - 취소 버튼: 변경사항 취소
+   - 의존성: 좌측 선택 없으면 비활성화
+
+5. **우하단 하위 상세**
+   - 컴포넌트: DataGrid 또는 상세 표시 영역
+   - 데이터: 선택된 마스터의 관련 데이터
+   - 표시 타입: {그리드/리스트/카드/차트}
+   - 액션: 하위 데이터 추가/수정/삭제
+   - 새로고침: 마스터 변경시 자동 새로고침
+   - 빈 상태: 관련 데이터 없을 때 안내 메시지
+
+6. **데이터 플로우**
+   - 좌측 선택 → 우상단 폼 데이터 로딩
+   - 좌측 선택 → 우하단 관련 데이터 로딩
+   - 폼 저장 → 좌측 그리드 새로고침
+   - 하위 데이터 변경 → 하단 영역 새로고침
+   - 동시 로딩: 상세/하위 데이터 병렬 로딩
+
+7. **상태 관리**
+   - 선택 상태: selectedMasterItem
+   - 편집 상태: isEditing, hasChanges
+   - 로딩 상태: masterLoading, detailLoading, subDetailLoading
+   - 레이아웃 상태: leftWidth, rightTopHeight, rightBottomHeight
+   - 폼 상태: formValues, originalValues
+
+8. **사용자 경험**
+   - 키보드 내비게이션: Tab으로 영역 간 이동
+   - 단축키: Ctrl+S(저장), Ctrl+N(신규), Delete(삭제)
+   - 변경 감지: 미저장 변경사항 경고
+   - 로딩 피드백: 각 영역별 로딩 상태 표시
+   - 에러 처리: 네트워크 오류시 재시도 옵션
+
+**DTO 활용 정보:**
+- 마스터 DTO: {마스터도메인명} interface
+- 하위 DTO: {하위도메인명} interface
+- 관계 정보: {마스터키필드명} 으로 연결
+- 폼 데이터: Partial<{마스터도메인명}> (수정시)
+
+**화면 경로:** /{도메인경로}/grid-form-detail
+**권한 관리:** 마스터 읽기/쓰기 + 하위 읽기/쓰기 권한
+
+**요청사항:**
+- 반응형 3분할 레이아웃
+- 실시간 데이터 동기화
+- 레이아웃 상태 저장/복원
+- 키보드 친화적 UI
+- 성능 최적화 (지연 로딩)
+```
+
+### 실제 사용 예시
+
+```
+고객 관리 좌그리드 + 우상세폼 + 하단상세 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: MemberService, OrderService
+   - 고객 목록: postMemberListMember
+   - 고객 상세: postMemberDtlInfoMember
+   - 고객 저장: postMemberUptMember
+   - 고객 주문: postOrderListByMember
+   - 고객 포인트: postPntAccmlListByMember
+
+2. **좌측 고객 그리드**
+   - 컬럼: 고객번호, 고객명, 등급, 가입일, 최종주문일
+   - 검색: 고객명, 휴대폰번호, 이메일
+   - 필터: 고객등급, 상태별
+   - 정렬: 가입일, 최종주문일 내림차순
+
+3. **우상단 고객 상세 폼**
+   - 기본정보: 고객명, 이메일, 휴대폰, 생년월일
+   - 주소정보: 기본주소, 상세주소
+   - 설정정보: 마케팅수신동의, SMS수신동의
+   - 통계정보: 총주문수, 총주문금액, 포인트잔액
+
+4. **우하단 관련 정보**
+   - 탭 구성: 주문내역/포인트내역/문의내역
+   - 주문내역: 최근 주문 10건 표시
+   - 포인트내역: 적립/사용 내역
+   - 문의내역: 고객 문의 및 답변
+
+**DTO 활용 정보:**
+- 고객 DTO: Member { usrNo, usrNm, usrEmailAddr, usrHpNo, ... }
+- 주문 DTO: Order { orderNo, orderDtm, orderAmt, ... }
+- 포인트 DTO: PntAccml { pntAccmlNo, pntAmt, accmlDtm, ... }
+
+**화면 경로:** /member/customer/grid-form-detail
+**권한 관리:** 고객정보 조회/수정 + 주문정보 조회 권한
+```
+
+---
+
+## 14. 👤 좌그리드 + 우상세폼형 (Grid Form)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 좌그리드 + 우상세폼 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 목록 조회: post{도메인명}List{기능명}
+   - 상세 조회: post{도메인명}Dtl{기능명}
+   - 저장: post{도메인명}Save{기능명}
+   - 삭제: post{도메인명}Del{기능명}
+   - Request DTO: Post{도메인명}List{기능명}Request
+   - Response DTO: Post{도메인명}List{기능명}Response
+
+2. **좌우 분할 레이아웃**
+   - 좌측 그리드: 40% 너비, 목록 데이터
+   - 우측 폼: 60% 너비, 상세/편집 폼
+   - ColResizer: 좌우 크기 조절 가능
+   - 최소 너비: 좌측 300px, 우측 400px
+   - 반응형: 모바일에서 상하 분할 또는 탭
+
+3. **좌측 데이터 그리드**
+   - 컴포넌트: ListDataGrid
+   - 주요 컬럼: {목록 표시 컬럼들}
+   - 선택 모드: 단일 선택 (라디오)
+   - 검색 기능: {검색 대상 필드들}
+   - 정렬 기능: {정렬 가능한 컬럼들}
+   - 페이지네이션: 기본 페이징
+   - 액션 버튼: 신규 등록, 삭제
+
+4. **우측 상세 폼**
+   - 컴포넌트: Form 컴포넌트
+   - 모드 관리: 신규/수정/읽기 모드
+   - 폼 레이아웃: {단일컬럼/2컬럼/탭형}
+   - 필드 구성:
+     * 기본 정보: {기본 필드들}
+     * 상세 정보: {상세 필드들}
+     * 설정 정보: {설정 필드들}
+   - 유효성 검증: 실시간 + 제출시 검증
+
+5. **폼 상태 관리**
+   - 편집 모드: isEditing (true/false)
+   - 신규 모드: isCreating (true/false)
+   - 변경 감지: hasChanges (true/false)
+   - 로딩 상태: isLoading, isSaving
+   - 폼 데이터: formData, originalData
+   - 검증 상태: validationErrors
+
+6. **데이터 플로우**
+   - 좌측 선택 → 우측 폼 데이터 로딩
+   - 신규 버튼 → 우측 폼 초기화
+   - 폼 저장 → 좌측 목록 새로고침
+   - 삭제 → 좌측 목록 새로고침, 우측 폼 초기화
+   - 취소 → 원본 데이터로 복원
+
+7. **사용자 인터랙션**
+   - 더블클릭: 목록 항목 더블클릭으로 편집 모드
+   - 키보드 단축키:
+     * Ctrl+N: 신규 등록
+     * Ctrl+S: 저장
+     * Ctrl+E: 편집 모드 전환
+     * ESC: 편집 취소
+   - 변경 경고: 미저장 상태에서 다른 항목 선택시 경고
+
+8. **고급 기능**
+   - 폼 템플릿: 자주 사용하는 데이터 템플릿
+   - 복사 기능: 기존 데이터 복사하여 신규 생성
+   - 히스토리: 변경 이력 추적
+   - 자동 저장: 설정 간격으로 임시 저장
+   - 폼 유효성: 실시간 필드별 검증
+
+**DTO 활용 정보:**
+- 기본 DTO: {도메인명} interface
+- 목록 응답: { page: DataGridPageResponse, ds: {도메인명}[] }
+- 상세 응답: { rs: {도메인명} }
+- 저장 요청: {도메인명} (전체 필드)
+
+**화면 경로:** /{도메인경로}/grid-form
+**권한 관리:** 조회/등록/수정/삭제 권한 세분화
+
+**요청사항:**
+- 매끄러운 좌우 데이터 연동
+- 폼 상태 관리 최적화
+- 키보드 친화적 인터페이스
+- 반응형 레이아웃 지원
+- 성능 최적화 (메모이제이션)
+```
+
+### 실제 사용 예시
+
+```
+공지사항 관리 좌그리드 + 우상세폼 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: BbsPostService
+   - 목록 조회: postBbsPostListNotice
+   - 상세 조회: postBbsPostDtlNotice
+   - 저장: postBbsPostSaveNotice
+   - 삭제: postBbsPostDelNotice
+
+2. **좌측 공지사항 그리드**
+   - 컬럼: 번호, 제목, 작성자, 작성일, 조회수, 상태
+   - 검색: 제목, 내용, 작성자
+   - 필터: 공지타입, 상태별
+   - 정렬: 작성일, 조회수 정렬
+   - 중요공지: 상단 고정 표시
+
+3. **우측 공지사항 폼**
+   - 기본정보: 제목, 공지타입, 중요도
+   - 내용: Rich Text Editor (Quill.js)
+   - 설정: 노출시작일, 노출종료일, 상태
+   - 첨부파일: 파일 업로드 (최대 5개)
+   - 미리보기: 실제 게시될 모습 미리보기
+
+4. **Rich Text Editor 설정**
+   - 툴바: 기본 서식, 이미지, 링크, 표
+   - 이미지 업로드: 드래그앤드롭 지원
+   - 자동 저장: 5분마다 임시 저장
+   - 워드카운트: 글자수 실시간 표시
+
+**DTO 활용 정보:**
+- 공지사항 DTO: BbsPost { bbsPostNo, bbsPostTitle, bbsPostContent, ... }
+- 첨부파일 DTO: AtchflInfo { fileId, fileName, fileSize, ... }
+- 임시저장 DTO: TempSave { tempId, content, savedAt }
+
+**화면 경로:** /system/notice/grid-form
+**권한 관리:** 공지사항 조회/작성/수정/삭제 권한
+```
+
+---
+
+## 15. 📝 좌드래그박스 + 우상세폼 + 하단트리형 (Drag Box Form Tree)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 좌드래그박스 + 우상세폼 + 하단트리 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 드래그 항목 목록: post{도메인명}ListDragItems
+   - 상세 정보: post{도메인명}DtlItem
+   - 트리 데이터: post{도메인명}ListTree
+   - 드래그 처리: post{도메인명}ProcessDrag
+   - 트리 업데이트: post{도메인명}UpdateTree
+   - Request DTO: Post{도메인명}List{기능명}Request
+   - Response DTO: Post{도메인명}List{기능명}Response
+
+2. **3영역 레이아웃 구성**
+   - 좌측 드래그박스: 30% 너비, 드래그 가능한 항목들
+   - 우상단 상세폼: 35% 너비, 선택 항목 상세 정보
+   - 우하단 트리: 35% 너비, 계층 구조 트리
+   - 크기 조절: ResizeObserver로 유동적 크기 조절
+   - 최소 크기: 각 영역 최소 200px
+
+3. **좌측 드래그박스 구성**
+   - 라이브러리: react-beautiful-dnd
+   - 항목 표시: 카드형 또는 리스트형
+   - 드래그 핸들: 명확한 드래그 영역 표시
+   - 검색/필터: 드래그 항목 필터링
+   - 카테고리: 항목별 카테고리 분류
+   - 드래그 피드백: 드래그 중 시각적 피드백
+
+4. **드래그 앤 드롭 기능**
+   - 드래그 소스: 좌측 박스의 항목들
+   - 드롭 타겟: 우하단 트리의 노드들
+   - 드래그 제약: 허용/불허용 드롭존 설정
+   - 드래그 미리보기: 드래그 중 미리보기 표시
+   - 드롭 효과: 복사/이동/링크 효과
+   - 자동 스크롤: 드래그 중 자동 스크롤
+
+5. **우상단 상세폼**
+   - 선택 방식: 좌측 클릭 또는 트리 노드 선택
+   - 폼 구성: {상세 정보 필드들}
+   - 편집 기능: 인라인 편집 또는 모달 편집
+   - 관계 정보: 다른 항목과의 연관 관계
+   - 미리보기: 실제 적용될 모습 미리보기
+
+6. **우하단 트리 구성**
+   - 트리 컴포넌트: antd Tree 또는 커스텀
+   - 노드 타입: 폴더/파일/카테고리 등
+   - 드롭 허용: 특정 노드만 드롭 허용
+   - 트리 액션: 추가/삭제/이름변경
+   - 확장/축소: 노드별 확장 상태 관리
+   - 컨텍스트 메뉴: 우클릭 메뉴
+
+7. **상태 관리**
+   - 드래그 상태: isDragging, draggedItem
+   - 선택 상태: selectedItem, selectedTreeNode
+   - 트리 상태: treeData, expandedKeys
+   - 폼 상태: formData, isEditing
+   - 로딩 상태: dragItemsLoading, treeLoading
+
+8. **고급 기능**
+   - 일괄 드래그: 다중 선택하여 일괄 드래그
+   - 드래그 히스토리: 드래그 작업 기록
+   - 되돌리기: Ctrl+Z로 마지막 드래그 취소
+   - 자동 정렬: 트리 노드 자동 정렬
+   - 검색: 트리 내 노드 검색
+
+**DTO 활용 정보:**
+- 드래그 항목 DTO: DragItem { id, name, type, category, data }
+- 트리 노드 DTO: TreeNode { id, parentId, name, type, children }
+- 드래그 결과 DTO: DragResult { sourceId, targetId, position, action }
+- 관계 DTO: ItemRelation { sourceId, targetId, relationType }
+
+**화면 경로:** /{도메인경로}/drag-form-tree
+**권한 관리:** 드래그 권한 + 트리 관리 권한 + 상세 편집 권한
+
+**요청사항:**
+- 매끄러운 드래그 앤 드롭 UX
+- 복잡한 트리 구조 지원
+- 실시간 상태 동기화
+- 키보드 접근성 지원
+- 터치 디바이스 대응
+```
+
+### 실제 사용 예시
+
+```
+메뉴 구성 관리 좌드래그박스 + 우상세폼 + 하단트리 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: SystemMenuService, SystemProgramService
+   - 사용가능 프로그램: postSystemProgramListAvailable
+   - 메뉴 트리: postSystemMenuListTree
+   - 메뉴 상세: postSystemMenuDtlMenu
+   - 메뉴 구성 저장: postSystemMenuSaveStructure
+   - 드래그 처리: postSystemMenuMoveProgram
+
+2. **좌측 프로그램 드래그박스**
+   - 사용가능한 프로그램 목록 표시
+   - 카테고리별 그룹핑 (시스템/업무/보고서)
+   - 검색: 프로그램명, 설명으로 검색
+   - 카드형 표시: 프로그램 아이콘 + 이름
+   - 드래그 가능: 모든 프로그램 드래그 가능
+
+3. **우상단 메뉴 상세폼**
+   - 메뉴 기본정보: 메뉴명, 설명, 아이콘
+   - 표시 설정: 표시여부, 순서, 권한
+   - 링크 설정: URL, 새창여부, 파라미터
+   - 프로그램 연결: 연결된 프로그램 정보
+   - 저장/취소: 메뉴 정보 저장
+
+4. **우하단 메뉴 트리**
+   - 현재 메뉴 구조를 트리로 표시
+   - 드롭 허용: 폴더 노드에만 드롭 허용
+   - 메뉴 타입: 폴더/링크/프로그램 구분
+   - 컨텍스트 메뉴: 추가/수정/삭제/이동
+   - 순서 변경: 같은 레벨 내 순서 변경
+
+5. **드래그 앤 드롭 규칙**
+   - 프로그램 → 메뉴폴더: 새 메뉴 생성
+   - 메뉴 → 다른폴더: 메뉴 이동
+   - 제약사항: 순환참조 방지, 최대 깊이 제한
+   - 시각적 피드백: 드롭 가능/불가능 영역 표시
+
+**DTO 활용 정보:**
+- 프로그램 DTO: SystemProgram { programId, programName, programDesc, iconPath }
+- 메뉴 DTO: SystemMenu { menuId, parentId, menuName, programId, sortOrder }
+- 트리 노드: MenuTreeNode { id, parentId, name, type, children, isDroppable }
+- 드래그 결과: MenuDragResult { programId, targetMenuId, position }
+
+**화면 경로:** /system/menu/drag-form-tree
+**권한 관리:** 시스템 관리자 권한 + 메뉴 관리 권한
+```
+
+---
+
+## 16. ➕ 모달 행추가삭제형 (Modal Row Management)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 모달 행추가삭제 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 목록 조회: post{도메인명}List{기능명}
+   - 상세 조회: post{도메인명}Dtl{기능명}
+   - 일괄 저장: post{도메인명}SaveBatch{기능명}
+   - 행 추가: post{도메인명}AddRow{기능명}
+   - 행 삭제: post{도메인명}DelRow{기능명}
+   - Request DTO: Post{도메인명}{기능명}Request
+   - Response DTO: Post{도메인명}{기늩명}Response
+
+2. **모달 구성**
+   - 모달 크기: large 또는 fullscreen (1200px+)
+   - 레이아웃: 상단 기본정보 + 하단 데이터 그리드
+   - 스크롤: 모달 내부 스크롤 지원
+   - 닫기 방지: 미저장 변경사항 있을 때 경고
+   - 키보드: ESC(취소), Ctrl+S(저장), Ctrl+N(새행)
+
+3. **상단 기본정보 섹션**
+   - 마스터 데이터: {기본 정보 필드들}
+   - 폼 컴포넌트: Ant Design Form
+   - 레이아웃: 2열 또는 3열 그리드
+   - 유효성 검증: 실시간 및 제출시 검증
+   - 의존성: 마스터 데이터 변경시 하단 데이터 영향
+
+4. **하단 데이터 그리드**
+   - 컴포넌트: DataGrid 또는 Table
+   - 인라인 편집: 각 셀에서 직접 편집 가능
+   - 행 선택: 체크박스로 다중 선택
+   - 드래그 앤 드롭: 행 순서 변경 (선택적)
+   - 상태 표시: 새로추가/수정/삭제 예정 표시
+   - 에러 표시: 유효성 검증 오류 행 하이라이트
+
+5. **행 관리 기능**
+   - 행 추가: 빈 행 추가 (템플릿 지원)
+   - 행 복사: 선택된 행 복사하여 새 행 생성
+   - 행 삭제: 선택된 행들 삭제 (확인 후)
+   - 행 이동: 드래그로 행 순서 변경
+   - 전체 선택: 전체 행 선택/해제
+   - 선택 역전: 선택 상태 반전
+
+6. **인라인 편집 기능**
+   - 편집 컴포넌트: Input, Select, DatePicker, InputNumber
+   - 편집 모드: 더블클릭, F2키, 직접 타이핑
+   - 저장 트리거: Enter, Tab, 포커스 아웃
+   - 취소: ESC키 또는 취소 아이콘
+   - 내비게이션: Tab/Shift+Tab으로 셀 이동
+   - 자동완성: 설정 가능한 필드에 자동완성
+
+7. **일괄 저장 기능**
+   - 변경 감지: 수정된 행들 자동 감지
+   - 유효성 검증: 전체 데이터 일괄 검증
+   - 트랜잭션: 전체 성공 또는 전체 실패
+   - 진행률: 대량 데이터 저장시 진행률 표시
+   - 에러 처리: 오류 행 표시 및 세부 메시지
+   - 성공 후: 목록 새로고침 및 모달 닫기
+
+8. **사용자 경험 최적화**
+   - 로딩 상태: 단계별 로딩 인디케이터
+   - 대량 데이터: 가상 스크롤로 성능 최적화
+   - 자동 저장: 선택적 자동 저장 기능
+   - 실행취소: Ctrl+Z로 마지막 작업 취소
+   - 상태 표시: 각 행의 변경 상태 시각적 표시
+
+**DTO 활용 정보:**
+- 마스터 DTO: {마스터도메인명} interface
+- 상세 DTO: {상세도메인명} interface
+- 일괄 저장: { master: 마스터DTO, details: 상세DTO[], deletedIds: number[] }
+- 유효성 에러: { rowIndex: number, fieldName: string, errorMessage: string }
+
+**화면 경로:** /{도메인경로}/modal-row-management
+**권한 관리:** 데이터 일괄 관리 권한
+
+**요청사항:**
+- 대량 데이터 처리 성능 최적화
+- 인라인 편집 UX 최적화
+- 복잡한 유효성 검증 로직
+- 키보드 내비게이션 지원
+- 모바일 대응 (터치 인터페이스)
+```
+
+### 실제 사용 예시
+
+```
+주문 상세 관리 모달 행추가삭제 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: OrderService, ProductService
+   - 주문 상세: postOrderDtlOrder
+   - 상품 목록: postProductListForOrder
+   - 일괄 저장: postOrderSaveBatch
+   - 주문항목 추가: postOrderAddItem
+   - 주문항목 삭제: postOrderDelItem
+
+2. **상단 주문 기본정보**
+   - 주문번호, 주문일시, 고객정보
+   - 배송지 정보, 결제정보
+   - 주문상태, 배송비, 할인금액
+   - 총 주문금액 자동 계산
+
+3. **하단 주문항목 그리드**
+   - 상품코드, 상품제목, 옵션, 수량, 단가, 금액
+   - 인라인 편집: 수량, 단가, 옵션 직접 수정
+   - 상품 검색: 상품코드 입력시 자동 검색
+   - 금액 자동 계산: 수량 × 단가 = 금액
+
+4. **행 관리 기능**
+   - 상품 추가: 상품 검색 모달에서 선택
+   - 행 복사: 기존 주문항목 복사
+   - 대량 추가: 엑셀 파일로 대량 상품 추가
+   - 반품 처리: 일부 수량 반품 및 전체 반품
+
+5. **유효성 검증**
+   - 필수 항목: 상품, 수량 필수 입력
+   - 재고 체크: 주문 수량 > 재고 수량 경고
+   - 중복 체크: 동일 상품+옵션 중복 방지
+   - 금액 범위: 최소/최대 주문금액 체크
+
+**DTO 활용 정보:**
+- 주문 DTO: Order { orderNo, orderDtm, customerId, totalAmount, ... }
+- 주문항목 DTO: OrderItem { orderItemNo, productId, qty, unitPrice, amount, ... }
+- 일괄저장: { order: Order, orderItems: OrderItem[], deletedItemIds: number[] }
+
+**화면 경로:** /order/detail/modal-row-management
+**권한 관리:** 주문 상세 조회/수정 권한
+```
+
+---
+
+## 17. 🖼️ 모달 이미지업로드형 (Modal Image Upload)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 모달 이미지업로드 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service, UploadService
+   - 이미지 업로드: postUploadImageMultiple
+   - 이미지 삭제: deleteUploadImage
+   - 이미지 리사이즈: postUploadImageResize
+   - 이미지 크롭: postUploadImageCrop
+   - 메타데이터 저장: post{도메인명}SaveImageMeta
+   - Request DTO: PostUploadImageRequest
+   - Response DTO: PostUploadImageResponse { fileId, url, thumbnailUrl }
+
+2. **모달 구성**
+   - 모달 크기: large (1000px) 또는 fullscreen
+   - 레이아웃: 상단 업로드 영역 + 하단 이미지 관리 영역
+   - 드래그 앤 드롭: 전체 모달 영역에 드롭 지원
+   - 키보드: ESC(닫기), Delete(선택 이미지 삭제)
+   - 모달 속성: 마스크 없이 드래그 가능
+
+3. **이미지 업로드 영역**
+   - 드래그 앤 드롭 조역: 큰 점선 사각형 영역
+   - 파일 선택 버튼: 브라우저 파일 다이얼로그
+   - 다중 선택: multiple 속성으로 여러 파일 동시 선택
+   - 파일 타입: accept="image/*" 또는 구체적 확장자
+   - 크기 제한: 개별 파일 최대 크기 (10MB 등)
+   - 개수 제한: 최대 업로드 가능 개수
+
+4. **업로드 진행 표시**
+   - 파일별 진행률: 개별 파일 업로드 진행률
+   - 전체 진행률: 전체 업로드 진행 상황
+   - 상태 표시: 대기/업로드중/완료/실패
+   - 취소 버튼: 업로드 중 취소 가능
+   - 에러 처리: 실패 시 재시도 옵션
+   - 속도 표시: 업로드 속도 및 남은 시간
+
+5. **이미지 미리보기 리스트**
+   - 썸네일 그리드: 가로 4-6개 열로 이미지 표시
+   - 이미지 사이즈: 인기 속성에 맞게 자동 비율 조정
+   - 호버 효과: 마우스 올릴 때 오버레이 또는 확대
+   - 선택 상태: 체크박스 또는 테두리로 선택 표시
+   - 제어 버튼: 미리보기/수정/삭제/다운로드
+   - 드래그 정렬: 드래그로 이미지 순서 변경
+
+6. **이미지 편집 기능**
+   - 크롭 코미: 비율 지정 크롭 (예: 16:9, 1:1)
+   - 리사이즈: 지정된 크기로 자동 리사이즈
+   - 회전: 90도 단위 회전
+   - 색상 보정: 밝기, 대비, 채도 조정
+   - 필터: 흩백, 세피아, 빈티지 등
+   - 워터마크: 로고 또는 텍스트 워터마크
+
+7. **메타데이터 관리**
+   - 파일 정보: 파일명, 크기, 형식, 해상도
+   - ALT 텍스트: 접근성을 위한 대체 텍스트
+   - 태그: 이미지 분류를 위한 태그
+   - 설명: 이미지 상세 설명
+   - 저작권: 저작권 정보 및 라이선스
+   - 버전 관리: 동일 이미지의 여러 버전
+
+8. **화질 및 성능 최적화**
+   - 이미지 압축: WebP, AVIF 등 최신 형식 지원
+   - 레이지 로딩: 대용량 이미지 점진적 로딩
+   - CDN 연동: 빠른 이미지 서빙
+   - 써네일 생성: 여러 크기 썸네일 자동 생성
+   - 메모리 관리: 대용량 이미지 처리시 메모리 최적화
+
+**DTO 활용 정보:**
+- 이미지 업로드: UploadImageRequest { files: File[], category: string, resize: ResizeOption }
+- 업로드 응답: UploadImageResponse { images: ImageInfo[] }
+- 이미지 정보: ImageInfo { fileId, url, thumbnailUrl, width, height, size }
+- 메타데이터: ImageMeta { altText, tags, description, copyright }
+
+**화면 경로:** /{도메인경로}/modal-image-upload
+**권한 관리:** 이미지 업로드 권한 + 편집 권한
+
+**요청사항:**
+- 대용량 이미지 처리 성능 최적화
+- 다양한 이미지 형식 지원
+- 실시간 이미지 편집 기능
+- 모바일 카메라 연동
+- 접근성 지원 (alt 텍스트, 키보드)
+```
+
+### 실제 사용 예시
+
+```
+상품 이미지 관리 모달 이미지업로드 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: ProductService, UploadService
+   - 상품 이미지 업로드: postUploadProductImage
+   - 이미지 순서 변경: postProductUpdateImageOrder
+   - 이미지 메타데이터: postProductSaveImageMeta
+   - 메인 이미지 설정: postProductSetMainImage
+
+2. **이미지 업로드 영역**
+   - 지원 형식: JPG, PNG, WebP (최대 10MB)
+   - 최대 개수: 20개 이미지
+   - 권장 크기: 메인 1920x1920, 상세 800x800
+   - 자동 리사이즈: 여러 크기 썸네일 생성
+
+3. **이미지 편집 기능**
+   - 크롭: 1:1, 16:9, 4:3 비율 선택 가능
+   - 색상 보정: 밝기, 대비, 채도 조정
+   - 워터마크: 브랜드 로고 자동 삽입
+   - 회전: 90도 단위 회전 가능
+
+4. **상품 이미지 관리**
+   - 메인 이미지: 첫 번째 이미지 자동 설정
+   - 순서 관리: 드래그로 이미지 순서 변경
+   - ALT 텍스트: SEO를 위한 대체 텍스트 입력
+   - 이미지 태그: 색상, 스타일, 용도 등
+
+**DTO 활용 정보:**
+- 상품이미지: ProductImage { productImageId, productId, imageUrl, isMain, sortOrder }
+- 업로드 요청: { productId, files: File[], category: 'main'|'detail'|'option' }
+- 이미지 메타: { altText, tags: string[], description }
+
+**화면 경로:** /product/image/modal-upload
+**권한 관리:** 상품 관리 권한 + 이미지 편집 권한
+```
+
+---
+
+## 18. 📋 모달 내용테이블형 (Modal Content Table)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 모달 내용테이블 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 테이블 데이터: post{도메인명}ListTable{기능명}
+   - 데이터 내보내기: post{도메인명}ExportTable{기능명}
+   - 데이터 가져오기: post{도메인명}ImportTable{기능명}
+   - 테이블 업데이트: post{도메인명}UpdateTable{기능명}
+   - 열 추가/삭제: post{도메인명}UpdateColumns{기능명}
+   - Request DTO: Post{도메인명}ListTable{기능명}Request
+   - Response DTO: Post{도메인명}ListTable{기능명}Response
+
+2. **모달 구성**
+   - 모달 크기: fullscreen 또는 90% 크기
+   - 레이아웃: 상단 도구모음 + 중앙 테이블 + 하단 액션
+   - 스크롤: 모달 내부 수직/수평 스크롤
+   - 크기 조절: 리사이즈 가능한 모달
+   - 키보드: ESC(닫기), Ctrl+S(저장), Ctrl+A(전체선택)
+
+3. **상단 도구모음**
+   - 테이블 옵션: 새로고침, 내보내기, 가져오기
+   - 열 관리: 열 추가, 열 삭제, 열 순서 변경
+   - 필터: 데이터 필터링 옵션
+   - 정렬: 여러 열 동시 정렬
+   - 검색: 테이블 내 데이터 검색
+   - 설정: 테이블 보기 옵션 설정
+
+4. **동적 테이블 구성**
+   - 열 정의: JSON 또는 설정으로 동적 열 생성
+   - 데이터 타입: text, number, date, boolean, select, image
+   - 열 너비: 고정 또는 비율로 열 너비 설정
+   - 열 순서: 드래그로 열 순서 변경 가능
+   - 고정 열: 좌측 고정 또는 우측 고정 열
+   - 가상 열: 계산된 값을 표시하는 가상 열
+
+5. **인라인 편집 기능**
+   - 더블클릭 편집: 셀 더블클릭으로 편집 모드
+   - 데이터 타입별 에디터:
+     * 텍스트: Input 컴포넌트
+     * 숫자: InputNumber 컴포넌트
+     * 날짜: DatePicker 컴포넌트
+     * 선택: Select 컴포넌트
+     * 불린: Switch 컴포넌트
+   - 유효성 검증: 실시간 셀 단위 검증
+   - 자동 저장: Enter 또는 포커스 아웃시 자동 저장
+
+6. **대량 데이터 처리**
+   - 가상 스크롤: 대량 데이터 성능 최적화
+   - 지연 로딩: 스크롤시 추가 데이터 로딩
+   - 청크 로딩: 데이터 청크 단위 처리
+   - 서버 사이드 정렬: 대량 데이터 정렬 내맵
+   - 메모리 관리: 렌더 셀 메모리 해제
+   - 성능 모니터링: 렌더링 성능 추적
+
+7. **데이터 내보내기/가져오기**
+   - 내보내기 형식: Excel, CSV, JSON, PDF
+   - 선택 데이터: 선택된 행/열만 내보내기
+   - 필터 데이터: 현재 필터된 데이터만
+   - 가져오기: Excel/CSV 파일 업로드
+   - 데이터 검증: 가져온 데이터 유효성 검증
+   - 오류 보고: 가져오기 오류 상세 보고
+
+8. **고급 기능**
+   - 동적 요약: 예시: 숫자 열의 합계, 평균
+   - 조건부 서식: 조건에 따른 셀 스타일 변경
+   - 열 그룹핑: 연관된 열들 그룹화
+   - 데이터 유효성: 사용자 정의 유효성 규칙
+   - 포뮬러: 셀 값 계산 포뮬러
+   - 데이터 링크: 다른 테이블과 데이터 연동
+
+**DTO 활용 정보:**
+- 테이블 설정: TableConfig { columns: ColumnDef[], data: any[][], meta: TableMeta }
+- 열 정의: ColumnDef { key, title, dataType, width, editable, validation }
+- 셀 데이터: CellData { value: any, formattedValue: string, style: CellStyle }
+- 내보내기: ExportConfig { format, selectedRows, selectedColumns, filters }
+
+**화면 경로:** /{도메인경로}/modal-content-table
+**권한 관리:** 데이터 조회 권한 + 테이블 편집 권한
+
+**요청사항:**
+- 대량 데이터 처리 성능 최적화
+- 다양한 데이터 타입 지원
+- 실시간 데이터 동기화
+- 접근성 지원 (스크린 리더, 키보드)
+- 다양한 내보내기 형식
+```
+
+### 실제 사용 예시
+
+```
+재고 현황 데이터 모달 내용테이블 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: InventoryService, ProductService
+   - 재고 데이터: postInventoryListStock
+   - 재고 조정: postInventoryAdjustStock
+   - 재고 내보내기: postInventoryExportStock
+   - 재고 가져오기: postInventoryImportStock
+
+2. **동적 테이블 구성**
+   - 고정 열: 상품코드, 상품제목, 카테고리
+   - 재고 열: 현재재고, 예약재고, 가용재고
+   - 위치별 열: 창고별 재고 수량 (동적 생성)
+   - 계산 열: 재고금액, 회전율, ABC분석
+
+3. **인라인 편집**
+   - 재고수량: 직접 수정 가능 (재고조정)
+   - 안전재고: 최소 재고 수량 설정
+   - 위치이동: 드래그로 재고 위치 이동
+   - 상태변경: 정상/결품/폐기 상태 변경
+
+4. **데이터 시각화**
+   - 재고 수준: 색상 코딩 (빨간: 부족, 녹색: 적정, 파랑: 과다)
+   - 진행률 바: 안전재고 대비 현재재고 비율
+   - 알림 아이콘: 재고 부족 경고 표시
+   - 트렌드 그래프: 최근 30일 재고 변동
+
+**DTO 활용 정보:**
+- 재고 DTO: InventoryStock { productId, warehouseId, currentStock, reservedStock, safetyStock }
+- 테이블 설정: InventoryTableConfig { warehouses: Warehouse[], columns: DynamicColumn[] }
+- 재고조정: StockAdjustment { productId, warehouseId, adjustQty, reason }
+
+**화면 경로:** /inventory/stock/modal-table
+**권한 관리:** 재고 조회 권한 + 재고조정 권한
+```
+
+---
+
+## 19. ✉️ 모달 추가삭제 기능형 (Modal Add Delete Function)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 모달 추가삭제 기능 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 사용가능 목록: post{도메인명}ListAvailable{기능명}
+   - 선택된 목록: post{도메인명}ListSelected{기능명}
+   - 일괄 추가: post{도메인명}AddBatch{기능명}
+   - 일괄 삭제: post{도메인명}DelBatch{기능명}
+   - 검색: post{도메인명}Search{기능명}
+   - Request DTO: Post{도메인명}{기능명}Request
+   - Response DTO: Post{도메인명}{기능명}Response
+
+2. **모달 구성**
+   - 모달 크기: large (1000px) 또는 extraLarge (1200px)
+   - 레이아웃: 좌우 분할 + 중앙 전송 버튼
+   - 좌측: 사용가능 항목 목록 (40%)
+   - 우측: 선택된 항목 목록 (40%)
+   - 중앙: 전송 버튼 영역 (20%)
+   - 키보드: Tab(좌우 이동), 스페이스(선택/해제)
+
+3. **좌측 사용가능 목록**
+   - 컴포넌트: ListDataGrid 또는 DataGrid
+   - 선택 모드: 다중 선택 (체크박스)
+   - 검색 기능: 상단 검색박스
+   - 필터: 카테고리, 상태별 필터
+   - 정렬: 이름, 등록일 등 정렬
+   - 페이지네이션: 기본 페이징 또는 무한 스크롤
+   - 전체 선택: 전체 선택/해제 버튼
+
+4. **중앙 전송 버튼 영역**
+   - 오른쪽 화살표 (▶): 선택 항목 오른쪽으로 이동
+   - 왼쪽 화살표 (◀): 선택 항목 왼쪽으로 이동
+   - 전체 오른쪽 (▶▶): 모든 항목 오른쪽으로
+   - 전체 왼쪽 (◀◀): 모든 항목 왼쪽으로
+   - 버튼 상태: 선택 상태에 따른 활성화/비활성화
+   - 단축키: 화살표 키로 이동 가능
+
+5. **우측 선택된 목록**
+   - 컴포넌트: ListDataGrid 또는 DataGrid
+   - 선택 모드: 다중 선택 (체크박스)
+   - 순서 변경: 드래그 앤 드롭으로 순서 변경
+   - 배치 정보: 추가된 순서 또는 배치 번호
+   - 빠른 삭제: Delete키 또는 X버튼으로 즉시 삭제
+   - 상태 표시: 신규추가/기존 항목 구분
+
+6. **고급 기능**
+   - 조건부 추가: 특정 조건을 만족하는 항목만 추가
+   - 전송 옵션: 복사/이동/링크 모드
+   - 드래그 앤 드롭: 좌우 간 드래그로 전송
+   - 자동 완성: 입력중 자동 완성 기능
+   - 이전 설정: 사용자별 이전 선택 내역 저장
+   - 빠른 선택: 단축키로 빠른 선택/전송
+
+7. **데이터 검증**
+   - 중복 체크: 이미 선택된 항목 중복 방지
+   - 의존성 체크: 전제조건 항목 선택 체크
+   - 최대/최소 제한: 선택 가능 항목 수 제한
+   - 구성 규칙: 비즈니스 규칙에 따른 유효성 검증
+   - 충돌 감지: 선택 항목 간 충돌 감지
+
+8. **사용자 경험**
+   - 실시간 검색: 입력에 따른 즉시 필터링
+   - 로딩 인디케이터: 데이터 로딩 상태 표시
+   - 선택 카운터: 좌우 항목 수 표시
+   - 단축키 가이드: 도움말 또는 툴팁
+   - 진행률: 대량 데이터 처리시 진행률
+   - 성공 피드백: 전송 완료 시 사용자 피드백
+
+**DTO 활용 정보:**
+- 사용가능 항목: AvailableItem { id, name, category, status, metadata }
+- 선택 항목: SelectedItem { id, order, addedAt, source }
+- 전송 요청: TransferRequest { addIds: number[], removeIds: number[], mode: 'copy'|'move' }
+- 전송 결과: TransferResult { success: boolean, added: number, removed: number, errors: Error[] }
+
+**화면 경로:** /{도메인경로}/modal-add-delete
+**권한 관리:** 데이터 선택 권한 + 일괄 처리 권한
+
+**요청사항:**
+- 대량 데이터 선택 성능 최적화
+- 직관적인 드래그 앤 드롭 UI
+- 다양한 선택 모드 지원
+- 키보드 내비게이션 최적화
+- 모바일 대응 (터치 인터페이스)
+```
+
+### 실제 사용 예시
+
+```
+사용자 그룹 권한 관리 모달 추가삭제 기능 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: SystemUserService, SystemRoleService
+   - 사용가능 사용자: postSystemUserListAvailableUsers
+   - 그룹 권한: postSystemRoleListGroupRoles
+   - 그룹 사용자: postSystemUserListGroupUsers
+   - 그룹 사용자 추가: postSystemUserAddToGroup
+   - 그룹 사용자 제거: postSystemUserRemoveFromGroup
+
+2. **좌측 사용가능 사용자**
+   - 컬럼: 사용자ID, 사용자명, 부서, 직책, 상태
+   - 검색: 사용자명, 사용자ID, 부서별 검색
+   - 필터: 부서, 직책, 상태별 필터
+   - 정렬: 사용자명, 부서 정렬
+   - 전체 선택: 현재 필터된 모든 사용자
+
+3. **우측 그룹 사용자**
+   - 컬럼: 사용자ID, 사용자명, 추가일, 추가자
+   - 순서 변경: 드래그로 그룹 내 사용자 순서
+   - 배치 삭제: 선택된 사용자들 일괄 제거
+   - 권한 표시: 각 사용자의 현재 권한 레벨
+
+4. **고급 기능**
+   - 권한 상속: 상위 그룹 권한 자동 상속
+   - 권한 충돌: 충돌하는 권한 감지 및 경고
+   - 임시 권한: 기간 한정 그룹 참여
+   - 대량 추가: CSV 파일로 대량 사용자 추가
+
+**DTO 활용 정보:**
+- 사용자 DTO: SystemUser { userId, userName, userLoginId, departmentName, jobTitle }
+- 그룹 DTO: UserGroup { groupId, groupName, description, parentGroupId }
+- 그룹 멤버: GroupMember { userId, groupId, addedAt, addedBy, isTemporary, expireDate }
+
+**화면 경로:** /system/user-group/modal-add-delete
+**권한 관리:** 사용자 그룹 관리 권한
+```
+
+---
+
+## 20. 🏢 체크박스 모달 드래그 서브항목형 (Checkbox Modal Drag Sub)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 체크박스 모달 드래그 서브항목 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 메인 목록: post{도메인명}List{메인기능명}
+   - 서브 목록: post{도메인명}ListSub{서브기능명}
+   - 드래그 처리: post{도메인명}MoveSub{기능명}
+   - 일괄 처리: post{도메인명}ProcessBatch{기능명}
+   - 관계 설정: post{도메인명}SetRelation{기능명}
+   - Request DTO: Post{도메인명}{기능명}Request
+   - Response DTO: Post{도메인명}{기능명}Response
+
+2. **모달 구성**
+   - 모달 크기: extraLarge (1400px) 또는 fullscreen
+   - 레이아웃: 상단 메인 선택 + 하단 서브 드래그 영역
+   - 상단: 체크박스 그리드 (30%)
+   - 하단: 드래그 가능한 서브항목 관리 (70%)
+   - 분할선: 상하 크기 조절 가능한 스플리터
+
+3. **상단 메인 체크박스 그리드**
+   - 컴포넌트: DataGrid 또는 Table
+   - 선택 모드: 다중 선택 (체크박스)
+   - 마스터 선택: 메인 항목 선택시 하단 서브항목 변경
+   - 전체 선택: 전체 메인 항목 선택/해제
+   - 필터링: 카테고리별, 상태별 필터
+   - 검색: 키워드 검색
+   - 상태 표시: 각 메인 항목의 서브항목 개수 표시
+
+4. **하단 서브항목 드래그 영역**
+   - 드래그 라이브러리: react-beautiful-dnd
+   - 레이아웃: 카드형 또는 리스트형
+   - 그룹화: 카테고리별 또는 상태별 그룹
+   - 드래그 가능: 서브항목 순서 변경
+   - 드롭 존: 여러 그룹 간 이동 가능
+   - 시각적 피드백: 드래그 중 미리보기
+   - 제약 조건: 특정 조건에서만 드래그 허용
+
+5. **드래그 앤 드롭 기능**
+   - 순서 변경: 같은 그룹 내 순서 변경
+   - 그룹 이동: 다른 그룹으로 이동
+   - 일괄 드래그: 다중 선택된 항목 일괄 이동
+   - 제약 사항: 비즈니스 규칙에 따른 드래그 제한
+   - 되돌리기: Ctrl+Z로 마지막 드래그 취소
+   - 자동 스크롤: 드래그 중 자동 스크롤
+
+6. **서브항목 관리**
+   - 추가: 새 서브항목 추가
+   - 편집: 인라인 또는 모달 편집
+   - 삭제: 선택된 서브항목 삭제
+   - 복사: 다른 메인 항목으로 복사
+   - 일괄 작업: 체크박스로 선택 후 일괄 처리
+   - 상태 변경: 활성/비활성 상태 토글
+
+7. **관계 설정 및 검증**
+   - 부모-자식 관계: 메인-서브 관계 설정
+   - 의존성 체크: 서브항목 간 의존성 검증
+   - 순환 참조: 순환 참조 방지
+   - 제약 조건: 최대/최소 서브항목 수 제한
+   - 유효성 검증: 관계 무결성 검증
+   - 경고 표시: 제약 위반시 경고 메시지
+
+8. **고급 기능**
+   - 템플릿: 서브항목 구성 템플릿
+   - 즐겨찾기: 자주 사용하는 구성 저장
+   - 히스토리: 변경 이력 추적 및 복원
+   - 미리보기: 최종 구성 미리보기
+   - 내보내기: 구성 정보 Excel/JSON 내보내기
+   - 가져오기: 외부 구성 정보 가져오기
+
+**DTO 활용 정보:**
+- 메인 항목: MainItem { id, name, category, status, subItemCount }
+- 서브 항목: SubItem { id, mainId, name, order, groupId, dependencies }
+- 드래그 결과: DragResult { sourceId, targetId, newOrder, newGroupId }
+- 관계 설정: RelationConfig { mainId, subItems: SubItem[], rules: Rule[] }
+
+**화면 경로:** /{도메인경로}/modal-checkbox-drag-sub
+**권한 관리:** 구조 관리 권한 + 드래그 권한
+
+**요청사항:**
+- 매끄러운 드래그 앤 드롭 UX
+- 복잡한 관계 설정 지원
+- 대량 데이터 성능 최적화
+- 실시간 유효성 검증
+- 키보드 접근성 지원
+```
+
+### 실제 사용 예시
+
+```
+조직도 관리 체크박스 모달 드래그 서브항목 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: OrganizationService, DepartmentService
+   - 부서 목록: postDepartmentListDepartment
+   - 직원 목록: postEmployeeListByDepartment
+   - 직원 이동: postEmployeeMoveEmployee
+   - 조직 구조: postOrganizationUpdateStructure
+
+2. **상단 부서 체크박스 그리드**
+   - 컬럼: 부서코드, 부서명, 상위부서, 직원수, 상태
+   - 체크박스: 다중 부서 선택 가능
+   - 계층 표시: 들여쓰기로 부서 계층 표시
+   - 직원수 표시: 각 부서별 현재 직원 수
+
+3. **하단 직원 드래그 영역**
+   - 직원 카드: 사진, 이름, 직책, 연락처
+   - 그룹별 정렬: 직책별, 입사일별 그룹화
+   - 드래그 가능: 직원을 다른 부서로 이동
+   - 제약 조건: 관리자급은 특정 부서로만 이동 가능
+
+4. **조직도 관리 기능**
+   - 부서장 지정: 드래그로 부서장 설정
+   - 직책 변경: 드래그로 직책 레벨 변경
+   - 팀 구성: 프로젝트 팀 임시 구성
+   - 승인 플로우: 조직 변경시 승인 절차
+
+**DTO 활용 정보:**
+- 부서 DTO: Department { deptId, deptName, parentDeptId, employeeCount }
+- 직원 DTO: Employee { empId, empName, deptId, jobTitle, profileImage }
+- 이동 요청: EmployeeMove { empId, fromDeptId, toDeptId, newJobTitle }
+
+**화면 경로:** /organization/structure/modal-drag
+**권한 관리:** 조직 관리 권한 + 인사 권한
+```
+
+---
+
+## 21. 📋 탭 서브탭 일괄등록형 (Tab SubTab Bulk Register)
+
+### 프롬프트 템플릿
+
+```
+{도메인명} 탭 서브탭 일괄등록 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: {도메인명}Service
+   - 탭 목록: post{도메인명}ListTabs{기능명}
+   - 서브탭 목록: post{도메인명}ListSubTabs{기능명}
+   - 데이터 목록: post{도메인명}ListData{기능명}
+   - 일괄 등록: post{도메인명}BulkRegister{기능명}
+   - 템플릿 조회: post{도메인명}GetTemplate{기능명}
+   - Request DTO: Post{도메인명}{기능명}Request
+   - Response DTO: Post{도메인명}{기능명}Response
+
+2. **탭 구조**
+   - 메인 탭: 1차 카테고리 탭
+   - 서브 탭: 2차 카테고리 탭
+   - 탭 활성화: 선택된 탭에 따른 콘텐츠 변경
+   - 탭 상태: 각 탭별 데이터 개수 배지 표시
+   - 탭 비활성화: 권한에 따른 탭 비활성화
+   - 탭 순서: 관리자 설정에 따른 탭 순서
+
+3. **일괄 등록 폼**
+   - 폼 구성: 동적 폼 필드 생성
+   - 반복 섹션: 여러 항목 동시 입력
+   - 필드 타입: text, number, date, select, checkbox, file
+   - 조건부 필드: 특정 조건에서만 표시되는 필드
+   - 필드 검증: 실시간 유효성 검증
+   - 자동 입력: 기본값 또는 계산값 자동 설정
+
+4. **데이터 그리드**
+   - 그리드 표시: 입력된 데이터 미리보기
+   - 인라인 편집: 그리드에서 직접 편집
+   - 행 추가/삭제: 동적으로 행 추가 및 삭제
+   - 데이터 검증: 그리드 내 데이터 유효성 검증
+   - 중복 체크: 동일 데이터 중복 방지
+   - 정렬 기능: 그리드 데이터 정렬
+
+5. **템플릿 기능**
+   - 템플릿 선택: 미리 정의된 템플릿 선택
+   - 템플릿 적용: 선택한 템플릿으로 폼 자동 설정
+   - 사용자 템플릿: 사용자 정의 템플릿 저장
+   - 템플릿 공유: 다른 사용자와 템플릿 공유
+   - 템플릿 버전: 템플릿 버전 관리
+   - 기본 템플릿: 탭별 기본 템플릿 설정
+
+6. **파일 업로드**
+   - Excel 업로드: Excel 파일로 대량 데이터 업로드
+   - CSV 업로드: CSV 파일 지원
+   - 파일 검증: 업로드 파일 형식 및 내용 검증
+   - 오류 보고: 업로드 오류 상세 리포트
+   - 미리보기: 업로드 전 데이터 미리보기
+   - 매핑: 파일 컬럼과 시스템 필드 매핑
+
+7. **진행률 및 상태**
+   - 진행률 표시: 전체 등록 진행률
+   - 단계별 진행: 각 단계별 완료 상태
+   - 성공/실패: 등록 성공 및 실패 통계
+   - 오류 목록: 등록 실패 항목 상세 정보
+   - 재시도: 실패한 항목 재시도 기능
+   - 중단/재개: 진행 중 중단 및 재개
+
+8. **고급 기능**
+   - 배치 처리: 대량 데이터 배치 단위 처리
+   - 스케줄링: 특정 시간에 등록 실행
+   - 승인 워크플로: 등록 전 승인 절차
+   - 알림: 등록 완료 시 이메일/SMS 알림
+   - 감사 로그: 모든 등록 활동 로그 기록
+   - 백업: 등록 전 기존 데이터 백업
+
+**DTO 활용 정보:**
+- 탭 구성: TabConfig { mainTabs: Tab[], subTabs: SubTab[] }
+- 등록 데이터: BulkRegisterData { tabId, subTabId, items: RegisterItem[] }
+- 템플릿: Template { templateId, name, config: FormConfig }
+- 진행 상태: ProgressStatus { total, completed, failed, inProgress }
+
+**화면 경로:** /{도메인경로}/tab-subtab-bulk
+**권한 관리:** 일괄 등록 권한 + 탭별 접근 권한
+
+**요청사항:**
+- 대량 데이터 처리 성능 최적화
+- 직관적인 탭 네비게이션
+- 강력한 데이터 검증 기능
+- 사용자 친화적 진행률 표시
+- 에러 처리 및 복구 기능
+```
+
+### 실제 사용 예시
+
+```
+상품 대량 등록 탭 서브탭 일괄등록 화면을 AXBoot 프레임워크로 개발해주세요.
+
+**필수 구현 요소:**
+
+1. **API 연동 정보**
+   - 서비스: ProductService, CategoryService
+   - 카테고리 탭: postCategoryListMainCategory
+   - 서브 카테고리: postCategoryListSubCategory
+   - 상품 템플릿: postProductGetBulkTemplate
+   - 상품 일괄등록: postProductBulkRegister
+
+2. **탭 구조**
+   - 메인 탭: 가전, 생활용품, 식품, 의류 등
+   - 서브 탭: 세부 카테고리 (예: 가전 > TV, 냉장고, 세탁기)
+   - 등록 개수: 각 탭별 등록 대기 상품 수 표시
+   - 필수 필드: 탭별로 다른 필수 입력 필드
+
+3. **상품 일괄 등록 폼**
+   - 기본 정보: 상품명, 가격, 재고수량, 상품설명
+   - 상세 정보: 브랜드, 모델명, 크기, 무게, 색상
+   - 이미지: 대표이미지, 상세이미지 (최대 10개)
+   - 배송 정보: 배송비, 배송방법, 배송기간
+   - SEO 정보: 메타태그, 키워드, 검색 태그
+
+4. **템플릿 활용**
+   - 카테고리별 템플릿: 각 카테고리에 최적화된 입력 템플릿
+   - 브랜드별 템플릿: 브랜드별 공통 정보 자동 입력
+   - 사용자 템플릿: 자주 사용하는 설정 저장
+   - Excel 템플릿: 카테고리별 Excel 업로드 템플릿
+
+5. **대량 처리 기능**
+   - Excel 업로드: 최대 1000개 상품 동시 업로드
+   - 이미지 업로드: ZIP 파일로 이미지 일괄 업로드
+   - 데이터 검증: 상품코드 중복, 가격 범위 등 검증
+   - 진행률 표시: 등록 진행 상황 실시간 표시
+
+**DTO 활용 정보:**
+- 상품 등록: ProductBulkRegister { categoryId, products: ProductRegisterItem[] }
+- 등록 항목: ProductRegisterItem { name, price, stock, description, images }
+- 템플릿: ProductTemplate { categoryId, fields: FieldConfig[] }
+
+**화면 경로:** /product/bulk-register/tab-subtab
+**권한 관리:** 상품 등록 권한 + 카테고리별 접근 권한
+```
+
+---
+
+## 22-27. 나머지 타입들 (간략형)
+
+마지막 6개 타입들에 대한 핵심 프롬프트를 제공합니다:
+
+## 22. 📁 모달 파일업로드형 (Modal File Upload)
+**핵심 기능:** 다양한 파일 타입 업로드, 드래그앤드롭, 진행률 표시, 파일 검증
+**API 패턴:** `postUploadFiles`, `postValidateFile`, `postProcessUpload`
+**주요 컴포넌트:** Upload, Progress, FileList, Validation
+
+## 23. 🎯 드로우모달형 (Draw Modal)
+**핵심 기능:** Drawer 형태 모달, 슬라이드 애니메이션, 다단계 폼
+**API 패턴:** `postDrawerData`, `postDrawerSave`, `postDrawerStep`
+**주요 컴포넌트:** Drawer, Steps, Form, Navigation
+
+## 24. 🎪 모달 내 모달형 (Modal in Modal)
+**핵심 기능:** 중첩 모달 관리, z-index 처리, 모달 스택 관리
+**API 패턴:** `postParentModal`, `postChildModal`, `postModalStack`
+**주요 컴포넌트:** Modal, ModalStack, ZIndexManager
+
+## 25. 📑 모달 탭구현형 (Modal Tab Implementation)
+**핵심 기능:** 모달 내 탭 구성, 탭별 독립 데이터, 탭 상태 관리
+**API 패턴:** `postTabData`, `postTabSave`, `postTabValidation`
+**주요 컴포넌트:** Tabs, TabPane, TabContent
+
+## 26. ⚖️ 모달 데이터 좌우이동형 (Modal Data Transfer)
+**핵심 기능:** Transfer 컴포넌트, 좌우 데이터 이동, 검색 및 필터
+**API 패턴:** `postTransferSource`, `postTransferTarget`, `postTransferExecute`
+**주요 컴포넌트:** Transfer, List, Search, Filter
+
+## 27. 📊 모달 테이블드래그형 (Modal Table Drag)
+**핵심 기능:** 테이블 행 드래그, 순서 변경, 그룹 이동
+**API 패턴:** `postTableData`, `postUpdateOrder`, `postMoveGroup`
+**주요 컴포넌트:** DragTable, SortableRow, DropZone
+
+---
+
+## 프롬프트 활용 가이드
+
+이 가이드의 프롬프트들을 효과적으로 활용하기 위한 핵심 포인트:
+
+1. **정확한 DTO 정보 제공**: 실제 프로젝트의 DTO 구조를 정확히 파악하여 프롬프트에 반영
+2. **구체적인 요구사항 명시**: 비즈니스 로직과 유효성 검증 규칙을 상세히 기술
+3. **성능 고려사항 포함**: 대용량 데이터 처리나 복잡한 UI 상호작용에 대한 성능 최적화 요구사항 명시
+4. **접근성 고려**: 키보드 내비게이션, 스크린 리더 지원 등 접근성 요구사항 포함
+5. **실제 화면 참조**: 기존 유사 화면을 참조하여 일관성 있는 UI/UX 구현