更新

src/components/ExtractionText/index.vue

@@ -37,7 +37,7 @@
         <p>上传文件提取文本内容（支持 .png, .jpg ）</p>
         <div class="container flex" style="height: 248px;">
           <div class="mr10">
-            <el-upload class="upload-demo" action="abc" :auto-upload="false" :on-change="onHandleChange" :show-file-list="false">
+            <el-upload class="upload-demo" accept=".png,.jpg" action="abc" :auto-upload="false" :on-change="onHandleChange" :show-file-list="false">
               <el-button size="medium" type="primary">上传图片</el-button>
             </el-upload>
             <p id="file-info">{{ files.name || '未选择文件' }} </p>
@@ -71,8 +71,7 @@
 <script setup>
 import * as ocr from "@paddlejs-models/ocr";
 import { drawBox } from "@/utils/ocrUtils";
-import { nextTick, onMounted,reactive, ref,getCurrentInstance, watch } from "vue";
-import { init } from "echarts";
+import { nextTick,reactive, ref,getCurrentInstance, watch } from "vue";
 const props = defineProps({
   modelValue: {
     type: Boolean,
@@ -95,7 +94,7 @@ const textStyle = reactive({
   width: "",
   height: ""
 })
-const hasLoadingJS = ref(false)
+const hasLoadingJS = ref(null) //加载的状态 1 ：成功，2：失败
 
 watch(()=>props.modelValue,val=>{
   if(val) initDemo();
@@ -103,7 +102,7 @@ watch(()=>props.modelValue,val=>{
 
 
 const initDemo = () =>{
-  if(!hasLoadingJS.value) initPage();
+  if(hasLoadingJS.value == null  || hasLoadingJS.value == 2) initPage();
   nextTick(() => {
     const fileInput = document.getElementById("file-input");
     const fileInfo = document.getElementById("file-info");
@@ -237,11 +236,11 @@ const initPage = async () => {
     await ocr.init();// 模型初始化
     proxy.$message({ type: "success",  message: "加载成功" });
     loading.value = false;
-    hasLoadingJS.value = true;
+    hasLoadingJS.value = 1;
   } catch (err) {
     proxy.$message({ type: "error",  message: "加载失败，请刷新页面" });
     loading.value = false;
-    hasLoadingJS.value = false;
+    hasLoadingJS.value = 2;
   }
 }
  /**
@@ -274,7 +273,7 @@ const getRecognize = async () => {
 // 切换标签
 const changeRadio = (val) =>{
   if(val == '图片解析') {
-    if(!hasLoadingJS.value) initPage()
+    if(hasLoadingJS.value == 2) initPage();
   }
   const resultDiv = document.getElementById("result");
   resultDiv.textContent = "请先上传文件...";