refactor(webapp): 优化发票验证流程和界面

- 修改验证流程初始步骤为第3步- 更新验证结果展示方式，使用 Ant Design Result 组件
-优化上传页面样式，增加顶部间距
- 调整验证接口返回格式，统一错误处理

alibabacloud_sample/main.py

@@ -44,15 +44,15 @@ def verify():
     file_path = request.args.get('filePath')
     invoice_id = request.args.get('invoiceId')
     if file_path is None:
-        return "请选择文件"
+        return {"msg":"请选择文件","status":'fail'}
     service = Service()
     data = dataservice.get_invoice(file_path=file_path,invice_id=invoice_id)
     if data is not None:
         if data.get('status') == 'yes':
-            return "已报销发票！！"
+            return {"msg":"请勿重复验证","status":'fail'}
         return service.verify(data=data,file_path=file_path)
     else:
-        return "请选择文件"
+        return {"msg":"请先识别发票","status":'fail'}
 # 发票复验
 @app.route('/reverify', methods=['GET'])
 def reverify():

alibabacloud_sample/service.py

@@ -105,13 +105,14 @@ class Service:
                 resdata = {'cyjgxx': "未查询到发票信息", 'inspectionAmount': -1,'status': 'fail'}
             else:
                 resdata.update({'status': 'success'})
+                resdata['status'] = 'success'
             dataservice.insert_verify_log(resdata.get('inspectionAmount'), resdata.get('cyjgxx'), file_path)
             dataservice.update_invoice_status(data.get('id'), resdata.get('status'), resdata.get('inspectionAmount'))
             return resdata
         except Exception as error:
             # 此处仅做打印展示，请谨慎对待异常处理，在工程项目中切勿直接忽略异常。
             # 错误 message
-            print(error.message)
+            print(error)
             # 诊断地址
             print(error.data.get("Recommend"))
             UtilClient.assert_as_string(error.message)

webapp/vite-project/src/components/check/index.vue

@@ -27,7 +27,7 @@ const items = [
 ] as StepProps[];
 // 文件路径
 const filePath = ref('');
-const current =  ref<number>(0);
+const current =  ref<number>(3);
 // 下一步
 const nextPage = () => {
   current.value ++;
@@ -59,7 +59,6 @@ const formState = ref<string>('');
           <a-space>
             <a-button type="default" v-if="current > 0"  @click="previousPage">上一步</a-button>
             <a-button type="primary" v-if="current < items.length-1 " @click="nextPage">下一步</a-button>
-            <a-button type="primary" v-if="current == items.length-1" @click="saveReport">报销</a-button>
             <a-button type="dashed" v-if="current == items.length-1" @click="saveReport">完成</a-button>
           </a-space>
         </a-col>

webapp/vite-project/src/components/check/report.vue

@@ -1,16 +1,14 @@
 <template>
   <a-layout-content>
-    <a-row  >
+    <a-result
-      <a-col :span="8">
+        :status="formState.status"
-        查验结果：{{formState.cyjgxx}}
+        :title="formState.cyjgxx"
-      </a-col>
+    >
-      <a-col :span="8">
+      <template #subTitle >
-        查验次数：{{formState.inspectionAmount}}
+        <p v-if="formState.status === 'success'">查验次数: {{formState.inspectionAmount}}</p>
-      </a-col>
+        <p v-if="formState.status === 'success'">已存入发票库</p>
-      <a-col :span="8">
+      </template>
-        查验时间：{{formState.verify_time}}
+    </a-result>
-      </a-col>
-    </a-row>
   </a-layout-content>
 </template>
 <script lang="ts" setup>
@@ -26,11 +24,7 @@ onMounted(() => {
     fileType.value = props.filePath.split('.').pop() ==='pdf'?'pdf':'img'
     request.get('/verify?filePath='+encodeURIComponent(props.filePath)).then((res) => {
       console.log(res)
-      if(res.data){
       formState.value = res.data
-      }else{
-        formState.value.cyjgxx ="失败"
-      }
     })
     fileUrl.value =  baseURL+"/"+props.filePath
   }
@@ -40,6 +34,7 @@ onMounted(() => {
 const fileUrl = ref('')
 
 let formState = ref({
+  status:"",
   inspectionAmount: "",
   cyjgxx: "",
   verify_time: "",

webapp/vite-project/src/components/check/upload.vue

@@ -74,6 +74,7 @@ const handleUpload = (options: any) => {
 
 <style scoped>
 .container {
+   margin-top: 50px;
    height: 100%;
 }
 </style>