포트폴리오
웹, ERPTOVLAB 자체 구현 ShowcaseFEATURED
FactoryOne 제조 업무 흐름 Showcase
오더·자재·공정 단계를 확인하고 계획을 조정하는 업무 화면을 구현한 TOVLAB 자체 제작 Showcase입니다. 오더·공정 값은 포트폴리오 시연용 fixture입니다.
프로젝트 화면
PC 화면
2모바일 웹
1주요 기능
오더 현황 카드자재·납기 상태 분류상태 필터작업지시 목록다음 단계 선택 UI예외 처리 UI
구축 내용
실제 개발 범위에 포함된 주요 작업입니다.
주요 구현 범위
- 오더별 자재·납기·예외 상태를 보여 주는 계획 화면
- 작업지시 상태를 분류하고 다음 단계 또는 예외 처리를 선택하는 현장 화면
- 모바일 작업지시 레이아웃과 테마 전환
기술 스택
Next.js 16 (App Router)React 19TypeScriptTailwind CSS 4React Context APIuseReducerlocalStorageESLint 9
작업 배경과 확인한 문제
- 사용자가 현재 상태와 다음 조치를 확인할 수 있도록 화면을 구성했습니다.
- 화면에 보이는 값은 포트폴리오 시연용 fixture로 분리했습니다.
진행 결과
- 이 항목은 TOVLAB 자체 구현 Showcase입니다. 이미지에 보이는 항목과 수치는 UI와 상태 흐름을 확인하기 위한 포트폴리오 fixture입니다.
우선 적용 범위
- 오더 현황 카드
- 자재·납기 상태 분류
- 상태 필터
- 작업지시 목록
이후 확장 방향
- 실제 BOM·재고 데이터 연동
- 작업자 권한과 이력 저장
- 설비·품질 데이터 연결
유사하게 적용할 수 있는 경우
- 상태 확인과 다음 조치 UI가 필요한 업무 화면
- 필터·선택·검토 단계를 가진 웹 서비스
상담 전에 정리하면 좋은 내용
- 확인할 상태와 다음 조치 규칙
- 실제 데이터·권한·연동의 범위
- 모바일에서 우선할 업무 흐름