# 견적/프로젝트/워크플로우 화면 명세

> **작성일**: 2026-03-06
> **상태**: 뷰 구현 완료 (목데이터 기반, API 미연동)
> **라우트**: `/juil/estimate`, `/juil/project`, `/juil/workflow`
> **관련**: [README.md](README.md) | [사진대지](construction-photos.md) | [회의록](meeting-minutes.md)

---

## 1. 개요

3개 화면 모두 **React 인라인 컴포넌트**(Babel 브라우저 트랜스파일)로 구현. 현재는 정적/목데이터 기반이며, 향후 API 연동 예정. PlanningController에서 뷰만 반환한다.

---

## 2. 견적/입찰/공사관리 (/juil/estimate)

### 2.1 개요

블라인드/스크린 설치 프로젝트의 견적서 작성, 입찰 관리, 공사 진행 현황을 한 화면에서 관리.

### 2.2 데이터 구조 (initialEstimates)

```javascript
{
    id: "string",
    name: "프로젝트명",
    client: "고객사명",
    status: "견적중|입찰|계약|공사중|준공",
    amount: number,                   // 금액
    startDate: "YYYY-MM-DD",
    endDate: "YYYY-MM-DD",
    manager: "담당자명",
    items: [                          // 품목 내역
        { name: "품목명", quantity: number, unitPrice: number }
    ]
}
```

### 2.3 공사관리 정보 (initialConstructionData)

```javascript
{
    id: "string",
    estimateId: "string",             // 연결 견적
    siteName: "현장명",
    address: "현장 주소",
    progress: number,                 // 진행률 (0~100)
    workers: number,                  // 투입 인원
    safetyChecks: [                   // 안전점검
        { date: "YYYY-MM-DD", result: "합격|불합격", inspector: "점검자" }
    ]
}
```

### 2.4 상태별 배지 색상

| 상태 | 색상 |
|------|------|
| 견적중 | 파랑 |
| 입찰 | 보라 |
| 계약 | 초록 |
| 공사중 | 주황 |
| 준공 | 회색 |

### 2.5 SAM 연계

- 견적서 작성 시 SAM 견적 시스템(`features/quotes/`) 데이터 활용 가능
- 향후 `/juil/estimate` ↔ SAM 견적 API 연동 계획

---

## 3. 프로젝트관리/기성청구 (/juil/project)

### 3.1 개요

계약된 프로젝트의 현장 관리, 발주/청구/인건비 상태 추적, 기성 청구 관리.

### 3.2 데이터 구조 (initialProjects)

```javascript
{
    id: "string",
    name: "프로젝트명",
    client: "발주처",
    contractAmount: number,           // 계약금액
    status: "진행중|완료|보류",
    sites: [                          // 현장 목록
        {
            name: "현장명",
            address: "주소",
            progress: number          // 진행률
        }
    ],
    orders: [                         // 발주 내역
        {
            vendor: "거래처",
            amount: number,
            status: "발주|납품|정산"
        }
    ],
    claims: [                         // 기성 청구
        {
            round: number,            // 차수
            amount: number,           // 청구금액
            claimDate: "YYYY-MM-DD",
            status: "청구|승인|입금"
        }
    ],
    laborCosts: [                     // 인건비
        {
            month: "YYYY-MM",
            amount: number,
            workers: number
        }
    ]
}
```

### 3.3 금액 포맷 함수

```javascript
fmt(amount)        // 1,234,567 (쉼표 포맷)
fmtBillion(amount) // 12.3억 (억 단위 축약)
```

---

## 4. 업무 Workflow (/juil/workflow)

### 4.1 개요

블라인드/스크린 사업의 전체 업무 프로세스를 단계별로 시각화. 각 프로세스에 담당 부서, 산출물, 서브스텝을 정의.

### 4.2 프로세스 데이터 구조

```javascript
{
    id: "S1-1",                       // 프로세스 ID
    phase: "영업",                     // Phase 명
    name: "정보 수집",                 // 프로세스 이름
    icon: "icon-name",               // 아이콘
    dept: "영업팀",                    // 담당 부서
    color: "#3B82F6",                // 테마 색상
    description: "프로세스 설명",
    documents: [                      // 산출물 목록
        "현장조사서", "고객요구사항서"
    ],
    subSteps: [                       // 상세 서브스텝
        {
            name: "서브스텝명",
            description: "상세 설명",
            responsible: "담당자/팀",
            output: "산출물"
        }
    ]
}
```

### 4.3 업무 Phase 목록

| Phase | ID 범위 | 설명 |
|-------|---------|------|
| **영업** | S1-1 ~ S1-4 | 정보 수집 → 현장 실측 → 고객 미팅 → 프로젝트 검토 |
| **견적서 작성** | S2-1 ~ S2-4 | 물량 산출 → 단가 산정 → 견적가 산출 → 견적서 작성/검토 |
| **입찰** | S3-* | 입찰 준비 → 제출 → 결과 확인 |
| **계약** | S4-* | 계약 협상 → 계약 체결 |
| **공사** | S5-* | 자재 발주 → 시공 → 현장 관리 |
| **준공** | S6-* | 검수 → 하자보수 → 준공 정산 |

### 4.4 SAM 연계 포인트

```javascript
// 견적서 작성 Phase에서 SAM 견적 화면으로 연결
{ samLink: '/juil/estimate', label: '견적서 작성 바로가기' }
```

---

## 5. 공통 특징

### 5.1 HTMX 전체 페이지 로드

3개 화면 모두 React 컴포넌트 사용하므로 HTMX 부분 로드 불가:

```php
// PlanningController의 모든 메서드
if ($request->header('HX-Request')) {
    return response('', 200)->header('HX-Redirect', route('juil.xxx'));
}
return view('juil.xxx');
```

### 5.2 현재 구현 상태

| 항목 | 상태 |
|------|------|
| UI 화면 | 구현 완료 (React 인라인) |
| 목데이터 | 블레이드에 하드코딩 |
| API 연동 | 미연동 (향후 계획) |
| DB 테이블 | 미생성 (향후 계획) |
| CRUD 기능 | 뷰 조회만 (생성/수정/삭제 미구현) |

### 5.3 향후 개발 방향

1. 견적/프로젝트 DB 테이블 설계 (API 프로젝트)
2. API 엔드포인트 구현
3. React 컴포넌트 API 연동
4. SAM 견적 시스템과 데이터 동기화

---

## 관련 문서

- [README.md](README.md) — 기획 메뉴 전체 개요
- [공사현장 사진대지](construction-photos.md) — GCS 파일 관리, 음성 입력
- [회의록 작성](meeting-minutes.md) — STT/AI 통합 회의 기록
- [견적 시스템](../quotes/README.md) — SAM 견적 관리 (BOM, 10단계 로직)

---

**최종 업데이트**: 2026-03-06