feat: 上传

projects/translate-h5/src/view/home/translate/component/voice/index.tsx

@@ -5,7 +5,8 @@ import microphoneSvg from "@/assets/translate/microphone.svg";
 import microphoneDisabledSvg from "@/assets/translate/microphoneDisabledSvg.svg";
 import { createStartRecordSound, createSendSound } from "@/utils/voice";
 import "./index.less";
-
+import { useUploadAudio } from "@/api/translate";
+import VConsole from "vconsole";
 interface DefinedProps {
   onRecordingComplete: (url: string, finalDuration: number) => void;
   isRecording: boolean;
@@ -13,6 +14,7 @@ interface DefinedProps {
 }
 function Index(props: DefinedProps) {
   const { isRecording } = props;
+  const { loading: uploadLoading, error: uploadError, uploadAudio } = useUploadAudio();
   const [hasPermission, setHasPermission] = useState<boolean>(false); //是否有权限
   const [isPermissioning, setIsPermissioning] = useState<boolean>(true); //获取权限中
   const [recordingDuration, setRecordingDuration] = useState<number>(0); //录音时长进度
@@ -23,6 +25,12 @@ function Index(props: DefinedProps) {
   // 音效相关
   const sendSoundRef = useRef<HTMLAudioElement | null>(null);
   const startRecordSoundRef = useRef<HTMLAudioElement | null>(null);
+  useEffect(() => {
+    // 只在开发环境启用
+    if (process.env.NODE_ENV === "development") {
+      new VConsole();
+    }
+  }, []);
   useEffect(() => {
     initializeSounds();
     checkMicrophonePermission();
@@ -59,7 +67,17 @@ function Index(props: DefinedProps) {
       console.error("音效初始化失败:", error);
     }
   };
+  const handleUploadAudio = async (formData: FormData) => {
+    // 打印FormData内容
 
+    console.log(formData);
+    try {
+      const response = await uploadAudio(formData);
+      console.log("上传成功:", response.data);
+    } catch (error) {
+      console.error("上传失败:", error);
+    }
+  };
   const renderBtn = useCallback(() => {
     if (!hasPermission) {
       //没有权限
@@ -210,7 +228,7 @@ function Index(props: DefinedProps) {
   //录音完成
   // 在发送时检查录音时长
   const onRecordingComplete = useCallback(
-    (blob: Blob) => {
+    async (blob: Blob) => {
       if (isCancelledRef.current) {
         Toast.show("已取消");
         return;
@@ -221,6 +239,10 @@ function Index(props: DefinedProps) {
 
         return;
       }
+      const formData = new FormData();
+      formData.append("file", blob);
+
+      await handleUploadAudio(formData);
       const audioUrl = URL.createObjectURL(blob);
       const audio = new Audio();
       audio.src = audioUrl;
@@ -231,7 +253,7 @@ function Index(props: DefinedProps) {
           Toast.show("录音时间太短，请重新录音");
           return;
         }
-        alert(audio.duration);
+        // alert(audio.duration);
         playSound(sendSoundRef);
         props.onRecordingComplete?.(audioUrl, Math.floor(audio.duration));
       });