o2o-negosium-original/frontend
Mina Choi 6eb4dc26f8 [feat] negosium·negodata: 협상 거부 흐름 정리 + 오프라인 계약가 낙찰 + 견적 상세 리모델링
협상 불가 사유를 내면 500 이 나고, 거부 폼은 목록·채팅이 따로 놀았으며,
제출한 내용을 다시 볼 방법이 없었다. 결렬 건은 협력사가 낸 거부가를 계약가로
간주해 낙찰시켜 절감 통계가 음수로 뒤집힐 수 있었고, 견적 상세는 판정 가격이
세 곳에 흩어져 대화 탭에선 아예 보이지 않았다.

agent
- 결렬 종료 로깅 크래시 수정 — _log 를 action_id 기반으로 되돌리고 선택 근거
  (Q·UCB·방문수)는 decision/policy 가 있을 때만 채운다. 종료 행은 카드 선택이
  없고 policy.update 뒤라 값을 넣으면 학습 화면 집계가 오염된다

negosium
- 거부 폼을 목록·채팅 공용 컴포넌트 하나로 통일(사유 3종 + 공급 희망가·의견 선택)
- 거부 사유 열람 — 목록에 '거부 사유 보기'(부가정보 보기와 같은 규격), 채팅
  재진입 시 대화 끝에 거부 내역 카드. 목록·채팅 init 응답에 reject_reason·reject_price 추가
- 자유 입력 거부("협상 포기합니다")가 사유 NULL 로 저장되던 문제 수정 — 폼 마커가
  없으면 원문을 사유로 쓰고, 문장 속 숫자를 희망가로 오인하지 않는다
- koreanNumber 를 전역 lib 으로 이동(공용 폼이 쓴다)

negodata
- 직접 낙찰에 계약가 입력 — 결렬·미응찰 건을 오프라인으로 다시 협상한 결과를
  담당자가 확정해 넣는다. 후보는 초청 협력사 전부(가격 미제출도 포함),
  계약가는 sessions.custom.offline_award 에 근거·작성자·시각과 함께 남긴다
- 통계 계약가 = 담당자 확정가 우선, 없으면 투찰가. 거부가를 계약가로 치던 파생 제거.
  KPI 에 오프라인 반영 건수 추가
- 견적 상세 리모델링 — 가격 레일(앵커링가/투찰현황 · 목표가 · 타결 상한가 · 결과가)을
  시트에 고정해 접힘·탭 전환에도 남기고, 스펙트럼에 타결 판정선과 구간색 추가.
  라벨은 폭을 실측해 두 레인으로 배치(겹침 불가). 상품·마감시각 등 전 행 동일 컬럼 제거,
  협상현황에 부가정보 노출, 1:1 은 협력사·세션상태를 결과 밴드로 올림

테스트: negosium 58 · negodata 110 통과. 프론트 빌드/린트 통과.
2026-08-12 10:25:26 +09:00
..
public [update] 상단의 문구 및 아이콘 변경 2026-06-24 09:46:29 +09:00
src [feat] negosium·negodata: 협상 거부 흐름 정리 + 오프라인 계약가 낙찰 + 견적 상세 리모델링 2026-08-12 10:25:26 +09:00
.dockerignore feat(docker): negosium 프론트 컨테이너화(:3300) + backend CORS 3300 허용 2026-06-18 15:50:04 +09:00
.env.sample update(front): front 폴더명 frontend로 변경 2026-06-18 11:30:26 +09:00
.gitignore [feat] vite 캐시 제거 2026-06-19 13:36:56 +09:00
Dockerfile feat(docker): negosium 프론트 컨테이너화(:3300) + backend CORS 3300 허용 2026-06-18 15:50:04 +09:00
eslint.config.js update(front): front 폴더명 frontend로 변경 2026-06-18 11:30:26 +09:00
index.html [fix] negosium·negodata·landing: 채팅 진입·부가정보 저장 오류 수정, 모바일 여백·스크롤·노치 대응 2026-07-23 12:50:40 +09:00
package-lock.json feat(frontend): 공통 토스트(sonner)·모달 컴포넌트 추가 2026-06-18 13:12:16 +09:00
package.json feat(frontend): 공통 토스트(sonner)·모달 컴포넌트 추가 2026-06-18 13:12:16 +09:00
README.md update(front): front 폴더명 frontend로 변경 2026-06-18 11:30:26 +09:00
tsconfig.app.json update(front): front 폴더명 frontend로 변경 2026-06-18 11:30:26 +09:00
tsconfig.json update(front): front 폴더명 frontend로 변경 2026-06-18 11:30:26 +09:00
tsconfig.node.json update(front): front 폴더명 frontend로 변경 2026-06-18 11:30:26 +09:00
vite.config.ts update(front): front 폴더명 frontend로 변경 2026-06-18 11:30:26 +09:00

