调接口加页面

MrShi

2026-04-20 a987eccb27891bbfaae334b7fa0e892ee2640271

 small-program/pages/store-apply/store-apply.vue

@@ -16,27 +16,37 @@

      <view v-if="currentStep === 1" class="form-card">
         <text class="card-title">门店信息</text>
         <text class="register-no">注册手机号：18155114565</text>
         <text class="register-no">注册手机号：{{ userInfo.telephone || '' }}</text>

         <view class="form-group">
            <view class="label-row"><text class="label">门店名称</text><text class="required">*</text></view>
            <input class="text-input" :value="previewMode === 'filled' ? '中铁快运南站旗舰店' : ''" placeholder="请输入门店名称" placeholder-class="placeholder" />
            <input class="text-input" v-model="form.name" placeholder="请输入门店名称" placeholder-style="color: #c1c7d0;" />
         </view>
         <view class="divider"></view>

         <view class="form-group select-group">
            <view class="label-row"><text class="label">所在城市</text><text class="required">*</text></view>
            <view class="select-row">
               <text class="select-text" :class="{ placeholder: previewMode === 'empty' }">{{ previewMode === 'filled' ? '安徽省/合肥市/庐阳区' : '请选择省市区' }}</text>
            <view class="select-row" @click="showAreaPicker = true">
               <text class="select-text" :class="{ placeholder: !form.areaName }">{{ form.areaName || '请选择省市区' }}</text>
               <u-icon name="arrow-right" size="18" color="#9FA6B2"></u-icon>
            </view>
         </view>
         <u-picker
            :show="showAreaPicker"
            v-if="areaList && areaList.length > 0"
            ref="uPicker"
            confirmColor="#10B2FA"
            keyName="text"
            :columns="areaColumns"
            @confirm="confirmArea"
            @change="changeAreaHandler"
            @cancel="showAreaPicker = false" />
         <view class="divider"></view>

         <view class="form-group select-group">
            <view class="label-row"><text class="label">门店地址</text><text class="required">*</text></view>
            <view class="select-row">
               <text class="select-text" :class="{ placeholder: previewMode === 'empty' }">{{ previewMode === 'filled' ? '九华山路201号' : '请选择地址' }}</text>
            <view class="select-row" @click="chooseAddress">
               <text class="select-text" :class="{ placeholder: !form.address }">{{ form.address || '请选择地址' }}</text>
               <u-icon name="arrow-right" size="18" color="#9FA6B2"></u-icon>
            </view>
         </view>
@@ -44,14 +54,14 @@

         <view class="form-group">
            <view class="label-row"><text class="label">联系人</text><text class="required">*</text></view>
            <input class="text-input" :value="previewMode === 'filled' ? '苏眠眠' : ''" placeholder="请输入联系人姓名" placeholder-class="placeholder" />
            <input class="text-input" v-model="form.linkName" placeholder="请输入联系人姓名" placeholder-style="color: #c1c7d0;" />
         </view>
         <view class="divider"></view>

         <view class="form-group phone-group">
            <view class="label-row"><text class="label">联系人电话</text><text class="required">*</text></view>
            <view class="input-with-icon">
               <input class="text-input" :value="previewMode === 'filled' ? '18155114565' : '18155114565'" placeholder="请输入联系人电话" placeholder-class="placeholder" />
               <input class="text-input" type="number" maxlength="11" v-model="form.linkPhone" placeholder="请输入联系人电话" placeholder-style="color: #c1c7d0;" />
               <view class="clear-icon"></view>
            </view>
         </view>
@@ -59,7 +69,7 @@

         <view class="form-group">
            <view class="label-row"><text class="label">联系人身份证号</text><text class="required">*</text></view>
            <input class="text-input" :value="previewMode === 'filled' ? '340198273482934298' : ''" placeholder="请输入联系人电话" placeholder-class="placeholder" />
            <input class="text-input" type="idcard" maxlength="18" v-model="form.idcard" placeholder="请输入联系人身份证号" placeholder-style="color: #c1c7d0;" />
         </view>
         <view class="divider"></view>

@@ -69,15 +79,13 @@
               <text class="upload-tip">最多上传3张照片</text>
            </view>
            <view class="upload-grid">
               <view class="upload-box">
               <view class="upload-box" @click="chooseStoreFrontImage">
                  <image class="upload-icon" src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
               </view>
               <template v-if="previewMode === 'filled'">
                  <view v-for="n in 2" :key="n" class="image-box">
                     <image class="preview-image" src="" mode="aspectFill"></image>
                     <text class="image-mark">删掉</text>
                  </view>
               </template>
               <view v-for="(item, index) in uploadedImagesStoreFront" :key="index" class="image-box" @click="deleteStoreFrontImage(index)">
                  <image class="preview-image" :src="item.url" mode="aspectFill"></image>
                  <text class="image-mark">删掉</text>
               </view>
            </view>
         </view>

