feat: 联调商家入驻开店

components.d.ts

@@ -16,6 +16,7 @@ declare module 'vue' {
     ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
     ElCascader: typeof import('element-plus/es')['ElCascader']
     ElCol: typeof import('element-plus/es')['ElCol']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElIcon: typeof import('element-plus/es')['ElIcon']
@@ -26,6 +27,7 @@ declare module 'vue' {
     ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSelectV2: typeof import('element-plus/es')['ElSelectV2']
     ElStatistic: typeof import('element-plus/es')['ElStatistic']
     ElStep: typeof import('element-plus/es')['ElStep']
     ElSteps: typeof import('element-plus/es')['ElSteps']
@@ -36,4 +38,7 @@ declare module 'vue' {
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
   }
+  export interface ComponentCustomProperties {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
 }

src/api/login.js

@@ -97,7 +97,6 @@ export function GetPostion (params){
   })
 }
 
-//废弃测试接口
 export function GetBank (data){
   return  new Promise((resolve, reject) => {
     http({
@@ -110,47 +109,12 @@ export function GetBank (data){
   })
 }
 
-export function merchApply(params){
+export function merchApply(data){
   return  new Promise((resolve, reject) => {
-    const form={
-      bank_name: params.bank_name,
-      bank_branch_name: params.bank_branch_name,
-      account_number: params.account_number,
-      account_holder_name: params.account_holder_name,
-      biz_category: params.biz_category,
-      biz_license_company: params.biz_license_company,
-      biz_license_image: params.biz_license_image,
-      biz_license_number: params.biz_license_number,
-      biz_second_category: params.biz_second_category,
-      city_id: params.city_id,
-      contact_name: params.contact_name,
-      county_id: params.county_id,
-      entity_type: params.entity_type,
-      environment_image: params.environment_image,
-      front_facade_image: params.front_facade_image,
-      individual_id_images: params.individual_id_images,
-      individual_id_images2: params.individual_id_images2,
-      individual_id_number: params.individual_id_number,
-      legal_person_id_images: params.legal_person_id_images,
-      legal_person_id_images2: params.legal_person_id_images2,
-      legal_person_id_number: params.legal_person_id_number,
-      legal_person_mobile: params.legal_person_mobile,
-      legal_person_name: params.legal_person_name,
-      license_image: params.license_imageToString,
-      license_number: params.license_number,
-      license_type: params.license_type,
-      login_mobile: params.login_mobile,
-      province_id: params.province_id,
-      store_address: params.postion+params.store_address,
-      store_latitude: params.store_latitude,
-      store_longitude: params.store_longitude,
-      store_name: params.store_name,
-    }
-    console.log("这是数据",form);
     http({
       url:'/api/mobile/shop/merch/apply',
       method:'post',
-      data:form
+      data
     }).then(res=>{
       resolve(res)
     }).catch(e => reject(console.warn(e)))

src/api/upload.js

@@ -30,4 +30,29 @@ export function uploadFile(file, params = {}) {
     })
    .catch(e => reject(console.warn(e)));
   });
-}
+}
+
+export function batchNoApi (file, type){
+  const formData = new FormData();
+  formData.append('upfile', file);
+  formData.append('imgType', type);
+  return new Promise((resolve, reject) => {
+    http({
+      url:'/api/mobile/shop/lakala/tk/uploadOcrImg',
+      method: 'post',
+      data: formData,
+    })
+   .then(res => {
+      resolve(res);
+    })
+   .catch(e => reject(console.warn(e)));
+  });
+}
+
+export function imgOcrResultApi (data){
+  return  http({
+    url:'/api/mobile/shop/lakala/tk/imgOcrResult',
+    method:'POST',
+    data,
+  })
+}

src/views/start/start.vue

@@ -12,6 +12,9 @@
         ref="formRef"
         label-width="160px"
         style="max-width: 600px"
+        v-loading.fullscreen.lock="loading"
+        element-loading-text="数据加载中..."
+        element-loading-background="rgba(0,0,0,.75)"
       >
         <div class="from_box">
           <div class="tit">店铺信息</div>
@@ -47,14 +50,14 @@
           </el-form-item>
           <el-form-item label="所在地区" prop="map_address">
             <el-cascader
-            style="marginRight:5px"
+              style="marginright: 5px"
               v-model="applyFormData.map_address"
               :options="cascaderOptions2"
               @change="handleChange"
             />
             <el-autocomplete
-            v-if="applyFormData.map_address"
+              v-if="applyFormData.map_address"
-            style="width:180px;"
+              style="width: 180px"
               v-model="applyFormData.position"
               placeholder="试试搜索，快速填写地址"
               :fetch-suggestions="querySearch"
@@ -76,7 +79,11 @@
               </template>
             </el-autocomplete>
           </el-form-item>
-          <el-form-item label="详细地址" prop="store_address"  v-if="applyFormData.map_address">
+          <el-form-item
+            label="详细地址"
+            prop="store_address"
+            v-if="applyFormData.map_address"
+          >
             <el-input
               v-model="applyFormData.store_address"
               placeholder="请输入详细地址"
@@ -205,6 +212,14 @@
                   <Plus />
                 </el-icon>
               </el-upload>
+
+              <el-button
+              type="info"
+              plain
+              v-if="applyFormData.biz_license_image && !applyFormData.biz_license_company"
+              @click="handleOcrText(currentBbatchNo, 'biz_license_image')"
+              >点击免填营业执照信息</el-button
+            >
             </el-form-item>
             <el-form-item
               label="公司名称"
@@ -347,6 +362,13 @@
                   <Plus />
                 </el-icon>
               </el-upload>
+              <el-button
+              type="info"
+              plain
+              v-if="applyFormData.legal_person_id_images && !applyFormData.legal_person_id_number"
+              @click="handleOcrText(currentBbatchNo, 'legal_person_id_images')"
+              >点击免填身份证</el-button
+            >
             </el-form-item>
             <el-form-item
               :label="getLabel('legal_person_id_images2', 1)"
@@ -473,7 +495,11 @@
                 </el-icon>
               </el-upload>
             </el-form-item>
-            <el-form-item label="个人身份证号" prop="individual_id_number" v-if="applyFormData.individual_id_images">
+            <el-form-item
+              label="个人身份证号"
+              prop="individual_id_number"
+              v-if="applyFormData.individual_id_images"
+            >
               <el-input
                 v-model="applyFormData.individual_id_number"
                 placeholder="请输入个人身份证号"
@@ -484,69 +510,74 @@
 
         <div class="from_box">
           <div class="tit">结算信息</div>
-          <el-form-item
+          <el-form-item label="银行卡" prop="bank_image">
-              label="银行卡"
+            <el-upload
-              prop="bank_image"
+              ref="uploadRef"
+              :limit="1"
+              list-type="picture-card"
+              :auto-upload="true"
+              :on-preview="handlePictureCardPreview"
+              v-model="applyFormData.bank_image"
+              :on-remove="
+                (file, fileList) => handleRemove(file, fileList, 'bank_image')
+              "
+              :on-success="
+                (response, file, fileList) =>
+                  handleUploadSuccess(response, file, fileList, 'bank_image')
+              "
+              :on-error="handleUploadError"
+              :before-upload="beforeUpload"
+              :action="uploadUrl"
+              name="upfile"
+              :class="{
+                'upload-hidden': isUploadHidden('bank_image'),
+              }"
             >
-              <el-upload
+              <el-icon class="avatar-uploader-icon">
-                ref="uploadRef"
+                <Plus />
-                :limit="1"
+              </el-icon>
-                list-type="picture-card"
+            </el-upload>
-                :auto-upload="true"
+            <el-button
-                :on-preview="handlePictureCardPreview"
+              type="info"
-                v-model="applyFormData.bank_image"
+              plain
-                :on-remove="
+              v-if="applyFormData.bank_image && !applyFormData.account_number"
-                  (file, fileList) =>
+              @click="handleOcrText(currentBbatchNo, 'bank_image')"
-                    handleRemove(file, fileList, 'bank_image')
+              >点击免填银行卡号</el-button
-                "
+            >
-                :on-success="
+          </el-form-item>
-                  (response, file, fileList) =>
+          <template v-if="applyFormData.bank_image">
-                    handleUploadSuccess(
+            <el-form-item label="账户姓名" prop="account_holder_name">
-                      response,
+              <el-input v-model="applyFormData.account_holder_name" />
-                      file,
-                      fileList,
-                      'bank_image'
-                    )
-                "
-                :on-error="handleUploadError"
-                :before-upload="beforeUpload"
-                :action="uploadUrl"
-                name="upfile"
-                :class="{
-                  'upload-hidden': isUploadHidden('bank_image'),
-                }"
-              >
-                <el-icon class="avatar-uploader-icon">
-                  <Plus />
-                </el-icon>
-              </el-upload>
             </el-form-item>