Negosium Front

React + TypeScript + Vite 기반 프론트엔드.

기술 스택

  • 빌드/런타임: Vite 8, React 19, TypeScript 6
  • 상태/데이터: TanStack Query(서버 상태), Zustand(클라이언트 상태)
  • HTTP: axios
  • 에디터: Slate (slate / slate-react / slate-history)
  • 스타일: Tailwind CSS v4 (@tailwindcss/vite)
  • 경로 alias: @/* → src/*

요구 사항

  • Node.js 20.19+ 또는 22.12+ (Vite 8 요구 사항, 개발은 24.x 기준)
  • npm

로컬 세팅

# 1. 프로젝트로 이동
cd front

# 2. 의존성 설치
npm install

# 3. env 파일 준비 (.env.sample 복사 후 값 채우기)
cp .env.sample .env.local

# 4. 로컬 개발 서버 실행 (기본 http://localhost:5173)
npm run dev

백엔드 API 는 negosium 백엔드(기본 http://localhost:9300)를 바라본다. .env.local 의 VITE_API_BASE_URL 로 조정한다.

환경 변수 (.env)

Vite 의 mode 기능으로 환경별 env 파일을 매핑한다. 클라이언트 번들에 노출되는 변수는 반드시 VITE_ 접두사를 붙인다.

파일 사용 시점 git
.env.sample 템플릿 (키 목록 공유용) ✅ 커밋
.env.local 로컬 개발 (npm run dev, Vite 가 자동 로드) 🚫 ignore
.env.dev --mode dev (개발 서버) 🚫 ignore
.env.prod --mode prod (운영) 🚫 ignore

새 환경 세팅 시 .env.sample 을 복사해 환경별 파일을 만들고 값을 채운다. 코드에서는 import.meta.env.VITE_API_BASE_URL 처럼 접근한다.

참고: Vite 8 부터 local 은 모드 이름으로 사용할 수 없다(.env.local 의 .local 접미사와 충돌). 그래서 로컬 개발은 별도 모드 없이 기본 vite(mode: development)로 실행하고, 로컬 값은 .env.local 에 둔다 — Vite 는 .env.local 을 모든 모드에서 항상 자동 로드한다(개인 로컬 오버라이드 용도). 우선순위는 .env.[mode] > .env.local > .env 이므로, 각 env 파일에 동일한 키 집합을 유지하면 mode 파일 값이 항상 이긴다. 특정 mode 에만 있어야 할 키를 .env.local 에 두면 다른 mode 로 새어 들어갈 수 있으니 주의.

실행 / 빌드

--mode <name> 으로 .env.[name] 파일이 선택된다(로컬은 모드 없이 .env.local 자동 로드).

npm run dev          # 로컬 개발 서버 (mode: development → .env.local 자동 로드)
npm run dev:dev      # 개발 서버를 dev 환경 변수로 실행 (mode: dev → .env.dev)

npm run build        # 운영 빌드 (mode: prod → .env.prod), build:prod 와 동일
npm run build:dev    # 개발 빌드 (mode: dev → .env.dev)
npm run build:prod   # 운영 빌드 (mode: prod → .env.prod)

npm run preview      # 직전 빌드 결과 로컬 미리보기
npm run lint         # ESLint