shin
48 lines
1.2 KiB
Markdown
48 lines
1.2 KiB
Markdown
---
|
|
name: component-dev
|
|
description: 리포트 뷰어 V2 컴포넌트 개발 가이드. v2-report-viewer 등 리포트 관련 V2 컴포넌트 개발 시 사용.
|
|
---
|
|
|
|
# 리포트 V2 컴포넌트 개발 가이드
|
|
|
|
## 수정 범위 제약
|
|
|
|
리포트 관련 V2 컴포넌트만 수정:
|
|
- `v2-report-viewer/`
|
|
- 리포트 연동 컴포넌트
|
|
|
|
다른 V2 컴포넌트(`v2-table-list`, `v2-input` 등)는 수정하지 않는다.
|
|
|
|
## V2 컴포넌트 핵심 규칙
|
|
|
|
- `v2-` 접두사 필수 (원본 폴더 수정 금지)
|
|
- 저장: `component_url + overrides` (차이값만)
|
|
- Zod 스키마에 `.passthrough()` 필수
|
|
- `isDesignMode` 체크하여 API 호출 스킵
|
|
- `beforeFormSave` 이벤트로 느슨한 결합
|
|
- `autoFilter`로 멀티테넌시 필터링
|
|
|
|
## 표준 파일 구조
|
|
|
|
```
|
|
frontend/lib/registry/components/v2-report-viewer/
|
|
├── index.ts
|
|
├── ReportViewerRenderer.tsx
|
|
├── ReportViewerComponent.tsx
|
|
├── ReportViewerConfigPanel.tsx
|
|
└── types.ts
|
|
```
|
|
|
|
## 표준 Props
|
|
|
|
```typescript
|
|
interface StandardComponentProps {
|
|
component: ComponentData;
|
|
isDesignMode?: boolean;
|
|
formData?: Record<string, any>;
|
|
onFormDataChange?: (fieldName: string, value: any) => void;
|
|
companyCode?: string;
|
|
refreshKey?: number;
|
|
}
|
|
```
|