feat: BOM 관리 시스템 대폭 개선 및 Docker 배포 가이드 추가

- 🎨 UI/UX 개선: 데본씽크 스타일 모던 디자인 적용
- 📁 컴포넌트 구조 개선: 폴더별 체계적 관리 (common/, bom/, materials/)
- 🔧 BOM 관리 페이지 리팩토링: NewMaterialsPage → BOMManagementPage + 카테고리별 컴포넌트 분리
- 💾 구매신청 기능 개선: 선택된 자재 비활성화, 제목 편집, 엑셀 다운로드
- 📊 자재 표시 개선: 타입/서브타입 컬럼 정리, 상세 정보 복원
- 🐛 CSS 빌드 오류 수정: NewMaterialsPage.css 문법 오류 해결
- 📚 문서화: PAGES_GUIDE.md 추가, README에 Docker 캐시 문제 해결 가이드 추가
- 🔄 API 개선: 구매신청 자재 조회, 제목 수정 엔드포인트 추가

frontend/README.md

@@ -50,40 +50,95 @@ uvicorn app.main:app --reload
 frontend/
 ├── src/
 │   ├── components/
-│   │   ├── Dashboard.jsx       # 대시보드
-│   │   ├── FileUpload.jsx      # 파일 업로드
-│   │   ├── MaterialList.jsx    # 자재 목록
-│   │   └── ProjectManager.jsx  # 프로젝트 관리
-│   ├── App.jsx                 # 메인 앱
-│   ├── main.jsx               # 엔트리 포인트
-│   └── index.css              # 전역 스타일
+│   │   ├── common/             # 공통 컴포넌트
+│   │   ├── bom/               # BOM 관련 컴포넌트
+│   │   │   ├── materials/     # 카테고리별 자재 뷰
+│   │   │   └── shared/        # BOM 공통 컴포넌트
+│   │   └── ...                # 기타 컴포넌트
+│   ├── pages/                 # 페이지 컴포넌트
+│   │   ├── DashboardPage.jsx  # 메인 대시보드
+│   │   ├── BOMManagementPage.jsx # BOM 관리
+│   │   ├── PurchaseRequestPage.jsx # 구매신청 관리
+│   │   └── ...                # 기타 페이지들
+│   ├── App.jsx                # 메인 앱
+│   ├── main.jsx              # 엔트리 포인트
+│   └── index.css             # 전역 스타일
+├── PAGES_GUIDE.md            # 📋 페이지 역할 가이드
 ├── package.json
 └── vite.config.js
 ```
 
-## 🎯 주요 컴포넌트
+## 📋 페이지 가이드
 
-### Dashboard
-- 프로젝트 통계 및 현황 표시
-- 최근 활동 목록
-- 실시간 데이터 업데이트
+**모든 페이지의 역할과 기능은 [`PAGES_GUIDE.md`](./PAGES_GUIDE.md)에 상세히 문서화되어 있습니다.**
 
-### FileUpload
-- 드래그&드롭 인터페이스
-- Excel 파일 검증
-- 업로드 진행률 표시
-- 배치 파일 처리
+### 🔄 페이지 개발 규칙
 
-### MaterialList
-- 페이지네이션이 있는 데이터 그리드
-- 실시간 검색 및 필터링
-- CSV 내보내기
-- 정렬 및 컬럼 관리
+1. **새 페이지 생성 시 `PAGES_GUIDE.md` 업데이트 필수**
+2. **페이지 역할, 기능, 라우팅, 접근 권한을 명확히 문서화**
+3. **관련 컴포넌트와의 연관성 설명**
+4. **디자인 시스템 준수 (데본씽크 스타일, 글래스모피즘)**
 
-### ProjectManager
-- 프로젝트 CRUD 작업
-- 카드 형태의 프로젝트 표시
-- 모달 기반 편집
+### ⚠️ **Docker 배포 시 주의사항**
+
+**프론트엔드 변경사항이 반영되지 않을 때:**
+
+```bash
+# 1. 프론트엔드 컨테이너 완전 재빌드 (캐시 문제 해결)
+docker-compose stop frontend
+docker-compose rm -f frontend
+docker-compose build --no-cache frontend
+docker-compose up -d frontend
+
+# 2. 배포 후 index 파일 버전 확인
+docker exec tk-mp-frontend find /usr/share/nginx/html -name "index-*.js"
+
+# 3. 로컬 빌드 버전과 비교
+ls -la frontend/dist/assets/index-*.js
+```
+
+**주의:** Docker 컨테이너는 이전 빌드를 캐시할 수 있어 최신 변경사항이 반영되지 않을 수 있습니다. 
+변경사항이 보이지 않으면 반드시 `--no-cache` 옵션으로 재빌드하세요.
+
+### 🚀 **빠른 배포 명령어**
+
+```bash
+# 프론트엔드 빠른 재배포 (한 줄 명령어)
+docker-compose stop frontend && docker-compose rm -f frontend && docker-compose build --no-cache frontend && docker-compose up -d frontend
+
+# 전체 시스템 재시작
+docker-compose restart
+
+# 특정 서비스만 재시작
+docker-compose restart backend
+docker-compose restart frontend
+```
+
+## 🎯 주요 페이지
+
+### DashboardPage
+- 프로젝트 선택 드롭다운
+- 프로젝트별 기능 카드 (BOM 관리, 구매신청 관리)
+- 관리자 전용 기능 (사용자 관리, 로그 관리)
+- 데본씽크 스타일 디자인
+
+### BOMManagementPage
+- 카테고리별 자재 관리 (PIPE, FITTING, FLANGE, VALVE, GASKET, BOLT, SUPPORT)
+- 구매신청된 자재 비활성화 표시
+- 엑셀 내보내기 및 서버 저장
+- 사용자 요구사항 입력
+
+### PurchaseRequestPage
+- 구매신청 목록 조회 및 관리
+- 구매신청 제목 인라인 편집
+- 원본 파일 정보 표시
+- 엑셀 파일 다운로드
+
+### 카테고리별 자재 뷰 컴포넌트
+- 각 자재 카테고리별 전용 뷰 컴포넌트
+- 통일된 테이블 형태 UI
+- 정렬, 필터링, 전체 선택 기능
+- 구매신청된 자재 비활성화 처리
 
 ## 📱 반응형 디자인