167 lines
4.0 KiB
Vue
167 lines
4.0 KiB
Vue
<template>
|
|
<view style="padding: 30rpx;">
|
|
<view style="height: 50rpx;"></view>
|
|
<u--form labelPosition="left" :model="form" :rules="rules" errorType="border-bottom" ref="uForm"
|
|
labelWidth="130rpx">
|
|
<u-form-item label="昵称" prop="nickname" borderBottom>
|
|
<u--input v-model="form.nickname" border="none"></u--input>
|
|
</u-form-item>
|
|
<u-form-item label="用户名" prop="username" borderBottom>
|
|
<u--input v-model="form.username" border="none"></u--input>
|
|
</u-form-item>
|
|
<u-form-item label="密码" prop="password" borderBottom>
|
|
<u--input v-model="form.password" type="password" border="none"></u--input>
|
|
</u-form-item>
|
|
|
|
<u-form-item label="手机号" prop="mobile" borderBottom>
|
|
<u--input v-model="form.mobile" type="mobile" border="none"></u--input>
|
|
</u-form-item>
|
|
|
|
<u-form-item label="验证码" prop="code" borderBottom>
|
|
<u-code-input v-model="form.code" :maxlength="4" mode="line"></u-code-input>
|
|
<view slot="right">
|
|
<u-toast ref="uToast"></u-toast>
|
|
<u-code :seconds="code.seconds" @end="end" @start="start" ref="uCode" @change="codeChange"></u-code>
|
|
<u-button type="primary" @tap="getCode">{{code.tips}}</u-button>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item label="等级" borderBottom>
|
|
<u-number-box v-model="form.vip" :min="0" :max="9"></u-number-box>
|
|
</u-form-item>
|
|
|
|
</u--form>
|
|
<view style="height: 100rpx;"></view>
|
|
<u-button type="primary" @click="userlogin">提交</u-button>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
API_URL,
|
|
STATIC_URL
|
|
} from '@/env'
|
|
let self;
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
form: {
|
|
nickname: '',
|
|
username: '',
|
|
password: '',
|
|
mobile: '',
|
|
code: '',
|
|
invite_code: '',
|
|
vip: 0
|
|
},
|
|
rules: {
|
|
'nickname': {
|
|
type: 'string',
|
|
required: true,
|
|
message: '昵称必填项',
|
|
trigger: ['blur', 'change']
|
|
},
|
|
'username': {
|
|
type: 'string',
|
|
required: true,
|
|
message: '用户名必填项',
|
|
trigger: ['blur', 'change']
|
|
},
|
|
'password': {
|
|
type: 'string',
|
|
required: true,
|
|
message: '密码必填项',
|
|
trigger: ['blur', 'change']
|
|
},
|
|
'mobile': {
|
|
type: 'string',
|
|
required: true,
|
|
message: '手机号必填项',
|
|
trigger: ['blur', 'change']
|
|
},
|
|
'code': {
|
|
type: 'string',
|
|
required: true,
|
|
message: '验证码必填项',
|
|
trigger: ['blur', 'change']
|
|
},
|
|
|
|
},
|
|
code: {
|
|
tips: '获取验证码',
|
|
// refCode: null,
|
|
seconds: 60,
|
|
}
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
self = this;
|
|
if (option && option.invite_code) {
|
|
self.form.invite_code = option.invite_code;
|
|
}
|
|
},
|
|
onReady() {
|
|
//onReady 为uni-app支持的生命周期之一
|
|
self.$refs.uForm.setRules(self.rules)
|
|
},
|
|
methods: {
|
|
topage(url) {
|
|
uni.redirectTo({
|
|
url: url
|
|
})
|
|
},
|
|
codeChange(text) {
|
|
self.code.tips = text;
|
|
},
|
|
getCode() {
|
|
if (self.form.mobile.length != 11) {
|
|
uni.$u.toast('请输入手机号');
|
|
return;
|
|
}
|
|
if (self.$refs.uCode.canGetCode) {
|
|
// 模拟向后端请求验证码
|
|
uni.showLoading({
|
|
title: '正在获取验证码'
|
|
})
|
|
self.$http.get('/com/sms/sendcode', self.form).then(res => {
|
|
if (res.success) {
|
|
uni.hideLoading();
|
|
// 这里此提示会被this.start()方法中的提示覆盖
|
|
uni.$u.toast('验证码已发送');
|
|
// 通知验证码组件内部开始倒计时
|
|
self.$refs.uCode.start();
|
|
}
|
|
})
|
|
} else {
|
|
uni.$u.toast('倒计时结束后再发送');
|
|
}
|
|
},
|
|
end() {
|
|
uni.$u.toast('倒计时结束');
|
|
},
|
|
start() {
|
|
uni.$u.toast('倒计时开始');
|
|
},
|
|
userlogin() {
|
|
|
|
this.$refs.uForm.validate().then(res => {
|
|
self.$http.get('/shop/admin/shop/create', self.form).then(res => {
|
|
if (res.success) {
|
|
uni.navigateBack();
|
|
}
|
|
})
|
|
}).catch(errors => {
|
|
|
|
uni.$u.toast(errors[0].message)
|
|
})
|
|
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
|
|
</style> |