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.
349 lines
9.4 KiB
349 lines
9.4 KiB
<template>
|
|
<view>
|
|
<uni-forms :modelValue="formData" validate-trigger='blur' ref="form">
|
|
<uni-forms-item label="昵称" required name="name">
|
|
<uni-easyinput v-model="formData.name" placeholder="请输入昵称" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="手机号" required name="phone">
|
|
<uni-easyinput v-model="formData.phone" placeholder="请输入手机号" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="密码" required name="password">
|
|
<uni-easyinput type="password" v-model="formData.password" placeholder="请输入密码" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="搜索码" required name="scanCode">
|
|
<uni-easyinput v-model="formData.scanCode" placeholder="请输入搜索码" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="邀请码" required name="inviteCode">
|
|
<uni-easyinput v-model="formData.inviteCode" placeholder="请输入邀请码" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="简介" name="intro">
|
|
<uni-easyinput v-model="formData.intro" placeholder="请输入简介" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="第三方平台账号详情地址" required name="url">
|
|
<uni-easyinput v-model="formData.url" placeholder="请输入第三方平台账号详情地址" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="头像" required name="img">
|
|
<uni-file-picker limit="1" file-mediatype="image" title="选择一张头像图片上传吧!" file-extname="png,jpg,jpeg"
|
|
@success="imgUploadSuccess" @fail="imgUploadFail" @select="uploadImg" @delete="deleteImg">
|
|
</uni-file-picker>
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
<button type="primary" @click="register(formData)">注册</button>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
insertCreator,
|
|
checkPhone,
|
|
checkScanCode,
|
|
checkInviteCode
|
|
} from '@/api/userInfo.js'
|
|
import {
|
|
uploadBatch,
|
|
uploadBanner,
|
|
deleteFile
|
|
} from '@/api/common.js'
|
|
import md5 from "js-md5"
|
|
export default {
|
|
data() {
|
|
return {
|
|
phoneFlag: false,
|
|
scanCodeFlag: false,
|
|
inviteCodeFlag: false,
|
|
formData: {
|
|
name: '',
|
|
phone: '',
|
|
password: '',
|
|
scanCode: '',
|
|
inviteCode: '',
|
|
intro: '',
|
|
url: '',
|
|
img: ''
|
|
},
|
|
|
|
rules: {
|
|
name: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入昵称'
|
|
},
|
|
{
|
|
minLength: 1,
|
|
maxLength: 8,
|
|
errorMessage: '昵称长度应在 {minLength} 到 {maxLength} 个字符'
|
|
}
|
|
],
|
|
},
|
|
password: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入密码'
|
|
}, {
|
|
minLength: 8,
|
|
errorMessage: '密码长度最短 {minLength} 个字符'
|
|
}]
|
|
},
|
|
phone: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入手机号'
|
|
},
|
|
{
|
|
pattern: '^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\\d{8}$',
|
|
errorMessage: '请输入正确的手机号'
|
|
},
|
|
{
|
|
validateFunction: () => {
|
|
return new Promise((resolve, reject) => {
|
|
const params = {
|
|
phone: this.formData.phone
|
|
}
|
|
checkPhone(params).then(res => {
|
|
if (res.data.code === 105001) {
|
|
// 如果验证不通过，需要在callback()抛出new Error('错误提示信息')
|
|
this.phoneFlag = false;
|
|
reject(new Error(res.data.msg))
|
|
} else {
|
|
// 如果校验通过，也要执行callback()回调
|
|
this.phoneFlag = true;
|
|
resolve()
|
|
}
|
|
})
|
|
})
|
|
},
|
|
}
|
|
],
|
|
},
|
|
scanCode: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入搜索码'
|
|
},
|
|
{
|
|
minLength: 1,
|
|
maxLength: 6,
|
|
errorMessage: '搜索码长度应在 {minLength} 到 {maxLength} 个字符'
|
|
},
|
|
{
|
|
validateFunction: () => {
|
|
return new Promise((resolve, reject) => {
|
|
const params = {
|
|
scanCode: this.formData.scanCode
|
|
}
|
|
checkScanCode(params).then(res => {
|
|
console.log('请求scanCode')
|
|
if (res.data.code === 105003) {
|
|
// 如果验证不通过，需要在callback()抛出new Error('错误提示信息')
|
|
this.scanCodeFlag = false;
|
|
reject(new Error(res.data.msg))
|
|
} else {
|
|
// 如果校验通过，也要执行callback()回调
|
|
this.scanCodeFlag = true;
|
|
resolve()
|
|
}
|
|
})
|
|
})
|
|
},
|
|
}
|
|
],
|
|
},
|
|
inviteCode: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入邀请码'
|
|
}, {
|
|
minLength: 6,
|
|
errorMessage: '邀请码长度最短 {minLength} 个字符'
|
|
}, {
|
|
validateFunction: () => {
|
|
return new Promise((resolve, reject) => {
|
|
const params = {
|
|
inviteCode: this.formData.inviteCode
|
|
}
|
|
checkInviteCode(params).then(res => {
|
|
console.log('请求inviteCode')
|
|
if (res.data.code === 105002) {
|
|
// 如果验证不通过，需要在callback()抛出new Error('错误提示信息')
|
|
this.inviteCodeFlag = false;
|
|
reject(new Error(res.data.msg))
|
|
} else {
|
|
// 如果校验通过，也要执行callback()回调
|
|
this.inviteCodeFlag = true;
|
|
resolve()
|
|
}
|
|
})
|
|
})
|
|
},
|
|
}]
|
|
},
|
|
url: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请输入第三方平台账号详情地址'
|
|
}, {
|
|
format: 'url',
|
|
errorMessage: '请输入以"https://"格式开头格式第三方平台账号详情地址'
|
|
}]
|
|
},
|
|
img: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '请选择一张头像图片上传'
|
|
}]
|
|
}
|
|
}
|
|
}
|
|
},
|
|
mounted(){
|
|
//设置校验规则
|
|
this.$refs.form.setRules(this.rules);
|
|
},
|
|
methods: {
|
|
//图片上传
|
|
uploadImg(e) {
|
|
console.log('选择了文件', e)
|
|
let that = this
|
|
uni.showLoading({
|
|
title: "上传中",
|
|
success() {
|
|
const tempFilePaths = e.tempFilePaths;
|
|
for (var i = 0; i < tempFilePaths.length; i++) {
|
|
const tempFile = e.tempFiles[i];
|
|
uni.uploadFile({
|
|
url: `${Vue.prototype.$baseURL}/file/uploadBatch`,
|
|
filePath: tempFilePaths[i],
|
|
name: 'files',
|
|
success: (uploadFileRes) => {
|
|
uni.hideLoading();
|
|
const result = JSON.parse(uploadFileRes.data);
|
|
console.log('result', result)
|
|
if (result.code === 200) {
|
|
that.$set(result.data, "url", tempFile.url)
|
|
that.formData.img = result.data[0]
|
|
console.log('that.formDataInner',that.formData)
|
|
uni.showToast({
|
|
title: '上传成功',
|
|
icon: 'success',
|
|
duration: 1500
|
|
})
|
|
}
|
|
},
|
|
fail: () => {
|
|
uni.hideLoading();
|
|
uni.showToast("上传失败")
|
|
},
|
|
complete: function() {
|
|
uni.hideLoading();
|
|
}
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
|
|
//删除图片
|
|
deleteImg(e) {
|
|
console.log('e',this.formData.img)
|
|
const param = {
|
|
url : this.formData.img
|
|
}
|
|
deleteFile(param).then(response =>{
|
|
console.log('response',response)
|
|
if(response.data.code === 200){
|
|
uni.showToast({
|
|
title: '图片删除成功',
|
|
icon: 'success',
|
|
duration: 1500
|
|
})
|
|
}else{
|
|
uni.showToast({
|
|
title: '删除失败',
|
|
icon: 'fail',
|
|
duration: 1500
|
|
})
|
|
}
|
|
});
|
|
console.log('图片删除成功')
|
|
},
|
|
// 上传成功
|
|
imgUploadSuccess(e) {
|
|
console.log('上传成功')
|
|
},
|
|
|
|
// 上传失败
|
|
imgUploadFail(e) {
|
|
console.log('上传失败：', e)
|
|
},
|
|
|
|
//注册
|
|
register(e) {
|
|
console.log(e)
|
|
let that = this
|
|
console.log('that.phoneFlag',that.phoneFlag)
|
|
console.log('that.scanCodeFlag',that.scanCodeFlag)
|
|
console.log('that.inviteCodeFlag',that.inviteCodeFlag)
|
|
if(that.phoneFlag === true && that.scanCodeFlag === true && that.inviteCodeFlag === true){
|
|
console.log('全部达成')
|
|
uni.showLoading({
|
|
title: '艺术家注册中!',
|
|
duration: 3000,
|
|
success() {
|
|
let pwd = md5(that.formData.password)
|
|
const param = {
|
|
name: that.formData.name,
|
|
scanCode: that.formData.scanCode,
|
|
phone: that.formData.phone,
|
|
password: pwd,
|
|
img: that.formData.img,
|
|
intro: that.formData.intro,
|
|
inviteCode: that.formData.inviteCode,
|
|
url: that.formData.url
|
|
}
|
|
console.log('form', param)
|
|
insertCreator(param).then(response => {
|
|
if (response.data.code === 200) {
|
|
//注册成功，页面跳转到登录页
|
|
uni.redirectTo({
|
|
url: '../login/login',
|
|
success() {
|
|
uni.showToast({
|
|
title: '艺术家注册成功!请耐心等待审核或联系客服',
|
|
icon: 'none',
|
|
duration: 4000
|
|
})
|
|
}
|
|
});
|
|
} else {
|
|
uni.showToast({
|
|
title: response.data.msg,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
})
|
|
},
|
|
fail: () => {
|
|
uni.hideLoading();
|
|
uni.showToast("注册失败")
|
|
},
|
|
complete: function() {
|
|
uni.hideLoading();
|
|
}
|
|
})
|
|
}else{
|
|
console.log('尚未全部达成')
|
|
uni.showToast({
|
|
title: '注册验证尚未全部通过,请更正后提交!',
|
|
icon: 'none',
|
|
duration: 3000
|
|
})
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|
|
|