fix:法人身份证上传bug

src/views/shop/create-shop.vue

@@ -410,7 +410,7 @@
                 </p>
                 <div>
                   <div>
-                    <el-form-item prop="imgUrlC1">
+                    <el-form-item prop="imgUrlC1" ref="imgUrlC1">
                     <el-upload
                       v-model="formData.imgUrlC1"
                       :disabled="Boolean(formData.imgUrlC1)"
@@ -625,7 +625,7 @@
                     <p v-if="certifyValidDtoList(6)" class="red">{{certifyValidDtoList(6)}}</p>
                     <div>法人身份证</div>
                     <div class="flex-wrap">
-                      <el-form-item prop="imgUrlC2">
+                      <el-form-item prop="imgUrlC2" ref="idCard">
                       <el-upload
                         :disabled="Boolean(formData.imgUrlC2)"
                         v-model="formData.imgUrlC2"
@@ -657,7 +657,7 @@
                         <div>身份证正面</div>
                       </el-upload>
                       </el-form-item>
-                      <el-form-item prop="imgUrlC3">
+                      <el-form-item prop="imgUrlC3" ref="idCardBack">
                       <el-upload
                         :disabled="Boolean(formData.imgUrlC3)"
                         v-model="formData.imgUrlC3"
@@ -689,6 +689,9 @@
                         <div>身份证反面</div>
                       </el-upload>
                       </el-form-item>
+                      <el-form-item>
+                         <div v-show="idCardError" style="color:#F56C6C">身份证内容识别失败，请手动输入</div>
+                       </el-form-item>
                     </div>
 
                     <div class="img-data">
@@ -732,7 +735,7 @@
                     <p v-if="certifyValidDtoList(6)" class="red">{{certifyValidDtoList(6)}}</p>
                     <div>法人身份证</div>
                     <div class="flex-wrap">
-                      <el-form-item>
+                      <el-form-item ref="idCard">
                       <el-upload
                         :disabled="Boolean(formData.imgUrlC2)"
                         v-model="formData.imgUrlC2"
@@ -764,7 +767,7 @@
                         <div>身份证正面</div>
                       </el-upload>
                       </el-form-item>
-                      <el-form-item>
+                      <el-form-item ref="idCardBack">
                       <el-upload
                         :disabled="Boolean(formData.imgUrlC3)"
                         v-model="formData.imgUrlC3"
@@ -796,6 +799,9 @@
                         <div>身份证反面</div>
                       </el-upload>
                       </el-form-item>
+                       <el-form-item>
+                         <div v-show="idCardError" style="color:#F56C6C">身份证内容识别失败，请手动输入</div>
+                       </el-form-item>
                     </div>
 
                     <div class="img-data">
