From 9bbed8cf5e859d91b12bf2b322ce88d81cb59b6e Mon Sep 17 00:00:00 2001
From: lafay <2021211506@stu.hit.edu.cn>
Date: Fri, 10 Apr 2026 01:10:55 +0800
Subject: [PATCH] feat(auth): upload proof materials image before verification
 submission

Add image upload functionality to the verification form that uploads local proof material images (file://, content://, blob: URIs) to the server and uses the returned URL for verification submission. Also add proper upload state tracking to disable form inputs during upload.
---
 src/screens/auth/VerificationFormScreen.tsx | 78 ++++++++++++++-------
 1 file changed, 52 insertions(+), 26 deletions(-)

diff --git a/src/screens/auth/VerificationFormScreen.tsx b/src/screens/auth/VerificationFormScreen.tsx
index 21fb50a..0140981 100644
--- a/src/screens/auth/VerificationFormScreen.tsx
+++ b/src/screens/auth/VerificationFormScreen.tsx
@@ -23,6 +23,7 @@ import * as ImagePicker from 'expo-image-picker';
 import { useAppColors, type AppColors } from '../../theme';
 import { useVerificationStore } from '../../stores/verificationStore';
 import { showPrompt } from '../../services/promptService';
+import { uploadService } from '../../services/uploadService';
 import type { UserIdentity } from '../../types/dto';
 
 const THEME_COLORS = {
@@ -45,6 +46,7 @@ export const VerificationFormScreen: React.FC = () => {
   const params = useLocalSearchParams<{ identity?: string }>();
   const { submitVerification, isLoading } = useVerificationStore();
 
+  const [uploading, setUploading] = useState(false);
   const [formData, setFormData] = useState({
     real_name: '',
     student_id: '',
@@ -110,29 +112,53 @@ export const VerificationFormScreen: React.FC = () => {
   const handleSubmit = async () => {
     if (!validateForm()) return;
 
-    const success = await submitVerification({
-      identity,
-      real_name: formData.real_name.trim(),
-      student_id: formData.student_id.trim() || undefined,
-      employee_id: formData.employee_id.trim() || undefined,
-      department: formData.department.trim() || undefined,
-      proof_materials: formData.proof_materials,
-    });
+    setUploading(true);
+    try {
+      let proofMaterialsUrl = formData.proof_materials;
 
-    if (success) {
-      showPrompt({
-        title: '提交成功',
-        message: '您的认证申请已提交，请等待审核',
-        type: 'success',
-      });
-      router.back();
-    } else {
-      const error = useVerificationStore.getState().error;
-      showPrompt({
-        title: '提交失败',
-        message: error || '请稍后重试',
-        type: 'error',
+      if (formData.proof_materials.startsWith('file://') || formData.proof_materials.startsWith('content://') || formData.proof_materials.startsWith('blob:')) {
+        const uploadResult = await uploadService.uploadImage({
+          uri: formData.proof_materials,
+        });
+
+        if (!uploadResult || !uploadResult.url) {
+          showPrompt({
+            title: '上传失败',
+            message: '证明材料图片上传失败，请重试',
+            type: 'error',
+          });
+          return;
+        }
+
+        proofMaterialsUrl = uploadResult.url;
+      }
+
+      const success = await submitVerification({
+        identity,
+        real_name: formData.real_name.trim(),
+        student_id: formData.student_id.trim() || undefined,
+        employee_id: formData.employee_id.trim() || undefined,
+        department: formData.department.trim() || undefined,
+        proof_materials: proofMaterialsUrl,
       });
+
+      if (success) {
+        showPrompt({
+          title: '提交成功',
+          message: '您的认证申请已提交，请等待审核',
+          type: 'success',
+        });
+        router.back();
+      } else {
+        const error = useVerificationStore.getState().error;
+        showPrompt({
+          title: '提交失败',
+          message: error || '请稍后重试',
+          type: 'error',
+        });
+      }
+    } finally {
+      setUploading(false);
     }
   };
 
@@ -169,7 +195,7 @@ export const VerificationFormScreen: React.FC = () => {
             }}
             keyboardType={keyboardType}
             maxLength={maxLength}
-            editable={!isLoading}
+            editable={!isLoading && !uploading}
           />
         </View>
         {error && <Text style={styles.errorText}>{error}</Text>}
@@ -245,7 +271,7 @@ export const VerificationFormScreen: React.FC = () => {
               style={[styles.uploadButton, errors.proof_materials && styles.uploadButtonError]}
               onPress={handlePickImage}
               activeOpacity={0.8}
-              disabled={isLoading}
+              disabled={isLoading || uploading}
             >
               {formData.proof_materials ? (
                 <Image
@@ -271,12 +297,12 @@ export const VerificationFormScreen: React.FC = () => {
         </View>
 
         <TouchableOpacity
-          style={[styles.submitButton, isLoading && styles.submitButtonDisabled]}
+          style={[styles.submitButton, (isLoading || uploading) && styles.submitButtonDisabled]}
           onPress={handleSubmit}
           activeOpacity={0.9}
-          disabled={isLoading}
+          disabled={isLoading || uploading}
         >
-          {isLoading ? (
+          {(isLoading || uploading) ? (
             <ActivityIndicator size="small" color="#FFF" />
           ) : (
             <Text style={styles.submitButtonText}>提交认证申请</Text>