Lou
2024-04-03 2000221edb7ad8dfab493fa0b5f08a5a92cd1e53
subPackage/contradiction/edit.vue
@@ -3,40 +3,68 @@
      <u-form labelPosition="left" :model="info" :rules="rules" ref="form" labelWidth="100"
         :labelStyle="{fontSize:'30rpx'}">
         <view class="content bgc-ff mb-20">
            <u-form-item label="当事人1姓名" prop="nameOne" borderBottom required>
               <u-input v-model="info.nameOne" border="none" placeholder="请输入当事人1姓名" placeholderClass="f-28 c-99"
                  inputAlign="right"></u-input>
            </u-form-item>
            <u-form-item label="当事人1手机号" prop="phoneOne" borderBottom required>
               <u-input v-model="info.phoneOne" type="number" border="none" placeholder="请输入当事人1手机号"
                  placeholderClass="f-28 c-99" inputAlign="right"></u-input>
            </u-form-item>
            <u-form-item label="当事人1性别" prop="genderOne" borderBottom @click="showGenderPicker = true">
               <u-input v-model="genderValue" border="none" placeholder="请选择当事人1性别" placeholderClass="f-28 c-99"
                  inputAlign="right" disabled disabledColor="#ffffff"></u-input>
               <u-icon slot="right" name="arrow-right"></u-icon>
            </u-form-item>
            <u-form-item label="当事人1身份证号码" prop="idCardOne" borderBottom required>
               <u-input v-model="info.idCardOne" type="idcard" border="none" placeholder="请输入当事人1身份证号码"
                  placeholderClass="f-28 c-99" inputAlign="right"></u-input>
            </u-form-item>
            <u-form-item label="当事人2姓名" prop="nameTwo" borderBottom required>
               <u-input v-model="info.nameTwo" border="none" placeholder="请输入当事人2姓名" placeholderClass="f-28 c-99"
                  inputAlign="right"></u-input>
            </u-form-item>
            <u-form-item label="当事人2性别" prop="genderTwo" borderBottom @click="showGender2Picker = true">
               <u-input v-model="genderValue2" border="none" placeholder="请选择当事人2性别" placeholderClass="f-28 c-99"
                  inputAlign="right" disabled disabledColor="#ffffff"></u-input>
               <u-icon slot="right" name="arrow-right"></u-icon>
            </u-form-item>
            <u-form-item label="当事人2手机号" prop="phoneTwo" borderBottom ref="phoneTwo" required>
               <u-input v-model="info.phoneTwo" type="number" border="none" placeholder="请输入当事人2手机号"
                  placeholderClass="f-28 c-99" inputAlign="right"></u-input>
            </u-form-item>
            <u-form-item label="当事人2身份证号码" prop="idCardTwo" required>
               <u-input v-model="info.idCardTwo" type="idcard" border="none" placeholder="请输入当事人2身份证号码"
                  placeholderClass="f-28 c-99" inputAlign="right"></u-input>
            </u-form-item>
            <view class="">
               <view class="form-caption flex j-c-s-b a-i-c">
                  <text class="f-32 fw">当事人1信息</text>
                  <ocr-navigator @onSuccess="recognizeSuccess($event,'one')" certificateType="idCard"
                     :opposite="false">
                     <view class="recognize-btn flex a-i-c">
                        <u-icon name="scan" color="#fff" size="24"></u-icon>
                        <text class="f-26 c-ff" style="margin-left: 10rpx;">身份证信息识别</text>
                     </view>
                  </ocr-navigator>
               </view>
               <u-form-item label="姓名" prop="nameOne" borderBottom required>
                  <u-input v-model="info.nameOne" border="none" placeholder="请输入当事人1姓名"
                     placeholderClass="f-28 c-99" inputAlign="right"></u-input>
               </u-form-item>
               <u-form-item label="手机号" prop="phoneOne" borderBottom required>
                  <u-input v-model="info.phoneOne" type="number" border="none" placeholder="请输入当事人1手机号"
                     placeholderClass="f-28 c-99" inputAlign="right"></u-input>
               </u-form-item>
               <u-form-item label="性别" prop="genderOne" borderBottom @click="showGenderPicker = true">
                  <u-input v-model="genderValue" border="none" placeholder="请选择当事人1性别"
                     placeholderClass="f-28 c-99" inputAlign="right" disabled disabledColor="#ffffff"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
               <u-form-item label="身份证号码" prop="idCardOne" borderBottom required>
                  <u-input v-model="info.idCardOne" type="idcard" border="none" placeholder="请输入当事人1身份证号码"
                     placeholderClass="f-28 c-99" inputAlign="right"></u-input>
               </u-form-item>
            </view>
            <view class="">
               <view class="form-caption flex j-c-s-b a-i-c">
                  <text class="f-32 fw">当事人2信息</text>
                  <ocr-navigator @onSuccess="recognizeSuccess($event,'two')" certificateType="idCard"
                     :opposite="false">
                     <view class="recognize-btn flex a-i-c">
                        <u-icon name="scan" color="#fff" size="24"></u-icon>
                        <text class="f-26 c-ff" style="margin-left: 10rpx;">身份证信息识别</text>
                     </view>
                  </ocr-navigator>
               </view>
               <u-form-item label="姓名" prop="nameTwo" borderBottom required>
                  <u-input v-model="info.nameTwo" border="none" placeholder="请输入当事人2姓名"
                     placeholderClass="f-28 c-99" inputAlign="right"></u-input>
               </u-form-item>
               <u-form-item label="性别" prop="genderTwo" borderBottom @click="showGender2Picker = true">
                  <u-input v-model="genderValue2" border="none" placeholder="请选择当事人2性别"
                     placeholderClass="f-28 c-99" inputAlign="right" disabled disabledColor="#ffffff"></u-input>
                  <u-icon slot="right" name="arrow-right"></u-icon>
               </u-form-item>
               <u-form-item label="手机号" prop="phoneTwo" borderBottom ref="phoneTwo" required>
                  <u-input v-model="info.phoneTwo" type="number" border="none" placeholder="请输入当事人2手机号"
                     placeholderClass="f-28 c-99" inputAlign="right"></u-input>
               </u-form-item>
               <u-form-item label="身份证号码" prop="idCardTwo" required>
                  <u-input v-model="info.idCardTwo" type="idcard" border="none" placeholder="请输入当事人2身份证号码"
                     placeholderClass="f-28 c-99" inputAlign="right"></u-input>
               </u-form-item>
            </view>
         </view>
         <view class="content bgc-ff">