@@ -87,15 +95,13 @@
               <text class="upload-tip">最多上传3张照片</text>
            </view>
            <view class="upload-grid">
               <view class="upload-box">
               <view class="upload-box" @click="chooseIdCardImage">
                  <image class="upload-icon" src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
               </view>
               <template v-if="previewMode === 'filled'">
                  <view v-for="n in 3" :key="n" class="image-box">
                     <image class="preview-image" src="" mode="aspectFill"></image>
                     <text class="image-mark">删掉</text>
                  </view>
               </template>
               <view v-for="(item, index) in uploadedImagesIdCard" :key="index" class="image-box" @click="deleteIdCardImage(index)">
                  <image class="preview-image" :src="item.url" mode="aspectFill"></image>
                  <text class="image-mark">删掉</text>
               </view>
            </view>
         </view>

@@ -105,8 +111,12 @@
               <text class="upload-tip">最多上传3张照片</text>
            </view>
            <view class="upload-grid">
               <view class="upload-box">
               <view class="upload-box" @click="choosePermitImage">
                  <image class="upload-icon" src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
               </view>
               <view v-for="(item, index) in uploadedImagesPermit" :key="index" class="image-box" @click="deletePermitImage(index)">
                  <image class="preview-image" :src="item.url" mode="aspectFill"></image>
                  <text class="image-mark">删掉</text>
               </view>
            </view>
         </view>
@@ -118,15 +128,15 @@
         <view class="form-group subject-first-group">
            <view class="label-row"><text class="label">门店类型</text><text class="required">*</text></view>
            <view class="switch-row type-switch-row">
               <view class="switch-pill" :class="{ active: qualificationType === 'personal' }" @tap="qualificationType = 'personal'">个人</view>
               <view class="switch-pill" :class="{ active: qualificationType === 'company' }" @tap="qualificationType = 'company'">企业</view>
               <view class="switch-pill" :class="{ active: qualificationType === 'personal' }" @tap="switchQualification('personal')">个人</view>
               <view class="switch-pill" :class="{ active: qualificationType === 'company' }" @tap="switchQualification('company')">企业</view>
            </view>
         </view>

         <template v-if="qualificationType === 'personal'">
            <view class="form-group compact-group">
               <view class="label-row"><text class="label">支付宝账号</text><text class="required">*</text></view>
               <input class="text-input" :value="previewMode === 'filled' ? '18155114565@alipay.com' : ''" placeholder="请输入个人支付宝账号" placeholder-class="placeholder" />
               <input class="text-input" v-model="form.aliAccount" placeholder="请输入个人支付宝账号" placeholder-class="placeholder" />
            </view>
            <view class="divider"></view>

@@ -135,13 +145,15 @@
                  <view class="label-row"><text class="label">身份证正反面</text><text class="required">*</text></view>
               </view>
               <view class="upload-grid double-upload-grid">
                  <view class="upload-box id-upload-box">
                     <image class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <text class="upload-text">上传人像面</text>
                  <view class="upload-box id-upload-box" @click="chooseIdCardFront">
                     <image v-if="!form.idcardImg" class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <image v-else class="preview-image" :src="getFullPath(form.idcardImg)" mode="aspectFill"></image>
                     <text v-if="!form.idcardImg" class="upload-text">上传人像面</text>
                  </view>
                  <view class="upload-box id-upload-box">
                     <image class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <text class="upload-text">上传国徽面</text>
                  <view class="upload-box id-upload-box" @click="chooseIdCardBack">
                     <image v-if="!form.idcardImgBack" class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <image v-else class="preview-image" :src="getFullPath(form.idcardImgBack)" mode="aspectFill"></image>
                     <text v-if="!form.idcardImgBack" class="upload-text">上传国徽面</text>
                  </view>
               </view>
            </view>