-            <template v-if="applyFormData.bank_image">
+            <el-form-item label="收款账户号码" prop="account_number">
-                <el-form-item label="账户姓名" prop="account_holder_name">
+              <el-input v-model="applyFormData.account_number" />
-            <el-input v-model="applyFormData.account_holder_name" />
+            </el-form-item>
-          </el-form-item>
+            <el-form-item label="开户银行" prop="bank_branch_name">
-          <el-form-item label="收款账户号码" prop="account_number">
+              <el-select-v2
-            <el-input v-model="applyFormData.account_number" />
+                clearable
-          </el-form-item>
+                filterable
-          <el-form-item label="开户银行" prop="bank_name">
+                remote
-            <el-select
+                @change="bankListChange"
-              v-model="applyFormData.bank_name"
+                :remote-method="bankListRemoteMethod"
-              placeholder="请选择银行"
+                v-model="applyFormData.bank_branch_name"
-              size="large"
+                placeholder="搜索银行名称"
-              style="width: 240px"
+                size="large"
-            >
+                placement="top-start"
-              <el-option
+                style="width: 350px"
+                :options="bankList2"
+              >
+                <!-- <el-option
                 v-for="bank in bankList2"
                 :key="bank.id"
-                :label="bank.bank_name"
+                :label="bank.branch_bank_name"
-                :value="bank.bank_name"
+                :value="bank.branch_bank_name"
-              />
+              /> -->
-            </el-select>
+              </el-select-v2>
-          </el-form-item>
+            </el-form-item>
-          <el-form-item label="支行名称" prop="bank_branch_name">
+            <!-- <el-form-item label="支行名称" prop="bank_branch_name">
             <el-input v-model="applyFormData.bank_branch_name" />
