Merge pull request #66 from SK-Rookies5-Auction/feat/payment-ui-fix

feat: simplify payment amount and fix image display

Author: Hyeonseok93

src/api/auction.ts

@@ -71,8 +71,8 @@ export const auctionApi = {
    * 4.3 결제하기
    * POST /payments
    */
-  processPayment: async (auctionId: number): Promise<ApiResponse<void>> => {
-    const { data } = await api.post<ApiResponse<void>>('/payments', { auctionId });
+  processPayment: async (auctionId: number, amount: number): Promise<ApiResponse<void>> => {
+    const { data } = await api.post<ApiResponse<void>>('/payments', { auctionId, amount });
     return data;
   },
 

src/api/types.ts

@@ -87,6 +87,7 @@ export interface UserAuctionItem {
   currentPrice: number;
   status: UserItemStatus;
   viewCount: number;
+  finalPrice?: number;
   createdAt: string;
   previewUrl: string;
   mainPictureUrl?: string;
@@ -137,6 +138,7 @@ export interface AuctionDetail extends AuctionSummary {
   startTime: string;
   viewCount: number;
   likeCount: number;
+  mainPictureUrl: string;
   winnerId?: number | string;
   winnerNickname?: string;
   pictures: { url: string; main: boolean }[];

src/pages/CheckoutPage.tsx

@@ -45,7 +45,7 @@ export function CheckoutPage() {
 
     setIsProcessing(true);
     try {
-      const res = await auctionApi.processPayment(item.id);
+      const res = await auctionApi.processPayment(item.id, item.currentPrice);
       if (res.success) {
         showToast('Payment successful! Your item will be shipped soon.', 'success');
         navigate('/my-page?tab=auctions');
@@ -79,9 +79,7 @@ export function CheckoutPage() {
     );
   }
 
-  const serviceFee = Math.floor(item.currentPrice * 0.05);
-  const shippingFee = 0; // Free shipping
-  const totalAmount = item.currentPrice + serviceFee + shippingFee;
+  const totalAmount = item.currentPrice;
 
   return (
     <Layout>
@@ -112,14 +110,6 @@ export function CheckoutPage() {
                   <span className="text-gray-400">Winning Bid</span>
                   <span className="text-white font-medium">₩{formatPrice(item.currentPrice)}</span>
                 </div>
-                <div className="flex justify-between text-sm">
-                  <span className="text-gray-400">Shipping</span>
-                  <span className="text-white font-medium">₩{formatPrice(shippingFee)}</span>
-                </div>
-                <div className="flex justify-between text-sm">
-                  <span className="text-gray-400">Service Fee (5%)</span>
-                  <span className="text-white font-medium">₩{formatPrice(serviceFee)}</span>
-                </div>
                 <div className="border-t border-[#1e3a5f] pt-3 flex justify-between items-center">
                   <span className="text-white font-bold text-lg">Total</span>
                   <span className="text-blue-400 font-black text-xl">₩{formatPrice(totalAmount)}</span>