Files

hskwon aca1767eb9 초기 커밋: 5130 레거시 시스템

- URL 하드코딩 → .env APP_URL 기반 동적 URL로 변경
- DB 연결 하드코딩 → .env 기반으로 변경
- MySQL strict mode DATE 오류 수정

2025-12-10 20:14:31 +09:00

3.4 KiB

Raw Blame History

Sales Management UI & API Integration Plan

1. 개요

목표: salesmangement/index.php에 영업 관리 UI를 구현하고, 멀티테넌시 환경을 지원하기 위해 회사별 기본 정보를 가져오는 API를 설계 및 연동함. 디자인: tone.md에 정의된 CodeBridgeExy 디자인 시스템(Pretendard 폰트, Glassmorphism, Primary Blue 등)을 적용.

2. API 설계 (Multi-tenancy Support)

2.1 API 개요

각 클라이언트(회사)의 고유 식별자(Tenant ID or Company ID)를 기반으로 해당 회사의 영업 설정 및 기본 정보를 반환하는 API.

2.2 엔드포인트

URL: /api/v1/company/sales-config (예시)
Method: GET
Headers:
- X-Tenant-ID: {company_id} (또는 세션/토큰 기반 인증)

2.3 응답 데이터 구조 (JSON)

{
  "company_info": {
    "id": "comp_12345",
    "name": "건축자재(주)",
    "logo_url": "https://...",
    "currency": "KRW"
  },
  "sales_config": {
    "programs": [
      {
        "id": "prog_qr",
        "name": "QR코드",
        "unit_price": 10400000,
        "subscription_fee": 100000,
        "commission_rates": {
          "seller": { "join": 0.2, "sub": 0.5 },
          "manager": { "join": 0.05, "sub": 0.3 }
        }
      },
      // ... 기타 프로그램
    ],
    "default_contract_period": 84 // months
  }
}

3. UI 구현 계획 (`salesmangement/index.php`)

3.1 기술 스택

Frontend: React (CDN 방식 또는 번들링), Tailwind CSS (CDN)
- Note: index.php 환경이므로 React를 CDN으로 로드하거나, 빌드된 JS를 포함하는 방식을 사용.
- User Request: Next.js 프로젝트 제안이 있었으나, 현재 파일이 index.php이므로 PHP 환경 내 리액트 통합 또는 순수 JS/HTML + Tailwind로 구현할지 결정 필요. (본 계획은 React + Tailwind CDN을 가정하여 빠른 프로토타이핑 지원)

3.2 주요 컴포넌트

Header: 회사 로고 및 회사명 표시 (API 데이터 연동).
Sales Dashboard: sales_commission_ui_plan.md의 대시보드 구현.
- KPI 카드 (총 매출, 수당 등) - tone.md의 Card 스타일 적용.
Commission Simulator:
- 프로그램 선택 Dropdown (API에서 로드된 프로그램 목록).
- 실시간 수당 계산기.

3.3 디자인 적용 (`tone.md` 준수)

Background: bg-gray-50 (rgb(250, 250, 250))
Font: font-sans (Pretendard)
Primary Color: text-blue-600, bg-blue-600 (버튼 등)
Cards: bg-white rounded-xl shadow-sm p-6

4. 개발 단계

API Mocking: api_mock.json 또는 PHP 파일로 간단한 Mock API 구현.
UI Skeleton: index.php에 HTML 구조 및 Tailwind CSS 로드.
Data Fetching: fetch()를 사용하여 API에서 회사 정보 로드.
Component Rendering: 로드된 데이터를 기반으로 UI 렌더링.

5. User Review Required

API 방식: 별도의 백엔드 프레임워크 없이 PHP로 간단한 JSON 응답을 주는 API를 api/company_info.php와 같이 만들어서 테스트하시겠습니까?
Frontend 환경: index.php 파일 하나에서 작업하려면 React CDN 방식이 간편합니다. Node.js 기반의 Next.js 프로젝트로 완전히 분리하시겠습니까? (현재 폴더 구조상 index.php 수정을 요청하셨으므로 PHP + JS 방식을 추천합니다.)

3.4 KiB Raw Blame History