From 43fe64d28661b491f96cbb1ac2c1b66d0fb59013 Mon Sep 17 00:00:00 2001
From: mixtan <424491071@qq.com>
Date: Fri, 23 May 2025 21:36:09 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E5=AE=98=E7=BD=91?=
 =?UTF-8?q?=E5=85=8D=E8=B4=B9=E5=BC=80=E5=BA=97UI=EF=BC=9B=E9=87=8D?=
 =?UTF-8?q?=E6=9E=84=E6=B3=A8=E5=86=8C=E7=99=BB=E5=BD=95=E5=BC=B9=E7=AA=97?=
 =?UTF-8?q?UI=E4=BA=A4=E4=BA=92=EF=BC=9B=E5=BC=80=E5=8F=91=E9=A9=B3?=
 =?UTF-8?q?=E5=9B=9E=E5=AE=A1=E6=A0=B8=E5=A1=AB=E5=86=99=E8=B5=84=E6=96=99?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=EF=BC=88=E5=BE=85=E5=AE=8C=E5=96=84=EF=BC=8C?=
 =?UTF-8?q?=E8=BF=99=E7=A7=8D=E6=8C=89=E9=9C=80=E5=81=9A=E7=9A=84=E4=BA=A4?=
 =?UTF-8?q?=E4=BA=92=E5=BE=88=E7=B9=81=E7=90=90=E5=BE=88=E8=B4=B9=E7=B2=BE?=
 =?UTF-8?q?=E5=8A=9B=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/login.js              |   20 +
 src/components/register.vue   |  424 ++++---
 src/views/start/check.vue     | 2127 +++++++++++++++++++++++----------
 src/views/start/formConfig.js |  200 ++++
 src/views/start/start.vue     |   99 +-
 5 files changed, 1922 insertions(+), 948 deletions(-)
 create mode 100644 src/views/start/formConfig.js

diff --git a/src/api/login.js b/src/api/login.js
index e380a5d..fb1461b 100644
--- a/src/api/login.js
+++ b/src/api/login.js
@@ -150,6 +150,26 @@ export function re_apply(params){
     })
 }
 
