From 29451277d10b974794f0d14f375d704852735ea0 Mon Sep 17 00:00:00 2001
From: Chever John <cheverjonathan@gmail.com>
Date: Tue, 30 Jun 2026 20:39:15 +0800
Subject: [PATCH] fix: use authenticated upload in ProductForm and
 AccountProfileCard

Both components had raw fetch to /api/v1/common/upload without the
Authorization header. Replace with commonApi.uploadFile which handles
token refresh and auth headers.

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/components/AccountProfileCard.tsx    | 19 ++-----------------
 src/components/warehouse/ProductForm.tsx | 21 ++-------------------
 2 files changed, 4 insertions(+), 36 deletions(-)

diff --git a/src/components/AccountProfileCard.tsx b/src/components/AccountProfileCard.tsx
index ef007a2..1352a36 100644
--- a/src/components/AccountProfileCard.tsx
+++ b/src/components/AccountProfileCard.tsx
@@ -15,6 +15,7 @@ import {
 } from 'lucide-react';
 import { useAuth } from '../contexts/AuthContext';
 import { http } from '../api';
+import { commonApi } from '../api/common';
 
 export type AccountRole = 'purchaser' | 'textile' | 'washing';
 
@@ -82,23 +83,7 @@ export function AccountProfileCard({
     if (!auth.user) return;
 
     try {
-      // TODO: 头像上传接口待后端实现
-      const formDataObj = new FormData();
-      formDataObj.append('file', file);
-      formDataObj.append('bucket', 'avatars');
-
-      const res = await fetch('/api/v1/common/upload', {
-        method: 'POST',
-        body: formDataObj,
-      });
-
-      if (!res.ok) {
-        alert('头像上传失败');
-        return;
-      }
-
-      const json = await res.json();
-      const publicUrl = json.data?.url || '';
+      const publicUrl = await commonApi.uploadFile(file, 'avatars', 'avatars');
 
       await http.patch('/auth/me', { image_url: publicUrl });
 
diff --git a/src/components/warehouse/ProductForm.tsx b/src/components/warehouse/ProductForm.tsx
index 048dc37..40153f5 100644
--- a/src/components/warehouse/ProductForm.tsx
+++ b/src/components/warehouse/ProductForm.tsx
@@ -3,6 +3,7 @@ import { motion } from 'framer-motion';
 import { X, Package, Tag, Hash, Palette, DollarSign, Layers, Plus, Minus, Image as ImageIcon, Upload, Trash2, Search } from 'lucide-react';
 import { useResponsive } from '../../hooks/useResponsive';
 import { http } from '../../api';
+import { commonApi } from '../../api/common';
 import type { Product, ProductYarnRatio } from '../../types';
 
 interface ProductFormData {
@@ -379,25 +380,7 @@ export function ProductForm({
     setUploading(true);
 
     try {
-      // TODO: 文件上传接口待后端实现
-      const formDataObj = new FormData();
-      formDataObj.append('file', file);
-      formDataObj.append('bucket', 'product_images');
-      formDataObj.append('path_prefix', 'products');
-
-      const res = await fetch('/api/v1/common/upload', {
-        method: 'POST',
-        body: formDataObj,
-      });
-
-      if (!res.ok) {
-        alert('图片上传失败');
-        setUploading(false);
-        return;
-      }
-
-      const json = await res.json();
-      const publicUrl = json.data?.url || '';
+      const publicUrl = await commonApi.uploadFile(file, 'product_images', 'products');
       setPreviewUrl(publicUrl);
       setFormData(prev => ({ ...prev, image_url: publicUrl }));
       setUploading(false);