第一次提交
This commit is contained in:
wangxiaowei
433
pages/shop/register.vue
Normal file
433
pages/shop/register.vue
Normal file
@ -0,0 +1,433 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="bg_image">
|
||||
<image :src="bg_image" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="certification">
|
||||
<form @submit="formSubmit" @reset="formReset">
|
||||
<view class="certification_head">
|
||||
<view class="certification_head_body">
|
||||
<view class="certification_head_body_item">
|
||||
<view class="icon iconfont icon-qiye"></view>
|
||||
<input type="text" name="store_name" v-model="form.store_name" placeholder='请输入店铺名称' />
|
||||
</view>
|
||||
<view class="certification_head_body_item">
|
||||
<view class="icon iconfont icon-ziyuan1"></view>
|
||||
<input type="text" name="user_name" v-model="form.user_name" placeholder='请输入真实姓名' />
|
||||
</view>
|
||||
<view class="certification_head_body_item">
|
||||
<view class="icon iconfont icon-phone"></view>
|
||||
<input type="text" name="mobile" v-model="form.mobile" placeholder='请输入手机号码' />
|
||||
<button type="default" v-if="sms_open == 1" :disabled="is_send" @click="getCode(form.mobile)">{{send_btn_txt}}</button>
|
||||
</view>
|
||||
<view class="certification_head_body_item">
|
||||
<view class="icon iconfont icon-mima"></view>
|
||||
<input type="text" name="password" v-model="form.password" password="true" placeholder='请输入登录密码' />
|
||||
</view>
|
||||
<view class="certification_head_body_item" v-if="sms_open == 1">
|
||||
<view class="icon iconfont icon-yanzhengma"></view>
|
||||
<input type="text" name="code" v-model="form.code" placeholder='请输入验证码' />
|
||||
</view>
|
||||
<picker class="" value="" @change="changeSelect($event)"
|
||||
:range="classify_data_name">
|
||||
<view class="certification_head_body_item d-b-c">
|
||||
<view class="make-item input-box flex-1" v-if="classify_data_name_active">{{classify_data_name_active}}</view>
|
||||
<view class="make-item input-box flex-1" style="color: #777777;" v-else>请选择您店铺的主营项目</view>
|
||||
<view class="icon iconfont icon-jiantou" style="font-size: 24rpx;"></view>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
<view class="certification_body">
|
||||
<view class="login_index_updata_name">
|
||||
<text style="color:red;">*</text>
|
||||
<text style="font-size: 32rpx;font-weight: 500;color: #000000;">请上传营业执照</text>
|
||||
</view>
|
||||
<view class="login_index_updata_updata">
|
||||
<view class="login_index_updata_updata_item2" @click="openUpload('license')">
|
||||
<view class="login_index_updata_updata_item_body">
|
||||
<view v-if="business_id_path!=''" class="img">
|
||||
<image :src="business_id_path"></image>
|
||||
</view>
|
||||
<view v-if="business_id_path==''">点击上传营业执照</view>
|
||||
<input style="display:none" name="business_id" v-model="form.business_id" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="login_index_btn">
|
||||
<button form-type="submit" type="default">确定</button>
|
||||
</view>
|
||||
<Upload v-if="isupload" :isupload="isupload" :type="type" @getImgs="getImgsFunc">上传图片</Upload>
|
||||
</form>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Upload from '@/components/upload/upload';
|
||||
export default {
|
||||
components: {
|
||||
/*编辑组件*/
|
||||
Upload
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
image_frontid: 0,
|
||||
business_id: 0,
|
||||
mobile: '',
|
||||
password: ''
|
||||
},
|
||||
isupload: false,
|
||||
type: 'frontid',
|
||||
image_frontid_path: '',
|
||||
business_id_path: '',
|
||||
bg_image: '',
|
||||
classify_data_name: '', //列表名字
|
||||
classify_data_id: '', //列表id
|
||||
classify_data_name_active: '', //当前选中的列表名字
|
||||
classify_data_id_active: '', //当前选中的列表id
|
||||
/*当前秒数*/
|
||||
second: 60,
|
||||
send_btn_txt: '获取验证码',
|
||||
/*是否已发验证码*/
|
||||
is_send: false,
|
||||
sms_open: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getData();
|
||||
this.get_classify();
|
||||
},
|
||||
methods: {
|
||||
/*改变发送验证码按钮文本*/
|
||||
changeMsg() {
|
||||
if (this.second > 0) {
|
||||
this.send_btn_txt = this.second + '秒';
|
||||
this.second--;
|
||||
setTimeout(this.changeMsg, 1000);
|
||||
} else {
|
||||
this.send_btn_txt = '获取验证码';
|
||||
this.second = 60;
|
||||
this.is_send = false;
|
||||
}
|
||||
},
|
||||
/*获取数据*/
|
||||
getData() {
|
||||
let self = this;
|
||||
self._get('user.index/detail', {
|
||||
|
||||
}, function(res) {
|
||||
self.bg_image = res.data.setting.supplier_image;
|
||||
});
|
||||
},
|
||||
//获取验证码
|
||||
getCode(mobile) {
|
||||
let self = this;
|
||||
self._post('supplier.apply/sendCode', {
|
||||
mobile: mobile
|
||||
}, function(res) {
|
||||
self.is_send = true;
|
||||
self.changeMsg();
|
||||
});
|
||||
},
|
||||
//获取分类
|
||||
get_classify() {
|
||||
let self = this;
|
||||
self._post('supplier.apply/category', {
|
||||
|
||||
}, function(res) {
|
||||
let list_name = [];
|
||||
let list_id = [];
|
||||
//合成select列表
|
||||
for (var i = 0; i < res.data.list.length; i++) {
|
||||
list_name.push(res.data.list[i].name);
|
||||
}
|
||||
//合成上传所需id数组
|
||||
for (var i2 = 0; i2 < res.data.list.length; i2++) {
|
||||
list_id.push(res.data.list[i2].category_id);
|
||||
}
|
||||
self.classify_data_name = list_name;
|
||||
self.classify_data_id = list_id;
|
||||
self.sms_open = res.data.sms_open;
|
||||
});
|
||||
},
|
||||
//选择分类
|
||||
select() {
|
||||
let self = this;
|
||||
uni.showActionSheet({
|
||||
itemList: self.classify_data_name,
|
||||
success: function(res) {
|
||||
self.classify_data_name_active = self.classify_data_name[res.tapIndex];
|
||||
self.classify_data_id_active = self.classify_data_id[res.tapIndex];
|
||||
},
|
||||
fail: function(res) {
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
/*提交*/
|
||||
formSubmit: function(e) {
|
||||
let self = this;
|
||||
var formdata = e.detail.value;
|
||||
formdata.business_id = self.form.business_id;
|
||||
console.log(formdata)
|
||||
console.log(self.form)
|
||||
formdata.category_id = self.classify_data_id_active;
|
||||
if (self.classify_data_name_active == '') {
|
||||
uni.showToast({
|
||||
title: '请填主营类别',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (formdata.store_name == '') {
|
||||
uni.showToast({
|
||||
title: '请输入店铺名称',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (formdata.business_id == 0) {
|
||||
uni.showToast({
|
||||
title: '请上传营业执照',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (formdata.user_name == '') {
|
||||
uni.showToast({
|
||||
title: '请输入真实姓名',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
if (formdata.mobile == '') {
|
||||
uni.showToast({
|
||||
title: '请输入手机号码',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (formdata.code == '' && self.sms_open == 1) {
|
||||
uni.showToast({
|
||||
title: '请填写验证码',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (formdata.password == '') {
|
||||
uni.showToast({
|
||||
title: '请填写登录密码',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
let reg = /^((0\d{2,3}-\d{7,8})|(1[3456789]\d{9}))$/;
|
||||
if (!reg.test(formdata.mobile)) {
|
||||
uni.showToast({
|
||||
title: '手机号码格式不正确',
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
uni.showLoading({
|
||||
title: '正在提交',
|
||||
mask: true
|
||||
})
|
||||
self._post('supplier.apply/index', formdata, function(res) {
|
||||
self.showSuccess(res.msg, function() {
|
||||
self.gotoPage('/pages/shop/application_status')
|
||||
}, null, function(){
|
||||
uni.hideLoading();
|
||||
});
|
||||
});
|
||||
},
|
||||
/*上传*/
|
||||
openUpload(e) {
|
||||
this.type = e;
|
||||
this.isupload = true;
|
||||
},
|
||||
|
||||
/*获取图片*/
|
||||
getImgsFunc(e) {
|
||||
console.log(e)
|
||||
if (e != null && e.length > 0) {
|
||||
if (this.type == 'frontid') {
|
||||
console.log(e[0].file_id);
|
||||
this.image_frontid_path = e[0].file_path;
|
||||
this.form.image_frontid = e[0].file_id;
|
||||
} else if (this.type == 'license') {
|
||||
console.log(e[0].file_id);
|
||||
this.business_id_path = e[0].file_path;
|
||||
this.form.business_id = e[0].file_id;
|
||||
}
|
||||
}
|
||||
this.isupload = false;
|
||||
},
|
||||
/* 下拉框 */
|
||||
changeSelect(e) {
|
||||
this.classify_data_id_active = this.classify_data_id[e.detail.value];
|
||||
this.classify_data_name_active = this.classify_data_name[e.detail.value];
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background: #FF3D19;
|
||||
}
|
||||
|
||||
.bg_image image{
|
||||
width: 100%;
|
||||
}
|
||||
.iconfont {
|
||||
font-size: 48rpx;
|
||||
}
|
||||
|
||||
.index {
|
||||
width: 750rpx;
|
||||
}
|
||||
|
||||
.certification {
|
||||
width: 675rpx;
|
||||
margin: 0 auto;
|
||||
border-radius: 30rpx;
|
||||
padding: 30rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
top: 260rpx;
|
||||
left: 37.5rpx;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
|
||||
.certification_head {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.certification_head_body {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.certification_head_body_item {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 32rpx !important;
|
||||
}
|
||||
|
||||
.certification_head_body_item view {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.certification_head_body_item button {
|
||||
width: 172rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
border: 1rpx #E2231A solid;
|
||||
border-radius: 40rpx;
|
||||
font-size: 26rpx;
|
||||
color: #E2231A;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.certification_body {}
|
||||
|
||||
.login_index_updata_name {
|
||||
margin-top: 28rpx;
|
||||
margin-left: 48rpx;
|
||||
}
|
||||
|
||||
.login_index_updata_updata {
|
||||
width: 90%;
|
||||
height: 360rpx;
|
||||
margin: 0 auto;
|
||||
margin-top: 35rpx;
|
||||
}
|
||||
|
||||
.login_index_updata_updata_item2 {
|
||||
width: 100%;
|
||||
height: 360rpx;
|
||||
border: 1rpx #9a9a9a dotted;
|
||||
border-radius: 15rpx;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.login_index_updata_updata_item_body {
|
||||
width: 150rpx;
|
||||
height: 360rpx;
|
||||
text-align: center;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.img image {
|
||||
width: 554rpx;
|
||||
height: 360rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.login_index_btn {
|
||||
position: relative;
|
||||
top: 30rpx;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.login_index_btn button {
|
||||
width: 90%;
|
||||
height: 80rpx;
|
||||
background-color: #F36A24;
|
||||
border-radius: 50rpx;
|
||||
line-height: 80rpx;
|
||||
margin: 0 auto;
|
||||
color: white;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.certification_rule {
|
||||
position: relative;
|
||||
left: 500rpx;
|
||||
top: -10rpx;
|
||||
}
|
||||
|
||||
.certification_rule text {
|
||||
color: #8a8a8a;
|
||||
}
|
||||
|
||||
.certification_rule image {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.classify_text {
|
||||
color: #808080;
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
|
||||
.select input {
|
||||
padding-left: 60rpx;
|
||||
color: #808080;
|
||||
}
|
||||
.make-item{
|
||||
padding-left: 60rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user