@@ -152,15 +164,13 @@
                  <text class="upload-tip">最多上传3张照片</text>
               </view>
               <view class="upload-grid">
                  <view class="upload-box">
                  <view class="upload-box" @click="chooseLaborContractImage">
                     <image class="upload-icon" src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
                  </view>
                  <template v-if="previewMode === 'filled'">
                     <view v-for="n in 3" :key="n" class="image-box">
                        <image class="preview-image" src="" mode="aspectFill"></image>
                        <text class="image-mark">删掉</text>
                     </view>
                  </template>
                  <view v-for="(item, index) in uploadedLaborContractImages" :key="index" class="image-box" @click="deleteLaborContractImage(index)">
                     <image class="preview-image" :src="item.url" mode="aspectFill"></image>
                     <text class="image-mark">删掉</text>
                  </view>
               </view>
            </view>

@@ -170,15 +180,13 @@
                  <text class="upload-tip">最多上传3张照片</text>
               </view>
               <view class="upload-grid">
                  <view class="upload-box">
                  <view class="upload-box" @click="chooseSocialSecurityImage">
                     <image class="upload-icon" src="/static/image/btn_upload@2x.png" mode="widthFix"></image>
                  </view>
                  <template v-if="previewMode === 'filled'">
                     <view class="image-box">
                        <image class="preview-image" src="" mode="aspectFill"></image>
                        <text class="image-mark">删掉</text>
                     </view>
                  </template>
                  <view v-for="(item, index) in uploadedSocialSecurityImages" :key="index" class="image-box" @click="deleteSocialSecurityImage(index)">
                     <image class="preview-image" :src="item.url" mode="aspectFill"></image>
                     <text class="image-mark">删掉</text>
                  </view>
               </view>
            </view>
         </template>
@@ -186,19 +194,19 @@
         <template v-else>
            <view class="form-group compact-group">
               <view class="label-row"><text class="label">法人姓名</text><text class="required">*</text></view>
               <input class="text-input" :value="previewMode === 'filled' ? '张光宣' : ''" placeholder="请输入法人姓名" placeholder-class="placeholder" />
               <input class="text-input" v-model="form.legalPersonName" placeholder="请输入法人姓名" placeholder-style="color: #c1c7d0;" />
            </view>
            <view class="divider"></view>

            <view class="form-group compact-group">
               <view class="label-row"><text class="label">企业支付宝账号</text><text class="required">*</text></view>
               <input class="text-input" :value="previewMode === 'filled' ? 'company@alipay.com' : ''" placeholder="请输入企业支付宝账号" placeholder-class="placeholder" />
               <input class="text-input" v-model="form.aliAccount" placeholder="请输入企业支付宝账号" placeholder-style="color: #c1c7d0;" />
            </view>
            <view class="divider"></view>

            <view class="form-group compact-group">
               <view class="label-row"><text class="label">法人身份证号</text><text class="required">*</text></view>
               <input class="text-input" :value="previewMode === 'filled' ? '340198273482934298' : ''" placeholder="请输入法人身份证号码" placeholder-class="placeholder" />
               <input class="text-input" v-model="form.legalPersonCard" placeholder="请输入法人身份证号码" placeholder-style="color: #c1c7d0;" />
            </view>
            <view class="divider"></view>

@@ -207,13 +215,15 @@
                  <view class="label-row"><text class="label">法人身份证正反面</text><text class="required">*</text></view>
               </view>
               <view class="upload-grid double-upload-grid">
                  <view class="upload-box id-upload-box">
                     <image class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <text class="upload-text">上传人像面</text>
                  <view class="upload-box id-upload-box" @click="chooseLegalPersonCardFront">
                     <image v-if="!form.legalPersonCard" class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <image v-else class="preview-image" :src="getFullPath(form.legalPersonCard)" mode="aspectFill"></image>
                     <text v-if="!form.legalPersonCard" class="upload-text">上传人像面</text>
                  </view>
                  <view class="upload-box id-upload-box">
                     <image class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <text class="upload-text">上传国徽面</text>
                  <view class="upload-box id-upload-box" @click="chooseLegalPersonCardBack">
                     <image v-if="!form.legalPersonCardBack" class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <image v-else class="preview-image" :src="getFullPath(form.legalPersonCardBack)" mode="aspectFill"></image>
                     <text v-if="!form.legalPersonCardBack" class="upload-text">上传国徽面</text>
                  </view>
               </view>
            </view>
@@ -223,9 +233,10 @@
                  <view class="label-row"><text class="label">营业执照</text><text class="required">*</text></view>
               </view>
               <view class="upload-grid">
                  <view class="upload-box license-upload-box">
                     <image class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <text class="upload-text">点击上传</text>
                  <view class="upload-box license-upload-box" @click="chooseBusinessImage">
                     <image v-if="!form.businessImg" class="camera-icon" src="/static/icon/ic_camera@2x.png" mode="widthFix"></image>
                     <image v-else class="preview-image" :src="getFullPath(form.businessImg)" mode="aspectFill"></image>
                     <text v-if="!form.businessImg" class="upload-text">点击上传</text>
                  </view>
               </view>
            </view>
