huoran
/
FE_occupationlab_client
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 14 Wiki Activity

个人注册

Browse Source
dev_202412
yujialong 8 months ago
parent 46b0be32f5
commit 123be6ef05
2 changed files with 63 additions and 114 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      src/api/index.js
  2. 176
      src/pages/account/login/index.vue

1
src/api/index.js
Unescape View File

@ -26,6 +26,7 @@ export default {
forgotPreVerification: `users/users/user/forgotPreVerification`,
forgotPassword: `users/users/user/forgotPassword`,
logout: `users/users/user/logout`,
quickRegistration: `users/users/user/quickRegistration`,
// 阿里云文件/视频管理
getPlayAuth: `nakadai/nakadai/oss/getPlayAuth`, // 获取播放凭证

176
src/pages/account/login/index.vue
Unescape View File

@ -30,9 +30,9 @@
<el-form-item prop="code">
<label class="label code"></label>
<div class="ver-code">
<el-input v-model="form.code" placeholder="请输入验证码" maxlength="6" :disabled="verFormEnable"
<el-input v-model="form.code" placeholder="请输入验证码" maxlength="6" :disabled="!verFormEnable"
@keyup.enter.native="submit"></el-input>
<el-button type="text" @click="sendPhoneCodeLogin" :disabled="phoneDisabledLogin || verFormEnable">{{
<el-button type="text" @click="sendPhoneCodeLogin" :disabled="phoneDisabledLogin || !verFormEnable">{{
phoneBtnTextLogin
}}
</el-button>
@ -54,7 +54,7 @@
</template>
<div class="bottom">
<el-link :underline="false" type="primary" @click="switchType">{{ verCodeLogin ? '密码' : '验证码' }}登录</el-link>
<!-- <el-link :underline="false" type="primary" @click="toAccount">没有账号，点击申请</el-link> -->
<el-link :underline="false" type="primary" @click="toAccount">没有账号，点击申请</el-link>
</div>
<el-button class="submit" type="primary" @click="submit">登录</el-button>
</el-form>
@ -145,66 +145,48 @@
</el-form-item>
<el-form-item prop="code" label="验证码">
<div class="ver-code">
<el-input v-model="pwForm.code" placeholder="请输入验证码" maxlength="6" :disabled="formEnable"></el-input>
<el-button style="top: 1px" type="text" @click="sendCodePw" :disabled="phoneDisabled || formEnable">{{
<el-input v-model="pwForm.code" placeholder="请输入验证码" maxlength="6" :disabled="!diaClientExist"></el-input>
<el-button style="top: 1px" type="text" @click="sendCodePw" :disabled="phoneDisabled || !diaClientExist">{{
phoneBtnText }}
</el-button>
</div>
</el-form-item>
<el-form-item prop="newPassword" label="登录密码">
<el-input placeholder="请输入登录密码" type="password" maxlength="6" v-model="pwForm.newPassword"
:disabled="formEnable"></el-input>
:disabled="!diaClientExist"></el-input>
</el-form-item>
<el-form-item prop="newPasswordTwo" label="确认登录密码">
<el-input placeholder="请再次输入登录密码" type="password" maxlength="6" v-model="pwForm.newPasswordTwo"
:disabled="formEnable"></el-input>
:disabled="!diaClientExist"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button v-if="!formEnable" size="small" type="primary" @click="pwSubmit">确定</el-button>
<el-button v-if="diaClientExist" size="small" type="primary" @click="pwSubmit">确定</el-button>
<el-button size="small" @click="resetPwVisible = false">取消</el-button>
</span>
</el-dialog>
<el-dialog title="账号申请" :visible.sync="accountVisible" :close-on-click-modal="false" width="500px"
@close="accountClose">
<el-form class="dia-form" ref="accountForm" label-width="110px" :model="accountForm" :rules="accountRules">
<el-form-item prop="schoolId" label="所属院校">
<el-select class="w-100" v-model="accountForm.schoolId" filterable placeholder="请选择院校" @change="schoolChange">
<el-option v-for="(item, i) in schoolList" :key="i" :label="item.schoolName"
:value="item.schoolId"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="workNumber" label="学号">
<el-input placeholder="申请后无法修改，请确认填写正确" v-model="accountForm.workNumber"
@change="workNumberChange"></el-input>
</el-form-item>
<el-form-item prop="userName" label="姓名">
<el-input placeholder="请输入姓名" v-model="accountForm.userName" :disabled="formEnable"></el-input>
</el-form-item>
<el-form-item prop="phone" label="手机号">
<el-input placeholder="请输入手机号" maxlength="11" v-model.trim="accountForm.phone"
:disabled="formEnable"></el-input>
<el-dialog title="欢迎注册" :visible.sync="accountVisible" :close-on-click-modal="false" width="500px">
<el-form class="dia-form" ref="accountForm" label-width="80px" :model="accountForm" :rules="accountRules">
<el-form-item prop="phoneOrEmail" label="手机号">
<el-input placeholder="请输入手机号" maxlength="11" v-model.trim="accountForm.phoneOrEmail"
@input="checkAccountByPhoneReg"></el-input>
<div v-if="regClientExist" class="flex a-center text-red">
该手机号已注册，您可直接点
<el-link class="m-l-5" :underline="false" type="primary" @click="accountVisible = false">此处登录</el-link>
</div>
</el-form-item>
<el-form-item prop="code" label="验证码">
<div class="ver-code">
<el-input v-model="accountForm.code" placeholder="请输入验证码" maxlength="6" :disabled="formEnable"></el-input>
<el-button style="top: 1px" type="text" @click="sendCode" :disabled="phoneDisabled && formEnable">{{
<el-input v-model="accountForm.code" placeholder="请输入验证码" maxlength="6" :disabled="regDisable"></el-input>
<el-button style="top: 1px" type="text" @click="sendCode" :disabled="phoneDisabled || regDisable">{{
phoneBtnText }}
</el-button>
</div>
</el-form-item>
<el-form-item prop="password" label="登录密码">
<el-input placeholder="请输入登录密码" type="password" maxlength="6" v-model="accountForm.password"
:disabled="formEnable"></el-input>
</el-form-item>
<el-form-item prop="rePassword" label="确认登录密码">
<el-input placeholder="请再次输入登录密码" type="password" maxlength="6" v-model="accountForm.rePassword"
:disabled="formEnable"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button v-if="!formEnable" size="small" type="primary" @click="accountSubmit">申请</el-button>
<el-button v-if="!regDisable" size="small" type="primary" @click="accountSubmit">立即注册</el-button>
<el-button size="small" @click="accountVisible = false">取消</el-button>
</span>
</el-dialog>
@ -275,7 +257,7 @@ export default {
password: [{ required: true, message: "请输入密码", trigger: "blur" }],
code: [{ required: true, message: "请输入验证码", trigger: "blur" }]
},
verFormEnable: true,
verFormEnable: false,
verCodeLogin: false,
phoneDisabledLogin: false,
phoneTimerLogin: null,
@ -299,31 +281,21 @@ export default {
infos: [],
accountVisible: false,
formEnable: true,
regDisable: true,
regClientExist: false,
accountForm: {
schoolId: '',
account: '',
code: '',
password: '',
rePassword: '',
phone: '',
userName: '',
workNumber: '',
uniqueIdentification: Date.now()
phoneOrEmail: '',
},
accountRules: {
schoolId: [{ required: true, message: "请选择所属院校", trigger: "change" }],
userName: [{ required: true, message: "请输入姓名", trigger: "blur" }],
workNumber: [{ required: true, validator: workNumberPass, trigger: "blur" }],
phone: [{ required: true, validator: phonePass, trigger: "blur" }],
password: [{ required: true, message: "请输入密码", trigger: "blur" }],
rePassword: [{ required: true, message: "请再次输入密码", trigger: "blur" }],
phoneOrEmail: [{ required: true, message: "请输入手机号/邮箱", trigger: "blur" }],
code: [{ required: true, message: "请输入验证码", trigger: "blur" }]
},
buyVisible: false,
resetPwVisible: false,
diaClientExist: false,
pwForm: {
code: '',
newPassword: '',
@ -516,7 +488,7 @@ export default {
newPasswordTwo: '',
phoneOrEmail: '',
}
this.formEnable = true
this.diaClientExist = false
this.resetPwVisible = true
},
@ -543,16 +515,15 @@ export default {
})
},
// 手机号输入完回调。有账号才能继续操作
async checkAccountByPhone (val, isResetPw) {
// 手机号输入完回调。有账号才能继续操作。type：0手机验证码登录，1重置密码
async checkAccountByPhone (val, type) {
if (!this.phoneReg.test(val) && !this.mailReg.test(val)) return false
try {
await this.$get(`${this.api.forgotPreVerification}?phoneOrEmail=${val}&platform=${Setting.platformId}`)
this[isResetPw ? 'formEnable' : 'verFormEnable'] = false
} catch (e) {
this.formEnable = true
}
const { message } = await this.$get(`${this.api.forgotPreVerification}?phoneOrEmail=${val}&platform=${Setting.platformId}`)
const exist = message === 'success' // 用户已存在
this[type ? 'diaClientExist' : 'verFormEnable'] = exist
} catch (e) { }
},
// 账号申请
switchType () {
@ -560,74 +531,51 @@ export default {
this.$refs.form.clearValidate()
this.handleRule()
},
// 发送验证码
async sendCode () {
const { phoneOrEmail } = this.accountForm
// 校验用户手机号是否存在
if (!this.verifyPhone(phoneOrEmail)) return false
const { message } = await this.$post(`${this.api.sendPhoneVerificationCode}?phoneOrEmail=${phoneOrEmail}&loginOrBind=1&platform=6`)
Util.successMsg(message)
this.phoneCountdown()
},
// 账号申请
toAccount () {
this.accountForm = {
code: '',
phoneOrEmail: '',
}
this.regDisable = true
this.regClientExist = false
this.accountVisible = true
},
// 学号输入完回调。学校和学号都输入完后，调这个接口查询是否有存在的学生，如果没有，才能继续输入，如果有，不让添加
workNumberChange () {
const form = this.accountForm
form.schoolId && form.workNumber && this.$get(`${this.api.enquireAboutSchoolStudents}?schoolId=${form.schoolId}&workNumber=${form.workNumber}&applyFor=1`).then(({ account }) => {
if (account) this.form = account
this.formEnable = !!account
}).catch(res => {
this.formEnable = true
})
},
// 学校选择回调
schoolChange (schoolId) {
this.$get(this.api.getCustomerBySchoolId, {
schoolId
}).then(res => {
if (!res) {
this.accountVisible = false
this.buyVisible = true
}
}).catch(res => { })
},
// 注册手机号输入完回调。没有账号才能继续操作
async checkAccountByPhoneReg (val) {
if (!this.phoneReg.test(val) && !this.mailReg.test(val)) return false
// 发送验证码
sendCode () {
const { phone } = this.accountForm
// 校验用户手机号是否存在
phone && this.$get(`${this.api.checkPhoneOrEmailExist}?phone=${phone}&type=1&email=`).then(res => {
if (res) return Util.errorMsg('手机号已存在，请更换手机号！')
if (!this.verifyPhone(phone)) return false
this.$post(`${this.api.sendPhoneVerificationCode}?phoneOrEmail=${phone}&loginOrBind=1&platform=${Setting.platformId}`).then(({ message }) => {
Util.successMsg(message)
this.phoneCountdown()
}).catch(res => { })
}).catch(res => { })
try {
const { message } = await this.$get(`${this.api.forgotPreVerification}?phoneOrEmail=${val}&platform=6`)
const exist = message === 'success' // 用户已存在
this.regDisable = !exist
this.regClientExist = exist
} catch (e) { }
},
// 账号申请提交
accountSubmit () {
this.$refs.accountForm.validate(valid => {
if (valid) {
const form = this.accountForm
if (form.password !== form.rePassword) return Util.errorMsg('两次输入的密码不一致，请重新输入！')
// 平台id-端id-schoolId-workNumber组成账号
form.account = `${Setting.platformId}-1-${form.schoolId}-${form.workNumber}`
this.$post(this.api.studentAccountApplication, form).then(res => {
form.platform = 6
this.$post(this.api.quickRegistration, form).then(res => {
this.accountVisible = false
Util.successMsg('账号申请已提交，需管理员审核，请10分钟后再登录')
Util.successMsg('注册成功！')
}).catch(res => { })
}
})
},
// 账号申请关闭
accountClose () {
this.accountForm = {
schoolId: '',
account: '',
code: '',
password: '',
rePassword: '',
phone: '',
userName: '',
workNumber: '',
uniqueIdentification: Date.now()
}
},
// 验证码倒计时
phoneCountdownLogin () {

Write Preview
Loading…
Cancel
Save