+/**
+ * 获取申请信息详情
+ * @author Seven
+ * @data 2025-3-4
+ * @param {  }
+ * @returns { mobile:13199998888  }
+ * @see https://mall.gpxscs.cn/mobile/shop/merch/detail
+ */
+
+ export function GetAuditInfo(data) {
+  return  new Promise((resolve, reject) => {
+    http({
+      url:'/api/mobile/shop/merch/detail',
+      method:'post',
+      data,
+    }).then(res=>{
+      resolve(res)
+    }).catch(e => reject(console.warn(e)))
+  })
+}
 
 /**
  * 账号密码登录
diff --git a/src/components/register.vue b/src/components/register.vue
index ac44352..f9ecf76 100644
--- a/src/components/register.vue
+++ b/src/components/register.vue
@@ -1,22 +1,30 @@
 <template>
-    <div class="register-box" v-if="isVisible">
-        <el-form :model="formData" :rules="rules" ref="formRef" label-width="120px" :hide-required-asterisk="true">
-            <div class="register-container">
-                <!-- 关闭按钮 -->
-                <div class="register-close" @click="closeRegisterForm">
-                    ×
-                </div>
-                <!-- 标题 -->
-                <h4>注册</h4>
-                <!-- 手机号输入项 -->
-                <el-form-item label="手机号" prop="phoneNumber">
-                    <el-input v-model="formData.phoneNumber" placeholder="输入11位手机号" maxlength="11" />
-                </el-form-item>
-                <!-- 验证码输入项 -->
-                <el-form-item label="验证码" prop="verificationCode">
-                    <div class="verifyAndButton">
+  <div class="register-box" v-if="isVisible">
+    <el-form
+      :model="formData"
+      :rules="rules"
+      ref="formRef"
+      label-width="88px"
+      :hide-required-asterisk="true"
+    >
+      <div class="register-container">
+        <!-- 关闭按钮 -->
+        <div class="register-close" @click="closeRegisterForm">×</div>
+        <!-- 标题 -->
+        <h4>欢迎登录注册</h4>
+        <!-- 手机号输入项 -->
+        <el-form-item label="手机号" prop="phoneNumber">
+          <el-input
+            v-model="formData.phoneNumber"
+            placeholder="请输入手机号"
+            maxlength="11"
+            size="large"
+          />
+        </el-form-item>
+        <!-- 验证码输入项 -->
+        <el-form-item label="验证码" prop="verificationCode">
+          <!-- <div class="verifyAndButton">
                         <el-input v-model="formData.verificationCode" placeholder="输入验证码" style="flex: 1;" maxlength="4" />
-                        <!-- 获取验证码按钮 -->
                         <button type="button" v-if="!sendCode" :style="{
                             marginLeft: '10px',
                             width: '80px',
@@ -27,7 +35,6 @@
                             cursor: formData.phoneNumber.length === 11? 'pointer' : 'not-allowed'
                         }"
                             :disabled="formData.phoneNumber.length!== 11" @click="getVerify_code">获取验证码</button>
-                        <!-- 倒计时按钮 -->
                         <button v-if="sendCode" :style="{
                             marginLeft: '10px',
                             width: '80px',
@@ -39,36 +46,45 @@
                         }" disabled>
                             {{ countdown }}秒后重发
                         </button>
-                    </div>
-                </el-form-item>
-                <!-- 注册按钮 -->
-                <el-button type="primary" @click="handleRegister">注册</el-button>
-                <p>注：未注册过的手机号将自动注册</p>
-            </div>
-        </el-form>
-    </div>
+                    </div> -->
+          <el-input
+            v-model="formData.verificationCode"
+            placeholder="验证码"
+            size="large"
+          >
+          <template #append>
+              <el-button type="primary" class="btn_code" size="large" v-if="!sendCode" :disabled="formData.phoneNumber.length!== 11"  @click="getVerify_code" round>发送验证码</el-button>
+              <el-button type="primary" class="btn_code" size="large" v-if="sendCode" disabled round>{{ countdown }}S</el-button>
+            </template>
+          </el-input>
+        </el-form-item>
+
+<div class="foot">
+        <el-button class="btn_sumit" type="primary" size="large" :disabled="!formData.phoneNumber || !formData.verificationCode" round @click="handleRegister">确定</el-button>
+</div>
+      </div>
+    </el-form>
+  </div>
 </template>
 
 <script lang="ts" setup>
-import { ref, defineProps, defineEmits, onMounted, onUnmounted } from 'vue';
-import { useUserStore } from '@/stores/userStore';
-import { useRouter } from 'vue-router';
-import { GetSmsCode, GetLogin } from '@/api/login';
-import { getApproval_status } from '@/api/login';
-import { ElMessage } from 'element-plus';
-
-
+import { ref, defineProps, defineEmits, onMounted, onUnmounted } from "vue";
+import { useUserStore } from "@/stores/userStore";
+import { useRouter } from "vue-router";
+import { GetSmsCode, GetLogin } from "@/api/login";
+import { getApproval_status } from "@/api/login";
+import { ElMessage } from "element-plus";
 
 const props = defineProps({
-    isVisible: {
-        type: Boolean,
-        default: false
-    }
+  isVisible: {
+    type: Boolean,
+    default: false,
+  },
 });
-const emits = defineEmits(['close-register-form']);
+const emits = defineEmits(["close-register-form"]);
 const formData = ref({
-    phoneNumber: '',
-    verificationCode: ''
+  phoneNumber: "",
+  verificationCode: "",
 });
 
 const router = useRouter();
@@ -76,228 +92,194 @@ const userStore = useUserStore();
 const sendCode = ref(false);
 const countdown = ref(0);
 let timer: ReturnType<typeof setInterval>;
-const formRef = ref<InstanceType<typeof import('element-plus/es')['ElForm']>>();
+const formRef = ref<InstanceType<typeof import("element-plus/es")["ElForm"]>>();
 // 移除 verificationError 相关的 ref
 // const verificationError = ref('');
 
 const closeRegisterForm = () => {
-    emits('close-register-form');
+  emits("close-register-form");
 };
 
 const getVerify_code = async () => {
-    const params = {
-        number: formData.value.phoneNumber
-    };
-    const res = await GetSmsCode(params);
+  const params = {
+    number: formData.value.phoneNumber,
+  };
+  const res = await GetSmsCode(params);
 
-    if (res && res.status === 200) {
-        const clicktime = new Date().getTime() + 60000;
-        localStorage.setItem('Countdown', JSON.stringify(clicktime));
-        sendCode.value = true;
-        countdown.value = 60;
-        startCountdown();
-    } else {
-        console.log('获取失败');
-    }
+  if (res && res.status === 200) {
+    const clicktime = new Date().getTime() + 60000;
+    localStorage.setItem("Countdown", JSON.stringify(clicktime));
+    sendCode.value = true;
+    countdown.value = 60;
+    startCountdown();
+  } else {
+    console.log("获取失败");
+  }
 };
 
 const startCountdown = () => {
-    timer = setInterval(() => {
-        if (countdown.value > 0) {
-            countdown.value--;
-        } else {
-            clearInterval(timer);
-            sendCode.value = false;
-            localStorage.removeItem('Countdown');
-        }
-    }, 1000);
+  timer = setInterval(() => {
+    if (countdown.value > 0) {
+      countdown.value--;
+    } else {
+      clearInterval(timer);
+      sendCode.value = false;
+      localStorage.removeItem("Countdown");
+    }
+  }, 1000);
 };
 
 const register = async () => {
-    const params = {
-        user_mobile: formData.value.phoneNumber,
-        rand_key: formData.value.phoneNumber,
-        verify_code: formData.value.verificationCode
-    };
-    const res = await GetLogin(params);
-    if (res && res.status === 200 && res.data && res.data) {
-        userStore.setToken(res.data.token);
-        userStore.setMobilePhone(formData.value.phoneNumber);
-        formData.value.phoneNumber = '';
-        formData.value.verificationCode = '';
-        closeRegisterForm();
+  const params = {
+    user_mobile: formData.value.phoneNumber,
+    rand_key: formData.value.phoneNumber,
+    verify_code: formData.value.verificationCode,
+  };
+  const res = await GetLogin(params);
+  if (res && res.status === 200 && res.data && res.data) {
+    userStore.setToken(res.data.token);
+    userStore.setMobilePhone(formData.value.phoneNumber);
+    formData.value.phoneNumber = "";
+    formData.value.verificationCode = "";
+    closeRegisterForm();
 
-        try {
-            const approvalRes = await getApproval_status();
-            if (approvalRes.data.code === 0 && approvalRes.data.status === 200) {
-                const approvalStatus = approvalRes.data.approval_status;
-                localStorage.setItem('approval_status', approvalStatus);
-                if (approvalStatus == '4') {
-                    router.push({ name: 'start' });
-                } else {
-                    router.push({ name: 'check' });
-                }
-            }
-        } catch (error) {
-            console.error('获取审批状态失败:', error);
-        }
-    } else {
-        if (res.status === 250) {
-            // 使用 ElMessage 提示验证码错误
-            ElMessage.error('验证码错误');
+    try {
+      const approvalRes = await getApproval_status();
+      if (approvalRes.data.code === 0 && approvalRes.data.status === 200) {
+        const approvalStatus = approvalRes.data.approval_status;
+        localStorage.setItem("approval_status", approvalStatus);
+        if (approvalStatus == "4") {
+          router.push({ name: "start" });
         } else {
-            console.log('操作返回的信息', res.data.msg);
-            console.log('hhhhh', res);
+          router.push({ name: "check" });
         }
+      }
+    } catch (error) {
+      console.error("获取审批状态失败:", error);
     }
+  } else {
+    if (res.status === 250) {
+      // 使用 ElMessage 提示验证码错误
+      ElMessage.error("验证码错误");
+    } else {
+      console.log("操作返回的信息", res.data.msg);
+      console.log("hhhhh", res);
+    }
+  }
 };
 
 const rules = ref({
-    phoneNumber: [
-        { required: true, message: '请输入手机号', trigger: 'blur' },
-        { pattern: /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/, message: '请输入正确的11位手机号', trigger: 'blur' }
-    ],
-    verificationCode: [
-        { required: true, message: '请输入验证码', trigger: 'blur' }
-    ]
+  phoneNumber: [
+    { required: true, message: "请输入手机号", trigger: "blur" },
+    {
+      pattern:
+        /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/,
+      message: "请输入正确的11位手机号",
+      trigger: "blur",
+    },
+  ],
+  verificationCode: [
+    { required: true, message: "请输入验证码", trigger: "blur" },
+  ],
 });
 
 const handleRegister = () => {
-    formRef.value?.validate((valid) => {
-        if (valid) {
-            register();
-        } else {
-            ElMessage.error('请正确填写注册信息！');
-        }
-    });
+  formRef.value?.validate((valid) => {
+    if (valid) {
+      register();
+    } else {
+      ElMessage.error("请正确填写注册信息！");
+    }
+  });
 };
 
-
 onMounted(() => {
-    const savedCountdown = localStorage.getItem('Countdown');
-    if (savedCountdown) {
-        const clicktime = JSON.parse(savedCountdown) as number;
-        const currentTime = new Date().getTime();
-        const remainingTime = (clicktime - currentTime) / 1000;
-        if (remainingTime > 0) {
-            sendCode.value = true;
-            countdown.value = Math.ceil(remainingTime);
-            startCountdown();
-        } else {
-            localStorage.removeItem('Countdown');
-            sendCode.value = false;
-        }
+  const savedCountdown = localStorage.getItem("Countdown");
+  if (savedCountdown) {
+    const clicktime = JSON.parse(savedCountdown) as number;
+    const currentTime = new Date().getTime();
+    const remainingTime = (clicktime - currentTime) / 1000;
+    if (remainingTime > 0) {
+      sendCode.value = true;
+      countdown.value = Math.ceil(remainingTime);
+      startCountdown();
+    } else {
+      localStorage.removeItem("Countdown");
+      sendCode.value = false;
     }
+  }
 });
 
 onUnmounted(() => {
-    if (timer) {
-        clearInterval(timer);
-    }
+  if (timer) {
+    clearInterval(timer);
+  }
 });
 </script>
 
-<style lang="scss">
-$primary-color: #007BFF;
-$secondary-color: #6C757D;
-$border-radius: 8px;
-$box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-
+<style lang="scss" scoped>
 .register-box {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.4);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    z-index: 1000101;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: rgba(0, 0, 0, 0.75);
+  z-index: 1000101;
 }
+
 .el-message {
   z-index: 1000102 !important; // 确保这个值高于遮罩层的 z-index
 }
-.register-container {
-    padding: 35px;
-    border-radius: $border-radius;
-    box-shadow: $box-shadow;
-    background-color: #fff;
-    width: 400px;
-    transition: box-shadow 0.3s ease;
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    &:hover {
-        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
-    }
 
-    h4 {
-        color: $primary-color;
-        text-align: center;
-        margin-bottom: 30px;
-        font-size: 24px;
-    }
-
-    .el-form-item {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 100%;
-    label{
-        width: 100px !important;
-    }
-    }
-    .el-input {
+.foot{
+    padding-top: 20px;
+    .btn_sumit{
+        display: block;
         width: 100%;
     }
 
-    .verifyAndButton {
-        display: flex;
-        width: 100%;
-    }
-
-    button {
-        width: 100%;
-        padding: 2px;
-        background-color: #007BFF;
-        color: #fff;
-        border: none;
-        border-radius: $border-radius;
-        font-size: 20px;
-        cursor: pointer;
-        transition: background-color 0.3s ease;
-
-        &:hover {
-            background-color: #0056b3;
-        }
-    }
-
-    .register-close {
-        position: absolute;
-        top: 10px;
-        right: 10px;
-        font-size: 20px;
-        cursor: pointer;
-        color: $secondary-color;
-
-        &:hover {
-            color: $primary-color;
-        }
-    }
-
-    .error-message {
-        // 由于已经移除相关的 div，这里的样式可以删除或保留（如果后续可能复用）
-        color: red;
-        margin-top: 5px;
-        font-size: 12px;
-    }
-
-    p {
-        color: red;
-        margin: 10px 0;
+    .btn_code{
+        display: block;
+        width: 60px;
     }
 }
-</style>
\ No newline at end of file
+
+.register-container {
+  padding: 25px;
+  border-radius: 10px;
+  background-color: #fff;
+  width: 500px;
+  position: relative;
+
+  h4 {
+    color: #666;
+    text-align: center;
+    margin-bottom: 30px;
+    font-size: 24px;
+  }
+
+  .el-input {
+    width: 100%;
+  }
+
+  .verifyAndButton {
+    display: flex;
+    width: 100%;
+  }
+
+  .register-close {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+  }
+
+  p {
+    color: red;
+    margin: 10px 0;
+  }
+}
+</style>
diff --git a/src/views/start/check.vue b/src/views/start/check.vue
index 1eb264c..9a7efdd 100644
--- a/src/views/start/check.vue
+++ b/src/views/start/check.vue
@@ -1,706 +1,1557 @@
 <template>
-    <div class="check_contain">
-        <div class="check_tips">
-            <div class="check_pass" v-if="approval_status == '1'">
-                <div class="icon">
-                    <i class="iconfont icon-shenhetongguo"></i>
-                </div>
-                <p>{{ approval_remark }}</p>
-                <p>请在绑定手机完成合同的签订</p>
-            </div>
-            <div class="check_fail" v-if="approval_status == '2'">
-                <div class="icon">
-                    <i class="iconfont icon-shenhebutongguo"></i>
-                </div>
-                <p>{{ approval_remark }}</p>
-            </div>
-            <div class="check_wait" v-if="approval_status == '3'">
-                <div class="icon">
-                    <i class="iconfont icon-shenhezhong"></i>
-                </div>
-                <p>{{ approval_remark }}</p>
-            </div>
-        </div>
-        <div class="check_re_apply">
-            <el-form :model="applyFormData" :rules="rules" ref="formRef" label-width="120px" style="max-width: 600px">
-                <el-form-item label="联系人" v-if="approval_invalid_col.includes('contact_name')" prop="contact_name">
-                    <el-input v-model="applyFormData.contact_name" placeholder="请输入联系人姓名" />
-                </el-form-item>
-                <el-form-item label="经营品类" v-if="approval_invalid_col.includes('biz_category')" prop="biz_category">
-                    <el-cascader v-model="applyFormData.biz_category" :options="cascaderOptions" :props="cascaderProps"
-                        placeholder="请选择经营品类" :show-all-levels="false" @change="handleChangeBizCategory" clearable />
-                </el-form-item>
-                <el-form-item label="门店名称" v-if="approval_invalid_col.includes('store_name')" prop="store_name">
-                    <el-input v-model="applyFormData.store_name" placeholder="请输入门店名称" />
-                </el-form-item>
-                <div v-if="approval_invalid_col.includes('mapAddress')">
-                    <el-form-item label="地图地址" prop="map_address">
-                        <el-cascader v-model="applyFormData.map_address" :options="cascaderOptions2" :props="cascaderProps"
-                            @change="handleChange" />
-                    </el-form-item>
-                    <el-form-item label="搜索定位" prop="position">
-                        <el-autocomplete v-model="applyFormData.position" :fetch-suggestions="querySearch"
-                            :options="autocompleteOptions" @select="handleSelect">
-                            <template #default="{ item }">
-                                <div class="auto-item" v-if="item">
-                                    <div>
-                                        <p>{{ item.name }}</p>
-                                    </div>
-                                    <div><span>{{ item.address }}</span></div>
-                                </div>
-                            </template>
-                        </el-autocomplete>
-                    </el-form-item>
-                </div>
-                <el-form-item label="详细地址" v-if="approval_invalid_col.includes('store_address')" prop="store_address">
-                    <el-input v-model="applyFormData.store_address" placeholder="请输入详细地址" />
-                </el-form-item>
-                <el-form-item :label="getLabel('front_facade_image', 1)" v-if="approval_invalid_col.includes('storefrontImg')"
-                    prop="front_facade_image">
-                    <el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.front_facade_image"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'front_facade_image')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'front_facade_image')"
-                        :on-error="handleUploadError" :on-exceed="handleExceed" :before-upload="beforeUpload"
-                        :action="uploadUrl" :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('front_facade_image') }">
-                        <el-icon class="avatar-uploader-icon">
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item :label="getLabel('environment_image', 1)" v-if="approval_invalid_col.includes('surroundingsImg')"
-                    prop="environment_image">
-                    <el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.environment_image"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'environment_image')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'environment_image')"
-                        :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
-                        :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('environment_image') }">
-                        <el-icon>
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item label="营业执照编号" v-if="approval_invalid_col.includes('biz_license_number')"
-                    prop="biz_license_number">
-                    <el-input v-model="applyFormData.biz_license_number" placeholder="请输入营业执照编号" />
-                </el-form-item>
-                <el-form-item label="营业执照公司名" v-if="approval_invalid_col.includes('biz_license_company')"
-                    prop="biz_license_company">
-                    <el-input v-model="applyFormData.biz_license_company" placeholder="请输入营业执照公司名" />
-                </el-form-item>
-                <el-form-item label="负责人姓名" v-if="approval_invalid_col.includes('legal_person_name')"
-                    prop="legal_person_name">
-                    <el-input v-model="applyFormData.legal_person_name" placeholder="请输入负责人姓名" />
-                </el-form-item>
-                <el-form-item :label="getLabel('biz_license_image', 1)" v-if="approval_invalid_col.includes('biz_license_image')"
-                    prop="biz_license_image">
-                    <el-upload ref="uploadRef" multiple :limit="1" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.biz_license_image"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'biz_license_image')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'biz_license_image')"
-                        :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
-                        :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('biz_license_image') }">
-                        <el-icon>
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item :label="getLabel('license_image', 5)" v-if="approval_invalid_col.includes('license_image')"
-                    prop="license_image">
-                    <el-upload ref="uploadRef" multiple :limit="5" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.license_image"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'license_image')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'license_image')"
-                        :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
-                        :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('license_image') }">
-                        <el-icon>
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item :label="getLabel('legal_person_id_images', 1)"
-                    v-if="approval_invalid_col.includes('legal_person_id_images')" prop="legal_person_id_images">
-                    <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.legal_person_id_images"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'legal_person_id_images')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'legal_person_id_images')"
-                        :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
-                        :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('legal_person_id_images') }">
-                        <el-icon class="avatar-uploader-icon">
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item :label="getLabel('legal_person_id_images2', 1)"
-                    v-if="approval_invalid_col.includes('legal_person_id_images2')" prop="legal_person_id_images2">
-                    <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.legal_person_id_images2"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'legal_person_id_images2')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'legal_person_id_images2')"
-                        :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
-                        :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('legal_person_id_images2') }">
-                        <el-icon class="avatar-uploader-icon">
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item label="个人身份证号" v-if="approval_invalid_col.includes('individual_id_number')"
-                    prop="individual_id_number">
-                    <el-input v-model="applyFormData.individual_id_number" placeholder="请输入个人身份证号" />
-                </el-form-item>
-                <el-form-item :label="getLabel('individual_id_images', 1)"
-                    v-if="approval_invalid_col.includes('individual_id_images')" prop="individual_id_images">
-                    <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.individual_id_images"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'individual_id_images')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'individual_id_images')"
-                        :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
-                        :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('individual_id_images') }">
-                        <el-icon class="avatar-uploader-icon">
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item :label="getLabel('individual_id_images2', 1)"
-                    v-if="approval_invalid_col.includes('individual_id_images2')" prop="individual_id_images2">
-                    <el-upload ref="uploadRef" :limit="1" list-type="picture-card" :auto-upload="true"
-                        v-model="applyFormData.individual_id_images2"
-                        :on-remove="(file, fileList) => handleRemove(file, fileList, 'individual_id_images2')"
-                        :on-success="(response, file, fileList) =>
-                            handleUploadSuccess(response, file, fileList, 'individual_id_images2')"
-                        :on-error="handleUploadError" :before-upload="beforeUpload" :action="uploadUrl"
-                        :headers="uploadHeaders" name="upfile"
-                        :class="{ 'upload-hidden': isUploadHidden('individual_id_images2') }">
-                        <el-icon class="avatar-uploader-icon">
-                            <Plus />
-                        </el-icon>
-                    </el-upload>
-                </el-form-item>
-                <el-form-item label="账户姓名" v-if="approval_invalid_col.includes('account_holder_name')"
-                    prop="account_holder_name">
-                    <el-input v-model="applyFormData.account_holder_name" placeholder="请输入账户姓名" />
-                </el-form-item>
-                <el-form-item label="收款账户号码" v-if="approval_invalid_col.includes('account_number')" prop="account_number">
-                    <el-input v-model="applyFormData.account_number" placeholder="请输入收款账户号码" />
-                </el-form-item>
-                <el-form-item label="开户银行" v-if="approval_invalid_col.includes('bank_name')" prop="bank_name">
-                    <el-select v-model="applyFormData.bank_name" placeholder="请选择银行" size="large" style="width: 240px">
-                        <el-option v-for="bank in bankList2" :key="bank.id" :label="bank.bank_name"
-                            :value="bank.bank_name" />
-                    </el-select>
-                </el-form-item>
-                <el-form-item label="支行名称" v-if="approval_invalid_col.includes('bank_branch_name')"
-                    prop="bank_branch_name">
-                    <el-input v-model="applyFormData.bank_branch_name" placeholder="请输入支行名称" />
-                </el-form-item>
-            </el-form>
-            <el-button v-if="approval_status == '2'" type="primary" size="default" @click="re_applySubmit">重新提交审核
-            </el-button>
-        </div>
+  <div class="signUp-container">
+    <!-- 步骤条 -->
+    <div class="steps-container">
+      <div class="tit" style="margin-bottom: 0">免费开店资料填写</div>
     </div>
+
+    <div class="form-submit">
+      <el-form
+        :model="applyFormData"
+        label-width="160px"
+        style="max-width: 600px"
+        v-loading.fullscreen.lock="loading"
+        element-loading-text="数据加载中..."
+        element-loading-background="rgba(0,0,0,.75)"
+      >
+
+      <template v-if="auditInfo.approval_invalid_col.includes('mapAddress') || auditInfo.approval_invalid_col.includes('store_address')">
+          <el-form-item label="店铺所在地区" prop="map_address">
+          <el-cascader
+            style="marginright: 5px"
+            v-model="applyFormData.map_address"
+            :options="cascaderOptions2"
+            @change="handleChange"
+          />
+          <el-autocomplete
+            v-if="applyFormData.map_address"
+            style="width: 180px"
+            v-model="applyFormData.position"
+            placeholder="试试搜索，快速填写地址"
+            :fetch-suggestions="querySearch"
+            value-key="value"
+            :options="autocompleteOptions"
+            @select="handleSelect"
+          >
+            <template #default="{ item }">
+              <div class="auto-item" v-if="item">
+                <div>
+                  <p>{{ item.name }}</p>
+                </div>
+                <div>
+                  <span>{{ item.address }}</span>
+                </div>
+              </div>
+            </template>
+          </el-autocomplete>
+        </el-form-item>
+        <el-form-item
+          label="店铺详细地址"
+          prop="store_address"
+          v-if="applyFormData.map_address"
+        >
+          <el-input
+            v-model="applyFormData.store_address"
+            placeholder="请输入详细地址"
+          />
+        </el-form-item>
+        </template>
+        
+        <el-form-item
+          :label="item.label"
+          prop="contact_name"
+          v-for="(item, index) in formItemData"
+          :key="index"
+        >
+          <el-input
+            v-if="item.type == 'input'"
+            v-model="applyFormData[item.key]"
+            :placeholder="item.placeholder"
+          />
+
+          <el-cascader
+            v-if="item.type == 'select' && item.key=='biz_category'"
+            v-model="applyFormData[item]"
+            :placeholder="item.placeholder"
+            :options="cascaderOptions"
+            :show-all-levels="false"
+            @change="handleChangeBizCategory"
+            clearable
+          />
+        </el-form-item>
+
+        <template v-if="auditInfo.approval_invalid_col.includes('bank_name') || auditInfo.approval_invalid_col.includes('bank_branch_name')">
+          <el-form-item label="开户银行" prop="bank_branch_name">
+            <el-select-v2
+              clearable
+              filterable
+              remote
+              @change="bankListChange"
+              :remote-method="bankListRemoteMethod"
+              v-model="applyFormData.bank_branch_name"
+              placeholder="搜索银行名称"
+              placement="top-start"
+              style="width: 350px"
+              :options="bankList2"
+            >
+            </el-select-v2>
+          </el-form-item>
+        </template>
+
+
+        <!-- <el-form-item label="联系人" prop="contact_name">
+          <el-input
+            v-model="applyFormData.contact_name"
+            placeholder="请输入联系人姓名"
+          />
+        </el-form-item>
+        <el-form-item label="联系电话" prop="login_mobile">
+          <el-input
+            v-model="applyFormData.login_mobile"
+            placeholder="请输入联系人电话"
+            disabled
+          />
+        </el-form-item>
+        <el-form-item label="经营品类" prop="biz_category">
+          <el-cascader
+            v-model="applyFormData.biz_category"
+            :options="cascaderOptions"
+            placeholder="请选择经营品类"
+            :show-all-levels="false"
+            @change="handleChangeBizCategory"
+            clearable
+          />
+        </el-form-item>
+        <el-form-item label="门店名称" prop="store_name">
+          <el-input
+            v-model="applyFormData.store_name"
+            placeholder="请输入门店名称"
+          />
+        </el-form-item>
+        <el-form-item label="所在地区" prop="map_address">
+          <el-cascader
+            style="marginright: 5px"
+            v-model="applyFormData.map_address"
+            :options="cascaderOptions2"
+            @change="handleChange"
+          />
+          <el-autocomplete
+            v-if="applyFormData.map_address"
+            style="width: 180px"
+            v-model="applyFormData.position"
+            placeholder="试试搜索，快速填写地址"
+            :fetch-suggestions="querySearch"
+            value-key="value"
+            :options="autocompleteOptions"
+            @select="handleSelect"
+          >
+            <template #default="{ item }">
+              <div class="auto-item" v-if="item">
+                <div>
+                  <p>{{ item.name }}</p>
+                </div>
+                <div>
+                  <span>{{ item.address }}</span>
+                </div>
+              </div>
+            </template>
+          </el-autocomplete>
+        </el-form-item>
+        <el-form-item
+          label="详细地址"
+          prop="store_address"
+          v-if="applyFormData.map_address"
+        >
+          <el-input
+            v-model="applyFormData.store_address"
+            placeholder="请输入详细地址"
+          />
+        </el-form-item>
+        <el-form-item
+          :label="getLabel('front_facade_image', 1)"
+          prop="front_facade_image"
+        >
+          <el-upload
+            ref="uploadRef"
+            multiple
+            :limit="1"
+            list-type="picture-card"
+            :auto-upload="true"
+            :on-remove="
+              (file, fileList) =>
+                handleRemove(file, fileList, 'front_facade_image')
+            "
+            :on-success="
+              (response, file, fileList) =>
+                handleUploadSuccess(
+                  response,
+                  file,
+                  fileList,
+                  'front_facade_image'
+                )
+            "
+            :on-preview="handlePictureCardPreview"
+            :on-error="handleUploadError"
+            :on-exceed="handleExceed"
+            :before-upload="beforeUpload"
+            :action="uploadUrl"
+            name="upfile"
+            :class="{ 'upload-hidden': isUploadHidden('front_facade_image') }"
+          >
+            <el-icon class="avatar-uploader-icon">
+              <Plus />
+            </el-icon>
+          </el-upload>
+        </el-form-item>
+        <el-form-item
+          :label="getLabel('environment_image', 1)"
+          prop="environment_image"
+        >
+          <el-upload
+            ref="uploadRef"
+            multiple
+            :limit="1"
+            list-type="picture-card"
+            :auto-upload="true"
+            :on-preview="handlePictureCardPreview"
+            v-model="applyFormData.environment_image"
+            :on-remove="
+              (file, fileList) =>
+                handleRemove(file, fileList, 'environment_image')
+            "
+            :on-success="
+              (response, file, fileList) =>
+                handleUploadSuccess(
+                  response,
+                  file,
+                  fileList,
+                  'environment_image'
+                )
+            "
+            :on-error="handleUploadError"
+            :before-upload="beforeUpload"
+            :action="uploadUrl"
+            name="upfile"
+            :class="{ 'upload-hidden': isUploadHidden('environment_image') }"
+          >
+            <el-icon>
+              <Plus />
+            </el-icon>
+          </el-upload>
+        </el-form-item>
+
+        <el-form-item label="主体类型" prop="entity_type">
+          <el-radio-group
+            v-model="applyFormData.entity_type"
+            @change="clearOtherFields"
+          >
+            <el-radio-button :value="1">企业</el-radio-button>
+            <el-radio-button :value="2">个人</el-radio-button>
+          </el-radio-group>
+        </el-form-item>
+        <div v-if="applyFormData.entity_type === 1">
+          <el-form-item
+            :label="getLabel('biz_license_image', 1)"
+            prop="biz_license_image"
+          >
+            <el-upload
+              ref="uploadRef"
+              multiple
+              :limit="1"
+              list-type="picture-card"
+              :auto-upload="true"
+              v-model="applyFormData.biz_license_image"
+              :on-remove="
+                (file, fileList) =>
+                  handleRemove(file, fileList, 'biz_license_image')
+              "
+              :on-preview="handlePictureCardPreview"
+              :on-success="
+                (response, file, fileList) =>
+                  handleUploadSuccess(
+                    response,
+                    file,
+                    fileList,
+                    'biz_license_image'
+                  )
+              "
+              :on-error="handleUploadError"
+              :before-upload="beforeUpload"
+              :action="uploadUrl"
+              name="upfile"
+              :class="{
+                'upload-hidden': isUploadHidden('biz_license_image'),
+              }"
+            >
+              <el-icon>
+                <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="公司名称"
+            prop="biz_license_company"
+            v-if="applyFormData.biz_license_image"
+          >
+            <el-input
+              v-model="applyFormData.biz_license_company"
+              placeholder="请输入公司名称"
+            />
+          </el-form-item>
+          <el-form-item
+            label="法人姓名"
+            prop="legal_person_name"
+            v-if="applyFormData.biz_license_image"
+          >
+            <el-input
+              v-model="applyFormData.legal_person_name"
+              placeholder="请输入法人姓名"
+            />
+          </el-form-item>
+          <el-form-item
+            label="注册号"
+            prop="biz_license_number"
+            v-if="applyFormData.biz_license_image"
+          >
+            <el-input
+              v-model="applyFormData.biz_license_number"
+              placeholder="请输入注册号"
+            />
+          </el-form-item>
+          <el-form-item
+            label="许可证类型"
+            prop="license_type"
+            v-if="applyFormData.biz_license_image"
+          >
+            <el-select
+              v-model="applyFormData.license_type"
+              value-key=""
+              placeholder="请选择类型"
+              clearable
+              @change=""
+            >
+              <el-option
+                v-for="item in optionsPermitType"
+                :key="item.value2"
+                :label="item.label"
+                :value="item.value2"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item
+            :label="getLabel('license_image', 5)"
+            prop="license_image"
+            v-if="applyFormData.license_type != 1"
+          >
+            <el-upload
+              ref="uploadRef"
+              multiple
+              :limit="5"
+              list-type="picture-card"
+              :auto-upload="true"
+              v-model="applyFormData.license_image"
+              :on-preview="handlePictureCardPreview"
+              :on-remove="
+                (file, fileList) =>
+                  handleRemove(file, fileList, 'license_image')
+              "
+              :on-success="
+                (response, file, fileList) =>
+                  handleUploadSuccess(response, file, fileList, 'license_image')
+              "
+              :on-error="handleUploadError"
+              :before-upload="beforeUpload"
+              :action="uploadUrl"
+              name="upfile"
+              :class="{ 'upload-hidden': isUploadHidden('license_image') }"
+            >
+              <el-icon>
+                <Plus />
+              </el-icon>
+            </el-upload>
+          </el-form-item>
+
+          <el-form-item
+            label="许可证编号"
+            prop="license_number"
+            v-if="applyFormData.license_type != 1"
+          >
+            <el-input
+              v-model="applyFormData.license_number"
+              placeholder="请输入许可证编号"
+            />
+          </el-form-item>
+
+          <el-form-item
+            :label="getLabel('legal_person_id_images', 1)"
+            prop="legal_person_id_images"
+          >
+            <el-upload
+              ref="uploadRef"
+              :limit="1"
+              list-type="picture-card"
+              :auto-upload="true"
+              :on-preview="handlePictureCardPreview"
+              v-model="applyFormData.legal_person_id_images"
+              :on-remove="
+                (file, fileList) =>
+                  handleRemove(file, fileList, 'legal_person_id_images')
+              "
+              :on-success="
+                (response, file, fileList) =>
+                  handleUploadSuccess(
+                    response,
+                    file,
+                    fileList,
+                    'legal_person_id_images'
+                  )
+              "
+              :on-error="handleUploadError"
+              :before-upload="beforeUpload"
+              :action="uploadUrl"
+              name="upfile"
+              :class="{
+                'upload-hidden': isUploadHidden('legal_person_id_images'),
+              }"
+            >
+              <el-icon class="avatar-uploader-icon">
+                <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)"
+            prop="legal_person_id_images2"
+          >
+            <el-upload
+              ref="uploadRef"
+              :limit="1"
+              list-type="picture-card"
+              :auto-upload="true"
+              :on-preview="handlePictureCardPreview"
+              v-model="applyFormData.legal_person_id_images2"
+              :on-remove="
+                (file, fileList) =>
+                  handleRemove(file, fileList, 'legal_person_id_images2')
+              "
+              :on-success="
+                (response, file, fileList) =>
+                  handleUploadSuccess(
+                    response,
+                    file,
+                    fileList,
+                    'legal_person_id_images2'
+                  )
+              "
+              :on-error="handleUploadError"
+              :before-upload="beforeUpload"
+              :action="uploadUrl"
+              name="upfile"
+              :class="{
+                'upload-hidden': isUploadHidden('legal_person_id_images2'),
+              }"
+            >
+              <el-icon class="avatar-uploader-icon">
+                <Plus />
+              </el-icon>
+            </el-upload>
+          </el-form-item>
+          <el-form-item
+            label="法人身份证号码"
+            prop="legal_person_id_number"
+            v-if="applyFormData.legal_person_id_images"
+          >
+            <el-input
+              v-model="applyFormData.legal_person_id_number"
+              placeholder="请输入法人身份证号码"
+            />
+          </el-form-item>
+        </div>
+        <div v-if="applyFormData.entity_type === 2">
+          <el-form-item
+            :label="getLabel('individual_id_images', 1)"
+            prop="individual_id_images"
+          >
+            <el-upload
+              ref="uploadRef"
+              :limit="1"
+              list-type="picture-card"
+              :auto-upload="true"
+              :on-preview="handlePictureCardPreview"
+              v-model="applyFormData.individual_id_images"
+              :on-remove="
+                (file, fileList) =>
+                  handleRemove(file, fileList, 'individual_id_images')
+              "
+              :on-success="
+                (response, file, fileList) =>
+                  handleUploadSuccess(
+                    response,
+                    file,
+                    fileList,
+                    'individual_id_images'
+                  )
+              "
+              :on-error="handleUploadError"
+              :before-upload="beforeUpload"
+              :action="uploadUrl"
+              name="upfile"
+              :class="{
+                'upload-hidden': isUploadHidden('individual_id_images'),
+              }"
+            >
+              <el-icon class="avatar-uploader-icon">
+                <Plus />
+              </el-icon>
+            </el-upload>
+          </el-form-item>
+
+          <el-form-item
+            :label="getLabel('individual_id_images2', 1)"
+            prop="individual_id_images2"
+          >
+            <el-upload
+              ref="uploadRef"
+              :limit="1"
+              list-type="picture-card"
+              :auto-upload="true"
+              :on-preview="handlePictureCardPreview"
+              v-model="applyFormData.individual_id_images2"
+              :on-remove="
+                (file, fileList) =>
+                  handleRemove(file, fileList, 'individual_id_images2')
+              "
+              :on-success="
+                (response, file, fileList) =>
+                  handleUploadSuccess(
+                    response,
+                    file,
+                    fileList,
+                    'individual_id_images2'
+                  )
+              "
+              :on-error="handleUploadError"
+              :before-upload="beforeUpload"
+              :action="uploadUrl"
+              name="upfile"
+              :class="{
+                'upload-hidden': isUploadHidden('individual_id_images2'),
+              }"
+            >
+              <el-icon class="avatar-uploader-icon">
+                <Plus />
+              </el-icon>
+            </el-upload>
+          </el-form-item>
+          <el-form-item
+            label="个人身份证号"
+            prop="individual_id_number"
+            v-if="applyFormData.individual_id_images"
+          >
+            <el-input
+              v-model="applyFormData.individual_id_number"
+              placeholder="请输入个人身份证号"
+            />
+          </el-form-item>
+        </div>
+
+        <el-form-item label="银行卡" prop="bank_image">
+          <el-upload
+            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-icon class="avatar-uploader-icon">
+              <Plus />
+            </el-icon>
+          </el-upload>
+          <el-button
+            type="info"
+            plain
+            v-if="applyFormData.bank_image && !applyFormData.account_number"
+            @click="handleOcrText(currentBbatchNo, 'bank_image')"
+            >点击免填银行卡号</el-button
+          >
+        </el-form-item>
+        <template v-if="applyFormData.bank_image">
+          <el-form-item label="开户名称" prop="account_holder_name">
+            <el-input v-model="applyFormData.account_holder_name" />
+          </el-form-item>
+          <el-form-item label="银行卡号" prop="account_number">
+            <el-input v-model="applyFormData.account_number" />
+          </el-form-item>
+          <el-form-item label="开户银行" prop="bank_branch_name">
+            <el-select-v2
+              clearable
+              filterable
+              remote
+              @change="bankListChange"
+              :remote-method="bankListRemoteMethod"
+              v-model="applyFormData.bank_branch_name"
+              placeholder="搜索银行名称"
+              placement="top-start"
+              style="width: 350px"
+              :options="bankList2"
+            >
+            </el-select-v2>
+          </el-form-item>
+        </template>
+         -->
+      </el-form>
+    </div>
+
+    <div class="form-button">
+      <el-button type="primary" @click="merchToApply" class="custom-button"
+        >重新审核</el-button
+      >
+    </div>
+
+    <el-dialog v-model="dialogVisible" width="max-content">
+      <img w-full :src="dialogImageUrl" alt="Preview Image" />
+    </el-dialog>
+  </div>
 </template>
 
 <script lang="ts" setup>
-import { getApproval_status, re_apply } from '@/api/login';
-import { onMounted, ref, reactive } from 'vue';
-import { ElMessage } from 'element-plus';
-import { GetStoreCategories, transformStoreCategories, GetPostion, GetBank, merchApply, GetMerchDetail } from '@/api/login';
-import { useUserStore } from '@/stores/userStore';
-import cityData from '../../stores/cityData';
-import { Plus } from '@element-plus/icons-vue'
+import { ref, reactive, onMounted, watch } from "vue";
+import cityData from "../../stores/cityData";
+import type { CityDataStructure } from "../../stores/cityData";
+import { ElMessage } from "element-plus";
+import { useUserStore } from "@/stores/userStore";
+import { Plus } from "@element-plus/icons-vue";
+import {
+  GetStoreCategories,
+  transformStoreCategories,
+  GetPostion,
+  GetBank,
+  merchApply,
+  re_apply,
+  GetAppDistrict,
+  GetAuditInfo,
+} from "@/api/login";
+import config from "./formConfig";
 
-const approval_status = ref('')
-const approval_remark = ref('')
-const approval_invalid_col = ref<string[]>([]);
-const signed_status = ref('')
-const user_is_admin = ref('')
-onMounted(() => {
-    // user_is_admin.value = localStorage.getItem("Identity")
-    // console.log("xxx", user_is_admin.value);
+import { batchNoApi, imgOcrResultApi } from "@/api/upload";
 
-    getApproval_status().then(res => {
-        if (res.data.code == 0 && res.data.status === 200) {
-            approval_status.value = res.data.data.approval_status;
-            approval_remark.value = res.data.data.approval_remark;
-            applyFormData.id = res.data.data.id;
-            approval_invalid_col.value = JSON.parse(res.data.data.approval_invalid_col);
-            console.log(res);
-        } else {
-            console.log("失败", res);
-        }
-    })
-    GetStoreCategories().then(res => {
-        if (res.data.code === 0 && res.data.status === 200) {
-            cascaderOptions.value = transformStoreCategories(res.data.data);
-        } else {
-            // ElMessage.error('获取店铺分类失败');
-        }
-    }).catch(err => {
-        // ElMessage.error('获取店铺分类失败');
-    });
-    GetBank().then(res => {
-        if (res.data.code === 0 && res.data.status === 200) {
-            bankList2.value = res.data.data;
-        } else {
-            // ElMessage.error('获取银行失败');
-        }
-    }).catch(err => {
-        // ElMessage.error('获取银行失败');
-    });
+interface Bank {
+  id: number;
+  bank_name: string;
+}
 
-    GetMerchDetail().then(res => {
-        if (res.data.code === 0 && res.data.status === 200) {
-            signed_status.value = res.data.data.signed_status;
-        } else {
-        }
-    }).catch(err => {
-    })
-})
-
-// 表单结构
-const applyFormData = reactive({
-    id: null,
-    bank_name: '',
-    bank_branch_name: '',
-    account_number: '',
-    account_holder_name: '',
-    biz_category: null,
-    biz_license_company: '',
-    biz_license_image: '',
-    biz_license_number: '',
-    biz_second_category: null,
-    city_id: null,
-    contact_name: '',
-    county_id: null,
-    entity_type: 1,
-    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: null,
-    login_mobile: localStorage.getItem("mobilePhone"),
-    province_id: null,
-    store_address: '',
-    map_address: '',
-    position: '',
-    store_latitude: null,
-    store_longitude: null,
-    store_name: '',
-    mapAddressLabel: '',
-    mapAddressLabel2: '',
-    license_imageToString: '',
-    user_status: ''
-});
-const keyToOriginalFieldMap = {
-    storefrontImg: 'front_facade_image',
-    surroundingsImg: 'environment_image',
-    mapAddress: ''
-};
-const optionsPermitType = [
-    {
-        value2: '1',
-        label: '许可证',
-    },
-    {
-        value2: '2',
-        label: '特许证件',
-    },
-    {
-        value2: '3',
-        label: '其他证件',
-    }
-]
-
-const getLabel = (field: string, limit: number) => {
-    const labels = {
-        front_facade_image: '门脸图',
-        environment_image: '环境图',
-        biz_license_image: '营业执照',
-        license_image: '许可证',
-        legal_person_id_images: '负责人身份证正面',
-        legal_person_id_images2: '负责人身份证反面',
-        individual_id_images: '个人身份证正面',
-        individual_id_images2: '个人身份证反面'
-    };
-
-    // 如果是多文件字段（如 permit），使用数组长度
-    if (field === 'license_image') {
-        return `${labels[field]}(${applyFormData[field].length}/${limit})`;
-    } else {
-        // 如果是单文件字段，判断是否有文件
-        const count = applyFormData[field] ? 1 : 0; // 如果字段有值，计数为1，否则为0
-        return `${labels[field]}(${count}/${limit})`;
-    }
+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 showAll = () => {
-    applyFormData.license_imageToString = applyFormData.license_image.map(url => `${url}`).join(',');
-    console.log(applyFormData.license_imageToString);
-    console.log(applyFormData);
+
+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 bankNameSearchText = ref("");
 const selectedValue = ref([]);
 const value = ref([]);
-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 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
+  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;
-    }
+  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 formConfig = reactive(JSON.parse(JSON.stringify(config.formConfig)));
+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: "",
+  biz_category: null,
+  biz_license_company: "",
+  biz_license_image: "",
+  biz_license_number: "",
+  biz_second_category: null,
+  city_id: null,
+  contact_name: "",
+  county_id: null,
+  entity_type: 1,
+  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: "1",
+  login_mobile: localStorage.getItem("mobilePhone"),
+  province_id: null,
+  store_address: "",
+  map_address: "",
+  position: "",
+  store_latitude: null,
+  store_longitude: null,
+  store_name: "",
+  mapAddressLabel: "",
+  license_imageToString: "",
+  store_area: "",
+  user_status: "",
+  bank_image: "",
+});
+const formItemData = ref([]);
+let auditInfo = reactive({
+  approval_status: 3,
+  created_at: "2099-02-17 09:25:53",
+  approval_remark: "",
+  approval_invalid_col: [],
+});
+const optionsPermitType = [
+  {
+    value2: "1",
+    label: "无需特殊资质",
+  },
+  {
+    value2: "2",
+    label: "需许可证资质",
+  },
+  {
+    value2: "3",
+    label: "需特许证件资质",
+  },
+];
+const rules = reactive({
+  contact_name: [
+    { required: true, message: "请输入联系人姓名", trigger: "blur" },
+  ],
+  biz_category: [
+    { required: true, message: "请选择经营品类", trigger: "change" },
+  ],
+  store_name: [{ required: true, message: "请输入门店名称", trigger: "blur" }],
+  map_address: [
+    { required: true, message: "请选择地图地址", trigger: "change" },
+  ],
+  //   position: [{ required: true, message: "请选择地图地址", trigger: "change" }],
+  store_address: [
+    { required: true, message: "请输入详细地址", trigger: "blur" },
+  ],
+  front_facade_image: [
+    { required: true, message: "请上传门脸图", trigger: ["change", "blur"] },
+  ],
+  environment_image: [
+    { required: true, message: "请上传环境图", trigger: ["change", "blur"] },
+  ],
+  entity_type: [{ required: true, message: "请主体类型", trigger: "change" }],
+  // license_type: [{ required: true, message: "请选择许可证类型", trigger: "change" }],
+  // license_number: [{ required: true, message: "请输入许可证编号", trigger: "blur" }],
+  biz_license_number: [
+    { required: true, message: "请输入注册号", trigger: "blur" },
+  ],
+  biz_license_company: [
+    { required: true, message: "请输入公司名称", trigger: "blur" },
+  ],
+  legal_person_name: [
+    { required: true, message: "请输入法人姓名", trigger: "blur" },
+  ],
+  legal_person_mobile: [
+    { required: true, message: "请输入法人手机号", trigger: "blur" },
+  ],
+  legal_person_id_number: [
+    { required: true, message: "请输入法人身份证号", trigger: "blur" },
+  ],
+  biz_license_image: [
+    { required: true, message: "请上传营业执照", trigger: "change" },
+  ],
+  // license_image: [{ required: true, message: '请上传许可证', trigger: 'change' }],
+  legal_person_id_images: [
+    { required: true, message: "请上传法人身份证正面", trigger: "change" },
+  ],
+  legal_person_id_images2: [
+    { required: true, message: "请上传法人身份证反面", trigger: "change" },
+  ],
+  individual_id_number: [
+    { required: true, message: "请输入个人身份证号", trigger: "blur" },
+  ],
+  individual_id_images: [
+    { required: true, message: "请上传个人身份证正面", trigger: "change" },
+  ],
+  individual_id_images2: [
+    { required: true, message: "请上传个人身份证反面", trigger: "change" },
+  ],
+  bank_image: [
+    { 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" },
+  ],
+  account_holder_name: [
+    { required: true, message: "请输入开户名称", trigger: "blur" },
+  ],
+});
+
+
+const ignoreFormItem = (item)=>{
+  return !['mapAddress', 'store_address', 'bank_name', 'bank_branch_name'].includes(item.key)
 }
 
-const bankList2 = ref<Bank[]>([]);
+const handleGetAuditInfo = async () => {
+  const res = (await GetAuditInfo({
+    mobile: localStorage.getItem("mobilePhone"),
+  })) as any;
+
+  let arr = JSON.parse(res.data.approval_invalid_col);
+  const arr2 = formConfig.reduce((acc, item) => {
+    if (arr.includes(item.key)) {
+      applyFormData[item.key] = "";
+      acc.push(item);
+    }
+    return acc;
+  }, []);
+  
+  auditInfo = { ...res.data, approval_invalid_col: arr };
+  formItemData.value = arr2.filter(item=> (ignoreFormItem(item)));
+};
+
+handleGetAuditInfo();
+
+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) {
+    handleReApply();
+    // handleMerchApply
+  }
+};
+
+const next = () => {
+  if (active.value < 3) {
+    active.value++;
+    window.scrollTo({
+      top: 0, //回到顶部
+      left: 0,
+      behavior: "smooth",
+    });
+  }
+};
+const pre = () => {
+  if (active.value > 1) {
+    active.value--;
+    window.scrollTo({
+      top: 0, //回到顶部
+      left: 0,
+      behavior: "smooth",
+    });
+  }
+};
+
+const getLabel = (field: string, limit: number) => {
+  const labels = {
+    front_facade_image: "门脸图",
+    environment_image: "环境图",
+    biz_license_image: "营业执照",
+    license_image: "许可证",
+    legal_person_id_images: "法人身份证正面",
+    legal_person_id_images2: "法人身份证反面",
+    individual_id_images: "个人身份证正面",
+    individual_id_images2: "个人身份证反面",
+  };
+
+  if (field === "license_image") {
+    return `${labels[field]}(${applyFormData[field].length}/${limit})`;
+  } else {
+    const count = applyFormData[field] ? 1 : 0;
+    return `${labels[field]}(${count}/${limit})`;
+  }
+};
+
+const showAll = () => {
+  applyFormData.license_imageToString = applyFormData.license_image
+    .map((url) => `${url}`)
+    .join(",");
+};
+
+const merchToApply = async () => {
+  console.log("formdata", applyFormData);
+  showAll();
+  checkForm();
+};
+
+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 bankListRemoteMethod = (val) => {
+  if (!val) {
+    bankList2.value = [];
+    return;
+  }
+
+  GetBank({
+    keyword: val, // 银行名称关键字,小地方支行，查不到，调整关键字范围，尝试市级银行
+    pageNum: 1,
+    pageSize: 2000,
+  }).then((res) => {
+    if (res.status == 200) {
+      bankList2.value = res.data.items.map((item) => {
+        return {
+          district: item.district,
+          area: item.area,
+          branch_bank_no: item.branch_bank_no,
+          clear_no: item.clear_no,
+          label: item.branch_bank_name,
+          value: item.branch_bank_no,
+        };
+      });
+    }
+  });
+};
 
 const handleChange = (value) => {
-    // 假设 cascader 的值是一个数组，格式为 [省份ID, 城市ID, 区县ID]
-    if (value && value.length === 3) {
-        const [provinceId, cityId, countyId] = value;
-        applyFormData.province_id = provinceId;
-        applyFormData.city_id = cityId;
-        applyFormData.county_id = countyId;
+  // 假设 cascader 的值是一个数组，格式为 [省份ID, 城市ID, 区县ID]
+  console.log(11, value);
 
-        // // 获取区县名称（可选）
-        // const targetOption2 = cascaderOptions2.value
-        //     .flatMap(province => province.children)
-        //     .flatMap(city => city.children)
-        //     .find(county => county.value === countyId);
-        // const label2 = targetOption?.label || '';
-        // applyFormData.mapAddressLabel2 = label2;
-        //找市  
-        const targetOption = cascaderOptions2.value
-            .flatMap(province => province.children)
-            .find(city => city.value === cityId)
-        const label = targetOption?.label || '';
-        applyFormData.mapAddressLabel = label;
+  if (value && value.length === 3) {
+    const [provinceId, cityId, countyId] = value;
+    applyFormData.province_id = provinceId;
+    applyFormData.city_id = cityId;
+    applyFormData.county_id = countyId;
+  }
 
-    }
+  const names = value.map((id, level) => {
+    const findName = (options, targetId) => {
+      for (const item of options) {
+        if (item.value === targetId) {
+          return item.label;
+        }
+        if (item.children) {
+          const childName = findName(item.children, targetId);
+          if (childName) return childName;
+        }
+      }
+      return "";
+    };
+
+    return findName(cascaderOptions2.value, id);
+  });
+
+  const str = names?.join("/");
+
+  applyFormData.mapAddressLabel = str;
+  applyFormData.store_area = str;
+  // formRef.value.validate();
 };
+
 const autocompleteOptions = ref([]);
 const querySearch = async (queryString, cb) => {
-    if (!queryString) {
-        cb([]); // 如果没有输入，返回空数组
-        return;
-    }
-    try {
-        // 调用后端接口，传递用户输入的 queryString
-        const params = {
-            query: queryString,
-            region: applyFormData.mapAddressLabel, // 可以根据需要设置区域
-            city_limit: true,
-            ret_coordtype: 'gcj02ll' // 返回坐标类型
-        };
-        console.log("这是市", applyFormData.mapAddressLabel);
-
-        const response = await GetPostion(params);
-
-        if (response.status === 200 && response.data.message === 'ok') {
-            // 将后端返回的数据转换为 el-autocomplete 需要的格式
-            const results = response.data.result
-                .filter((item) => "location" in item).
-                map(item => ({
-                    name: item.name, // 名称
-                    address: item.address, // 地址
-                    value: item.name, // 用于输入框显示的值
-                    lat: item.location.lat,
-                    lng: item.location.lng
-                }));
-
-            cb(results); // 通过回调函数返回数据
-        } else {
-            // ElMessage.error('搜索失败');
-            cb([]);
-        }
-    } catch (error) {
-        // ElMessage.error('搜索失败');
-        cb([]);
+  if (!queryString) {
+    cb([]);
+    return;
+  }
+
+  try {
+    const params = {
+      query: queryString,
+      region: applyFormData.mapAddressLabel,
+      city_limit: true,
+      ret_coordtype: "gcj02ll",
+    };
+
+    const res = await GetPostion(params);
+
+    if (res?.result?.length) {
+      const results = res.result
+        .filter((item) => "location" in item)
+        .map((item) => ({
+          value: item.name, // 确保有 value 属性
+          label: item.name, // 确保有 label 属性
+          name: item.name,
+          address: item.address || "", // 确保 address 属性存在
+          lat: item.location?.lat || "", // 确保 lat 属性存在
+          lng: item.location?.lng || "", // 确保 lng 属性存在
+        }));
+      cb(results);
+    } else {
+      ElMessage.error("搜索失败");
+      cb([]);
     }
+  } catch (error) {
+    ElMessage.error("搜索失败");
+    cb([]);
+  }
 };
 
-// 处理选中项
 const handleSelect = (item) => {
-    applyFormData.position = item.value; // 更新绑定的值
-    applyFormData.store_latitude = item.lat;
-    applyFormData.store_longitude = item.lng;
+  applyFormData.position = "";
+  applyFormData.store_address = item.value;
+  applyFormData.store_latitude = item.lat;
+  applyFormData.store_longitude = item.lng;
+  // formRef.value.validate();
 };
 
 const beforeUpload = (file) => {
-    const isJPG = file.type === 'image/jpeg';
-    const isPNG = file.type === 'image/png';
-    const isLt2M = file.size / 1024 / 1024 < 2;
-    if (!isJPG && !isPNG) {
-        // ElMessage.error('上传的图片必须是JPG或PNG格式！');
-        return false;
-    }
-    if (!isLt2M) {
-        // ElMessage.error('上传的图片大小不能超过2MB！');
-        return false;
-    }
-    return true;
+  const isJPG = file.type === "image/jpeg";
+  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;
+  }
+  return true;
 };
 
-const uploadUrl = ref('https://mall.gpxscs.cn/mobile/shop/oss/upload');
+const uploadUrl = ref("https://mall.gpxscs.cn/mobile/shop/oss/upload");
 
 const handleRemove = (file, fileList, field) => {
-    if (field === 'license_image') {
-        const removedUrl = file.url;
-        applyFormData[field] = applyFormData[field].filter(url => url !== removedUrl);
-    } else {
-        applyFormData[field] = ''; // 单文件字段直接清空
-    }
-    // ElMessage.info('文件已移除');
+  if (field === "license_image") {
+    const removedUrl = file.url;
+    applyFormData[field] = applyFormData[field].filter(
+      (url) => url !== removedUrl
+    );
+  } else {
+    applyFormData[field] = "";
+  }
 };
-const isUploadHidden = (field: string) => {
-    const limits = {
-        license_image: 5, // 保留多文件字段的限制
-    };
-    const limit = limits[field] || 1; // 默认值为1
 
-    if (field === 'license_image') {
-        return applyFormData[field].length >= limit;
-    } else {
-        return applyFormData[field] !== '' && applyFormData[field] != null; // 单文件字段，有值且不为null则隐藏
-    }
+const isUploadHidden = (field: string) => {
+  const limits = {
+    license_image: 5,
+  };
+  const limit = limits[field] || 1;
+
+  if (field === "license_image") {
+    return applyFormData[field].length >= limit;
+  } else {
+    return applyFormData[field] !== "" && applyFormData[field] != null;
+  }
 };
 
 const handleExceed = (files, fileList) => {
-    // ElMessage.warning('最多只能上传3张图片');
+  ElMessage.warning(`最多只能上传1张图片`);
 };
 
-const uploadHeaders = ref({
-    // 如果需要，可以在这里设置上传请求的头部，例如认证令牌
-    //  'Authorization': 'Bearer' + useUserStore().token
-});
+const handlePictureCardPreview = (uploadFile) => {
+  dialogImageUrl.value = uploadFile.url!;
+  dialogVisible.value = true;
+};
 
-const handleUploadSuccess = (response, file, fileList, field) => {
-    if (response && response.status === 200 && response.code === 0) {
-        if (response.data && response.data.url) {
-            file.url = response.data.url;
+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;
+  }
+};
 
-            // 根据字段类型处理
-            if (field === 'license_image') {
-                applyFormData[field].push(file.url);
-            } else {
-                applyFormData[field] = file.url; // 单文件字段直接赋值
-            }
+const getOcrText = async (batchNo, type) => {
+  return new Promise(async (resolve, reject) => {
+    let formData: null | FormData = new FormData();
 
-            // ElMessage.success('文件上传成功');
-        } else {
-            // ElMessage.error('文件上传成功，但未返回文件 URL');
-        }
+    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;
+    }, 2000);
+  });
+};
+
+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;
+  // formRef.value.validate();
+};
+
+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;
+
+      if (field === "license_image") {
+        applyFormData[field].push(file.url);
+      } else {
+        applyFormData[field] = file.url;
+      }
+      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(response.msg || '文件上传失败');
+      ElMessage.error("文件上传成功，但未返回文件 URL");
+      loading.value = false;
     }
+  } else {
+    ElMessage.error(response.msg || "文件上传失败");
+    loading.value = false;
+  }
+
+  // formRef.value.validate();
 };
 
 const handleUploadError = (error, file) => {
-    // ElMessage.error('文件上传失败');
+  loading.value = false;
+  ElMessage.error("文件上传失败");
+};
+const clearOtherFields = () => {
+  //   if (applyFormData.entity_type === 1) {
+  //     // 清空个人部分的字段
+  //     applyFormData.individual_id_number = "";
+  //     applyFormData.individual_id_images = "";
+  //     applyFormData.individual_id_images2 = "";
+  //   } else if (applyFormData.entity_type === 2) {
+  //     // 清空企业部分的字段
+  //     applyFormData.license_type = "1";
+  //     applyFormData.license_number = "";
+  //     applyFormData.biz_license_number = "";
+  //     applyFormData.biz_license_company = "";
+  //     applyFormData.legal_person_name = "";
+  //     applyFormData.legal_person_mobile = "";
+  //     applyFormData.legal_person_id_number = "";
+  //     applyFormData.biz_license_image = "";
+  //     applyFormData.license_image = [];
+  //     applyFormData.legal_person_id_images = "";
+  //     applyFormData.legal_person_id_images2 = "";
+  //   }
 };
 
-// 表单校验规则
-const rules = reactive({
-    contact_name: [{ required: true, message: '请输入联系人姓名', trigger: 'blur' }],
-    biz_category: [{ required: true, message: '请选择经营品类', trigger: 'change' }],
-    store_name: [{ required: true, message: '请输入门店名称', trigger: 'blur' }],
-    map_address: [{ required: true, message: '请选择地图地址', trigger: 'change' }],
-    position: [{ required: true, message: '请选择地图地址', trigger: 'change' }],
-    store_address: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
-    front_facade_image: [{ required: true, message: '请上传门脸图', trigger: 'change' }],
-    environment_image: [{ required: true, message: '请上传环境图', trigger: 'change' }],
-    biz_license_number: [{ required: true, message: '请输入营业执照编号', trigger: 'blur' }],
-    biz_license_company: [{ required: true, message: '请输入营业执照公司名', trigger: 'blur' }],
-    legal_person_name: [{ required: true, message: '请输入负责人姓名', trigger: 'blur' }],
-    biz_license_image: [{ required: true, message: '请上传营业执照', trigger: 'change' }],
-    // license_image: [{ required: true, message: '请上传许可证', trigger: 'change' }],
-    legal_person_id_images: [{ required: true, message: '请上传负责人身份证正面', trigger: 'change' }],
-    legal_person_id_images2: [{ required: true, message: '请上传负责人身份证反面', trigger: 'change' }],
-    individual_id_number: [{ required: true, message: '请输入个人身份证号', trigger: 'blur' }],
-    individual_id_images: [{ required: true, message: '请上传个人身份证正面', trigger: 'change' }],
-    individual_id_images2: [{ required: true, message: '请上传个人身份证反面', trigger: 'change' }],
-    account_holder_name: [{ required: true, message: '请输入账户姓名', trigger: 'blur' }],
-    account_number: [{ required: true, message: '请输入收款账户号码', trigger: 'blur' }],
-    bank_name: [{ required: true, message: '请选择银行', trigger: 'change' }],
-    // bank_branch_name: [{ required: true, message: '请输入支行名称', trigger: 'blur' }]
+onMounted(() => {
+  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("获取银行失败");
+    });
 });
-
-// 表单引用
-const formRef = ref(null);
-
-// 再次提交审核
-const re_applySubmit = async () => {
-    const isValid = await (formRef.value as any).validate((valid) => {
-        return valid;
-    });
-
-    if (!isValid) {
-        ElMessage.error('请完善表单信息');
-        return;
-    }
-
-    showAll();
-    const newFormData: Record<string, any> = { id: applyFormData.id }; // 添加 id 字段
-    approval_invalid_col.value.forEach(field => {
-        const originalField = keyToOriginalFieldMap[field] || field;
-        if (applyFormData[originalField] !== undefined) {
-            newFormData[originalField] = applyFormData[originalField];
-        }
-        if (applyFormData.province_id !== '') {
-            newFormData.province_id = applyFormData.province_id;
-            newFormData.city_id = applyFormData.city_id;
-            newFormData.county_id = applyFormData.county_id;
-            newFormData.store_latitude = applyFormData.store_latitude;
-            newFormData.store_longitude = applyFormData.store_longitude;
-        }
-        if (applyFormData.license_image != null) {
-            newFormData.license_image = applyFormData.license_imageToString;
-        }
-        console.log("这是", newFormData);
-    });
-    const res = await re_apply(newFormData);
-    if (res && res.status === 200) {
-        location.reload()
-        console.log("成功发送入驻请求");
-    } else {
-        console.log("发送请求失败");
-    }
-};
 </script>
 
-<style lang="scss">
-.check_contain {
+<style lang="scss" scoped>
+:deep(.el-upload--picture-card),
+:deep(.el-upload-list__item) {
+  width: 96px;
+  height: 96px;
+}
+
+.signUp-container {
+  display: flex;
+  padding-top: 12px;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background: #eee;
+
+  .tit {
+    font-size: 16px;
+    margin-bottom: 15px;
+  }
+
+  .steps-container {
+    width: 50%;
+    padding: 15px;
+    border-radius: 5px;
+    background: #fff;
+    margin-bottom: 12px;
+  }
+
+  :deep(.upload-hidden .el-upload--picture-card) {
+    display: none;
+  }
+
+  .form-submit {
+    width: 50%;
+    padding: 15px;
+    margin: 0 0 12px;
+    border-radius: 5px;
+    background: #fff;
+
+    .from_box {
+      width: 100%;
+      padding: 15px;
+      margin: 0 0 12px;
+      border-radius: 5px;
+      background: #fff;
+    }
+  }
+
+  .form-button {
     width: 100%;
-    max-width: 1200px;
-    margin: auto;
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-
-    .check_tips {
-        margin-top: 40px;
-        .check_pass {
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-
-            .icon {
-                display: flex;
-                justify-content: center;
-                align-items: center;
-            }
-        }
-
-        .check_fail {
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-
-            .icon {
-                display: flex;
-                justify-content: center;
-                align-items: center;
-            }
-        }
-
-        .check_wait {
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-
-            .icon {
-                display: flex;
-                justify-content: center;
-                align-items: center;
-            }
-        }
-
-        i {
-            font-size: 200px;
-        }
-
-        p {
-            margin: 10px 0;
-            font-size: 20px;
-        }
-    }
-
-    .check_re_apply {
-        padding-top: 40px;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-    }
+    text-align: center;
+    padding: 20px;
+    background: #fff;
+  }
 }
 
 .auto-item {
-    p {
-        font-size: 15px;
-        font-weight: 900;
+  p {
+    font-size: 15px;
+    font-weight: 900;
+  }
+
+  span {
+    font-size: 10px;
+  }
+}
+
+@media (max-width: 768px) {
+  .el-cascader-menu {
+    width: 120px;
+    min-width: 120px;
+  }
+
+  .signUp-container {
+    .steps-container {
+      width: 100%;
     }
 
-    span {
-        font-size: 10px;
+    .form-submit {
+      width: 100%;
     }
+  }
 }
-@media (max-width: 768px){
-    .el-cascader-menu{
-        width: 120px;
-        min-width: 120px;
-    }
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/start/formConfig.js b/src/views/start/formConfig.js
new file mode 100644
index 0000000..5feda86
--- /dev/null
+++ b/src/views/start/formConfig.js
@@ -0,0 +1,200 @@
+const formConfig =  [
+  {
+    type:"input",
+    key:'contact_name',
+    label:'联系人',
+    placeholder:'请输入联系人',
+  },
+  {
+    type:"select",
+    key:'biz_category',
+    label:'经营品类',
+    isReadonly:true,
+    style:"pointer-events: none",
+    placeholder:'请选择经营品类',
+  },
+  {
+    type:"input",
+    key:'store_name',
+    label:'门店名称',
+    placeholder:'请输入门店名称',
+  },
+  {
+    type:"select",
+    key:'mapAddress',
+    label:'店铺所在地区',
+    isReadonly:true,
+    style:"pointer-events: none",
+    placeholder:'请在地图上选择门店地址',
+  },
+  {
+    type:"input",
+    key:'store_address',
+    label:'店铺详细地址',
+    placeholder:'请输入店铺详细地址',
+  },
+  {
+    type:'upload',
+    key:'storefrontImg',
+    label:'门脸图片',
+    class:"upload-1",
+    placeholder:'',
+    imgUrlArr:[],
+    imgWidth:270,
+    imgHeight:150
+  },
+  {
+    type:'upload',
+    key:'surroundingsImg',
+    class:"upload-2",
+    label:'环境图片',
+    placeholder:'',
+    imgUrlArr:[],
+    imgWidth:270,
+    imgHeight:150
+  },
+  {
+    type:"input",
+    key:'license_number',
+    label:'许可证编号',
+    placeholder:'请输入许可证编号',
+  },
+  {
+    type:"input",
+    key:'biz_license_number',
+    label:'注册号',
+    placeholder:'请输入注册号',
+  },
+  {
+    type:"input",
+    key:'biz_license_company',
+    label:'公司名称',
+    placeholder:'请输入公司名称',
+  },
+  {
+    type:"input",
+    key:'legal_person_name',
+    label:'法人姓名',
+    placeholder:'请输入法人姓名',
+  },
+  {
+    type:"input",
+    key:'legal_person_mobile',
+    label:'法人手机号',
+    placeholder:'请输入法人手机号',
+  },
+  {
+    type:"input",
+    key:'legal_person_id_number',
+    label:'法人身份证号码',
+    placeholder:'请输入法人身份证号',
+  },
+  {
+    type:'upload',
+    key:'biz_license_image',
+    class:"upload-3",
+    label:'营业执照图片',
+    placeholder:'',
+    imgUrlArr:[],
+    imgWidth:125,
+    imgHeight:88
+  },
+  {
+    type:"select",
+    key:'license_type',
+    label:'许可证类型',
+    isReadonly:true,
+    style:"pointer-events: none",
+    placeholder:'请选择许可证类型',
+  },
+  {
+    type:"input",
+    key:'license_number',
+    label:'许可证编号',
+    placeholder:'',
+  },
+  {
+    type:"input",
+    type:'upload',
+    key:'license_image',
+    label:'许可证图片',
+    class:"upload-4",
+    placeholder:'',
+    imgUrlArr:[],
+    imgWidth:125,
+    imgHeight:88,
+    imgUpMaxCount:5
+  },
+  {
+    type:'upload',
+    key:'legal_person_id_images',
+    label:'法人身份证正面图片',
+    class:"upload-5",
+    placeholder:'',
+    imgUrlArr:[],
+    imgWidth:180,
+    imgHeight:110
+  },
+  {
+    type:'upload',
+    key:'legal_person_id_images2',
+    label:'法人身份证反面图片',
+    class:"upload-6",
+    placeholder:'',
+    imgUrlArr:[],
+    imgWidth:180,
+    imgHeight:110
+  },
+  {
+    type:"select",
+    key:'bank_name',
+    label:'开户银行',
+    isReadonly:true,
+    style:"pointer-events: none",
+    placeholder:'请选择开户银行',
+  },
+  {
+    key:'bank_branch_name',
+    label:'开户支行',
+    placeholder:'请输入开户支行名称',
+  },
+  {
+    type:"input",
+    key:'account_number',
+    label:'银行卡号',
+    placeholder:'请输入银行卡号',
+  },
+  {
+    type:"input",
+    key:'account_holder_name',
+    label:'开户名称',
+    placeholder:'请输入开户名称',
+  },
+  {
+    type:"input",
+    key:'individual_id_number',
+    label:'个人身份证号码',
+    placeholder:'请输入个人身份证号码',
+  },
+  {
+    type:'upload',
+    key:'individual_id_images',
+    label:'个人身份证正面图片',
+    class:"upload-5",
+    placeholder:'',
+    imgUrlArr:[]
+  },
+  {
+    type:'upload',
+    key:'individual_id_images2',
+    label:'个人身份证反面图片',
+    class:"upload-5",
+    placeholder:'',
+    imgUrlArr:[]
+  },
+]
+
+
+export default {
+   formConfig,
+}
diff --git a/src/views/start/start.vue b/src/views/start/start.vue
index 3b6134f..5bb0a6b 100644
--- a/src/views/start/start.vue
+++ b/src/views/start/start.vue
@@ -546,10 +546,10 @@
             >
           </el-form-item>
           <template v-if="applyFormData.bank_image">
-            <el-form-item label="账户姓名" prop="account_holder_name">
+            <el-form-item label="开户名称" prop="account_holder_name">
               <el-input v-model="applyFormData.account_holder_name" />
             </el-form-item>
-            <el-form-item label="收款账户号码" prop="account_number">
+            <el-form-item label="银行卡号" prop="account_number">
               <el-input v-model="applyFormData.account_number" />
             </el-form-item>
             <el-form-item label="开户银行" prop="bank_branch_name">
@@ -561,7 +561,6 @@
                 :remote-method="bankListRemoteMethod"
                 v-model="applyFormData.bank_branch_name"
                 placeholder="搜索银行名称"
-                size="large"
                 placement="top-start"
                 style="width: 350px"
                 :options="bankList2"
@@ -607,7 +606,6 @@ import {
   GetPostion,
   GetBank,
   merchApply,
-  re_apply,
   GetAppDistrict,
 } from "@/api/login";
 
@@ -806,93 +804,13 @@ const rules = reactive({
   ],
   // bank_branch_name: [{ required: true, message: '请输入支行名称', trigger: 'blur' }],
   account_number: [
-    { required: true, message: "请输入收款账户号码", trigger: "blur" },
+    { required: true, message: "请输入银行卡号", trigger: "blur" },
   ],
   account_holder_name: [
-    { required: true, message: "请输入账户姓名", trigger: "blur" },
+    { required: true, message: "请输入开户名称", trigger: "blur" },
   ],
 });
 
-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,
@@ -978,8 +896,8 @@ const checkForm = async () => {
   });
 
   if (isValid) {
-    handleReApply();
-    // handleMerchApply
+    // handleReApply();
+    handleMerchApply
   }
 };
 
@@ -1244,7 +1162,7 @@ const getOcrText = async (batchNo, type) => {
         resolve(imgOcrRes?.data);
       }
       loading.value = false;
-    }, 1000);
+    }, 2000);
   });
 };
 
@@ -1275,6 +1193,7 @@ const handleOcrText = async (batchNo, imgType) => {
   }
 
   loading.value = false;
+  formRef.value.validate()
 };
 
 const handleUploadSuccess = async (response, file, fileList, field) => {
@@ -1315,6 +1234,8 @@ const handleUploadSuccess = async (response, file, fileList, field) => {
     ElMessage.error(response.msg || "文件上传失败");
     loading.value = false;
   }
+
+  formRef.value.validate()
 };
 
 const handleUploadError = (error, file) => {