@@ -469,6 +497,45 @@
            this.info.eventTime = uni.$u.timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
         },
         //识别成功
         recognizeSuccess(e, key) {
            let {
               detail: {
                  name,
                  id,
                  address,
                  gender,
                  nationality
               }
            } = e;
            if (key == "one") {
               this.info.nameOne = name.text;
               this.info.idCardOne = id.text;
               this.genderValue = gender.text;
               this.genderIndex = [this.getValue(this.genderList, gender.text).index];
               this.info.genderOne = this.getValue(this.genderList, gender.text).value;
            } else {
               this.info.nameTwo = name.text;
               this.info.idCardTwo = id.text;
               this.genderValue2 = gender.text;
               this.genderIndex2 = [this.getValue(this.genderList, gender.text).index];
               this.info.genderTwo = this.getValue(this.genderList, gender.text).value;
            }
         },
         getValue(arr, name) {
            for (let i = 0, ii = arr.length; i < ii; i++) {
               if (arr[i].name == name) {
                  return {
                     index: i,
                     value: arr[i].value
                  }
               }
            }
         }
      }
   }
</script>
@@ -568,4 +635,15 @@
   /deep/ .u-textarea__field {
      text-align: right;
   }
   .form-caption {
      padding: 20rpx 0;
   }
   .recognize-btn {
      padding: 12rpx;
      border-radius: 6rpx;
      background-color: #3c9cff;
      margin-left: 30rpx;
   }
</style>