kjs
/
ERP-node
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
ERP-node/시연_시나리오.md

543 lines
16 KiB
Markdown
Raw Blame History

# ERP-node 시스템 시연 시나리오
## 전체 개요
**주제**: 발주 → 입고 프로세스 자동화
**목표**: 버튼 클릭 한 번으로 발주 데이터가 입고 테이블로 자동 이동하는 것을 보여주기
**총 시간**: 10분
---
## Part 1: 테이블 2개 생성 (2분)
### 1-1. 발주 테이블 생성
**화면 조작**:
1. 테이블 관리 메뉴 접속
2. "새 테이블" 버튼 클릭
3. 테이블 정보 입력:
- **테이블명(영문)**: `purchase_order`
- **테이블명(한글)**: `발주`
- **설명**: `발주 관리`
4. 컬럼 추가 (4개):
| 컬럼명(영문) | 컬럼명(한글) | 타입 | 필수 여부 |
| ------------ | ------------ | ------ | --------- |
| order_no | 발주번호 | text | ✓ |
| item_name | 품목명 | text | ✓ |
| quantity | 수량 | number | ✓ |
| unit_price | 단가 | number | ✓ |
5. "테이블 생성" 버튼 클릭
6. 성공 메시지 확인
---
### 1-2. 입고 테이블 생성
**화면 조작**:
1. "새 테이블" 버튼 클릭
2. 테이블 정보 입력:
- **테이블명(영문)**: `receiving`
- **테이블명(한글)**: `입고`
- **설명**: `입고 관리`
3. 컬럼 추가 (5개):
| 컬럼명(영문) | 컬럼명(한글) | 타입 | 필수 여부 | 비고 |
| -------------- | ------------ | ------ | --------- | ------------------- |
| receiving_no | 입고번호 | text | ✓ | 자동 생성 |
| order_no | 발주번호 | text | ✓ | 발주 테이블 참조 |
| item_name | 품목명 | text | ✓ | |
| quantity | 수량 | number | ✓ | |
| receiving_date | 입고일자 | date | ✓ | 오늘 날짜 자동 입력 |
4. "테이블 생성" 버튼 클릭
5. 성공 메시지 확인
**포인트 강조**:
- 클릭만으로 데이터베이스 테이블 자동 생성
- Input Type에 따라 적절한 UI 자동 설정
---
## Part 2: 메뉴 2개 생성 (1분)
### 2-1. 발주 관리 메뉴 생성
**화면 조작**:
1. 관리자 메뉴 > 메뉴 관리 접속
2. "새 메뉴 추가" 버튼 클릭
3. 메뉴 정보 입력:
- **메뉴명**: `발주 관리`
- **순서**: 1
4. "저장" 클릭
---
### 2-2. 입고 관리 메뉴 생성
**화면 조작**:
1. "새 메뉴 추가" 버튼 클릭
2. 메뉴 정보 입력:
- **메뉴명**: `입고 관리`
- **순서**: 2
3. "저장" 클릭
4. 좌측 메뉴바에서 새로 생성된 메뉴 2개 확인
**포인트 강조**:
- URL 기반 자동 라우팅
- 아이콘으로 직관적인 메뉴 구성
---
## Part 3: 플로우 생성 (2분)
### 3-1. 플로우 생성
**화면 조작**:
1. 제어 관리 메뉴 접속
2. "새 플로우 생성" 버튼 클릭
3. 플로우 생성 모달에서 입력:
- **플로우명**: `발주-입고 프로세스`
- **설명**: `발주에서 입고로 데이터 자동 이동`
4. "생성" 버튼 클릭
5. 플로우 편집 화면(캔버스)으로 자동 이동
---
### 3-2. 노드 구성
**내레이션**:
"플로우는 소스 테이블과 액션 노드로 구성합니다. 발주 테이블에서 입고 테이블로 데이터를 INSERT하는 구조입니다."
**노드 1: 발주 테이블 소스**
**화면 조작**:
1. 캔버스 좌측 팔레트에서 "테이블 소스" 에서 테이블 노드 드래그
2. 캔버스에 드롭
3. 생성된 노드 클릭 → 우측 속성 패널 표시
4. 속성 패널에서 설정:
- **노드명**: `발주 테이블`
- **소스 테이블**: `purchase_order` 선택
- **색상**: 파란색 (#3b82f6)
5. 데이터 소스 타입 컨텍스트 데이터 선택
---
**노드 2: 입고 INSERT 액션**
**화면 조작**:
1. 좌측 팔레트에서 "INSERT 액션" 노드 드래그
2. 캔버스의 발주 테이블 오른쪽에 드롭
3. 노드 클릭 → 우측 속성 패널 표시
4. 속성 패널에서 설정:
- **노드명**: `입고 처리`
- **타겟 테이블**: `receiving`(입고) 선택
- **액션 타입**: INSERT
- **색상**: 초록색 (#22c55e)
---
### 3-3. 노드 연결 및 필드 매핑
**내레이션**:
"소스 테이블과 액션 노드를 연결하고 필드 매핑을 설정합니다."
**화면 조작**:
1. "발주 테이블" 노드의 오른쪽 연결점(핸들)에 마우스 올리기
2. 연결점에서 드래그 시작
3. "입고 처리" 노드의 왼쪽 연결점으로 드래그
4. 연결선 자동 생성됨
5. "입고 처리" (INSERT 액션) 노드 클릭
6. 우측 속성 패널에서 "필드 매핑" 탭 선택
7. 필드 매핑 설정:
| 소스 필드 (발주) | 타겟 필드 (입고) | 비고 |
| ---------------- | ---------------- | ------------- |
| order_no | order_no | 발주번호 복사 |
| item_name | item_name | 품목명 복사 |
| quantity | quantity | 수량 복사 |
| (자동 생성) | receiving_no | 입고번호 |
| (현재 날짜) | receiving_date | 입고일자 |
8. 우측 상단 "저장" 버튼 클릭
9. 성공 메시지: "플로우가 저장되었습니다"
**포인트 강조**:
- 테이블 소스 → 액션 노드 구조
- 필드 매핑으로 데이터 자동 복사 설정
- INSERT 액션으로 새 테이블에 데이터 생성
**참고**:
- `receiving_no`와 `receiving_date`는 자동 생성 필드로 설정
- 같은 이름의 필드는 자동 매핑됨
---
## Part 4: 화면 설계 (2분)
### 4-1. 발주 관리 화면 설계
**화면 조작**:
1. 화면 관리 > 화면 설계 메뉴 접속
2. "발주 관리" 메뉴의 "화면 할당" 클릭
3. "새 화면 생성" 선택
4. 테이블 선택: `purchase_order` (발주)
**화면 구성**:
**전체: 테이블 리스트 컴포넌트 (CRUD 기능 포함)**
1. 컴포넌트 팔레트에서 "테이블 리스트" 드래그
2. 테이블 설정:
- **연결 테이블**: `purchase_order`
- **컬럼 표시**:
| 컬럼 | 표시 | 정렬 가능 | 너비 |
| ---------- | ---- | --------- | ----- |
| order_no | ✓ | ✓ | 150px |
| item_name | ✓ | ✓ | 200px |
| quantity | ✓ | | 100px |
| unit_price | ✓ | | 120px |
3. 기능 설정:
- **조회**: 활성화
- **등록**: 활성화 (신규 버튼)
- **수정**: 활성화
- **삭제**: 활성화
- **페이징**: 10개씩
- **입고 처리 버튼**: 커스텀 액션 추가
4. 입고 처리 버튼 설정:
- **버튼 라벨**: `입고 처리`
- **버튼 위치**: 행 액션
- **연결 플로우**: `발주-입고 프로세스` 선택
- **플로우 액션**: `입고 처리` (Connection에서 정의한 액션)
5. "화면 저장" 버튼 클릭
---
### 4-2. 입고 관리 화면 설계
**화면 조작**:
1. "입고 관리" 메뉴의 "화면 할당" 클릭
2. "새 화면 생성" 선택
3. 테이블 선택: `receiving` (입고)
**화면 구성**:
**전체: 테이블 리스트 컴포넌트 (조회 전용)**
1. 컴포넌트 팔레트에서 "테이블 리스트" 드래그
2. 테이블 설정:
- **연결 테이블**: `receiving`
- **컬럼 표시**:
| 컬럼 | 표시 | 정렬 가능 | 너비 |
| -------------- | ---- | --------- | ----- |
| receiving_no | ✓ | ✓ | 150px |
| order_no | ✓ | ✓ | 150px |
| item_name | ✓ | ✓ | 200px |
| quantity | ✓ | | 100px |
| receiving_date | ✓ | ✓ | 120px |
3. 기능 설정:
- **조회**: 활성화
- **등록**: 비활성화 (플로우로만 데이터 생성)
- **수정**: 비활성화
- **삭제**: 비활성화
- **페이징**: 20개씩
- **정렬**: 입고일자 내림차순
4. "화면 저장" 버튼 클릭
**포인트 강조**:
- 테이블 리스트 컴포넌트로 CRUD 자동 구성
- 발주 화면에는 "입고 처리" 버튼으로 플로우 실행
- 입고 화면은 조회 전용 (플로우로만 데이터 생성)
---
## Part 5: 실행 및 동작 확인 (3분)
### 5-1. 발주 등록
**화면 조작**:
1. 좌측 메뉴에서 "발주 관리" 클릭
2. 화면 구성 확인:
- 테이블 리스트 컴포넌트 (빈 테이블)
- 상단에 "신규" 버튼
3. "신규" 버튼 클릭
4. 입력 모달 창 표시
5. 데이터 입력:
- **발주번호**: PO-001
- **품목명**: 노트북 (LG Gram 17)
- **수량**: 10
- **단가**: 2,000,000
6. "저장" 버튼 클릭
7. 성공 메시지 확인: "저장되었습니다"
8. 결과 확인:
- 테이블에 새 행 추가됨
- 행 우측에 "입고 처리" 버튼 표시됨
**추가 발주 등록 (옵션)**:
9. "신규" 버튼 클릭
10. 2번째 데이터 입력:
- **발주번호**: PO-002
- **품목명**: 모니터 (삼성 27인치)
- **수량**: 5
- **단가**: 300,000
11. "저장" 클릭
12. 테이블에 2개 행 확인
---
### 5-2. 입고 처리 실행 ⭐ (핵심 데모)
**화면 조작**:
1. 발주 테이블에서 첫 번째 행(PO-001 노트북) 확인
2. 행 우측의 **"입고 처리"** 버튼 클릭
3. 확인 대화상자:
- "이 발주를 입고 처리하시겠습니까?"
- **"예"** 클릭
4. 성공 메시지: "입고 처리되었습니다"
---
### 5-3. 자동 데이터 이동 확인 ⭐⭐⭐
**실시간 변화 확인**:
**1) 발주 테이블 자동 업데이트**
- PO-001 항목이 테이블에서 **즉시 사라짐**
- PO-002만 남아있음 (추가로 등록했다면)
**2) 입고 관리 화면으로 이동**
1. 좌측 메뉴에서 **"입고 관리"** 클릭
2. 입고 테이블에 **자동으로 데이터 생성됨**:
| 입고번호 | 발주번호 | 품목명 | 수량 | 입고일자 |
| ---------------- | -------- | ------------------- | ---- | ---------- |
| RCV-20250124-001 | PO-001 | 노트북 (LG Gram 17) | 10 | 2025-01-24 |
3. **데이터 자동 생성 확인**:
- 입고번호: 자동 생성됨 (RCV-20250124-001)
- 발주번호: PO-001 복사됨
- 품목명: 노트북 (LG Gram 17) 복사됨
- 수량: 10 복사됨
- 입고일자: 오늘 날짜 자동 입력
**3) 다시 발주 관리로 돌아가기**
1. 좌측 메뉴 "발주 관리" 클릭
2. PO-001은 여전히 사라진 상태 확인
3. PO-002만 남아있음
**4) 제어 관리에서 확인**
1. 제어 관리 > 플로우 목록 접속
2. "발주-입고 프로세스" 클릭
3. 플로우 현황 확인:
- **발주 완료**: 1건 (PO-002)
- **입고 완료**: 1건 (PO-001)
---
### 5-4. 추가 입고 처리 (옵션)
**화면 조작**:
1. "발주 관리" 화면에서 PO-002 (모니터) 선택
2. "입고 처리" 버튼 클릭
3. 확인 후 입고 완료
4. 최종 확인:
- 발주 관리: 0건 (모두 입고 처리됨)
- 입고 관리: 2건 (PO-001, PO-002)
- 제어 관리 플로우:
- **발주 완료: 0건**
- **입고 완료: 2건**
---
## 시연 마무리 (30초)
**화면 정리 및 요약**:
**보여준 핵심 기능**:
- ✅ **코딩 없이 테이블 생성**: 클릭만으로 DB 테이블 자동 생성
- ✅ **시각적 플로우 구성**: 드래그앤드롭으로 업무 흐름 설계
- ✅ **자동 데이터 이동**: 버튼 클릭 한 번으로 테이블 간 데이터 자동 복사 및 이동
- ✅ **실시간 상태 추적**: 제어 관리에서 플로우 현황 확인
- ✅ **빠른 화면 구성**: 테이블 리스트 컴포넌트로 CRUD 자동 완성
**마지막 화면**:
- 대시보드 또는 시스템 전체 구성도
- 로고 및 연락처 정보
**자막**:
"개발자 없이도 비즈니스 담당자가 직접 업무 시스템을 구축할 수 있습니다."
---
## 시간 배분 요약
| 파트 | 시간 | 주요 내용 |
| -------- | ---------- | ---------------------------- |
| Part 1 | 2분 | 테이블 2개 생성 (발주, 입고) |
| Part 2 | 1분 | 메뉴 2개 생성 |
| Part 3 | 2분 | 플로우 구성 및 연결 설정 |
| Part 4 | 2분 | 화면 2개 디자인 |
| Part 5 | 3분 | 발주 등록 → 입고 처리 실행 |
| 마무리 | 0.5분 | 요약 및 정리 |
| **합계** | **10.5분** | |
---
## 시연 준비사항
### 사전 설정
1. 개발 서버 실행: `http://localhost:9771`
2. 로그인 정보: `wace / qlalfqjsgh11`
3. 데이터베이스 초기화 (테스트 데이터 제거)
### 녹화 설정
- **해상도**: 1920x1080 (Full HD)
- **프레임**: 30fps
- **마우스 효과**: 클릭 하이라이트 활성화
- **배경음악**: 부드러운 BGM (옵션)
- **자막**: 주요 포인트마다 표시
### 시연 팁
- 각 단계마다 2-3초 대기 (시청자 이해 시간)
- 중요한 버튼 클릭 시 화면 확대 효과
- 플로우 위젯 카운트 변화는 빨간색 박스로 강조
- 성공 메시지는 충분히 길게 보여주기 (최소 3초)
- 입고 테이블에 데이터 들어오는 순간 화면 확대
---
## 시연 스크립트 (참고용)
### 오프닝 (10초)
"안녕하세요. 오늘은 ERP-node 시스템의 핵심 기능을 시연하겠습니다. 발주에서 입고까지 데이터가 자동으로 이동하는 과정을 보여드립니다."
### Part 1 (2분)
"먼저 발주와 입고를 관리할 테이블을 생성합니다. 코딩 없이 클릭만으로 데이터베이스 테이블이 자동으로 만들어집니다."
### Part 2 (1분)
"이제 사용자가 접근할 메뉴를 추가합니다. URL만 지정하면 자동으로 라우팅이 연결됩니다."
### Part 3 (2분)
"발주에서 입고로 데이터가 이동하는 흐름을 제어 플로우로 정의합니다. 두 테이블을 연결하고 버튼을 누르면 자동으로 데이터가 복사 및 이동하도록 설정합니다."
### Part 4 (2분)
"실제 사용자가 볼 화면을 디자인합니다. 테이블 리스트 컴포넌트를 사용하면 CRUD 기능이 자동으로 구성되고, 각 행에 입고 처리 버튼을 추가하여 플로우를 실행할 수 있습니다."
### Part 5 (3분)
"이제 실제로 작동하는 모습을 보겠습니다. 발주를 등록하고... (데이터 입력) 저장하면 테이블에 추가됩니다. 입고 처리 버튼을 누르면... (클릭) 발주 테이블에서 데이터가 사라지고 입고 테이블에 자동으로 생성됩니다!"
### 클로징 (10초)
"이처럼 ERP-node는 코딩 없이 비즈니스 로직을 구현할 수 있는 노코드 플랫폼입니다. 감사합니다."
---
## 체크리스트
### 시연 전
- [ ] 개발 서버 실행 확인
- [ ] 로그인 테스트
- [ ] 기존 테스트 데이터 삭제
- [ ] 브라우저 창 크기 조정 (1920x1080)
- [ ] 녹화 프로그램 설정
- [ ] 마이크 테스트
- [ ] 시나리오 1회 이상 리허설
### 시연 중
- [ ] 천천히 명확하게 진행
- [ ] 각 단계마다 결과 확인
- [ ] 플로우 위젯 카운트 강조
- [ ] 입고 테이블 데이터 자동 생성 강조
### 시연 후
- [ ] 녹화 파일 확인
- [ ] 자막 추가 (필요 시)
- [ ] 배경음악 삽입 (옵션)
- [ ] 인트로/아웃트로 편집
- [ ] 최종 영상 검수
---
## 추가 개선 아이디어
### 시연 버전 2 (고급)
- 발주 승인 단계 추가 (발주 요청 → 승인 → 입고)
- 입고 수량 불일치 처리 (일부 입고)
- 대시보드에서 통계 차트 표시
### 시연 버전 3 (실전)
- 실제 업무: 구매 요청 → 견적 → 발주 → 입고 → 검수
- 권한 관리: 요청자, 승인자, 구매담당자 역할 분리
- 알림: 각 단계 변경 시 담당자에게 알림
---
**작성일**: 2025-01-24
**버전**: 1.0
**작성자**: AI Assistant
Reference in New Issue View Git Blame Copy Permalink