手机号登录

This commit is contained in:
asd
2020-10-22 09:12:24 +08:00
parent 20e9a56e03
commit f0fde71145
5 changed files with 162 additions and 22 deletions

View File

@@ -209,7 +209,7 @@
<div class="form-item">
<label class="label">手机验证码</label>
<a-input size="small" v-model:value="verificationCode" />
<div @click="sendVerificationCode(userinfo.mobile)" class="confirm-btn">获取验证码<span v-if="remainTime>0">{{ remainTime }}s</span></div>
<div @click="sendVerificationCode(userinfo.code+userinfo.mobile)" class="confirm-btn">获取验证码<span v-if="remainTime>0">{{ remainTime }}s</span></div>
</div>
</div>
<div @click="nextPhoneStep" class="confirm-btn">下一步</div>
@@ -220,15 +220,25 @@
<div class="form-box">
<div class="form-item">
<label class="label">手机号</label>
<a-input size="small" v-model:value="bindPhone.number" />
<!-- <a-input size="small" v-model:value="bindPhone.number" /> -->
<a-input-group compact class="telbox">
<a-select :default-value="quhaolist[0].code" size="small" @change="getquhao">
<a-select-option v-for="(i,j) in quhaolist" :key="j" :value="i.code">
{{i.name}}+{{i.code}}
</a-select-option>
<!-- <a-select-option value="Jiangsu"> Jiangsu </a-select-option> -->
</a-select>
<div class="line"></div>
<a-input v-model:value="mynewtel" size="small" placeholder="请输入您的手机号" />
</a-input-group>
</div>
<div class="form-item">
<label class="label">手机验证码</label>
<a-input size="small" v-model:value="bindPhone.code" />
<div @click="sendVerificationCode" class="confirm-btn">获取验证码<span v-if="remainTime>0">{{ remainTime }}s</span></div>
<div @click="sendVerificationCode(myquhao+mynewtel)" class="confirm-btn">获取验证码<span v-if="remainTime>0">{{ remainTime }}s</span></div>
</div>
</div>
<div @click="nextPhoneStep" class="confirm-btn">绑定手机</div>
<div @click="updatePhoneNumber" class="confirm-btn">绑定手机</div>
</div>
</a-modal>
<!-- 修改密码 -->
@@ -277,7 +287,7 @@ import { uploadflie } from "@/utils/vod"
import store from '@/store';
import smile from "@/static/images/smile.png"
import smilet from "@/static/images/smilet.png"
import { editpassword, getarchives, getlanguages, putmember, sendsms } from "@/api/index"
import { changetel, checksmscode, editpassword, getarchives, getlanguages, getquhaolist, putmember, sendsms } from "@/api/index"
import { message } from 'ant-design-vue';
export default defineComponent({
@@ -306,9 +316,16 @@ export default defineComponent({
const chiveslist = ref<any>([[],[]]);
const languages = ref<unknown>([])
const quhaolist = ref<any>([])
const myquhao=ref<string>("")
const mynewtel=ref<string>("")
onMounted(async ()=>{
chiveslist.value = await getarchives()
languages.value = await getlanguages()
quhaolist.value=await getquhaolist()
myquhao.value=quhaolist.value[0].code
console.log(quhaolist.value,"listsssss")
})
/**
@@ -370,10 +387,11 @@ export default defineComponent({
/**
* 发送验证码
*/
function sendVerificationCode(phone: string): void {
function sendVerificationCode(tel: string): void {
if(remainTime.value === 0) {
computedVerificationCode();
sendsms(phone, 0)
console.log(tel,"send")
sendsms(tel, 0)
}
}
// 绑定手机号是否是第二步
@@ -389,16 +407,45 @@ export default defineComponent({
/**
* 绑定手机号下一步
*/
function nextPhoneStep(): void {
isSecondStep.value = true;
async function nextPhoneStep(): Promise<void> {
remainTime.value = 0
if(!isSecondStep.value){
console.log(formData.value.code)
if(verificationCode.value == ""){
return ;
}
const res=await checksmscode(formData.value.code+formData.value.mobile,verificationCode.value)
console.log(res,"0.0")
if(res){
isSecondStep.value = true;
}
// isSecondStep.value = true;
}
// isSecondStep.value = true;
}
/**
* 修改手机号
* @return { void }
*/
function updatePhoneNumber (): void {
async function updatePhoneNumber (): Promise<void> {
console.log('修改手机号');
console.log(mynewtel.value,myquhao.value,bindPhone.code)
const res=await checksmscode(myquhao.value+mynewtel.value,bindPhone.code.toString())
console.log(res,"xiugai")
if(res){
const res1=await changetel(mynewtel.value)
if(res1){
store.dispatch("setUserInfo");
updatePhoneVisible.value=false
}
}
}
function getquhao(e ?:any){
console.log(e)
myquhao.value=e.toString()
}
// 是否显示修改密码框
const updatePasswordVisible: Ref<boolean> = ref(false);
@@ -553,7 +600,11 @@ export default defineComponent({
chiveslist,
languages,
uploadprogress,
choosewillsay
choosewillsay,
mynewtel,
quhaolist,
getquhao,
myquhao
}
}
});
@@ -567,6 +618,10 @@ export default defineComponent({
padding: 46px;
border-radius: 17px;
position: relative;
.telbox{
margin-left:15px;
font-size: 12px;
}
.update-btn {
font-size: 11px;
color: #08AE98;