You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1099 lines
39 KiB
1099 lines
39 KiB
<template>
|
|
<gui-page>
|
|
<view slot="gBody" v-if="detail">
|
|
<view style="position: relative;">
|
|
<!-- 表单元素核心区域 -->
|
|
<scroll-view class=" gui-dark-bg-level-3 gui-margin-top gui-flex1" :scroll-y="true"
|
|
:show-scrollbar="false">
|
|
<view style="padding: 20rpx;">
|
|
<form @submit="submit">
|
|
<view
|
|
style="background-color: #fff;padding:0 20rpx;border-radius: 10rpx;margin-bottom: 20rpx;">
|
|
<view style="font-weight: bold;font-size: 32rpx;">商户基本信息</view>
|
|
<view class="gui-form-item gui-border-b">
|
|
<text class="gui-form-label" style="width: 150rpx;"><text
|
|
style="color: red;">*</text>商户LOGO</text>
|
|
<view class="gui-form-body">
|
|
<view v-if="!logo_image.image_id"
|
|
style="width: 120rpx;color: #9e9e9e;background-color: #f5f6f7;height: 120rpx;text-align: center;padding: 30rpx 0;margin-left: 380rpx;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">logo</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 120rpx;color: #9e9e9e;background-color: #f5f6f7;height: 120rpx;text-align: center;margin-left: 380rpx;">
|
|
<image :src="logo_image.url" style="height: 160rpx;" mode="heightFix">
|
|
</image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item gui-border-b">
|
|
<text class="gui-form-label"><text style="color: red;">*</text>商户简称</text>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.shop_name"
|
|
@input="inputsss($event,'shop_name')" name="shop_name" placeholder="请输入商户简称"
|
|
style="text-align: right;" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item gui-border-b">
|
|
<text class="gui-form-label"><text style="color: red;">*</text>主营类目</text>
|
|
<view class="gui-form-body">
|
|
|
|
<view style="text-align: right;">{{ name }}</view>
|
|
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item ">
|
|
<text class="gui-form-label"><text style="color: red;">*</text>营业时间</text>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.shop_hours"
|
|
@input="inputsss($event,'shop_hours')" name="shop_hours"
|
|
placeholder="请输入营业时间(如9:00-18:00)" style="text-align: right;" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item ">
|
|
<text class="gui-form-label"><text style="color: red;">*</text>客服电话</text>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.kftelephone"
|
|
@input="inputsss($event,'kftelephone')" name="kftelephone"
|
|
placeholder="请输入客服电话" style="text-align: right;" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item gui-border-b">
|
|
<text class="gui-form-label" style="width: 200rpx;"><text
|
|
style="color: red;">*</text>客服微信二维码</text>
|
|
<view class="gui-form-body">
|
|
<view v-if="!service.image_id"
|
|
style="width: 120rpx;color: #9e9e9e;background-color: #f5f6f7;height: 120rpx;text-align: center;padding: 30rpx 0;margin-left: 330rpx;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">二维码</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 120rpx;color: #9e9e9e;background-color: #f5f6f7;height: 120rpx;text-align: center;margin-left: 330rpx;">
|
|
<image :src="service.url" style="height: 160rpx;" mode="heightFix"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
style="background-color: #fff;padding:30rpx 20rpx;border-radius: 10rpx;margin-bottom: 20rpx;">
|
|
<view style="font-weight: bold;font-size: 32rpx;">身份证照片</view>
|
|
<view style="display: flex;margin: 20rpx 0;">
|
|
<view v-if="!card_front.image_id"
|
|
style="width: 47%;margin-right: 6%;color: #9e9e9e;background-color: #f5f6f7;height: 160rpx;text-align: center;padding: 30rpx 0;border-radius: 10rpx;">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传身份证正面</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 47%;margin-right: 6%;color: #9e9e9e;background-color: #f5f6f7;height: 160rpx;display: flex;justify-content: center;align-items: center;border-radius: 10rpx">
|
|
<image :src="card_front.url" style="height: 160rpx;" mode="heightFix"></image>
|
|
</view>
|
|
<view v-if="!card_opposite.image_id"
|
|
style="width: 47%;background-color: #f5f6f7;text-align: center;padding: 30rpx 0;color: #9e9e9e;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传身份证背面</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 47%;background-color: #f5f6f7;height: 160rpx;display: flex;justify-content: center;align-items: center;border-radius: 10rpx">
|
|
<image :src="card_opposite.url" style="height: 160rpx;" mode="heightFix">
|
|
</image>
|
|
</view>
|
|
</view>
|
|
<view style="font-size: 23rpx;color: #9e9e9e;">请保持身份证与经营者信息一致</view>
|
|
</view>
|
|
|
|
<view
|
|
style="background-color: #fff;padding:30rpx 20rpx;border-radius: 10rpx;margin-bottom: 20rpx;">
|
|
<view style="font-weight: bold;font-size: 32rpx;margin-bottom: 20rpx;">经营者基本信息</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>姓名
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.name" name="name"
|
|
@input="inputsss($event,'name')" placeholder="请输入姓名" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>邮箱
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.mailbox"
|
|
@input="inputsss($event,'mailbox')" name="mailbox" placeholder="请输入邮箱"
|
|
disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>手机号
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.phone" name="phone"
|
|
@input="inputsss($event,'phone')" placeholder="请输入手机号" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>身份证号
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.IDCard" name="IDCard"
|
|
@input="inputsss($event,'IDCard')" placeholder="请输入身份证号" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>身份证地址
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.IDCard_address"
|
|
@input="inputsss($event,'IDCard_address')" name="IDCard_address"
|
|
placeholder="请输入身份证地址" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>微信号
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.WeChat" name="WeChat"
|
|
@input="inputsss($event,'WeChat')" placeholder="请输入微信号" disabled />
|
|
</view>
|
|
</view>
|
|
<view
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view class="gui-form-item " style="padding: 10rpx 0;">
|
|
<view style="display: flex;">
|
|
<view
|
|
style="width: 180rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>身份证有效期
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<view
|
|
class="gui-flex gui-rows gui-nowrap gui-space-between gui-align-items-center">
|
|
<text class="gui-text" style="text-align: right;"></text>
|
|
<text class="gui-form-icon gui-icons gui-text-center "
|
|
style="width: 130rpx;color: #000;">{{effective[effectiveIndex]}}</text>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
<view style="text-align: right;padding-bottom: 20rpx;" v-if="effectiveIndex == 0">
|
|
|
|
<text class="demo gui-block-text gui-icons" v-if="CardendValue2"
|
|
style="color: #f17487;">
|
|
{{CardstartValue2}} <text style="margin: 0 10rpx;color: #000;">至</text>
|
|
{{CardendValue2}}</text>
|
|
<text class="demo gui-block-text gui-icons" v-else style="color: #f17487;">
|
|
开始日期 <text style="margin: 0 10rpx;color: #000;">至</text> 结束日期</text>
|
|
|
|
</view>
|
|
</view>
|
|
<view
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view class="gui-form-item " style="">
|
|
<view style="display: flex;">
|
|
<view
|
|
style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>经营地址
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
</view>
|
|
<view style="padding: 0 0 15rpx;" v-if="operate_address">
|
|
{{operate_address}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view
|
|
style="background-color: #fff;padding:30rpx 20rpx;border-radius: 10rpx;margin-bottom: 20rpx;">
|
|
<view style="font-weight: bold;font-size: 32rpx;">营业执照信息</view>
|
|
<view
|
|
style="display: flex;margin: 30rpx 0;justify-content: center;align-items: center;">
|
|
<view v-if="!license.image_id"
|
|
style="width: 47%;background-color: #f5f6f7;height: 160rpx;text-align: center;padding: 40rpx 0;color: #9e9e9e;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传营业执照照片</view>
|
|
</view>
|
|
|
|
<view v-else
|
|
style="width: 47%;background-color: #f5f6f7;height: 160rpx;display: flex;justify-content: center;align-items: center;">
|
|
<image :src="license.url" style="height: 160rpx;" mode="heightFix"></image>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 240rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>营业执照名称
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.license_name"
|
|
@input="inputsss($event,'license_name')" name="license_name"
|
|
placeholder="请输入营业执照名称" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 240rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>统一社会信用代码
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.credit_code"
|
|
@input="inputsss($event,'credit_code')" name="credit_code"
|
|
placeholder="请输入统一社会信用代码" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 240rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>营业执照地址
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.license_address"
|
|
@input="inputsss($event,'license_address')" name="license_address"
|
|
placeholder="请输入营业执照地址" disabled />
|
|
</view>
|
|
</view>
|
|
<view
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view class="gui-form-item " style="padding: 10rpx 0;">
|
|
<view style="display: flex;">
|
|
<view
|
|
style="width: 240rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>营业执照有效期
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<view
|
|
class="gui-flex gui-rows gui-nowrap gui-space-between gui-align-items-center">
|
|
<text class="gui-text" style="text-align: right;"></text>
|
|
<text class="gui-form-icon gui-icons gui-text-center "
|
|
style="width: 130rpx;color: #000;">{{licensestart[licensestartIndex]}}</text>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
<view style="text-align: right;padding-bottom: 20rpx;"
|
|
v-if="licensestartIndex == 0">
|
|
|
|
<text class="demo gui-block-text gui-icons" v-if="LicenseendValue2"
|
|
style="color: #f17487;">
|
|
{{LicensestartValue2}} <text style="margin: 0 10rpx;color: #000;">至</text>
|
|
{{LicenseendValue2}}</text>
|
|
<text class="demo gui-block-text gui-icons" v-else style="color: #f17487;">
|
|
开始日期 <text style="margin: 0 10rpx;color: #000;">至</text> 结束日期</text>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view v-if="selectIndex == 0"
|
|
style="background-color: #fff;padding:30rpx 20rpx;border-radius: 10rpx;margin-bottom: 20rpx;">
|
|
<view style="font-weight: bold;font-size: 32rpx;">上传企业照片</view>
|
|
<view style="display: flex;margin: 20rpx 0;">
|
|
<view v-if="!enterprise_front.image_id"
|
|
style="width: 47%;margin-right: 6%;background-color: #f5f6f7;height: 160rpx;text-align: center;padding: 40rpx 0;color: #9e9e9e;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传门头照</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 47%;margin-right: 6%;color: #9e9e9e;background-color: #f5f6f7;height: 160rpx;display: flex;justify-content: center;align-items: center;">
|
|
<image :src="enterprise_front.url" style="height: 160rpx;" mode="heightFix">
|
|
</image>
|
|
</view>
|
|
<view v-if="!enterprise_within.image_id"
|
|
style="width: 47%;background-color: #f5f6f7;text-align: center;padding: 40rpx 0;color: #9e9e9e;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传内景照</view>
|
|
</view>
|
|
|
|
<view v-else
|
|
style="width: 47%;background-color: #f5f6f7height: 160rpx;display: flex;justify-content: center;align-items: center;">
|
|
<image :src="enterprise_within.url" style="height: 160rpx;" mode="heightFix">
|
|
</image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="selectIndex == 1"
|
|
style="background-color: #fff;padding:30rpx 20rpx;border-radius: 10rpx;margin-bottom: 20rpx;">
|
|
<view style="font-weight: bold;font-size: 32rpx;">上传企业照片</view>
|
|
<view style="display: flex;margin: 20rpx 0;">
|
|
<view v-if="!enterprise_front.image_id"
|
|
style="width: 30%;margin-right: 6%;background-color: #f5f6f7;height: 160rpx;text-align: center;padding: 40rpx 0;color: #9e9e9e;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传门头照</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 30%;margin-right: 6%;color: #9e9e9e;background-color: #f5f6f7;height: 160rpx;display: flex;justify-content: center;align-items: center;">
|
|
<image :src="enterprise_front.url" style="height: 160rpx;" mode="heightFix">
|
|
</image>
|
|
</view>
|
|
<view v-if="!open_license.image_id"
|
|
style="width:30%;margin-right: 6%;background-color: #f5f6f7;height: 160rpx;text-align: center;padding: 40rpx 0;color: #9e9e9e;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传开户许可</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 30%;margin-right: 6%;color: #9e9e9e;background-color: #f5f6f7;height: 160rpx;display: flex;justify-content: center;align-items: center;">
|
|
<image :src="open_license.url" style="height: 160rpx;" mode="heightFix">
|
|
</image>
|
|
</view>
|
|
<view v-if="!enterprise_within.image_id"
|
|
style="width: 30%;background-color: #f5f6f7;text-align: center;padding: 40rpx 0;color: #9e9e9e;border-radius: 10rpx">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传内景照</view>
|
|
</view>
|
|
|
|
<view v-else
|
|
style="width: 30%;background-color: #f5f6f7height: 160rpx;display: flex;justify-content: center;align-items: center;">
|
|
<image :src="enterprise_within.url" style="height: 160rpx;" mode="heightFix">
|
|
</image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<view
|
|
style="background-color: #fff;padding:30rpx 20rpx;border-radius: 10rpx;margin-bottom: 20rpx;">
|
|
<view style="font-weight: bold;font-size: 32rpx;">结算账户信息</view>
|
|
<view
|
|
style="display: flex;margin: 30rpx 0;justify-content: center;align-items: center;">
|
|
<view v-if="!bank.image_id"
|
|
style="width: 47%;background-color: #f5f6f7;text-align: center;padding: 40rpx 0;color: #9e9e9e;">
|
|
<text class="gui-icons " style="font-size: 40rpx;"></text>
|
|
<view style="font-size: 24rpx;margin-top: 10rpx;">上传银行账户开户证明</view>
|
|
</view>
|
|
<view v-else
|
|
style="width: 47%;background-color: #f5f6f7;display: flex;justify-content: center;align-items: center;">
|
|
<image :src="bank.url" style="height: 160rpx;" mode="heightFix"></image>
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>银行卡号
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" v-model="detail.bank_card"
|
|
@input="inputsss($event,'bank_card')" name="bank_card"
|
|
placeholder="企业银行账户开户证明" disabled />
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>开户地
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
{{bank_address ? bank_address: '请选择开户银行所在地' }}
|
|
</view>
|
|
</view>
|
|
<view class="gui-form-item "
|
|
style="background-color: #f5f6f7;padding: 0 20rpx ;margin-bottom: 20rpx;border-radius: 10rpx;">
|
|
<view style="display: flex;">
|
|
<view style="width: 170rpx;color: #888888;font-weight: bold;font-size: 26rpx;">
|
|
<text style="color: red;">*</text>开户银行
|
|
</view>
|
|
<view style="color: #9e9e9e;">|</view>
|
|
</view>
|
|
<view class="gui-form-body">
|
|
<input type="text" class="gui-form-input" name="bank_deposit"
|
|
v-model="detail.bank_deposit" @input="inputsss($event,'bank_deposit')"
|
|
placeholder="请输入开户银行" disabled />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</form>
|
|
<view style="height: 100rpx;"></view>
|
|
</view>
|
|
|
|
</scroll-view>
|
|
</view>
|
|
|
|
</view>
|
|
</gui-page>
|
|
</template>
|
|
<script>
|
|
var graceJS = require('@/GraceUI5/js/grace.js');
|
|
var graceChecker = require("@/GraceUI5/js/checker.js");
|
|
import * as ArticleApi from '@/api/article'
|
|
import * as UploadApi from '@/api/upload'
|
|
import * as CategoryApi from '@/api/shop/category'
|
|
import * as YinhangApi from '@/api/shop/yinhang'
|
|
import * as InfoApi from '@/api/shop/info'
|
|
export default {
|
|
data() {
|
|
return {
|
|
dataSource: [],
|
|
|
|
name: '请选择主营类目',
|
|
|
|
classifyArr: [
|
|
[],
|
|
[]
|
|
], // picker - 数据源
|
|
classifyIndex: [0, 0], // picker - 索引
|
|
|
|
childArr: [], // 二级分类数据源
|
|
// 步骤
|
|
// 表单数据记录
|
|
formData: {},
|
|
selectIndex: 0,
|
|
contentHeight: 300,
|
|
CardstartValue2: "",
|
|
CardendValue2: '',
|
|
LicensestartValue2: "",
|
|
LicenseendValue2: '',
|
|
licensestartIndex: 0,
|
|
licensestart: ['非长期', '长期'],
|
|
effective: ['非长期', '长期'],
|
|
effectiveIndex: 0,
|
|
card_front: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
card_opposite: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
license: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
enterprise_within: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
enterprise_front: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
open_license: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
bank: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
logo_image: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
service: {
|
|
url: '',
|
|
image_id: ''
|
|
},
|
|
bank_address: '',
|
|
operate_address: '',
|
|
operate_latitude: '',
|
|
operate_longitude: '',
|
|
disabled: false,
|
|
category_id: 0,
|
|
yinhangList: [],
|
|
yinhangIndex: '-1',
|
|
bank_deposit: '',
|
|
ArticleDetail: '',
|
|
shuoming: '',
|
|
radiochecked: false,
|
|
detail: '',
|
|
xianshi: true,
|
|
}
|
|
},
|
|
mounted: function() {
|
|
var systemInfo = graceJS.system();
|
|
this.contentHeight = systemInfo.windowHeight * 0.65;
|
|
},
|
|
onLoad() {
|
|
this.getDetail()
|
|
|
|
this.getCategory()
|
|
},
|
|
methods: {
|
|
|
|
inputsss(e, name) {
|
|
|
|
this.cunhuancun(e.detail.value, name)
|
|
},
|
|
|
|
cxtj() {
|
|
let _this = this
|
|
_this.selectIndex = _this.detail.type
|
|
|
|
_this.dataSource.forEach(function(elements, index) {
|
|
if (elements.category_id == _this.detail.category_id) {
|
|
_this.name = elements.name,
|
|
_this.category_id = elements.category_id
|
|
}
|
|
});
|
|
if (_this.detail.card_front_id && _this.detail.card_front_url) {
|
|
_this.card_front = {
|
|
url: _this.detail.card_front_url,
|
|
image_id: _this.detail.card_front_id
|
|
};
|
|
}
|
|
if (_this.detail.card_opposite_id && _this.detail.card_opposite_url) {
|
|
_this.card_opposite = {
|
|
url: _this.detail.card_opposite_url,
|
|
image_id: _this.detail.card_opposite_id
|
|
};
|
|
}
|
|
if (_this.detail.license_id && _this.detail.license_url) {
|
|
_this.license = {
|
|
url: _this.detail.license_url,
|
|
image_id: _this.detail.license_id
|
|
};
|
|
}
|
|
if (_this.detail.enterprise_within_id && _this.detail.enterprise_within_url) {
|
|
_this.enterprise_within = {
|
|
url: _this.detail.enterprise_within_url,
|
|
image_id: _this.detail.enterprise_within_id
|
|
};
|
|
}
|
|
if (_this.detail.enterprise_front_id && _this.detail.enterprise_front_url) {
|
|
_this.enterprise_front = {
|
|
url: _this.detail.enterprise_front_url,
|
|
image_id: _this.detail.enterprise_front_id
|
|
};
|
|
}
|
|
if (_this.detail.open_license_id && _this.detail.open_license_url) {
|
|
_this.open_license = {
|
|
url: _this.detail.open_license_url,
|
|
image_id: _this.detail.open_license_id
|
|
};
|
|
}
|
|
if (_this.detail.bank_id && _this.detail.bank_url) {
|
|
_this.bank = {
|
|
url: _this.detail.bank_url,
|
|
image_id: _this.detail.bank_id
|
|
};
|
|
}
|
|
|
|
if (_this.detail.bank_id && _this.detail.bank_url) {
|
|
_this.bank = {
|
|
url: _this.detail.bank_url,
|
|
image_id: _this.detail.bank_id
|
|
};
|
|
}
|
|
|
|
if (_this.detail.service_id && _this.detail.service_url) {
|
|
_this.service = {
|
|
url: _this.detail.service_url,
|
|
image_id: _this.detail.service_id
|
|
};
|
|
}
|
|
|
|
|
|
|
|
|
|
if (_this.detail.logo_image_id && _this.detail.logo_image_url) {
|
|
console.log(89)
|
|
_this.logo_image = {
|
|
url: _this.detail.logo_image_url,
|
|
image_id: _this.detail.logo_image_id
|
|
};
|
|
}
|
|
|
|
_this.licensestartIndex = _this.detail.is_longTerms
|
|
if (_this.detail.is_longTerms == 0) {
|
|
_this.LicensestartValue2 = _this.detail.license_start_time
|
|
_this.LicenseendValue2 = _this.detail.license_end_time
|
|
}
|
|
_this.effectiveIndex = _this.detail.is_longTerm
|
|
if (_this.detail.is_longTerm == 0) {
|
|
_this.CardstartValue2 = _this.detail.card_start_time
|
|
_this.CardendValue2 = _this.detail.card_end_time
|
|
}
|
|
_this.bank_address = _this.detail.bank_address
|
|
_this.operate_address = _this.detail.operate_address
|
|
_this.shop_hours = _this.detail.shop_hours
|
|
_this.operate_latitude = _this.detail.operate_latitude
|
|
_this.operate_longitude = _this.detail.operate_longitude
|
|
|
|
// _this.yinhangList.forEach(function(element, index) {
|
|
|
|
// if (element.name == _this.detail.bank_deposit) {
|
|
// _this.yinhangIndex = index
|
|
// _this.bank_deposit = _this.detail.bank_deposit
|
|
// }
|
|
// });
|
|
_this.xianshi = true
|
|
},
|
|
getDetail() {
|
|
InfoApi.detail()
|
|
.then(result => {
|
|
this.detail = result.data.detail
|
|
this.cxtj()
|
|
})
|
|
},
|
|
radioChange(e) {
|
|
this.radiochecked = !this.radiochecked
|
|
},
|
|
confirm: function() {
|
|
// 客户点击确认按钮后的逻辑请在此处实现
|
|
this.$refs.guimodal.close();
|
|
this.radiochecked = true
|
|
},
|
|
getArticleDetail() {
|
|
const app = this
|
|
ArticleApi.detail(1)
|
|
.then(result => {
|
|
app.ArticleDetail = result.data.detail
|
|
})
|
|
ArticleApi.detail(2)
|
|
.then(result => {
|
|
app.shuoming = result.data.detail
|
|
})
|
|
|
|
},
|
|
pickerChange(e) {
|
|
this.yinhangIndex = e.detail.value;
|
|
this.bank_deposit = this.yinhangList[e.detail.value].name
|
|
|
|
},
|
|
getCategory() {
|
|
let _this = this
|
|
CategoryApi.list()
|
|
.then(result => {
|
|
_this.dataSource = result.data.list
|
|
_this.getAllClassify()
|
|
})
|
|
YinhangApi.list()
|
|
.then(result => {
|
|
_this.yinhangList = result.data.list
|
|
})
|
|
},
|
|
// 获取数据源并分出一级二级
|
|
getAllClassify() {
|
|
let dataLen = this.dataSource.length;
|
|
|
|
for (let i = 0; i < dataLen; i++) {
|
|
// 将数据源中的二级分类 push 进 childArr，作为二级分类的数据源
|
|
this.childArr.push(this.dataSource[i].children)
|
|
};
|
|
|
|
// 一级分类的数据源
|
|
this.classifyArr[0] = this.dataSource;
|
|
|
|
// 第一次打开时，默认给一级分类添加它的二级分类
|
|
this.classifyArr[1] = this.childArr[0]
|
|
},
|
|
|
|
// 选择商品分类
|
|
classifyChange(e) {
|
|
let value = e.target.value;
|
|
this.classifyIndex = value;
|
|
|
|
// if (this.classifyArr[0].length != 0) {
|
|
// this.name = this.classifyArr[0][this.classifyIndex[0]].name
|
|
// this.category_id = this.classifyArr[0][this.classifyIndex[0]].category_id
|
|
// };
|
|
|
|
if (this.classifyArr[1].length != 0) {
|
|
this.name = this.classifyArr[1][this.classifyIndex[1]].name
|
|
this.category_id = this.classifyArr[1][this.classifyIndex[1]].category_id
|
|
}
|
|
},
|
|
|
|
// 获取二级分类
|
|
columnchange(e) {
|
|
// 当滚动切换一级分类时，为当前的一级分类添加它的子类
|
|
if (e.detail.column == 0) {
|
|
// #ifdef H5
|
|
// 在小程序中直接赋值无效 H5 可直接赋值
|
|
this.classifyArr[1] = this.childArr[e.detail.value]
|
|
// #endif
|
|
|
|
// #ifdef MP-WEIXIN
|
|
// 在 H5 环境下 $set 会导致一级分类无法滚动， 小程序正常运行
|
|
this.$set(this.classifyArr, 1, this.childArr[e.detail.value])
|
|
// #endif
|
|
}
|
|
},
|
|
getLocation(callback) {
|
|
const app = this
|
|
uni.getLocation({
|
|
type: 'wgs84',
|
|
success: callback,
|
|
fail() {
|
|
app.isAuthor = false
|
|
}
|
|
})
|
|
},
|
|
authVerification() {
|
|
let _this = this
|
|
uni.chooseLocation({
|
|
success: function(res) {
|
|
_this.operate_address = res.address
|
|
_this.operate_latitude = res.latitude
|
|
_this.operate_longitude = res.longitude
|
|
}
|
|
});
|
|
},
|
|
handerChooseLocation(latitude, longitude) {
|
|
console.log('2212')
|
|
uni.chooseLocation({
|
|
latitude: latitude || '',
|
|
longitude: longitude || '',
|
|
success: (res) => {
|
|
console.log(res)
|
|
},
|
|
fail: function(err) {
|
|
console.log(err)
|
|
}
|
|
})
|
|
},
|
|
open1: function() {
|
|
this.$refs.graceAddressPicker1.open();
|
|
},
|
|
confirm1: function(e) {
|
|
// 返回选中城市的编号及文本信息
|
|
this.bank_address = e.names[0] + ',' + e.names[1] + ',' + e.names[2];
|
|
},
|
|
selectImg: function(e) {
|
|
let _this = this
|
|
uni.chooseImage({
|
|
count: 1,
|
|
success: (res) => {
|
|
|
|
_this[e]['url'] = res.tempFilePaths[0]
|
|
|
|
UploadApi.image([res.tempFiles[0]])
|
|
.then(fileIds => {
|
|
_this[e]['image_id'] = fileIds[0]
|
|
|
|
// _this.cunhuancun(datas,e)
|
|
})
|
|
}
|
|
})
|
|
},
|
|
pickerEffective: function(e) {
|
|
this.effectiveIndex = e.detail.value;
|
|
},
|
|
pickerIicensestart: function(e) {
|
|
this.licensestartIndex = e.detail.value;
|
|
},
|
|
Cardconfirm2: function(res) {
|
|
this.CardstartValue2 = res[0][0] + '-' + res[0][1] + '-' + res[0][2];
|
|
this.CardendValue2 = res[1][0] + '-' + res[1][1] + '-' + res[1][2];
|
|
},
|
|
|
|
Licenseconfirm2: function(res) {
|
|
this.LicensestartValue2 = res[0][0] + '-' + res[0][1] + '-' + res[0][2];
|
|
this.LicenseendValue2 = res[1][0] + '-' + res[1][1] + '-' + res[1][2];
|
|
},
|
|
|
|
|
|
|
|
onagreement() {
|
|
this.$refs.guimodal.open();
|
|
},
|
|
|
|
onselect(e) {
|
|
this.selectIndex = e
|
|
},
|
|
bdChange: function(e) {
|
|
this.formData.bd = e.detail.value;
|
|
},
|
|
fanhui() {
|
|
uni.navigateBack()
|
|
},
|
|
stepto: function(index) {
|
|
console.log(this.formData);
|
|
switch (index) {
|
|
case 1:
|
|
// 第1步数据验证这里编写
|
|
// 不满足使用 return 返回即可
|
|
break;
|
|
case 2:
|
|
// 第2步数据验证这里编写
|
|
// 不满足使用 return 返回即可
|
|
break;
|
|
case 3:
|
|
uni.reLaunch({
|
|
url: '/pages/index/index'
|
|
})
|
|
break;
|
|
}
|
|
console.log(index)
|
|
this.step = index;
|
|
},
|
|
// 提交
|
|
submit: function(e) {
|
|
// 部分能够获得的表单数据 在 e 对象保存
|
|
// 不支持表单直接获取的数据通过事件记录
|
|
// 最终整理获得完整的表单记录
|
|
var fromData = e.detail.value;
|
|
fromData['category_id'] = this.category_id
|
|
fromData['type'] = this.selectIndex
|
|
fromData['card_front_id'] = this.card_front.image_id
|
|
fromData['card_opposite_id'] = this.card_opposite.image_id
|
|
fromData['is_longTerm'] = this.effectiveIndex
|
|
fromData['is_longTerms'] = this.licensestartIndex
|
|
fromData['card_start_time'] = this.CardstartValue2
|
|
fromData['card_end_time'] = this.CardendValue2
|
|
fromData['operate_address'] = this.operate_address
|
|
fromData['operate_latitude'] = this.operate_latitude
|
|
fromData['operate_longitude'] = this.operate_longitude
|
|
fromData['license_id'] = this.license.image_id
|
|
fromData['license_start_time'] = this.LicensestartValue2
|
|
fromData['license_end_time'] = this.LicenseendValue2
|
|
fromData['enterprise_front_id'] = this.enterprise_front.image_id
|
|
fromData['enterprise_within_id'] = this.enterprise_within.image_id
|
|
fromData['service_id'] = this.service.image_id
|
|
fromData['open_license_id'] = this.open_license.image_id
|
|
fromData['bank_id'] = this.bank.image_id
|
|
fromData['logo_image_id'] = this.logo_image.image_id
|
|
fromData['bank_address'] = this.bank_address
|
|
// fromData['bank_deposit'] = this.bank_deposit
|
|
|
|
if (!this.logo_image.image_id) {
|
|
this.$toast('请上传商户LOGO')
|
|
return false
|
|
}
|
|
if (!fromData['shop_name']) {
|
|
this.$toast('请输入商户简称')
|
|
return false
|
|
}
|
|
if (this.category_id == 0) {
|
|
this.$toast('请选择主营类目')
|
|
return false
|
|
}
|
|
if (!fromData['shop_hours']) {
|
|
this.$toast('请输入营业时间')
|
|
return false
|
|
}
|
|
// if (!fromData['kftelephone']) {
|
|
// this.$toast('请输入客服电话')
|
|
// return false
|
|
// }
|
|
if (!this.service.image_id) {
|
|
this.$toast('请上传微信客服二维码')
|
|
return false
|
|
}
|
|
if (!this.card_front.image_id) {
|
|
this.$toast('请上传身份证正面')
|
|
return false
|
|
}
|
|
if (!this.card_opposite.image_id) {
|
|
this.$toast('请上传身份证背面')
|
|
return false
|
|
}
|
|
if (!fromData['name']) {
|
|
this.$toast('请输入姓名')
|
|
return false
|
|
}
|
|
if (!fromData['mailbox']) {
|
|
this.$toast('请输入邮箱')
|
|
return false
|
|
}
|
|
if (!fromData['phone']) {
|
|
this.$toast('请输入手机号')
|
|
return false
|
|
}
|
|
if (!fromData['IDCard']) {
|
|
this.$toast('请输入身份证号')
|
|
return false
|
|
}
|
|
if (!fromData['IDCard_address']) {
|
|
this.$toast('请输入身份证地址')
|
|
return false
|
|
}
|
|
if (!fromData['WeChat']) {
|
|
this.$toast('请输入微信号')
|
|
return false
|
|
}
|
|
if (fromData['is_longTerm'] == 0) {
|
|
if (!this.CardstartValue2) {
|
|
this.$toast('请选择身份证有效期')
|
|
return false
|
|
}
|
|
|
|
}
|
|
if (!this.operate_address) {
|
|
this.$toast('请选择经营地址')
|
|
return false
|
|
}
|
|
if (!this.license.image_id) {
|
|
this.$toast('请上传营业执照')
|
|
return false
|
|
}
|
|
if (!fromData['license_name']) {
|
|
this.$toast('请输入营业执照名称')
|
|
return false
|
|
}
|
|
if (!fromData['credit_code']) {
|
|
this.$toast('请输入统一社会信用代码')
|
|
return false
|
|
}
|
|
if (!fromData['license_address']) {
|
|
this.$toast('请输入营业执照地址')
|
|
return false
|
|
}
|
|
if (fromData['is_longTerms'] == 0) {
|
|
if (!this.LicensestartValue2) {
|
|
this.$toast('请选择营业执照有效期')
|
|
return false
|
|
}
|
|
|
|
}
|
|
if (!this.enterprise_front.image_id) {
|
|
this.$toast('请上传门头照')
|
|
return false
|
|
}
|
|
if (this.selectIndex == 1) {
|
|
|
|
if (!this.open_license.image_id) {
|
|
this.$toast('请上传开户许可')
|
|
return false
|
|
}
|
|
}
|
|
if (!this.enterprise_within.image_id) {
|
|
this.$toast('请上传内景照')
|
|
return false
|
|
}
|
|
if (!this.bank.image_id) {
|
|
this.$toast('请上传银行账户开户证明')
|
|
return false
|
|
}
|
|
if (!fromData['bank_deposit']) {
|
|
this.$toast('请输入开户银行')
|
|
return false
|
|
}
|
|
if (!this.radiochecked) {
|
|
this.$toast('请阅读协议')
|
|
return false
|
|
}
|
|
|
|
var rule = [{
|
|
name: "mailbox",
|
|
checkType: "email",
|
|
checkRule: "",
|
|
errorMsg: "邮箱格式错误"
|
|
},
|
|
{
|
|
name: "phone",
|
|
checkType: "phone",
|
|
checkRule: "^(-?\\d+)$",
|
|
errorMsg: "请输入正确的手机号",
|
|
},
|
|
// {
|
|
// name: "kftelephone",
|
|
// checkType: "phone",
|
|
// checkRule: "^(-?\\d+)$",
|
|
// errorMsg: "请输入正确的手机号",
|
|
// },
|
|
{
|
|
name: "IDCard",
|
|
checkType: "idCard",
|
|
checkRule: "",
|
|
errorMsg: "身份证号码错误"
|
|
}
|
|
];
|
|
var checkRes = graceChecker.check(fromData, rule);
|
|
if (checkRes) {
|
|
|
|
} else {
|
|
uni.showToast({
|
|
title: graceChecker.error,
|
|
icon: "none"
|
|
});
|
|
return false;
|
|
}
|
|
this.disabled = true
|
|
InfoApi.add({
|
|
fromData
|
|
})
|
|
.then(result => {
|
|
this.step = 3
|
|
})
|
|
.finally(result => {
|
|
this.disabled = false
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.gui-step-item {
|
|
width: 130rpx;
|
|
}
|
|
|
|
.form-add-footer-btns {
|
|
padding: 0 38rpx;
|
|
font-size: 30rpx;
|
|
line-height: 100rpx;
|
|
}
|
|
|
|
.modal-btns {
|
|
line-height: 100rpx;
|
|
height: 100rpx;
|
|
font-size: 35rpx;
|
|
text-align: center;
|
|
width: 320rpx;
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
.dealer-boot {
|
|
padding: 10rpx 30rpx;
|
|
margin-top: 80rpx;
|
|
|
|
.msg__icon {
|
|
font-size: 120rpx;
|
|
color: #8e84fc;
|
|
}
|
|
|
|
.boot__submit {
|
|
margin-top: 60rpx;
|
|
}
|
|
}
|
|
</style>
|
|
<style>
|
|
page {
|
|
background-color: #f5f6f7;
|
|
}
|
|
</style>
|