@@ -234,23 +245,693 @@

      <view class="bottom-btn-wrap">
         <template v-if="currentStep === 1">
            <view class="next-btn">下一步</view>
            <view class="next-btn" @click="goToStep2">下一步</view>
         </template>
         <template v-else>
            <view class="footer-btn footer-plain-btn">上一步</view>
            <view class="footer-btn footer-primary-btn">提交入驻申请</view>
            <view class="footer-btn footer-plain-btn" @click="currentStep = 1">上一步</view>
            <view class="footer-btn footer-primary-btn" @click="submitApply">提交入驻申请</view>
         </template>
      </view>
   </view>
</template>

<script>
   import { mapState } from 'vuex'
   export default {
      computed: {
         ...mapState(['userInfo'])
      },
      data() {
         return {
            form: {
               telephone: '',
               companyType: 0,
               name: '',
               areaId: '',
               longitude: '',
               latitude: '',
               address: '',
               linkName: '',
               linkPhone: '',
               idcard: '',
               storeFrontImgs: [],
               storeInteriorImgs: [],
               otherMaterialImgs: [],
               idcardImg: '',
               idcardImgBack: '',
               laborContractImgs: [],
               socialSecurityImgs: [],
               legalPersonCard: '',
               legalPersonCardBack: '',
               legalPersonName: '',
               legalPersonPhone: '',
               aliAccount: '',
               businessImg: ''
            },

            previewMode: 'filled',
            currentStep: 2,
            qualificationType: 'company'
            currentStep: 1,
            qualificationType: 'company',
            showAreaPicker: false,
            areaList: [],
            areaColumns: [],
            uploadedImagesStoreFront: [],
            uploadedImagesIdCard: [],
            uploadedImagesBusiness: [],
            uploadedImagesPermit: [],
            uploadedLaborContractImages: [],
            uploadedSocialSecurityImages: [],
            storeFrontImages: [],
            idCardImages: [],
            businessImages: [],
            permitImages: [],
            laborContractImages: [],
            socialSecurityImages: []
         }
      },
      onLoad() {
         this.form.telephone = this.userInfo.telephone || ''
         this.getAreaList()
         this.getMyShopData()
      },
      methods: {
         goToStep2() {
            if (!this.form.name) {
               uni.showToast({ title: '请输入门店名称', icon: 'none' })
               return
            }
            if (!this.form.areaId) {
               uni.showToast({ title: '请选择所在城市', icon: 'none' })
               return
            }
            if (!this.form.address) {
               uni.showToast({ title: '请选择门店地址', icon: 'none' })
               return
            }
            if (!this.form.linkName) {
               uni.showToast({ title: '请输入联系人', icon: 'none' })
               return
            }
            if (!this.form.linkPhone) {
               uni.showToast({ title: '请输入联系人电话', icon: 'none' })
               return
            }
            if (!this.form.idcard) {
               uni.showToast({ title: '请输入联系人身份证号', icon: 'none' })
               return
            }
            if (!this.form.storeFrontImgs || this.form.storeFrontImgs.length === 0) {
               uni.showToast({ title: '请上传门店门头照片', icon: 'none' })
               return
            }
            if (!this.form.storeInteriorImgs || this.form.storeInteriorImgs.length === 0) {
               uni.showToast({ title: '请上传门店内部招牌', icon: 'none' })
               return
            }
            this.currentStep = 2
         },
         switchQualification(type) {
            this.qualificationType = type
            this.form.companyType = type === 'personal' ? 0 : 1
         },
         async submitApply() {
            if (this.form.companyType === 0) {
               if (!this.form.idcardImg) {
                  uni.showToast({ title: '请上传身份证人像面', icon: 'none' })
                  return
               }
               if (!this.form.idcardImgBack) {
                  uni.showToast({ title: '请上传身份证国徽面', icon: 'none' })
                  return
               }
               if (!this.form.laborContractImgs || this.form.laborContractImgs.length === 0) {
                  uni.showToast({ title: '请上传劳动合同', icon: 'none' })
                  return
               }
               if (!this.form.socialSecurityImgs || this.form.socialSecurityImgs.length === 0) {
                  uni.showToast({ title: '请上传社保缴纳证明', icon: 'none' })
                  return
               }
            } else {
               if (!this.form.legalPersonName) {
                  uni.showToast({ title: '请输入法人姓名', icon: 'none' })
                  return
               }
               if (!this.form.aliAccount) {
                  uni.showToast({ title: '请输入企业支付宝账号', icon: 'none' })
                  return
               }
               if (!this.form.legalPersonCard) {
                  uni.showToast({ title: '请上传法人身份证人像面', icon: 'none' })
                  return
               }
               if (!this.form.legalPersonCardBack) {
                  uni.showToast({ title: '请上传法人身份证国徽面', icon: 'none' })
                  return
               }
               if (!this.form.businessImg) {
                  uni.showToast({ title: '请上传营业执照', icon: 'none' })
                  return
               }
            }
            uni.showLoading({ title: '提交中...', mask: true })
            try {
               const res = await this.$u.api.applyShop(this.form)
               uni.hideLoading()
               if (res.code === 200) {
                  uni.showToast({ title: '提交成功', icon: 'success' })
                  setTimeout(() => {
                     uni.navigateBack()
                  }, 1500)
               } else {
                  uni.showToast({ title: res.msg || '提交失败', icon: 'none' })
               }
            } catch (error) {
               uni.hideLoading()
               uni.showToast({ title: '提交失败', icon: 'none' })
            }
         },
         async getMyShopData() {
            try {
               const res = await this.$u.api.getMyShop()
               if (res.code === 200 && res.data) {
                  const data = res.data
                  const imgPrefix = data.imgPrefix || ''
                  this.form.name = data.name || ''
                  this.form.areaId = data.areaId || ''
                  this.form.areaName = data.areaName || ''
                  this.form.address = data.address || ''
                  this.form.longitude = data.longitude || ''
                  this.form.latitude = data.latitude || ''
                  this.form.linkName = data.linkName || ''
                  this.form.linkPhone = data.linkPhone || ''
                  this.form.idcard = data.idcard || ''
                  this.form.aliAccount = data.aliAccount || ''
                  this.form.companyType = data.companyType || 0
                  this.form.telephone = data.telephone || this.userInfo.telephone || ''
                  this.form.legalPersonName = data.legalPersonName || ''
                  this.form.legalPersonPhone = data.legalPersonPhone || ''
                  this.qualificationType = data.companyType === 0 ? 'personal' : 'company'
                  if (data.storeFrontImgs) {
                     let storeFrontImgs = data.storeFrontImgs
                     if (typeof storeFrontImgs === 'string') {
                        storeFrontImgs = storeFrontImgs.split(',')
                     }
                     this.storeFrontImages = storeFrontImgs
                     this.uploadedImagesStoreFront = storeFrontImgs.map(url => ({ url: imgPrefix + url }))
                     this.form.storeFrontImgs = storeFrontImgs
                  }
                  if (data.storeInteriorImgs) {
                     let storeInteriorImgs = data.storeInteriorImgs
                     if (typeof storeInteriorImgs === 'string') {
                        storeInteriorImgs = storeInteriorImgs.split(',')
                     }
                     this.idCardImages = storeInteriorImgs
                     this.uploadedImagesIdCard = storeInteriorImgs.map(url => ({ url: imgPrefix + url }))
                     this.form.storeInteriorImgs = storeInteriorImgs
                  }
                  if (data.otherMaterialImgs) {
                     let otherMaterialImgs = data.otherMaterialImgs
                     if (typeof otherMaterialImgs === 'string') {
                        otherMaterialImgs = otherMaterialImgs.split(',')
                     }
                     this.permitImages = otherMaterialImgs
                     this.uploadedImagesPermit = otherMaterialImgs.map(url => ({ url: imgPrefix + url }))
                     this.form.otherMaterialImgs = otherMaterialImgs
                  }
                  this.form.idcardImg = data.idcardImg ? imgPrefix + data.idcardImg : ''
                  this.form.idcardImgBack = data.idcardImgBack ? imgPrefix + data.idcardImgBack : ''
                  if (data.laborContractImgs) {
                     let laborContractImgs = data.laborContractImgs
                     if (typeof laborContractImgs === 'string') {
                        laborContractImgs = laborContractImgs.split(',')
                     }
                     this.laborContractImages = laborContractImgs
                     this.uploadedLaborContractImages = laborContractImgs.map(url => ({ url: imgPrefix + url }))
                     this.form.laborContractImgs = laborContractImgs
                  }
                  if (data.socialSecurityImgs) {
                     let socialSecurityImgs = data.socialSecurityImgs
                     if (typeof socialSecurityImgs === 'string') {
                        socialSecurityImgs = socialSecurityImgs.split(',')
                     }
                     this.socialSecurityImages = socialSecurityImgs
                     this.uploadedSocialSecurityImages = socialSecurityImgs.map(url => ({ url: imgPrefix + url }))
                     this.form.socialSecurityImgs = socialSecurityImgs
                  }
                  this.form.legalPersonCard = data.legalPersonCard ? imgPrefix + data.legalPersonCard : ''
                  this.form.legalPersonCardBack = data.legalPersonCardBack ? imgPrefix + data.legalPersonCardBack : ''
                  this.form.businessImg = data.businessImg ? imgPrefix + data.businessImg : ''
                  if (data.businessImg) {
                     this.businessImages = [data.businessImg]
                  }
               }
            } catch (error) {
               console.log('获取店铺信息失败', error)
            }
         },
         getAreaList() {
            this.$u.api.treeList({
               type: 0,
               flag: 1
            }).then(res => {
               if (res.code === 200) {
                  this.areaList = res.data
                  this.areaColumns[0] = this.areaList.map(item => {
                     return {
                        id: item.id,
                        text: item.name
                     }
                  })
                  this.areaColumns[1] = this.areaList[0].childList.map(item => {
                     return {
                        id: item.id,
                        text: item.name
                     }
                  })
                  this.areaColumns[2] = this.areaList[0].childList[0].childList.map(item => {
                     return {
                        id: item.id,
                        text: item.name
                     }
                  })
               }
            })
         },
         confirmArea(e) {
            this.form.areaId = e.value[e.value.length - 1].id
            this.form.areaName = e.value[0].text + '/' + e.value[1].text + '/' + e.value[2].text
            this.showAreaPicker = false
         },
         chooseAddress() {
            uni.chooseLocation({
               success: (res) => {
                  this.form.address = res.address
                  this.form.longitude = res.longitude
                  this.form.latitude = res.latitude
               }
            })
         },
         changeAreaHandler(e) {
            const { columnIndex, indexs, picker = this.$refs.uPicker } = e
            if (columnIndex === 0) {
               let city = this.areaList[indexs[0]].childList.map(item => {
                  return {
                     id: item.id,
                     text: item.name
                  }
               })
               let qu = this.areaList[indexs[0]].childList[0].childList.map(item => {
                  return {
                     id: item.id,
                     text: item.name
                  }
               })
               picker.setColumnValues(1, city)
               picker.setColumnValues(2, qu)
            } else if (columnIndex === 1) {
               let qu = this.areaList[indexs[0]].childList[indexs[1]].childList.map(item => {
                  return {
                     id: item.id,
                     text: item.name
                  }
               })
               picker.setColumnValues(2, qu)
            }
         },
         async uploadFiles(filePaths, maxCount = 9) {
            if (!filePaths || filePaths.length === 0) {
               return []
            }
            const limitedPaths = filePaths.slice(0, maxCount)
            const uploadTasks = limitedPaths.map(filePath => {
               return new Promise((resolve, reject) => {
                  uni.uploadFile({
                     url: this.$baseUrl + '/web/public/upload',
                     filePath: filePath,
                     name: 'file',
                     formData: {
                        folder: 'shop'
                     },
                     success: (res) => {
                        if (res.statusCode === 200) {
                           const data = JSON.parse(res.data)
                           if (data.code === 200) {
                              resolve(data.data)
                           } else {
                              reject(new Error(data.msg || '上传失败'))
                           }
                        } else {
                           reject(new Error('上传失败'))
                        }
                     },
                     fail: (err) => {
                        reject(err)
                     }
                  })
               })
            })
            try {
               const results = await Promise.all(uploadTasks)
               return results
            } catch (error) {
               uni.showToast({
                  title: '上传失败',
                  icon: 'none'
               })
               throw error
            }
         },
         deleteStoreFrontImage(index) {
            this.uploadedImagesStoreFront.splice(index, 1)
            this.storeFrontImages.splice(index, 1)
            this.form.storeFrontImgs = this.storeFrontImages.map(url => this.getShortPath(url))
         },
         async chooseStoreFrontImage() {
            const maxCount = 3
            const currentCount = this.storeFrontImages.length
            const remainingCount = maxCount - currentCount
            if (remainingCount <= 0) {
               uni.showToast({
                  title: `最多上传${maxCount}张图片`,
                  icon: 'none'
               })
               return
            }
            uni.chooseImage({
               count: remainingCount,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({
                     title: '上传中...',
                     mask: true
                  })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, maxCount)
                     const fullPaths = uploadResults.map(item => item.url || item.path || item)
                     this.uploadedImagesStoreFront = [...this.uploadedImagesStoreFront, ...fullPaths.map(url => ({ url }))]
                     this.storeFrontImages = [...this.storeFrontImages, ...fullPaths]
                     this.form.storeFrontImgs = this.storeFrontImages.map(url => this.getShortPath(url))
                     uni.hideLoading()
                     uni.showToast({
                        title: '上传成功',
                        icon: 'success'
                     })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         deleteIdCardImage(index) {
            this.uploadedImagesIdCard.splice(index, 1)
            this.idCardImages.splice(index, 1)
            this.form.storeInteriorImgs = this.idCardImages.map(url => this.getShortPath(url))
         },
         async chooseIdCardImage() {
            const maxCount = 2
            const currentCount = this.idCardImages.length
            const remainingCount = maxCount - currentCount
            if (remainingCount <= 0) {
               uni.showToast({
                  title: `最多上传${maxCount}张图片`,
                  icon: 'none'
               })
               return
            }
            uni.chooseImage({
               count: remainingCount,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({
                     title: '上传中...',
                     mask: true
                  })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, maxCount)
                     const fullPaths = uploadResults.map(item => item.url || item.path || item)
                     this.uploadedImagesIdCard = [...this.uploadedImagesIdCard, ...fullPaths.map(url => ({ url }))]
                     this.idCardImages = [...this.idCardImages, ...fullPaths]
                     this.form.storeInteriorImgs = this.idCardImages.map(url => this.getShortPath(url))
                     uni.hideLoading()
                     uni.showToast({
                        title: '上传成功',
                        icon: 'success'
                     })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         deleteBusinessImage(index) {
            this.uploadedImagesBusiness.splice(index, 1)
            this.businessImages.splice(index, 1)
            this.form.businessImg = this.businessImages.map(url => this.getShortPath(url)).join(',')
         },
         async chooseBusinessImage() {
            const maxCount = 3
            const currentCount = this.businessImages.length
            const remainingCount = maxCount - currentCount
            if (remainingCount <= 0) {
               uni.showToast({
                  title: `最多上传${maxCount}张图片`,
                  icon: 'none'
               })
               return
            }
            uni.chooseImage({
               count: remainingCount,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({
                     title: '上传中...',
                     mask: true
                  })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, maxCount)
                     const fullPaths = uploadResults.map(item => item.url || item.path || item)
                     this.uploadedImagesBusiness = [...this.uploadedImagesBusiness, ...fullPaths.map(url => ({ url }))]
                     this.businessImages = [...this.businessImages, ...fullPaths]
                     this.form.businessImg = this.businessImages.map(url => this.getShortPath(url)).join(',')
                     uni.hideLoading()
                     uni.showToast({
                        title: '上传成功',
                        icon: 'success'
                     })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         deletePermitImage(index) {
            this.uploadedImagesPermit.splice(index, 1)
            this.permitImages.splice(index, 1)
            this.form.otherMaterialImgs = this.permitImages.map(url => this.getShortPath(url))
         },
         async choosePermitImage() {
            const maxCount = 3
            const currentCount = this.permitImages.length
            const remainingCount = maxCount - currentCount
            if (remainingCount <= 0) {
               uni.showToast({
                  title: `最多上传${maxCount}张图片`,
                  icon: 'none'
               })
               return
            }
            uni.chooseImage({
               count: remainingCount,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({
                     title: '上传中...',
                     mask: true
                  })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, maxCount)
                     const fullPaths = uploadResults.map(item => item.url || item.path || item)
                     this.uploadedImagesPermit = [...this.uploadedImagesPermit, ...fullPaths.map(url => ({ url }))]
                     this.permitImages = [...this.permitImages, ...fullPaths]
                     this.form.otherMaterialImgs = this.permitImages.map(url => this.getShortPath(url))
                     uni.hideLoading()
                     uni.showToast({
                        title: '上传成功',
                        icon: 'success'
                     })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         chooseIdCardFront() {
            uni.chooseImage({
               count: 1,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({ title: '上传中...', mask: true })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, 1)
                     this.form.idcardImg = this.getShortPath(uploadResults[0].url || uploadResults[0].path || uploadResults[0])
                     uni.hideLoading()
                     uni.showToast({ title: '上传成功', icon: 'success' })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         chooseIdCardBack() {
            uni.chooseImage({
               count: 1,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({ title: '上传中...', mask: true })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, 1)
                     this.form.idcardImgBack = this.getShortPath(uploadResults[0].url || uploadResults[0].path || uploadResults[0])
                     uni.hideLoading()
                     uni.showToast({ title: '上传成功', icon: 'success' })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         chooseLegalPersonCardFront() {
            uni.chooseImage({
               count: 1,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({ title: '上传中...', mask: true })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, 1)
                     this.form.legalPersonCard = this.getShortPath(uploadResults[0].url || uploadResults[0].path || uploadResults[0])
                     uni.hideLoading()
                     uni.showToast({ title: '上传成功', icon: 'success' })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         chooseLegalPersonCardBack() {
            uni.chooseImage({
               count: 1,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({ title: '上传中...', mask: true })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, 1)
                     this.form.legalPersonCardBack = this.getShortPath(uploadResults[0].url || uploadResults[0].path || uploadResults[0])
                     uni.hideLoading()
                     uni.showToast({ title: '上传成功', icon: 'success' })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         deleteLaborContractImage(index) {
            this.uploadedLaborContractImages.splice(index, 1)
            this.laborContractImages.splice(index, 1)
            this.form.laborContractImgs = this.laborContractImages.map(url => this.getShortPath(url))
         },
         async chooseLaborContractImage() {
            const maxCount = 3
            const currentCount = this.laborContractImages.length
            const remainingCount = maxCount - currentCount
            if (remainingCount <= 0) {
               uni.showToast({ title: `最多上传${maxCount}张图片`, icon: 'none' })
               return
            }
            uni.chooseImage({
               count: remainingCount,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({ title: '上传中...', mask: true })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, maxCount)
                     const fullPaths = uploadResults.map(item => item.url || item.path || item)
                     this.uploadedLaborContractImages = [...this.uploadedLaborContractImages, ...fullPaths.map(url => ({ url }))]
                     this.laborContractImages = [...this.laborContractImages, ...fullPaths]
                     this.form.laborContractImgs = this.laborContractImages.map(url => this.getShortPath(url))
                     uni.hideLoading()
                     uni.showToast({ title: '上传成功', icon: 'success' })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         },
         deleteSocialSecurityImage(index) {
            this.uploadedSocialSecurityImages.splice(index, 1)
            this.socialSecurityImages.splice(index, 1)
            this.form.socialSecurityImgs = this.socialSecurityImages.map(url => this.getShortPath(url))
         },
         getShortPath(url) {
            if (!url) return ''
            const baseUrl = this.$baseUrl || ''
            if (url.startsWith('http')) {
               return url
            }
            return url.replace(baseUrl, '')
         },
         getFullPath(url) {
            if (!url) return ''
            if (url.startsWith('http')) {
               return url
            }
            return (this.$baseUrl || '') + url
         },
         async chooseSocialSecurityImage() {
            const maxCount = 3
            const currentCount = this.socialSecurityImages.length
            const remainingCount = maxCount - currentCount
            if (remainingCount <= 0) {
               uni.showToast({ title: `最多上传${maxCount}张图片`, icon: 'none' })
               return
            }
            uni.chooseImage({
               count: remainingCount,
               sizeType: ['compressed'],
               sourceType: ['album', 'camera'],
               success: async (res) => {
                  const tempFilePaths = res.tempFilePaths
                  uni.showLoading({ title: '上传中...', mask: true })
                  try {
                     const uploadResults = await this.uploadFiles(tempFilePaths, maxCount)
                     const fullPaths = uploadResults.map(item => item.url || item.path || item)
                     this.uploadedSocialSecurityImages = [...this.uploadedSocialSecurityImages, ...fullPaths.map(url => ({ url }))]
                     this.socialSecurityImages = [...this.socialSecurityImages, ...fullPaths]
                     this.form.socialSecurityImgs = this.socialSecurityImages.map(url => this.getShortPath(url))
                     uni.hideLoading()
                     uni.showToast({ title: '上传成功', icon: 'success' })
                  } catch (error) {
                     uni.hideLoading()
                  }
               }
            })
         }
      }
   }
@@ -600,12 +1281,12 @@
      left: 0;
      right: 0;
      bottom: 0;
      height: 24rpx;
      line-height: 24rpx;
      height: 40rpx;
      line-height: 40rpx;	
      text-align: center;
      font-size: 16rpx;
      font-size: 24rpx;
      color: #ffffff;
      background: rgba(0, 0, 0, 0.4);
      background: rgba(0,0,0,0.5);
   }

   .bottom-btn-wrap {