각 프레임은 데스크톱 웹 페이지의 레이아웃·핵심 영역·주요 컴포넌트 배치를 로우파이로 나타냅니다. 색·실데이터·정밀 시안 아님. 표 안 예시값은 DE22-1 ui-sketch 샘플입니다.

SCR-PM-001자재 목록

원자재/부자재 탭 전환 · 검색·필터 · 목록 테이블에서 등록/복사/Excel 및 행 클릭으로 상세 진입 (권한 ROLE_PM_VIEWER 이상)

진입 — 사이드바 [자재관리] 메뉴 진입 / 헤더 ⌘K 글로벌 검색으로 진입

  1. 자재 유형 탭 — 원자재/부자재 전환. 탭에 따라 목록·필터 카테고리 세트와 코드 접두어(원자재 R-01·부자재 R-02 등)가 달라진다.
  2. 검색 — 자재코드·자재명 부분일치 검색. Enter 또는 [검색] 시 목록 조회 파라미터로 전달된다.
  3. 필터 패널(토글) — 카테고리(6종)·단위 조건은 서버 필터 적용 중, 등록일 범위·규격은 BE 확장 대기(IF-PM-MAT-001, ISS-0060 3단계 미결정)로 조건을 겹쳐 적용해 목록을 좁힌다.
  4. 액션 버튼 — [+ 자재 등록](빈 폼 SCR-PM-002)·[복사 등록](선택 행 프리필)·[단가 묶음 등록]·[Excel 다운로드]. 등록은 ROLE_PM_EDITOR 이상만 노출. [단가 묶음 등록]은 고른 자재 여러 건에 거래처 하나·기간을 한 번 매기고 단가는 자재 줄마다 받는다 — 고른 자재가 없으면 비활성이고 정본은 SCR-PM-006 R-PM006-BULK-PRICE 다(#1708). [Excel 업로드]는 BE 인프라 이슈(ISS-0061) 해소 전까지 비활성(준비중) 표시.
  5. 목록 테이블 — 자재코드 정렬(▲), 행 클릭 시 자재 상세(SCR-PM-003) 진입, 좌측 체크박스로 다중 선택(복사·삭제 대상 지정).
  6. 페이지네이션 — 서버 페이징. 페이지 이동 + 페이지당 표시 개수(20/50/100) 선택.
관련 API Swagger UI ↗
  • GET/api/pm/materials — 목록 조회(원/부자재 탭·검색·필터·페이징)
  • GET/api/cm/codes — 필터 옵션(카테고리 6종·단위) 코드 조회
  • GET/api/pm/materials/export — Excel 다운로드
  • POST/api/pm/materials/import — Excel 업로드
자재관리  ›  자재 목록
CMD+K 검색
탭 · 검색 · 필터바
1원자재부자재
2자재코드/자재명 검색 검색 필터 ▾

3필터 패널(토글): 카테고리(6종) · 단위 — 서버 필터 적용 / 등록일 범위 · 규격 — BE 확장 대기 (IF-PM-MAT-001, ISS-0060 3단계 미결정)

액션 버튼
4+ 자재 등록 복사 등록 단가 묶음 등록 Excel 다운로드 Excel 업로드 (준비중)
5목록 테이블 (행 클릭 → 상세)
자재코드 ▲자재명카테고리규격단위수정일
R-01-00001상틀 알루미늄PROFILEW×60×70EA04.05
R-02-00012로이유리 복층GLASS5+12A+5EA04.03
R-01-00023하틀 알루미늄PROFILEW×60×70EA03.28
6페이지네이션
123… / 8 20개/페이지
SCR-PM-002자재 등록

자재 유형 선택 후 기본 정보 입력 · 카테고리별 전용 섹션(PROFILE·부자재) · 저장 (권한 ROLE_PM_EDITOR 이상, 복사 등록 프리필 지원)

진입 — SCR-PM-001 [+ 자재 등록] 또는 [복사 등록] / 사이드바 > 자재관리 > 자재 등록(직접 메뉴)

  1. 자재 유형 선택 — 원자재/부자재 라디오 선택. 선택값에 따라 카테고리 후보 세트와 아래 조건부 섹션(③④) 노출이 달라진다.
  2. 기본 정보 폼 — 자재코드는 입력 즉시 중복확인하며 ✅ 사용 가능 / ❌ 활성 자재와 중복 / ♻️ 휴지통 자재와 중복(→ [복원] 버튼으로 기존 자재 복원) 3상태로 분기한다(R-MAT-TRASH-RESTORE). 자재명·규격·단위·카테고리를 입력하고, SCR-PM-001의 [복사 등록]으로 진입하면 원본 자재값이 프리필된다.
  3. PROFILE 전용 섹션 — 카테고리가 PROFILE일 때만 노출. 다이스 코드·단위 중량(kg/m)을 입력한다.
  4. 부자재 전용 섹션 — 자재 유형이 부자재일 때만 노출. 용도·용량 단위(필수)·사양·보관 방법을 입력한다.
  5. 추가 정보 — 비고 텍스트와 이미지(JPG/PNG, 5MB 이하) 업로드.
  6. 거래처·단가 안내 — 거래처·구매 단가는 이 화면에서 입력하지 않고, 등록 완료 후 상세 화면의 [거래처 매핑] 탭에서 별도 연결한다.
  7. 저장/취소 액션 — [저장] 시 신규 자재로 등록되고 상세(SCR-PM-003)로 이동, [취소] 시 목록(SCR-PM-001)으로 복귀.
관련 API Swagger UI ↗
  • GET/api/pm/materials — 자재 코드 중복확인(code, exists 쿼리, debounce 300ms)
  • POST/api/pm/materials — 신규 자재 등록 저장
  • POST/api/pm/materials/{itemCode}/restore — 휴지통 자재와 코드 충돌 시 복원(설계문서에만 명세, 화면 미반영)
  • POST/api/external/s3/presign — 자재 대표 이미지 업로드(R-PM-003-IMAGE)는 공용 S3 presigned URL 발급을 재사용한다(전용 자재 이미지 엔드포인트 불필요, #413). 업로드 후 자재의 imageUrl 을 세팅한다.
자재관리  ›  자재 등록
CMD+K 검색
1자재 유형 선택
자재 유형 * 원자재 부자재
2기본 정보 폼
자재 코드 *R-01-_____중복확인✅ 사용 가능

3상태 분기: ✅ 사용 가능 · ❌ 활성 자재와 중복 · ♻️ 휴지통 자재와 중복 → [복원] 버튼 노출 (R-MAT-TRASH-RESTORE v1.7-r21)

자재명 *자재명 입력
규격 *규격 입력
단위 *EA
카테고리 *선택 (PROFILE / GLASS / HARDWARE / …)
3PROFILE 전용 (카테고리=PROFILE 시)
다이스 코드DHS-AE225-D-1
단위 중량0.000kg/m
4부자재 전용 (자재 유형=부자재 시)
용도 * 용량 단위 * 사양 보관 방법
5추가 정보
비고비고 입력
이미지파일 선택 + 미리보기
(JPG/PNG · 5MB 이하)
6거래처·구매 단가는 등록 후 [거래처 매핑]에서 별도 등록합니다. (FR-PM-003)
7액션
취소저장
SCR-PM-003자재 상세 / 수정 · [기본정보] 탭

자재 마스터 조회·수정 (자재 코드 수정 불가) · 이미지 조회/교체/삭제 · BOM 미포함 시만 삭제 활성 (조회 VIEWER / 수정 EDITOR)

진입 — SCR-PM-001 [행 클릭]

  1. 탭 바 — 기본정보/거래처 매핑/BOM 사용처/변경이력 4탭 전환. 현재 탭은 [기본정보].
  2. 상세 폼 · 기본 정보 — 자재코드는 수정 불가(배지 표시)로 고정하고, 자재명·규격·단위·카테고리는 편집 가능하다.
  3. PROFILE 전용 섹션 — 카테고리가 PROFILE인 자재만 다이스 코드·단위 중량을 노출·편집한다.
  4. 비고 · 이미지 · 감사 정보 — 이미지 조회/교체/삭제, 하단에 등록자·수정자 감사 정보(일시 포함)를 표시한다.
  5. 삭제/취소/저장 액션 — [삭제]는 이 자재가 BOM에 포함되지 않은 경우만 활성화된다(본 예시는 [BOM 사용처] 탭 기준 4건 포함이라 비활성 표시). [취소]/[저장]으로 폼을 종료한다.
관련 API Swagger UI ↗
  • GET/api/pm/materials/{itemCode} — 자재 상세 조회
  • PUT/api/pm/materials/{itemCode} — 기본정보 수정 저장
  • DELETE/api/pm/materials/{itemCode} — 삭제(soft delete) — BOM 미포함 시만 활성
  • POST/api/external/s3/presign — SCR-PM-002와 동일하게 이미지 교체는 공용 S3 presigned URL 발급을 재사용한다(전용 엔드포인트 불필요, #413). 업로드 후 자재의 imageUrl 을 갱신한다.
자재관리  ›  자재 상세 · 기본정보
CMD+K 검색
1기본정보거래처 매핑BOM 사용처변경이력
2상세 폼 · 기본 정보
자재 코드R-01-00001수정 불가
자재 유형원자재
자재명 *상틀 알루미늄
규격 *W×60×70×1.2t
단위 *EA
카테고리 *PROFILE
3PROFILE 전용
다이스 코드DHS-AE225-D-1
단위 중량1.250kg/m
4비고 · 이미지 · 감사 정보
비고표준 상틀 자재
이미지현재 이미지 미리보기
클릭하여 교체
이미지 삭제

등록자 김진호 (2026-04-01 09:30)
수정자 박영희 (2026-04-05 14:12)
5액션 (BOM 포함 시 삭제 비활성)
삭제취소저장
SCR-PM-003자재 상세 / 수정 · [기본정보] 탭 — ROLE_PM_VIEWER 읽기 전용 변형

ROLE_PM_VIEWER 진입 시 화면 전체가 읽기 전용으로 동작 — 입력 필드 비활성, [저장]·[삭제] 버튼 숨김, [목록으로]만 노출 (R-PM-003-VIEWER-UI)

진입 — SCR-PM-001 [행 클릭] (ROLE_PM_VIEWER 권한으로 진입 시 읽기 전용 변형)

  1. 탭 바 — 4탭 모두 열람 가능하다(조회만). [거래처 매핑]·[BOM 사용처]·[변경이력] 탭 내부의 수정 액션([+ 거래처 추가]·[신규 단가 등록] 등)도 동일하게 비활성·숨김 처리된다.
  2. 읽기 전용 폼 — 자재명·규격·단위·카테고리 등 [기본정보] 탭의 모든 입력 필드를 비활성(disabled) 처리한다. 값은 표시되나 편집할 수 없다.
  3. PROFILE 전용 섹션 — 다이스 코드·단위 중량도 동일하게 비활성 표시로 조회만 가능하다.
  4. 비고 · 이미지 · 감사 정보 — 이미지는 미리보기 조회만 가능하고 교체·삭제 버튼은 숨긴다. 등록자·수정자 감사 정보는 EDITOR 화면과 동일하게 노출한다.
  5. 액션 영역 — [저장]·[삭제] 버튼을 숨기고 [목록으로](ghost) 버튼만 노출한다.
관련 API Swagger UI ↗
  • GET/api/pm/materials/{itemCode} — 자재 상세 조회 (VIEWER: PUT/DELETE 미노출·미호출)
자재관리  ›  자재 상세 · 기본정보 (VIEWER)
CMD+K 검색
1기본정보거래처 매핑BOM 사용처변경이력
2읽기 전용 폼 · 기본 정보 (입력 필드 전체 비활성)
자재 코드R-01-00001수정 불가
자재 유형원자재
자재명상틀 알루미늄
규격W×60×70×1.2t
단위EA
카테고리PROFILE
3PROFILE 전용 (비활성)
다이스 코드DHS-AE225-D-1
단위 중량1.250kg/m
4비고 · 이미지 · 감사 정보 (교체·삭제 버튼 숨김)
비고표준 상틀 자재
이미지현재 이미지 미리보기
(조회 전용)

등록자 김진호 (2026-04-01 09:30)
수정자 박영희 (2026-04-05 14:12)
5액션 ([저장]·[삭제] 숨김 — [목록으로]만 노출)
목록으로
SCR-PM-003자재 상세 / 수정 · [거래처 매핑] 탭

거래처-자재 매핑 인라인 5컬럼(상태·거래처·별칭·단가·적용 기간) · 행 클릭 시 단가 이력 아코디언 · 신규 단가 등록 (전체 9컬럼은 SCR-PM-006)

진입 — SCR-PM-001 [행 클릭] 후 [거래처 매핑] 탭 전환

  1. 탭 바 — 4탭 중 현재 [거래처 매핑] 탭이 활성 상태다.
  2. 매핑 목록(인라인 5컬럼) — 상태·거래처·별칭·단가·적용기간을 축약 표시. 행 클릭 시 아래 ④ 단가 이력 아코디언이 펼쳐진다.
  3. [+ 거래처 추가] 버튼 — 신규 거래처-자재 매핑 등록 폼을 연다.
  4. 단가 이력 아코디언 — 선택한 거래처의 최근 5건 단가 변경 이력을 펼쳐 보여주며, 현재 유효한 단가 행은 강조 표시한다(정본 규칙: 배경 #E8F5E9 연두+볼드, 본 로우파이는 그레이스케일 회색 볼드로 대체).
  5. 신규 단가 등록 — 단가·적용 시작일·변경 사유를 입력해 [등록]하면 단가 이력에 새 행이 쌓인다.
관련 API Swagger UI ↗
  • GET/api/pm/items/{itemCode}/partners — 거래처 매핑 인라인 5컬럼 목록 조회
  • POST/api/pm/items/{itemCode}/partners — [+ 거래처 추가] 신규 매핑 등록
  • GET/api/pm/items/{itemCode}/partners/{partnerMaterialId}/prices — 단가 이력 아코디언(최근 5건) 조회
  • POST/api/pm/items/{itemCode}/partners/{partnerMaterialId}/prices — 신규 단가 등록
자재관리  ›  자재 상세 · 거래처 매핑
CMD+K 검색
기본정보1거래처 매핑BOM 사용처변경이력
2매핑 목록 (인라인 5컬럼 · 행 클릭 → 아코디언)
거래처 매핑3+ 거래처 추가
상태거래처별칭단가적용 기간
🟢 유효가공소AGA-TOP-A12,500 / EA2026-04-01 ~ (현재)
🟢 유효동신테크DST-PCS-100📦 8,500 / 박스(100 EA) → 85 / EA2026-04-15 ~ (현재)
⚪ 종료가공소B ⚠ 비활성11,800 / EA2026-03-01 ~ 2026-05-31
4단가 이력 아코디언 (▼ 가공소A · 최근 5건)
적용시작적용종료이전단가변경단가변경사유
2026-04-01(현재)12,00012,500원자재 인상
2026-01-152026-03-3111,80012,000분기 조정

유효 단가 행 강조 — 정본 규칙은 배경 #E8F5E9(연두)+볼드, 본 로우파이는 그레이스케일로 대체(회색 볼드) 표기 · 최근 5건만 표시 — 전체 이력은 SCR-PM-006 으로 이동

5신규 단가 등록
단가 2026-05-01 📅 변경 사유 등록
SCR-PM-003자재 상세 / 수정 · [BOM 사용처] 탭

이 자재를 참조하는 BOM 목록(제품·유형·버전·상태) · 필터(EBOM/MBOM·상태·검색) · 행 클릭 시 BOM 트리(SCR-PM-013) · 비페이징(전건 로드)

진입 — SCR-PM-001 [행 클릭] 후 [BOM 사용처] 탭 전환

  1. 탭 바 — 4탭 중 현재 [BOM 사용처] 탭이 활성 상태다.
  2. BOM 사용처 헤더 — 이 자재를 사용하는 BOM 건수("총 N건")를 표시한다.
  3. 삭제 비활성 안내 — 이 자재가 포함된 BOM이 존재하면 [기본정보] 탭의 [삭제] 버튼이 비활성됨을 알린다.
  4. 필터바 — BOM 유형(자재구성/공정구성)·상태·제품코드/제품명 검색으로 목록을 좁힌다.
  5. BOM 사용처 테이블 — 행 클릭 시 해당 제품의 BOM 트리(SCR-PM-013)로 이동. 자재당 사용처가 통상 20건 이하라 비페이징 전건 로드다.
관련 API Swagger UI ↗
  • GET/api/pm/materials/{itemCode}/bom-usage — BOM 사용처 목록 조회(BOM유형/상태/제품 검색 필터, 비페이징 전건 로드)
자재관리  ›  자재 상세 · BOM 사용처
CMD+K 검색
기본정보거래처 매핑1BOM 사용처변경이력
2BOM 사용처총 4건
3본 자재가 포함된 BOM이 존재하므로 [기본정보] 탭의 [삭제] 버튼은 비활성됩니다.
4필터바
전체 (자재구성/공정구성) 전체 상태 제품코드/제품명 검색 검색
5BOM 사용처 테이블 (행 클릭 → SCR-PM-013 트리)
제품코드제품명BOM 유형버전상태최종변경
P-W-0001이중창 표준형 1200×1500자재구성(EBOM)v3🟢 RELEASED2026-04-10
P-W-0001이중창 표준형 1200×1500공정구성(MBOM)v2🟢 RELEASED2026-04-12
P-W-0007단창 슬라이딩 900×1200자재구성(EBOM)v1🟡 DRAFT2026-04-22
P-W-0015PW 시스템창 1500×1800자재구성(EBOM)v2⚪ DEPRECATED2026-02-08

비페이징(전건 로드) — 자재당 통상 20건 이하 (§00 5.7 패턴)

SCR-PM-003자재 상세 / 수정 · [변경이력] 탭

마스터 필드 변경 이력(일시·변경자·필드·변경 전/후) · 기간·변경자 필터 · Excel 다운로드 · 기본 최근 20건

진입 — SCR-PM-001 [행 클릭] 후 [변경이력] 탭 전환

  1. 탭 바 — 4탭 중 현재 [변경이력] 탭이 활성 상태다.
  2. 변경 이력 헤더 — 기본값으로 "최근 20건 표시"임을 안내한다.
  3. 필터바 — 기간(시작~종료)·변경자를 선택해 [조회]하고, [Excel 다운로드]로 결과를 내려받는다.
  4. 변경 이력 테이블 — 변경일시·변경자·필드·변경 전/변경 후 값을 행 단위로 나열한다.
  5. 페이지네이션 — 서버 페이징. 페이지 이동과 페이지당 표시 개수(20/50/100)를 선택한다.
관련 API Swagger UI ↗
  • GET/api/pm/materials/{itemCode}/history — 변경이력 조회(기간·변경자 필터, 페이징)
  • GET/api/pm/materials/{itemCode}/history/export — 변경이력 Excel 다운로드
자재관리  ›  자재 상세 · 변경이력
CMD+K 검색
기본정보거래처 매핑BOM 사용처1변경이력
2변경 이력최근 20건 표시
3필터바
기간 2026-01-01 ~ 2026-04-29 변경자 전체 조회 Excel 다운로드
4변경 이력 테이블
변경일시변경자필드변경 전변경 후
2026-04-05 14:12박영희규격W×60×70W×60×70×1.2t
2026-04-05 14:12박영희비고(공백)표준 상틀 자재
2026-04-03 10:25김진호자재명상틀 알루(임시)상틀 알루미늄
2026-04-01 09:30김진호(신규 등록)자재 마스터 생성
5페이지네이션
1/ 1 20개/페이지