parent
74831cceaf
commit
50791074c1
13 changed files with 366 additions and 65 deletions
@ -0,0 +1,188 @@ |
|||||||
|
<template> |
||||||
|
<view class="wrap"> |
||||||
|
<view class="title">欢迎加入</view> |
||||||
|
<view class="wel"> |
||||||
|
<image class="icon" src="http://124.71.79.122/images/miniProgram/house.png" mode="widthFix" /> |
||||||
|
<view class="text">{{ teamName + '邀请你加入他的团队' }}</view> |
||||||
|
</view> |
||||||
|
<view class="inner"> |
||||||
|
<view class="input"> |
||||||
|
<uni-easyinput type="text" v-model="form.name" placeholder="请输入你的真实姓名" :clearable="false" /> |
||||||
|
</view> |
||||||
|
<view class="input"> |
||||||
|
<uni-easyinput type="number" v-model="form.phone" placeholder="请填写你的手机号" maxlength="11" :clearable="false" /> |
||||||
|
</view> |
||||||
|
<view class="input code-wrap"> |
||||||
|
<uni-easyinput class="code" type="number" v-model="form.code" placeholder="验证码" maxlength="6" :clearable="false" /> |
||||||
|
<view class="send-code" @click="sendCode" :disabled="codeDisabled">{{ phoneBtnText }}</view> |
||||||
|
</view> |
||||||
|
<button class="submit" type="primary" @click="submit">立即加入</button> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { sendPhoneOrEmailCode, inviteJoinOrganization } from '@/apis/modules/user.js' |
||||||
|
export default { |
||||||
|
data () { |
||||||
|
return { |
||||||
|
teamName: '', |
||||||
|
form: { |
||||||
|
accountId: '', |
||||||
|
classificationId: '', |
||||||
|
platformId: '', |
||||||
|
phone: '', |
||||||
|
code: '', |
||||||
|
name: '', |
||||||
|
}, |
||||||
|
rules: { |
||||||
|
phone: [ |
||||||
|
{ required: true, message: '请输入手机号', trigger: 'blur' } |
||||||
|
], |
||||||
|
code: [ |
||||||
|
{ required: true, message: "请输入验证码", trigger: 'blur' } |
||||||
|
] |
||||||
|
}, |
||||||
|
repeat: false, // 是否有已存在用户，有的话禁填用户名和账号 |
||||||
|
codeDisabled: false, |
||||||
|
phoneTimer: null, |
||||||
|
phoneOpener: '', |
||||||
|
phoneBtnText: '发送验证码', |
||||||
|
submiting: false // 新增编辑防抖标识 |
||||||
|
}; |
||||||
|
}, |
||||||
|
onShow () { |
||||||
|
const pages = getCurrentPages() |
||||||
|
const { options } = pages[pages.length - 1] |
||||||
|
this.teamName = options.teamName |
||||||
|
this.form.accountId = options.accountId |
||||||
|
this.form.classificationId = options.id |
||||||
|
this.form.platformId = options.platformId |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 验证手机号 |
||||||
|
verifyPhone (phone) { |
||||||
|
if (!phone) { |
||||||
|
this.$util.errMsg("请输入手机号") |
||||||
|
return false |
||||||
|
} |
||||||
|
if (!/^1[3456789]\d{9}$/.test(phone) && !/^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/.test(phone)) { |
||||||
|
this.$util.errMsg("请输入正确的手机号") |
||||||
|
return false |
||||||
|
} |
||||||
|
return true |
||||||
|
}, |
||||||
|
// 验证码倒计时 |
||||||
|
phoneCountdown () { |
||||||
|
let count = 60 |
||||||
|
if (!this.phoneTimer) { |
||||||
|
this.codeDisabled = true |
||||||
|
this.phoneTimer = setInterval(() => { |
||||||
|
if (count > 0) { |
||||||
|
count-- |
||||||
|
this.phoneBtnText = `${count}秒后重试` |
||||||
|
} else { |
||||||
|
this.codeDisabled = false |
||||||
|
clearInterval(this.phoneTimer) |
||||||
|
this.phoneTimer = null |
||||||
|
this.phoneBtnText = `发送验证码` |
||||||
|
} |
||||||
|
}, 1000) |
||||||
|
} |
||||||
|
}, |
||||||
|
// 发送验证码 |
||||||
|
sendCode () { |
||||||
|
const { phone } = this.form |
||||||
|
if (!this.verifyPhone(phone)) return false |
||||||
|
sendPhoneOrEmailCode({ |
||||||
|
phone, |
||||||
|
types: 2 |
||||||
|
}).then(({ message }) => { |
||||||
|
if (message.opener) { |
||||||
|
this.phoneCountdown() |
||||||
|
this.phoneOpener = message.opener |
||||||
|
} else { |
||||||
|
this.$util.errMsg(message) |
||||||
|
} |
||||||
|
}).catch(res => { }) |
||||||
|
}, |
||||||
|
// 提交 |
||||||
|
submit () { |
||||||
|
if (this.submiting) return false |
||||||
|
if (this.phoneRepeat) return this.$util.errMsg("该手机号已存在") |
||||||
|
const { form } = this |
||||||
|
form.uniqueIdentification = Date.now() |
||||||
|
this.submiting = true |
||||||
|
inviteJoinOrganization(form).then(res => { |
||||||
|
this.$util.sucMsg('加入成功！') |
||||||
|
setTimeout(() => { |
||||||
|
uni.redirectTo({ |
||||||
|
url: '/team/joinSuccess/joinSuccess' |
||||||
|
}) |
||||||
|
}, 1500) |
||||||
|
}).catch(res => { |
||||||
|
this.submiting = false |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap { |
||||||
|
margin: 100px 30rpx; |
||||||
|
text-align: center; |
||||||
|
border-radius: 6px; |
||||||
|
background-color: #fff; |
||||||
|
border-radius: 6px; |
||||||
|
overflow: hidden; |
||||||
|
.title { |
||||||
|
padding: 15rpx 0; |
||||||
|
font-size: 36rpx; |
||||||
|
color: #fff; |
||||||
|
background-color: $uni-primary; |
||||||
|
} |
||||||
|
.icon { |
||||||
|
width: 120rpx; |
||||||
|
margin: 50rpx 0 30rpx; |
||||||
|
} |
||||||
|
.text { |
||||||
|
margin-bottom: 20rpx; |
||||||
|
font-size: 28rpx; |
||||||
|
color: #565656; |
||||||
|
} |
||||||
|
.inner { |
||||||
|
padding: 20px; |
||||||
|
} |
||||||
|
.input { |
||||||
|
margin-bottom: 30rpx; |
||||||
|
input { |
||||||
|
border-color: #dedede !important; |
||||||
|
} |
||||||
|
} |
||||||
|
.code-wrap { |
||||||
|
display: flex; |
||||||
|
} |
||||||
|
.code { |
||||||
|
flex: 1; |
||||||
|
} |
||||||
|
.send-code { |
||||||
|
width: 100px; |
||||||
|
margin-left: 20px; |
||||||
|
text-align: center; |
||||||
|
color: #4386ff; |
||||||
|
font-size: 12px; |
||||||
|
line-height: 36px; |
||||||
|
border: 1px solid #4386ff; |
||||||
|
border-radius: 5px; |
||||||
|
} |
||||||
|
.submit { |
||||||
|
width: 100%; |
||||||
|
margin-top: 40rpx; |
||||||
|
font-size: 36rpx; |
||||||
|
background-color: $uni-primary; |
||||||
|
border-color: #007eff; |
||||||
|
border-radius: 20px; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,44 @@ |
|||||||
|
<template> |
||||||
|
<view class="wrap"> |
||||||
|
<uni-icons type="checkbox-filled" size="50" color="#4876f9"></uni-icons> |
||||||
|
<view class="tips">加入成功</view> |
||||||
|
<view class="btn" @click="toLogin">前往登录</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
toLogin() { |
||||||
|
uni.clearStorageSync() |
||||||
|
this.$util.to('/pages/login/login') |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap { |
||||||
|
padding: 100rpx 30rpx; |
||||||
|
text-align: center; |
||||||
|
.tips { |
||||||
|
margin: 10rpx 0 30rpx; |
||||||
|
font-size: 30rpx; |
||||||
|
color: $uni-primary; |
||||||
|
} |
||||||
|
.btn { |
||||||
|
width: 100%; |
||||||
|
line-height: 80rpx; |
||||||
|
font-size: 30rpx; |
||||||
|
text-align: center; |
||||||
|
color: #fff; |
||||||
|
border-radius: 10rpx; |
||||||
|
background-color: $uni-primary; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue