# 견적 등록/수정 FormField type="custom" 수정 작업

## 📅 작업일: 2026-01-06

## 🎯 문제 요약
견적 등록/수정 페이지에서 **수량(quantity) 변경이 총합계에 반영되지 않는 버그**

### 증상
- 수량 1 → 자동견적산출 → 합계 1,711,225원
- 수량 3으로 변경 → 자동견적산출 → 합계가 여전히 1,711,225원 (3배인 ~5,133,675원이어야 함)

## 🔍 근본 원인
**FormField 컴포넌트의 `type="custom"` 누락**

FormField 컴포넌트 (`src/components/molecules/FormField.tsx`)는 `type` prop에 따라 다르게 동작:
- `type="custom"` → children(자식 요소)을 렌더링
- 그 외 → 자체 내부 Input을 렌더링 (value/onChange 연결 안됨)

```tsx
// FormField.tsx 내부 renderInput() 함수
case 'custom':
  return children;  // ← children 렌더링
default:
  return <Input value={value} onChange={...} />  // ← 자체 Input 렌더링 (value=undefined)
```

**결과**: `type="custom"` 없이 FormField 안에 Input을 넣으면, 해당 Input은 렌더링되지 않고 FormField 자체 Input이 렌더링됨 → state와 연결 끊김

## ✅ 수정 완료 (8개 FormField)

### 파일: `src/components/quotes/QuoteRegistration.tsx`

**기본정보 섹션** (3개):
1. 등록일 (line 581) - `type="custom"` 추가
2. 현장명 (line 627) - `type="custom"` 추가 (datalist 자동완성 포함)
3. 납기일 (line 662) - `type="custom"` 추가

**견적 항목 섹션** (5개):
4. 층수 (line 733) - `type="custom"` 추가
5. 부호 (line 744) - `type="custom"` 추가
6. **수량 (line 926)** - `type="custom"` 추가 ⭐ 핵심 버그 원인
7. 마구리 날개치수 (line 944) - `type="custom"` 추가
8. 검사비 (line 959) - `type="custom"` 추가

## 추가 수정사항

### 1. useMemo로 calculatedGrandTotal 추가 (line 194-201)
```tsx
const calculatedGrandTotal = useMemo(() => {
  if (!calculationResults?.items) return 0;
  return calculationResults.items.reduce((sum, itemResult) => {
    const formItem = formData.items[itemResult.index];
    return sum + (itemResult.result.grand_total * (formItem?.quantity || 1));
  }, 0);
}, [calculationResults, formData.items]);
```

### 2. Toast 메시지 수정 (line 493-498)
`updatedItems` 사용하여 최신 상태 반영

### 3. Badge 및 하단 총합계
`calculatedGrandTotal` 사용 (line 1019, 1131)

## ⚠️ 남은 이슈
사용자가 "견적 산출 결과에는 왜 반영이 안되는거지?"라고 질문 → 확인 필요:
1. 수정된 코드로 테스트했는지 (브라우저 새로고침)
2. 수량 변경 후 즉시 반영되는지 vs 버튼 클릭 필요한지
3. 현재 코드에서 수량 변경 시 합계는 실시간 업데이트되어야 함 (useMemo + React 재렌더링)

## 📁 관련 파일
- `src/components/quotes/QuoteRegistration.tsx` - 메인 수정 파일
- `src/components/molecules/FormField.tsx` - FormField 컴포넌트 (참조)
- `src/app/[locale]/(protected)/sales/quote-management/[id]/edit/page.tsx` - 수정 페이지

## 🔑 핵심 교훈
**FormField에 커스텀 children(Input, Select, datalist 등)을 넣을 때는 반드시 `type="custom"` 필요!**

## 🚀 새 세션에서 이어서 작업하려면
1. 프로젝트 활성화: Serena `activate_project` → "react"
2. 메모리 읽기: `read_memory("quote-registration-formfield-fix.md")`
3. 확인 필요: 수량 변경 시 견적 산출 결과가 실시간으로 업데이트되는지 테스트
