|
|
|
@ -0,0 +1,276 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="step" v-if="stage==1">
|
|
|
|
|
<div class="cardTitle">添加商户</div>
|
|
|
|
|
<div class="step-item">
|
|
|
|
|
<span class="step-item-title">1、选择入驻商户的主体类型</span>
|
|
|
|
|
<a-divider></a-divider>
|
|
|
|
|
<a-form-model>
|
|
|
|
|
<a-form-model-item label="主体类型">
|
|
|
|
|
<a-radio-group v-model="form.type" size="large" buttonStyle="solid">
|
|
|
|
|
<a-radio-button :value="1">个体户</a-radio-button>
|
|
|
|
|
<a-radio-button :value="2">企业</a-radio-button>
|
|
|
|
|
<a-radio-button :value="3">个人</a-radio-button>
|
|
|
|
|
</a-radio-group>
|
|
|
|
|
<div>
|
|
|
|
|
<a-card class="card-item" size="small" :bordered="false">
|
|
|
|
|
<span v-if="form.type == 1">“个体户”在营业执照上的主体类型一般为:个体户、个体工商户、个体经营。</span>
|
|
|
|
|
<span v-if="form.type == 2">“企业”在营业执照上的主体类型一般为:有限公司、有限责任公司等。</span>
|
|
|
|
|
<span v-if="form.type == 3">“个人”为根据法律法规和相关规定免于办理工商登记,无营业执照的商家。 </span>
|
|
|
|
|
<div v-if="form.type == 3">(若年交易额大于10万元,则不属于个人商家范畴,需依法办理营业执照。)</div>
|
|
|
|
|
</a-card>
|
|
|
|
|
</div>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="经营类目">
|
|
|
|
|
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="step-item">
|
|
|
|
|
<span class="step-item-title">2、按照以下清单准备材料</span>
|
|
|
|
|
<a-divider></a-divider>
|
|
|
|
|
<a-table :columns="columns1" :data-source="form.type==3? tableData3 : form.type==2? tableData2 : tableData1" :pagination="false">
|
|
|
|
|
<div slot="detail" slot-scope="text,record">
|
|
|
|
|
<div v-if="record.detail == true">
|
|
|
|
|
<p>· 证件包含:身份证、护照、来往内地通行证等有效证件</p>
|
|
|
|
|
<p>· 其中护照需要增加翻译件,加盖公司鲜章,外籍商家姓名需为中文(英文),如微软(Microsoft)</p>
|
|
|
|
|
<p>· 照片标准:四角完整,清晰可辨。若加水印需保证照片重要信息清晰可辨</p>
|
|
|
|
|
<p>· 法人证件非大陆身份证(如护照等)时,需要提供法人证明函</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-else>{{record.detail}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</a-table>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="step" v-if="stage==2">
|
|
|
|
|
<div class="cardTitle">申请流程</div>
|
|
|
|
|
<div class="step2-item">
|
|
|
|
|
<a-alert message="依据中国人民银行《关于进一步加强支付结算管理防范电信网络新型违法犯罪有关事项的通知》要求,
|
|
|
|
|
切实履行账户实名管理,商户身份核实、交易风险管理等职责,需核实相关信息,感谢你的配合。" type="info" show-icon />
|
|
|
|
|
<a-tabs v-model="activeTab" style="margin-top: 24px">
|
|
|
|
|
<a-tab-pane :key="1" tab="填写主体信息" v-if="form.type == 1 || form.type == 2">
|
|
|
|
|
<h3 style="padding: 16px">主体类型</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 5}">
|
|
|
|
|
<a-form-model-item label="主体类型">
|
|
|
|
|
<a-radio-group v-model="form.type" disabled>
|
|
|
|
|
<a-radio :value="1">个体户</a-radio>
|
|
|
|
|
<a-radio :value="2">企业</a-radio>
|
|
|
|
|
<a-radio :value="3">个人</a-radio>
|
|
|
|
|
</a-radio-group>
|
|
|
|
|
<div><span>如需修改主体类型请返回<a>上一步</a>进行操作</span></div>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="企业名称">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="注册地址">
|
|
|
|
|
<a-select></a-select>
|
|
|
|
|
<a-textarea></a-textarea>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="经营范围">
|
|
|
|
|
<a-textarea></a-textarea>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="统一社会信用代码">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="营业期限">
|
|
|
|
|
<a-radio-group v-model="form.isLongtime">
|
|
|
|
|
<a-radio :value="0">区间有效</a-radio>
|
|
|
|
|
<a-radio :value="1">长期有效</a-radio>
|
|
|
|
|
</a-radio-group>
|
|
|
|
|
<a-date-picker v-if="form.isLongtime == 1"></a-date-picker>
|
|
|
|
|
<a-range-picker v-if="form.isLongtime == 0"></a-range-picker>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
<h3 style="padding: 16px">主体证件照片</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 5}">
|
|
|
|
|
<a-form-model-item label="统一社会信用代码证">
|
|
|
|
|
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="其他资质证明">
|
|
|
|
|
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane :key="2" tab="填写个人信息">
|
|
|
|
|
<h3 style="padding: 16px">法定代表人证件照</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 5}">
|
|
|
|
|
<a-form-model-item label="手持身份证照">
|
|
|
|
|
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="证件照正面">
|
|
|
|
|
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="证件照反面">
|
|
|
|
|
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
<h3 style="padding: 16px">法定代表人信息</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 5}">
|
|
|
|
|
<a-form-model-item label="证件类型">
|
|
|
|
|
<a-select></a-select>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="法定代表人姓名">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="证件号码">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="出生日期">
|
|
|
|
|
<a-date-picker></a-date-picker>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="证件有效期">
|
|
|
|
|
<a-radio-group v-model="form.isIdCardLongtime">
|
|
|
|
|
<a-radio :value="0">区间有效</a-radio>
|
|
|
|
|
<a-radio :value="1">长期有效</a-radio>
|
|
|
|
|
</a-radio-group>
|
|
|
|
|
<a-date-picker v-if="form.isIdCardLongtime == 1"></a-date-picker>
|
|
|
|
|
<a-range-picker v-if="form.isIdCardLongtime == 0"></a-range-picker>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane :key="3" tab="填写经营信息">
|
|
|
|
|
<h3 style="padding: 16px">联系人</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 5}">
|
|
|
|
|
<a-form-model-item label="联系人姓名">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="手机号">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="常用邮箱">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="客服电话">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
<h3 style="padding: 16px">结算账户信息</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 5}">
|
|
|
|
|
<a-form-model-item label="结算类型">支付宝</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="用户名称">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="支付宝账号">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
<h3 style="padding: 16px">经营信息</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 6}">
|
|
|
|
|
<a-form-model-item label="商户名称">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="经营地址">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="经营类目">
|
|
|
|
|
<a-input></a-input>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<h4 style="padding: 12px">“食品>生鲜果蔬”特殊资质证明</h4>
|
|
|
|
|
<a-form-model-item label="具体资质">
|
|
|
|
|
<a-checkbox-group v-model="zList" :options="zOption"></a-checkbox-group>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="许可证资质证明">
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="门店门头照片">
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="门店内景照片">
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="收银台照片">
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="补充信息">
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
<a-tab-pane :key="4" tab="申请上架社区">
|
|
|
|
|
<h3 style="padding: 16px">城市一</h3>
|
|
|
|
|
<a-form-model style="margin-left: 12px" :labelCol="{span: 3}" :wrapperCol="{span: 5}">
|
|
|
|
|
<a-form-model-item label="选择位置">
|
|
|
|
|
<a-select></a-select>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
<a-form-model-item label="选择小区">
|
|
|
|
|
<a-select></a-select>
|
|
|
|
|
</a-form-model-item>
|
|
|
|
|
</a-form-model>
|
|
|
|
|
</a-tab-pane>
|
|
|
|
|
</a-tabs>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="height: 100px"></div>
|
|
|
|
|
<div class="footer">
|
|
|
|
|
<a-checkbox v-model="isChecked" v-if="stage==1" style="margin-left: 24px">
|
|
|
|
|
我已同意协议并开通有赞支付账户
|
|
|
|
|
</a-checkbox>
|
|
|
|
|
<a v-if="stage==1">《有赞支付开户及服务协议》</a>
|
|
|
|
|
<a v-if="stage==1">《有赞支付隐私政策》</a>
|
|
|
|
|
<a-button style="margin-left: 24px" type="primary" v-if="stage==1" @click="goNext">下一步</a-button>
|
|
|
|
|
<a-button style="margin-left: 24px" type="primary" v-if="stage==2" @click="submit">提交</a-button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import { columns1,tableData1,tableData2,tableData3 } from "./depend/config"
|
|
|
|
|
export default {
|
|
|
|
|
name: 'certification',
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
stage: 2,
|
|
|
|
|
activeTab: 1,
|
|
|
|
|
isChecked: false,
|
|
|
|
|
columns1: columns1,
|
|
|
|
|
tableData1: tableData1,
|
|
|
|
|
tableData2: tableData2,
|
|
|
|
|
tableData3: tableData3,
|
|
|
|
|
zOption: [{label:'食品流通许可证',value:1},{label:'食品经营许可证',value:2},
|
|
|
|
|
{label:'食品生产许可证',value:3},{label:'食品小作坊登记证',value:4},
|
|
|
|
|
{label:'国境口岸卫生许可证',value:5},{label:'预包装食品备案凭证',value:6},],
|
|
|
|
|
form: {
|
|
|
|
|
type: 1,
|
|
|
|
|
isLongtime: 0,
|
|
|
|
|
isIdCardLongtime: 0,
|
|
|
|
|
zList: []
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
goNext() {
|
|
|
|
|
if(this.isChecked == true) {
|
|
|
|
|
this.stage = 2;
|
|
|
|
|
if(this.form.type == 3) {
|
|
|
|
|
this.activeTab = 2;
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.warning('请阅读并同意《服务协议》和《隐私政策》')
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
submit() {
|
|
|
|
|
this.stage = 1;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style lang="less">
|
|
|
|
|
.step {
|
|
|
|
|
.step-item {
|
|
|
|
|
padding: 32px 32px 0px 32px;
|
|
|
|
|
.step-item-title {
|
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
|
font-style: normal;
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
font-size: 20px;
|
|
|
|
|
line-height: 28px;
|
|
|
|
|
text-transform: uppercase;
|
|
|
|
|
color: #333333;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.step2-item {
|
|
|
|
|
padding: 16px
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.card-item {
|
|
|
|
|
background: #ECECEC;
|
|
|
|
|
margin-top: 16px;
|
|
|
|
|
width: 40%;
|
|
|
|
|
}
|
|
|
|
|
</style>
|