-          </el-form-item>
+          </el-form-item> -->
-            </template>
+          </template>
         </div>
       </el-form>
     </div>
@@ -558,8 +589,8 @@
     </div>
 
     <el-dialog v-model="dialogVisible" width="max-content">
-    <img w-full :src="dialogImageUrl" alt="Preview Image" />
+      <img w-full :src="dialogImageUrl" alt="Preview Image" />
-  </el-dialog>
+    </el-dialog>
   </div>
 </template>
 
@@ -576,15 +607,86 @@ import {
   GetPostion,
   GetBank,
   merchApply,
+  re_apply,
   GetAppDistrict,
 } from "@/api/login";
 
+import { batchNoApi, imgOcrResultApi } from "@/api/upload";
+
+interface Bank {
+  id: number;
+  bank_name: string;
+}
+
+const orcImgTypeConf = {
+  FR_ID_CARD_FRONT: "FR_ID_CARD_FRONT",
+  FR_ID_CARD_BEHIND: "FR_ID_CARD_BEHIND",
+  ID_CARD_FRONT: "ID_CARD_FRONT",
+  ID_CARD_BEHIND: "ID_CARD_BEHIND",
+  BUSINESS_LICENCE: "BUSINESS_LICENCE",
+  BANK_CARD: "BANK_CARD",
+};
+
+const userStore = useUserStore();
+
+const processData = () => {
+  const { provinceData, cityData: cityList, areaData } = cityData;
+  return provinceData.map((province, provinceIndex) => {
+    const provinceItem = {
+      ...province,
+      children: cityList[provinceIndex].map((city, cityIndex) => {
+        const cityItem = {
+          ...city,
+        };
+        if (areaData[provinceIndex] && areaData[provinceIndex][cityIndex]) {
+          cityItem.children = areaData[provinceIndex][cityIndex];
+        }
+        return cityItem;
+      }),
+    };
+    return provinceItem;
+  });
+};
+
 const active = ref(1);
