diff --git a/frontend/src/app/cost/page.tsx b/frontend/src/app/cost/page.tsx index ce901e2..5e407cc 100644 --- a/frontend/src/app/cost/page.tsx +++ b/frontend/src/app/cost/page.tsx @@ -1,12 +1,13 @@ 'use client'; import { useState, useEffect } from 'react'; -import { useTranslation, formatPriceWithCurrency } from '@/lib/i18n'; +import { useTranslation, formatPriceWithCurrency, translateCarName } from '@/lib/i18n'; import { useExchangeRateStore } from '@/lib/exchangeRateStore'; import Link from 'next/link'; import { useRouter } from 'next/navigation'; import SidebarLayout from '@/components/SidebarLayout'; import { useAuthStore } from '@/lib/store'; +import { vehicleRequestsApi } from '@/lib/api'; // Cost constants const KOREAN_FEE_PERCENT = 5; // 5% of vehicle price @@ -37,6 +38,14 @@ interface Settings { domestic_export_customs_krw: number; } +interface MyVehicle { + id: number; + car_name: string; + price_krw: number; + year?: number; + mileage?: number; +} + export default function CostPage() { const { t, language } = useTranslation(); const { user, isLoading } = useAuthStore(); @@ -94,6 +103,11 @@ export default function CostPage() { domestic_export_customs_krw: 1150000, }); + // My vehicles from requests + const [myVehicles, setMyVehicles] = useState([]); + const [selectedVehicleId, setSelectedVehicleId] = useState('example'); + const [vehiclesLoading, setVehiclesLoading] = useState(true); + // Calculator state const [vehiclePrice, setVehiclePrice] = useState('2000'); const [carType, setCarType] = useState<'small' | 'compact'>('small'); @@ -133,6 +147,63 @@ export default function CostPage() { fetchSettings(); }, []); + // Fetch user's vehicles from requests + useEffect(() => { + const fetchMyVehicles = async () => { + if (!user) { + setVehiclesLoading(false); + return; + } + try { + const data = await vehicleRequestsApi.getMyVehicles(); + const vehicles: MyVehicle[] = []; + + // Extract vehicles from vehicle requests + data.vehicle_requests.forEach(request => { + request.approved_vehicles.forEach(vehicle => { + const carData = vehicle.car_data; + if (carData) { + vehicles.push({ + id: vehicle.id, + car_name: carData.car_name || 'Unknown', + price_krw: carData.final_price || 0, + year: carData.year, + mileage: carData.mileage, + }); + } + }); + }); + + // Also add direct purchases + data.direct_purchases.forEach(purchase => { + const carData = purchase.car_data; + if (carData) { + vehicles.push({ + id: purchase.id + 10000, // Offset to avoid id collision + car_name: carData.car_name || 'Unknown', + price_krw: carData.final_price || 0, + year: carData.year, + mileage: carData.mileage, + }); + } + }); + + setMyVehicles(vehicles); + + // Auto-select first vehicle if available + if (vehicles.length > 0) { + setSelectedVehicleId(vehicles[0].id.toString()); + setVehiclePrice(Math.round(vehicles[0].price_krw / 10000).toString()); + } + } catch (error) { + console.error('Failed to fetch my vehicles:', error); + } finally { + setVehiclesLoading(false); + } + }; + fetchMyVehicles(); + }, [user]); + // Calculate cost for a single slot based on current matched slots const calculateSlotCosts = (slots: ContainerSlot[]): ContainerSlot[] => { const filledSlots = slots.filter(s => s.status !== 'empty'); @@ -582,24 +653,89 @@ export default function CostPage() { {/* Input Fields */}
- {/* Vehicle Price */} + {/* Vehicle Selection */}
-
- setVehiclePrice(e.target.value)} - className="w-full border border-gray-300 rounded-lg px-4 py-3 text-lg focus:ring-primary-500 focus:border-primary-500" - placeholder="2000" - /> - - {language === 'ko' ? '만원' : 'x 10,000 KRW'} - -
-

+ {vehiclesLoading ? ( +

+ + {language === 'ko' ? '차량 목록 불러오는 중...' : 'Loading vehicles...'} + +
+ ) : ( + <> + + {myVehicles.length === 0 && ( +

+ {language === 'ko' ? '💡 추천받은 차량이 없습니다. 예시 가격으로 계산합니다.' : + language === 'mn' ? '💡 Санал болгосон машин байхгүй. Жишээ үнээр тооцоолно.' : + language === 'ru' ? '💡 Нет рекомендованных автомобилей. Расчет по примерной цене.' : + '💡 No recommended vehicles. Using example price for calculation.'} +

+ )} + {selectedVehicleId === 'example' && myVehicles.length > 0 && ( +
+ +
+ setVehiclePrice(e.target.value)} + className="w-full border border-gray-300 rounded-lg px-4 py-2 focus:ring-primary-500 focus:border-primary-500" + placeholder="2000" + /> + + {language === 'ko' ? '만원' : 'x 10,000 KRW'} + +
+
+ )} + + )} +

= {formatLocalCurrency(parseInt(vehiclePrice || '0') * 10000)}