o2o-negosium-original/lps-admin
민헌 c126d56631 feat(lps-admin): 테스트 검색 페이지 — 임의 상품을 실제 파이프라인에 흘려 점검
셀렉터·프록시·AI 매칭 회귀를 UI 에서 즉석 점검. API 는 lean(브라우저
없음)이라 크롤은 워커에만 있으므로, 기존 POST /v1/lps/search 로 잡을
넣고 GET /jobs/{id} 를 2초 폴링해 결과를 시각화(신규 백엔드 0).

- 폼(상품명 필수+모델/규격/제조사/현재가) → 제출 → 진행 스텝퍼
  (대기→크롤·판정중→완료, 1초 티커 경과시간) → 결과.
- 결과: 판정(최저가·소스), 파이프라인 퍼널(수집→필터→이상치→AI→top-N
  단계별 잔존 수), 소스별 수집(+실패 시 error 표시), 검색 원가
  (AI/프록시 분해·전송량), 매칭 상품 표, 원본 JSON.
- product_code=TEST-<시각> 자동 — 프로덕션과 필터 구분(negodata 는
  UUID 만 매핑, 연동 무영향). 자격증명은 서버에만, 결과엔 집계 사용량만.
- 워커 미실행 시 8초 후 '워커 확인' 힌트, DEAD 시 오류 표시.
- 작업 큐에 '테스트만'(TEST- 접두) 필터 칩 추가.
- 실기동 검증: 맥심 커피 검색 → 퍼널 80→2·쿠팡 9.5s·원가 /bin/zsh.002 렌더,
  콘솔 에러 0, 모바일 hscroll 0.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-14 09:13:54 +09:00
..
src feat(lps-admin): 테스트 검색 페이지 — 임의 상품을 실제 파이프라인에 흘려 점검 2026-07-14 09:13:54 +09:00
.gitignore chore(lps-admin): 폴더명 lps-temp-fe → lps-admin 2026-07-13 22:07:30 +09:00
index.html chore(lps-admin): 폴더명 lps-temp-fe → lps-admin 2026-07-13 22:07:30 +09:00
package-lock.json chore(lps-admin): package-lock name 동기화 — 폴더명 변경 후속 2026-07-13 22:39:49 +09:00
package.json chore(lps-admin): 폴더명 lps-temp-fe → lps-admin 2026-07-13 22:07:30 +09:00
README.md chore(lps-admin): 폴더명 lps-temp-fe → lps-admin 2026-07-13 22:07:30 +09:00
tsconfig.json chore(lps-admin): 폴더명 lps-temp-fe → lps-admin 2026-07-13 22:07:30 +09:00
tsconfig.tsbuildinfo chore(lps-admin): 폴더명 lps-temp-fe → lps-admin 2026-07-13 22:07:30 +09:00
vite.config.ts chore(lps-admin): 폴더명 lps-temp-fe → lps-admin 2026-07-13 22:07:30 +09:00

LPS 관리자 페이지

LPS(인터넷 최저가 검색)의 운영 지표를 보고 필수 액션(수동 재검색·DEAD 재큐)을 수행하는 React 관리자 페이지입니다. 서버 동작 설정은 여기서 바꾸지 않습니다 — 설정 소스는 서버의 config.<env>.toml 하나(2026-07-13 협의).

실행 (개발)

npm install
npm run dev        # http://localhost:5174 — /v1·/healthz 는 vite 프록시로 :9600 에 전달(CORS 불필요)

LPS API 를 먼저 띄워두세요: cd ../lps && ./run_local_server.sh. 다른 호스트의 API 를 보려면 VITE_LPS_URL=http://<host>:9600 npm run dev 또는 앱의 설정 페이지에서 API 주소를 지정합니다(guard 켜진 prod 는 API 키도 입력 — X-API-Key 자동 첨부).

페이지

페이지 내용 데이터
대시보드 큐/차단/비용/DB풀 스탯 타일 + 임계 배너 + 큐 추이(5초 폴링) GET /v1/lps/ops
작업 큐 목록(상태·검색 필터)·상세(결과/원가/오류)·DEAD 재큐 /v1/lps/jobs, /jobs/{id}/requeue
상품·가격 가격 추이 3선(네이버·쿠팡·최종)·몰별 최저가·검증 링크·지금 다시 검색 /v1/lps/products, /products/{code}/history, POST /search
크롤 상태 IP 세션 종료사유 도넛·요청 수 분포(+차단 시작 기준선 = 예산 튜닝 뷰)·차단 이력 /v1/lps/stats/ip-sessions, /stats/bot
비용 시간별 원가 스택(AI vs 프록시)·건당 평균·평균 소요 /v1/lps/stats/cost

스택·규칙

  • Vite + React + TS + Tailwind v4 + recharts + @tanstack/react-query + react-router (negodata 프론트와 동일 계열, 경량)
  • 색 토큰은 숫자 스케일(src/index.css @theme). 차트 시리즈 색은 엔터티 고정 — 네이버 #008a43(적록색약 분리 검증 통과 톤) · 쿠팡 #f0455b · 최종 #4f46e5. 순서·색 재배정 금지.
  • 빌드: npm run build (tsc 포함) → dist/