+const loading = ref(false);
 const formRef = ref(null);
 const dialogVisible = ref(false);
-const dialogImageUrl = ref('');
+const dialogImageUrl = ref("");
+const bankNameSearchText = ref("");
+const selectedValue = ref([]);
+const value = ref([]);
+const cascaderOptions = ref([]);
+const cascaderOptions2 = ref(processData());
+const cityData2 = ref<CityDataStructure>();
+const cascaderOptions3 = ref();
+//hover触发选择
+const cascaderProps = ref({
+  value: "value",
+  label: "label",
+  children: "children",
+  expandTrigger: "hover" as const,
+});
+const bankList2 = ref([]);
+
+let orcTimeout = 0;
+let currentFile = ref(null);
+let currentBbatchNo = ref('');
+
+const handleChangeBizCategory = (value) => {
+  if (value && value.length === 2) {
+    const [bizCategoryId, bizSecondCategoryId] = value;
+    applyFormData.biz_category = bizCategoryId;
+    applyFormData.biz_second_category = bizSecondCategoryId;
+  }
+};
+const currentBankItem = reactive(null);
 const applyFormData = reactive({
   bank_name: "",
+  bank_district: "",
+  bank_area: "",
+  openning_bank_code: "",
+  clearing_bank_code: "",
   bank_branch_name: "",
   account_number: "",
   account_holder_name: "",
@@ -649,7 +751,7 @@ const rules = reactive({
   map_address: [
     { required: true, message: "请选择地图地址", trigger: "change" },
   ],
-//   position: [{ required: true, message: "请选择地图地址", trigger: "change" }],
+  //   position: [{ required: true, message: "请选择地图地址", trigger: "change" }],
   store_address: [
     { required: true, message: "请输入详细地址", trigger: "blur" },
   ],
@@ -699,7 +801,9 @@ const rules = reactive({
   bank_image: [
     { required: true, message: "请上传银行卡正面", trigger: "change" },
   ],
-  bank_name: [{ required: true, message: "请选择银行", trigger: "change" }],
+  bank_branch_name: [
+    { required: true, message: "请选择银行", trigger: "change" },
+  ],
   // bank_branch_name: [{ required: true, message: '请输入支行名称', trigger: 'blur' }],
   account_number: [
     { required: true, message: "请输入收款账户号码", trigger: "blur" },
@@ -709,13 +813,173 @@ const rules = reactive({
   ],
 });
 
+const handleReApply = async () => {
+  const {
+    bank_name,
+    bank_district,
+    bank_area,
+    openning_bank_code,
+    clearing_bank_code,
+    account_number,
+    account_holder_name,
+    biz_category,
+    biz_license_company,
+    biz_license_image,
+    biz_license_number,
+    biz_second_category,
+    city_id,
+    contact_name,
+    county_id,
+    entity_type,
+    environment_image,
+    front_facade_image,
+    individual_id_images,
+    individual_id_images2,
+    individual_id_number,
+    legal_person_id_images,
+    legal_person_id_images2,
+    legal_person_id_number,
+    legal_person_mobile,
+    legal_person_name,
+    license_image,
+    license_number,
+    license_type,
+    login_mobile,
+    province_id,
+    store_address,
+    store_latitude,
+    store_longitude,
+    store_name,
+    store_area,
+  } = applyFormData;
+  const res = await re_apply({
+    id: 15,
+    bank_name,
+    bank_district,
+    bank_area,
+    openning_bank_code,
+    clearing_bank_code,
+    account_number,
+    account_holder_name,
+    biz_category,
+    biz_license_company,
+    biz_license_image,
+    biz_license_number,
+    biz_second_category,
+    city_id,
+    contact_name,
+    county_id,
+    entity_type,
+    environment_image,
+    front_facade_image,
+    individual_id_images,
+    individual_id_images2,
+    individual_id_number,
+    legal_person_id_images,
+    legal_person_id_images2,
+    legal_person_id_number,
+    legal_person_mobile,
+    legal_person_name,
+    license_image,
+    license_number,
+    license_type,
+    login_mobile,
+    province_id,
+    store_address: store_area.replace(/\//g, "") + store_address,
+    store_latitude,
+    store_longitude,
+    store_name,
+    store_area,
+  });
+};
+
+const handleMerchApply = async () => {
+  const {
+    bank_name,
+    bank_district,
+    bank_area,
+    openning_bank_code,
+    clearing_bank_code,
+    account_number,
+    account_holder_name,
+    biz_category,
+    biz_license_company,
+    biz_license_image,
+    biz_license_number,
+    biz_second_category,
+    city_id,
+    contact_name,
+    county_id,
+    entity_type,
+    environment_image,
+    front_facade_image,
+    individual_id_images,
+    individual_id_images2,
+    individual_id_number,
+    legal_person_id_images,
+    legal_person_id_images2,
+    legal_person_id_number,
+    legal_person_mobile,
+    legal_person_name,
+    license_image,
+    license_number,
+    license_type,
+    login_mobile,
+    province_id,
+    store_address,
+    store_latitude,
+    store_longitude,
+    store_name,
+    store_area,
+  } = applyFormData;
+  const res = await merchApply({
+    bank_name,
+    bank_district,
+    bank_area,
+    openning_bank_code,
+    clearing_bank_code,
+    account_number,
+    account_holder_name,
+    biz_category,
+    biz_license_company,
+    biz_license_image,
+    biz_license_number,
+    biz_second_category,
+    city_id,
+    contact_name,
+    county_id,
+    entity_type,
+    environment_image,
+    front_facade_image,
+    individual_id_images,
+    individual_id_images2,
+    individual_id_number,
+    legal_person_id_images,
+    legal_person_id_images2,
+    legal_person_id_number,
+    legal_person_mobile,
+    legal_person_name,
+    license_image,
+    license_number,
+    license_type,
+    login_mobile,
+    province_id,
+    store_address: store_area.replace(/\//g, "") + store_address,
+    store_latitude,
+    store_longitude,
+    store_name,
+    store_area,
+  });
+};
+
 const checkForm = async () => {
   const isValid = await (formRef.value as any).validate((valid) => {
     return valid;
   });
 
   if (isValid) {
-    console.log("可以通过");
+    handleReApply();
+    // handleMerchApply
   }
 };
 
@@ -748,8 +1012,8 @@ const getLabel = (field: string, limit: number) => {
     license_image: "许可证",
     legal_person_id_images: "法人身份证正面",
     legal_person_id_images2: "法人身份证反面",
-    individual_id_images: "身份证正面",
+    individual_id_images: "个人身份证正面",
-    individual_id_images2: "身份证反面",
+    individual_id_images2: "个人身份证反面",
   };
 
   if (field === "license_image") {
@@ -760,7 +1024,6 @@ const getLabel = (field: string, limit: number) => {
   }
 };
 
-const userStore = useUserStore();
 const showAll = () => {
   applyFormData.license_imageToString = applyFormData.license_image
     .map((url) => `${url}`)
@@ -768,108 +1031,47 @@ const showAll = () => {
 };
 
 const merchToApply = async () => {
+  console.log("formdata", applyFormData);
   showAll();
   checkForm();
-  const res = await merchApply(applyFormData);
+};
-  if (res && res.status === 200) {
-    // ElMessage.success('成功入驻');
-    location.reload();
-    console.log("成功入驻", res);
-  } else {
-    console.log(res.data);
 
-    ElMessage.error(res.data.msg);
+const bankListChange = (val) => {
+  const item = bankList2.value.find((item) => item.value == val);
+  if (item) {
+    applyFormData.bank_name = item.label;
+    applyFormData.bank_district = item.district;
+    applyFormData.bank_area = item.area;
+    applyFormData.openning_bank_code = item.branch_bank_no;
+    applyFormData.clearing_bank_code = item.clear_no;
   }
 };
 
-const selectedValue = ref([]);
+const bankListRemoteMethod = (val) => {
-const value = ref([]);
+  if (!val) {
-const processData = () => {
+    bankList2.value = [];
-  const { provinceData, cityData: cityList, areaData } = cityData;
+    return;
-  return provinceData.map((province, provinceIndex) => {
-    const provinceItem = {
-      ...province,
-      children: cityList[provinceIndex].map((city, cityIndex) => {
-        const cityItem = {
-          ...city,
-        };
-        if (areaData[provinceIndex] && areaData[provinceIndex][cityIndex]) {
-          cityItem.children = areaData[provinceIndex][cityIndex];
-        }
-        return cityItem;
-      }),
-    };
-    return provinceItem;
-  });
-};
-
-const cascaderOptions = ref([]);
-const cascaderOptions2 = ref(processData());
-const cityData2 = ref<CityDataStructure>();
-const cascaderOptions3 = ref();
-//hover触发选择
-const cascaderProps = ref({
-  value: "value",
-  label: "label",
-  children: "children",
-  expandTrigger: "hover" as const,
-});
-
-const handleChangeBizCategory = (value) => {
-  if (value && value.length === 2) {
-    const [bizCategoryId, bizSecondCategoryId] = value;
-    applyFormData.biz_category = bizCategoryId;
-    applyFormData.biz_second_category = bizSecondCategoryId;
   }
-};
-interface Bank {
-  id: number;
-  bank_name: string;
-}
-
-const bankList2 = ref<Bank[]>([]);
-
-onMounted(() => {
-  GetStoreCategories()
-    .then((res) => {
-      if (res.code === 0 && res.status === 200) {
-        cascaderOptions.value = transformStoreCategories(res.data);
-      } else {
-      }
-    })
-    .catch((err) => {
-      ElMessage.error("获取店铺分类失败");
-    });
 
   GetBank({
-    keyword: "中国工商银行桂平", // 银行名称关键字,小地方支行，查不到，调整关键字范围，尝试市级银行
+    keyword: val, // 银行名称关键字,小地方支行，查不到，调整关键字范围，尝试市级银行
     pageNum: 1,
-    pageSize: 10,
+    pageSize: 2000,
-  })
+  }).then((res) => {
-    .then((res) => {
+    if (res.status == 200) {
-      if (res.code === 0 && res.status === 200) {
+      bankList2.value = res.data.items.map((item) => {
-        bankList2.value = res.data;
+        return {
-      } else {
+          district: item.district,
-        ElMessage.error("获取银行失败");
+          area: item.area,
-      }
+          branch_bank_no: item.branch_bank_no,
-    })
+          clear_no: item.clear_no,
-    .catch((err) => {
+          label: item.branch_bank_name,
-      ElMessage.error("获取银行失败");
+          value: item.branch_bank_no,
-    });
+        };
-
+      });
-  GetAppDistrict()
+    }
-    .then((res) => {
+  });
-      if (res.code === 0 && res.status === 200) {
+};
-        cityData2.value = res.data;
-        console.log(cascaderOptions3.value);
-      } else {
-        ElMessage.error("获取银行失败");
-      }
-    })
-    .catch((err) => {
-      ElMessage.error("获取银行失败");
-    });
-});
 
 const handleChange = (value) => {
   // 假设 cascader 的值是一个数组，格式为 [省份ID, 城市ID, 区县ID]
@@ -899,10 +1101,11 @@ const handleChange = (value) => {
     return findName(cascaderOptions2.value, id);
   });
 
-  applyFormData.mapAddressLabel = names?.join("/");
+  const str = names?.join("/");
-  applyFormData.store_area = names?.join("/");
+
-  applyFormData.position = '';
+  applyFormData.mapAddressLabel = str;
-  applyFormData.store_address = '';
+  applyFormData.store_area = str;
+  formRef.value.validate();
 };
 
 const autocompleteOptions = ref([]);
@@ -921,7 +1124,6 @@ const querySearch = async (queryString, cb) => {
     };
 
     const res = await GetPostion(params);
-    console.log(res);
 
     if (res?.result?.length) {
       const results = res.result
@@ -948,11 +1150,9 @@ const querySearch = async (queryString, cb) => {
 const handleSelect = (item) => {
   applyFormData.position = "";
   applyFormData.store_address = item.value;
-  applyFormData.store_address = item.value;
-  formRef.value.validate();
-  console.log(item.value);
   applyFormData.store_latitude = item.lat;
   applyFormData.store_longitude = item.lng;
+  formRef.value.validate();
 };
 
 const beforeUpload = (file) => {
@@ -960,11 +1160,15 @@ const beforeUpload = (file) => {
   const isPNG = file.type === "image/png";
   const isLt2M = file.size / 1024 / 1024 < 2;
 
+  loading.value = true;
+
   if (!isJPG && !isPNG) {
+    loading.value = false;
     ElMessage.error("上传的图片必须是JPG或PNG格式！");
     return false;
   }
   if (!isLt2M) {
+    loading.value = false;
     ElMessage.error("上传的图片大小不能超过2MB！");
     return false;
   }
@@ -1001,12 +1205,79 @@ const handleExceed = (files, fileList) => {
   ElMessage.warning(`最多只能上传1张图片`);
 };
 
-const handlePictureCardPreview=(uploadFile)=>{
+const handlePictureCardPreview = (uploadFile) => {
-    dialogImageUrl.value = uploadFile.url!
+  dialogImageUrl.value = uploadFile.url!;
-    dialogVisible.value = true
+  dialogVisible.value = true;
-}
+};
 
-const handleUploadSuccess = (response, file, fileList, field) => {
+const getBatchNo = async (file, type) => {
+  loading.value = true;
+  const rsp = await batchNoApi(file, type).then((res) => {
+    return res;
+  });
+  loading.value = false;
+  if (rsp.status == 200) {
+    return rsp?.data;
+  } else {
+    return null;
+  }
+};
+
+const getOcrText = async (batchNo, type) => {
+  return new Promise(async (resolve, reject) => {
+    let formData: null | FormData = new FormData();
+
+    formData.append("batchNo", batchNo);
+    formData.append("imgType", type);
+
+    clearTimeout(orcTimeout);
+
+    orcTimeout = setTimeout(async () => {
+      const imgOcrRes = await imgOcrResultApi(formData);
+
+      formData = null;
+      clearTimeout(orcTimeout);
+
+      if (imgOcrRes.status != 200) {
+        reject(imgOcrRes?.data);
+      } else {
+        resolve(imgOcrRes?.data);
+      }
+      loading.value = false;
+    }, 1000);
+  });
+};
+
+const handleOcrText = async (batchNo, imgType) => {
+  loading.value = true;
+
+  switch (imgType) {
+    case "biz_license_image":
+      var res = (await getOcrText(batchNo, orcImgTypeConf.BUSINESS_LICENCE)) as any;
+
+      console.log("biz_license_image", res);
+      applyFormData.biz_license_company = res.bizLicenseCompanyName;
+      applyFormData.legal_person_name = res.bizLicenseOwnerName;
+      applyFormData.biz_license_number = res.bizLicenseCreditCode;
+      applyFormData.account_holder_name = res.bizLicenseCompanyName;
+      break;
+    case "legal_person_id_images":
+      var res = (await getOcrText(batchNo, orcImgTypeConf.ID_CARD_FRONT)) as any;
+
+      console.log("legal_person_id_images", res);
+      applyFormData.legal_person_id_number = res.idNumber;
+      break;
+    case "bank_image":
+      var res = (await getOcrText(batchNo, orcImgTypeConf.BANK_CARD)) as any;
+      console.log("bank_image", res);
+      applyFormData.account_number = res.card_number;
+      break;
+  }
+
+  loading.value = false;
+};
+
+const handleUploadSuccess = async (response, file, fileList, field) => {
   if (response && response.status === 200 && response.code === 0) {
     if (response.data && response.data.url) {
       file.url = response.data.url;
@@ -1016,39 +1287,89 @@ const handleUploadSuccess = (response, file, fileList, field) => {
       } else {
         applyFormData[field] = file.url;
       }
-      formRef.value.validate();
+      loading.value = false;
+      currentFile.value = file.raw;
+
+      switch (field) {
+        case "biz_license_image":
+          var res = await getBatchNo(file.raw, orcImgTypeConf.BUSINESS_LICENCE);
+          currentBbatchNo.value = res.batchNo
+          handleOcrText(res.batchNo, field)
+          break;
+        case "legal_person_id_images":
+          var res = await getBatchNo(file.raw, orcImgTypeConf.ID_CARD_FRONT);
+          currentBbatchNo.value = res.batchNo
+          handleOcrText(res.batchNo, field)
+          break;
+        case "bank_image":
+          var res = await getBatchNo(file.raw, orcImgTypeConf.BANK_CARD);
+          currentBbatchNo.value = res.batchNo
+          handleOcrText(res.batchNo, field)
+          break;
+      }
     } else {
       ElMessage.error("文件上传成功，但未返回文件 URL");
+      loading.value = false;
     }
   } else {
     ElMessage.error(response.msg || "文件上传失败");
+    loading.value = false;
   }
 };
 
 const handleUploadError = (error, file) => {
+  loading.value = false;
   ElMessage.error("文件上传失败");
 };
 const clearOtherFields = () => {
-  if (applyFormData.entity_type === 1) {
+  //   if (applyFormData.entity_type === 1) {
-    // 清空个人部分的字段
+  //     // 清空个人部分的字段
-    applyFormData.individual_id_number = "";
+  //     applyFormData.individual_id_number = "";
-    applyFormData.individual_id_images = "";
+  //     applyFormData.individual_id_images = "";
-    applyFormData.individual_id_images2 = "";
+  //     applyFormData.individual_id_images2 = "";
-  } else if (applyFormData.entity_type === 2) {
+  //   } else if (applyFormData.entity_type === 2) {
-    // 清空企业部分的字段
+  //     // 清空企业部分的字段
-    applyFormData.license_type = "1";
+  //     applyFormData.license_type = "1";
-    applyFormData.license_number = "";
+  //     applyFormData.license_number = "";
-    applyFormData.biz_license_number = "";
+  //     applyFormData.biz_license_number = "";
-    applyFormData.biz_license_company = "";
+  //     applyFormData.biz_license_company = "";
-    applyFormData.legal_person_name = "";
+  //     applyFormData.legal_person_name = "";
-    applyFormData.legal_person_mobile = "";
+  //     applyFormData.legal_person_mobile = "";
-    applyFormData.legal_person_id_number = "";
+  //     applyFormData.legal_person_id_number = "";
-    applyFormData.biz_license_image = "";
+  //     applyFormData.biz_license_image = "";
-    applyFormData.license_image = [];
+  //     applyFormData.license_image = [];
-    applyFormData.legal_person_id_images = "";
+  //     applyFormData.legal_person_id_images = "";
-    applyFormData.legal_person_id_images2 = "";
+  //     applyFormData.legal_person_id_images2 = "";
-  }
+  //   }
 };
+
+onMounted(() => {
+  bankListRemoteMethod();
+
+  GetStoreCategories()
+    .then((res) => {
+      if (res.code === 0 && res.status === 200) {
+        cascaderOptions.value = transformStoreCategories(res.data);
+      } else {
+      }
+    })
+    .catch((err) => {
+      ElMessage.error("获取店铺分类失败");
+    });
+
+  GetAppDistrict()
+    .then((res) => {
+      if (res.code === 0 && res.status === 200) {
+        cityData2.value = res.data;
+        console.log(cascaderOptions3.value);
+      } else {
+        ElMessage.error("获取银行失败");
+      }
+    })
+    .catch((err) => {
+      ElMessage.error("获取银行失败");
+    });
+});
 </script>
 
 <style lang="scss" scoped>