20a429eecb97c500b842df17693bfaec45a7bbad
사용자 검증으로 발견된 5가지 함정 일괄 정정.
(1) ebom-search 검색폼 운영판 1:1 — wace structureAscendingList.jsp 노출 필드만:
- 제거: 프로젝트 OBJID (raw input), UNIT_CODE (raw input)
운영판도 고객사/프로젝트번호/유닛명 모두 주석 처리되어 노출 안 됨
- 유지: 품번 / 품명 / 표시 레벨 (1~5 select)
- BomTreeFilter.search_level 추가 + ascending/descending CTE 에 T.lev <= $search_level::int
(2) 품번/품명 자동완성 (wace select2-part 1:1):
- 영업관리 PartSelect 는 item_info 마스터 기반 → 개발관리(part_mng)용 별도 컴포넌트 신설
- backend GET /api/development/part/options : IS_LAST='1' part_mng 전체 (영업관리 sales/parts 패턴)
- frontend DevPartSelect.tsx : SmartSelect 캐시 + mode partNo/partName 분리
- ebom-search 페이지 단순 Input → DevPartSelect 교체
- 품번 선택 시 품명 자동 채움 / 품명 선택 시 품번 자동 채움 (운영판 select2-part 1:1)
(3) BomReportStatusDialog 운영판 1:1 재작성 — wace structureStatusChangePopup.jsp:
- 잘못된 점: read-only 박스 + 상태 select(create/changeDesign/deploy 3옵션)
- 정정: 5필드 모두 편집 가능 (CommCodeSelect 제품구분 / 품번 input / 품명 input /
Version input / 상태 Y/N 라디오) — 운영 매퍼 updateStructureStatus 5컬럼 UPDATE 1:1
- 헤더 파란 바 + 4컬럼 테이블(25%/75%) + 저장/닫기 중앙 배치 (운영판 스타일 1:1)
(4) DataGrid id 매핑 — 체크박스 ID 키 불일치 함정:
- DataGrid 는 row.id 로 체크박스 ID 관리, 백엔드 응답은 row.objid (postgres lowercase)
- 결과: checkedIds[0] 가 undefined → 상태변경/수정/삭제 다이얼로그가 objid=undefined 로 열려
detail 호출 안 됨 → 빈 폼 표시 (사용자 지적 "기본 정보 표시 안됨")
- 일괄 수정 (3 페이지) : ebom-regist / part-regist / part-search
gridRows = useMemo(() => rows.map(r => ({ ...r, id: r.objid })), [rows])
영업관리 페이지 동일 패턴 1:1
(5) STATUS_TITLE 매핑 운영판 1:1 — 운영 그리드는 'Y'/'N' 글자 그대로 표시:
CASE UPPER(T.STATUS)
WHEN 'CREATE' THEN '등록중'
WHEN 'CHANGEDESIGN' THEN '설계변경미배포'
WHEN 'DEPLOY' THEN '배포완료'
ELSE COALESCE(T.STATUS, '') END AS STATUS_TITLE
- 운영 매퍼는 ELSE '' 이지만 RPS 는 raw fallback (사용자 화면에서 식별 가능)
- 'Y'/'N' 매핑 라벨 추가 → 운영 스크린샷 확인 후 제거 (운영판은 raw)
미해결 (별 작업):
- 확정일 (DEPLOY_DATE) 표시 — 운영판은 별도 "배포" 액션 (deployBomReport 매퍼) 으로 채움.
RPS ebom-regist 에 배포 버튼 미구현 → 신규 BOM 확정일 빈값. 별 PR.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
WACE 솔루션 (ERP/PLM)
프로젝트 개요
본 프로젝트는 WACE ERP/PLM(Product Lifecycle Management) 솔루션입니다. Node.js + Next.js 기반 풀스택 웹 애플리케이션으로, 멀티테넌시를 지원합니다.
주요 특징
- 모던 프론트엔드: Next.js (App Router) + TypeScript + shadcn/ui
- Node.js 백엔드: Express + TypeScript + PostgreSQL
- 반응형 디자인: 데스크톱, 태블릿, 모바일 모든 기기 지원
- 멀티테넌시: 회사별 데이터 격리 (company_code 기반)
- Docker 기반 배포: 개발/운영 환경 일관성 보장
- 타입 안전성: TypeScript로 런타임 에러 방지
기술 스택
Frontend
- 프레임워크: Next.js (App Router, Turbopack)
- 언어: TypeScript
- UI 라이브러리: shadcn/ui + Radix UI
- 스타일링: Tailwind CSS
- 상태 관리: TanStack Query + React Context
- 아이콘: Lucide React
Backend
- 런타임: Node.js 20+
- 프레임워크: Express 4
- 언어: TypeScript
- 데이터베이스: PostgreSQL (pg 드라이버)
- 인증: JWT (jsonwebtoken) + bcryptjs
- 로깅: Winston
개발 도구
- 컨테이너화: Docker + Docker Compose
- 코드 품질: ESLint + Prettier
- 테스트: Jest + Supertest
- 백엔드 핫리로드: nodemon
- CI/CD: Jenkins
프로젝트 구조
ERP-node/
├── backend-node/ # Express + TypeScript 백엔드
│ ├── src/
│ │ ├── app.ts # 엔트리포인트
│ │ ├── controllers/ # API 컨트롤러
│ │ ├── services/ # 비즈니스 로직
│ │ ├── middleware/ # 인증, 에러처리 미들웨어
│ │ ├── routes/ # 라우터
│ │ └── config/ # DB 연결 등 설정
│ └── package.json
├── frontend/ # Next.js 프론트엔드
│ ├── app/ # App Router 페이지
│ ├── components/ # React 컴포넌트
│ │ ├── ui/ # shadcn/ui 기본 컴포넌트
│ │ ├── admin/ # 관리자 컴포넌트
│ │ ├── screen/ # 화면 디자이너
│ │ └── v2/ # V2 컴포넌트
│ ├── lib/ # 유틸리티, API 클라이언트
│ ├── hooks/ # Custom React Hooks
│ └── package.json
├── db/ # 데이터베이스
│ └── migrations/ # 순차 마이그레이션 SQL
├── docker/ # Docker 설정 (dev/prod/deploy)
├── scripts/ # 개발/배포 스크립트
├── docs/ # 프로젝트 문서
├── Dockerfile # 프로덕션 멀티스테이지 빌드
├── Jenkinsfile # CI/CD 파이프라인
└── .cursorrules # AI 개발 가이드
빠른 시작
1. 필수 요구사항
- Node.js: 20.10+
- PostgreSQL: 데이터베이스 서버
- npm: 10.0+
2. 개발 환경 실행
# 백엔드 (nodemon으로 자동 재시작)
cd backend-node && npm install && npm run dev
# 프론트엔드 (Turbopack)
cd frontend && npm install && npm run dev
3. Docker 환경 실행
# 백엔드 + 프론트엔드 (개발)
docker-compose -f docker-compose.backend.win.yml up -d
docker-compose -f docker-compose.frontend.win.yml up -d
# 프로덕션 배포
docker-compose -f docker/deploy/docker-compose.yml up -d
4. 서비스 접속
| 서비스 | URL | 설명 |
|---|---|---|
| 프론트엔드 | http://localhost:9771 | Next.js 사용자 인터페이스 |
| 백엔드 API | http://localhost:8080 | Express REST API |
주요 기능
1. 사용자 및 권한 관리
- 사용자 계정 관리 (CRUD)
- 역할 기반 접근 제어 (RBAC)
- 부서/조직 관리
- 멀티테넌시 (회사별 데이터 격리)
2. 메뉴 및 화면 관리
- 동적 메뉴 구성
- 화면 디자이너 (드래그앤드롭)
- V2 컴포넌트 시스템
3. 플로우(워크플로우) 관리
- 비즈니스 프로세스 정의
- 데이터 흐름 관리
- 감사 로그
4. 제품/BOM 관리
- BOM 구성 및 버전 관리
- 제품 정보 관리
5. 기타
- 파일/문서 관리
- 메일 연동
- 외부 DB 연결
- 번호 채번 규칙
환경 변수
# backend-node/.env
DATABASE_URL=postgresql://postgres:password@localhost:5432/dbname
JWT_SECRET=your-jwt-secret
JWT_EXPIRES_IN=24h
PORT=8080
CORS_ORIGIN=http://localhost:9771
# frontend/.env.local
NEXT_PUBLIC_API_URL=http://localhost:8080/api
배포
프로덕션 빌드
# 멀티스테이지 Docker 빌드 (백엔드 + 프론트엔드)
docker build -t wace-solution .
CI/CD
Jenkins 파이프라인 (Jenkinsfile)으로 자동 빌드 및 배포가 설정되어 있습니다.
코드 컨벤션
- TypeScript: 엄격한 타입 정의 사용
- ESLint + Prettier: 일관된 코드 스타일
- shadcn/ui: UI 컴포넌트 표준
- API 클라이언트:
frontend/lib/api/전용 클라이언트 사용 (fetch 직접 사용 금지) - 멀티테넌시: 모든 쿼리에 company_code 필터링 필수
Description
Languages
TypeScript
98.2%
PLpgSQL
0.7%
JavaScript
0.5%
CSS
0.3%
HTML
0.2%
Other
0.1%