@@ -1424,7 +1430,9 @@ export default {
           areaStr: [],
           orgType: '',
           orgName:'',
+          legalName:'',
           licenseUrl:'',
+          legalCertNo:'',
           licenseValidDateBegin:'',
           licenseValidDateEnd:'',
           licenseType: 1,
@@ -1582,14 +1590,14 @@ export default {
         'certifyReq.orgType':[{required: true, message: '请填企业类型', trigger: 'blur'}],  //有多条校验条件的时候可以放个ob
         'certifyReq.orgAddress':[{type: "string", required: true, message: '请填写详细地址', trigger: 'blur'}],
         'certifyReq.bizScope':[{type: "array", required: true, message: '请选择经营范围', trigger: 'change'}],
-        'certifyReq.orgName':[{type: "string", required: true, message: '请输入企业名称', trigger: 'blur'}],
-        'certifyReq.creditCode':[{type: "string", required: true, message: '请输入信用代码', trigger: 'blur'}],
+        'certifyReq.orgName':[{type: "string", required: true, message: '请输入企业名称', trigger: 'change'}],
+        'certifyReq.creditCode':[{type: "string", required: true, message: '请输入信用代码', trigger: 'change'}],
         imgUrlC1Date:[{type: "array", required: true, message: '请选择有效日期', trigger: 'blur'}],
         'certifyReq.assignorName':[{type: "string", required: true, message: '请输入委托人姓名', trigger: 'blur'}],
         'certifyReq.assignorCertNo':[{type: "string", required: true, message: '请输入证件号码', trigger: 'blur'}],
         imgUrlC5Date:[{type: "array", required: true, message: '请选择有效日期', trigger: 'change'}],
-        'certifyReq.legalName':[{type: "string", required: true, message: '请输入法人姓名', trigger: 'blur'}],
-        'certifyReq.legalCertNo':[{type: "string", required: true, message: '请输入证件号码', trigger: 'blur'}],
+        'certifyReq.legalName':[{type: "string", required: true, message: '请输入法人姓名', trigger: 'change'}],
+        'certifyReq.legalCertNo':[{type: "string", required: true, message: '请输入证件号码', trigger: 'change'}],
         imgUrlC3Date:[{type: "array", required: true, message: '请选择有效日期', trigger: 'change'}],
         imgUrlP5:[{type: "string", required: true, message: '请上传图片', trigger: 'blur'}],
         imgUrlP5Date:[{type: "array", required: true, message: '请选择有效日期', trigger: 'change'}],
@@ -1671,7 +1679,8 @@ export default {
         }
       ],
       orgScopeLIST:[],
-      certifyStatus: ''
+      certifyStatus: '',
+      idCardError:false,
     };
   },
   computed: {
@@ -2313,7 +2322,7 @@ export default {
               attachmentExt: path.ext,
               attachmentSize: path.size,
             };
-            console.log('vm.formData--', vm.formData, fileLimit);
+            console.log(vm.formData.imgUrlC2,'--------------');
             vm.setImgUrl(path, fileLimit);
             vm.$message.success("上传成功");
           });
@@ -2844,6 +2853,7 @@ export default {
             const {wordsResult} = data.ocrCardDto;
             if(wordsResult) {
               const {creditCode, establishmentDate, orgName, validDate} = wordsResult;
+              this.$refs.imgUrlC1.clearValidate();
               vm.formData.certifyReq.orgName = orgName;
               vm.formData.certifyReq.creditCode = creditCode;
               if(establishmentDate && validDate) {
@@ -2860,6 +2870,7 @@ export default {
     },
     // 身份证正面/反面OCR上传后的回调处理
     idCardFileHandle(file, type, legal) {
+      console.log(type);
       file['cardSide'] = type;
       console.log('---cardSide', file);
       idCardOcr(file).then((res) => {
@@ -2867,8 +2878,27 @@ export default {
           const { code, data } = res;
           if (code === '000000') {
             console.log('---data', data);
+            if(!data.ocrCardDto.ocrStatus) {
+              this.$message.error(data.ocrCardDto.ocrMessage || '身份证识别失败，请重新上传');
+              if(type === 1){
+                console.log('上传身份证正面');
+                setTimeout(() => {
+                  this.formData.imgUrlC2 = ''
+                }, 500);
+              }
+              if(type === 2){
+                setTimeout(() => {
+                  this.formData.imgUrlC3 = ''
+                }, 500);
+              }
+              return;
+            }
             if(data.ocrCardDto.wordsResultDto){
+              this.$refs.idCard.clearValidate();
               const {cardNo,name} = data.ocrCardDto.wordsResultDto;
+              if(!cardNo || !name) { // 身份证内容识别失败
+                this.idCardError = true
+              }
               if(legal == 'legal'){
                 vm.formData.certifyReq.legalName = name;
                 vm.formData.certifyReq.legalCertNo = cardNo;
@@ -2879,7 +2909,11 @@ export default {
             }
 
             if(data.ocrCardDto.wordsResultBackDto){
+              this.$refs.idCardBack.clearValidate();
               const {signYmd, endYmd} = data.ocrCardDto.wordsResultBackDto;
+              if(!signYmd || !endYmd) { // 身份证内容识别失败
+                this.idCardError = true
+              }
               if(legal == 'legal'){
                 vm.formData.imgUrlC3Date = [signYmd, endYmd];
                 vm.formData.certifyReq.legalValidDateBegin = signYmd;