feat(global): 手机验证码功能补全

This commit is contained in:
woody 2025-05-09 14:54:51 +08:00
parent 090245eea2
commit 7b6d35606f
6 changed files with 221 additions and 202 deletions

View File

@ -4,13 +4,13 @@
* @Author: kBank
* @Date: 2023-01-10 11:38:48
*/
import request from '@/util/request'
import request from "@/util/request";
// 获取验证码
export function getCodeImg() {
return request({
url: '/code',
method: 'get',
})
url: "/code",
method: "get",
});
}
// 登录方法
@ -19,42 +19,42 @@ export function login(username, password, code, uuid) {
username,
password,
code,
uuid
}
uuid,
};
return request({
url: '/member/auth/api/login',
method: 'post',
data: data
})
url: "/member/auth/api/login",
method: "post",
data: data,
});
}
// 获取用户详细信息
export function getInfo() {
return request({
url: '/member/api/member/get-info',
method: 'get'
})
url: "/member/api/member/get-info",
method: "get",
});
}
// 退出方法
export function logout() {
return request({
url: '/member/auth/api/logout',
method: 'delete'
})
url: "/member/auth/api/logout",
method: "delete",
});
}
// 忘记密码验证码
export function forgetSms(params) {
return request({
url: '/member/api/sms/forget-verification',
method: 'get',
params
})
url: "/member/api/sms/forget-verification",
method: "get",
params,
});
}
// 忘记密码更新
export function forgetPwd(data) {
return request({
url: '/member/api/member/forget-password',
method: 'put',
data
})
url: "/member/api/member/forget-password",
method: "put",
data,
});
}

View File

@ -70,6 +70,15 @@ export function selfVerification(params) {
params,
});
}
// 用户重置支付密码获取验证码
export function resetPayPassword(params) {
return request({
url: "/member/api/sms/reset-verification",
method: "get",
params,
});
}
// 更新邮箱
export function updateEmail(data) {
return request({

View File

@ -123,7 +123,7 @@
</el-row>
<el-row>
<el-col :span="12">
<el-col :span="24">
<el-form-item :label="'详细地址'" prop="address">
<el-input v-model="smform.address"></el-input>
</el-form-item>
@ -133,7 +133,7 @@
<el-input v-model="smform.phone"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span="12">
<el-col :span="12">
<el-form-item :label="'验证码'" prop="verificationCode">
<el-input
v-model="smform.verificationCode"
@ -148,7 +148,7 @@
>
</el-input>
</el-form-item>
</el-col> -->
</el-col>
</el-row>
<!-- <div class="agreementBox flex_ac">
<div class="agreementIcon">
@ -289,7 +289,7 @@ export default {
// }
// },
toCheck(e) {
toCheck() {
if (this.hasRead == true) {
this.toShow = true;
} else {
@ -312,7 +312,7 @@ export default {
this.$set(this.smform, "sex", res.data.sex);
}
})
.catch((err) => {
.catch(() => {
this.$set(this.smform, "accountName", "");
this.$set(this.smform, "idCard", "");
this.$set(this.smform, "sex", "");
@ -325,8 +325,8 @@ export default {
.ocrIdCardBack({
idCardBackUrl: e,
})
.then((res) => {})
.catch((err) => {
.then(() => {})
.catch(() => {
this.$set(this.smform, "idBack", "");
});
}
@ -377,7 +377,7 @@ export default {
this.isSend = false;
}
}, 1000);
wal.getVerification({ phone: this.smform.phone }).then((res) => {
wal.getVerification({ phone: this.smform.phone }).then(() => {
this.$message({
message: "验证码已发送",
type: "success",
@ -399,7 +399,7 @@ export default {
this.getDetail();
}
})
.catch((err) => {
.catch(() => {
this.beginTime = 0;
});
} else {

View File

@ -47,7 +47,7 @@
@click="applyChange(scope.row)"
type="text"
size="small"
>{{ '申请变更' }}</el-button
>{{ "申请变更" }}</el-button
>
</template>
</el-table-column>
@ -101,18 +101,18 @@
prop="approveStatusVal"
:label="'审核状态'"
>
<template slot-scope="scope">
<template slot-scope="scope">
<div v-if="scope.row.approveStatus == 3">
<el-popover placement="right"
width="400"
trigger="hover">
<el-popover placement="right" width="400" trigger="hover">
<div v-html="scope.row.rejectMsg"></div>
<div style="color:#00417C;cursor: pointer;" slot="reference">{{ scope.row.approveStatusVal }}</div>
<div style="color: #00417c; cursor: pointer" slot="reference">
{{ scope.row.approveStatusVal }}
</div>
</el-popover>
</div>
<div v-else>{{ scope.row.approveStatusVal }}</div>
</template>
</el-table-column>
</el-table-column>
<el-table-column
align="center"
prop="approveTime"
@ -126,12 +126,7 @@
</el-table>
</div>
<el-dialog
:title="'户籍变更'"
:visible.sync="regShow"
width="45%"
center
>
<el-dialog :title="'户籍变更'" :visible.sync="regShow" width="45%" center>
<div class="diaBox">
<el-form
:model="regForm"
@ -139,38 +134,65 @@
label-width="auto"
ref="regForm"
>
<el-form-item :label="'会员姓名'" prop="memberName">
<el-input disabled v-model="regForm.memberName"></el-input>
</el-form-item>
<el-form-item :label="'联系方式'" prop="phone">
<el-input disabled v-model="regForm.phone"></el-input>
</el-form-item>
<el-form-item :label="'新会员姓名'" prop="changeMemberName">
<el-input v-model="regForm.changeMemberName"></el-input>
</el-form-item>
<el-form-item :label="'新联系方式'" prop="changePhone">
<el-input v-model="regForm.changePhone"></el-input>
</el-form-item>
<el-form-item :label="'验证码'" prop="verificationCode">
<div style="display: flex; align-items: center">
<el-input
class="thecode"
v-model="regForm.verificationCode"
></el-input>
<div
class="hqyzm1"
:class="isSend ? 'hui' : ''"
@click="startTime"
>
{{ getCode }}
</div>
</div>
</el-form-item>
<el-form-item
class="oldcard"
:label="'情况说明'"
prop="description"
>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item :label="'会员姓名'" prop="memberName">
<el-input disabled v-model="regForm.memberName"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="'联系方式'" prop="phone">
<el-input disabled v-model="regForm.phone"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item :label="'新会员姓名'" prop="changeMemberName">
<el-input v-model="regForm.changeMemberName"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="'新联系方式'" prop="changePhone">
<el-input v-model="regForm.changePhone"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item :label="'验证码'" prop="verificationCode">
<div style="display: flex; align-items: center">
<el-input
class="thecode"
v-model="regForm.verificationCode"
placeholder="请输入验证码"
></el-input>
<!-- <div
class="hqyzm1"
:class="isSend ? 'hui' : ''"
@click="startTime"
></div> -->
<el-button
style="margin-left: 10px"
type="primary"
:disabled="isSend"
@click="startTime"
>
{{ getCode }}
</el-button>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="`${'业务扣费'}(¥)`" prop="amount">
<el-input disabled v-model="regForm.amount"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-form-item :label="'情况说明'" prop="description">
<el-input
v-model="regForm.description"
:placeholder="'请输入'"
@ -183,12 +205,18 @@
:label="'原会员证件图片'"
prop="idFront"
>
<ImageUpload v-model="regForm.idFront" :backimg="
<ImageUpload
v-model="regForm.idFront"
:backimg="
require('../../assets/images/markerSpace/idCard-img1.png')
"/>
<ImageUpload v-model="regForm.idBack" :backimg="
"
/>
<ImageUpload
v-model="regForm.idBack"
:backimg="
require('../../assets/images/markerSpace/idCard-img2.png')
"/>
"
/>
</el-form-item>
<el-form-item
class="newcard"
@ -208,16 +236,13 @@
v-model="regForm.changeIdBack"
/>
</el-form-item>
<el-form-item :label="`${'业务扣费'}(¥)`" prop="amount">
<el-input disabled v-model="regForm.amount"></el-input>
</el-form-item>
<el-form-item :label="'备注'" prop="remark">
<el-input v-model="regForm.remark"></el-input>
</el-form-item>
<div style="text-align: center">
<el-button class="saveBtn" @click="saveReg('regForm')">{{
'立即申请'
}}</el-button>
<el-button type="primary" @click="saveReg('regForm')">
立即申请
</el-button>
</div>
</el-form>
</div>
@ -235,11 +260,11 @@ export default {
return {
vipList: [
{
text: '可申请信息',
text: "可申请信息",
id: 0,
},
{
text: '已申请信息',
text: "已申请信息",
id: 1,
},
],
@ -249,32 +274,27 @@ export default {
regForm: {},
rerules: {
changeMemberName: [
{ required: true, message: '请输入', trigger: "blur" },
{ required: true, message: "请输入", trigger: "blur" },
],
changePhone: [
{ required: true, message: '请输入', trigger: "blur" },
{ min: 8, max: 20, message: '请输入', trigger: "blur" },
{ required: true, message: "请输入", trigger: "blur" },
{ min: 8, max: 20, message: "请输入", trigger: "blur" },
],
verificationCode: [
{ required: true, message: '请输入', trigger: "blur" },
],
description: [
{ required: true, message: '请输入', trigger: "blur" },
],
idFront:[
{ required: true, message: '请上传', trigger: "change" },
{ required: true, message: "请输入", trigger: "blur" },
],
description: [{ required: true, message: "请输入", trigger: "blur" }],
idFront: [{ required: true, message: "请上传", trigger: "change" }],
changeIdFront: [
{ required: true, message: '请上传', trigger: "change" },
{ required: true, message: "请上传", trigger: "change" },
],
},
regShow: false,
isSend: false,
beginTime: 60,
getCode: '获取验证码',
getCode: "获取验证码",
timer: "",
beginTime: 60,
};
},
created() {
@ -301,35 +321,35 @@ export default {
startTime() {
if (!this.regForm.changePhone) {
this.$message({
message: '请先输入手机号',
message: "请先输入手机号",
type: "warning",
});
return;
} else {
if (this.isSend) return;
this.isSend = true;
this.getCode = this.beginTime +'s后重新发送';
this.getCode = this.beginTime + "s后重新发送";
this.timer = setInterval(() => {
this.beginTime--;
this.getCode = this.beginTime +'s后重新发送';
this.getCode = this.beginTime + "s后重新发送";
if (this.beginTime < 0) {
clearInterval(this.timer);
this.getCode = '获取验证码';
this.getCode = "获取验证码";
this.beginTime = 60;
this.isSend = false;
}
}, 1000);
getVerification({ phone: this.regForm.changePhone }).then((res) => {
getVerification({ phone: this.regForm.changePhone }).then(() => {
this.$message({
message: '验证码已发送',
message: "验证码已发送",
type: "success",
});
});
}
},
applyChange(row) {
applyChange(_row) {
clearInterval(this.timer);
this.getCode = '获取验证码';
this.getCode = "获取验证码";
this.beginTime = 60;
this.isSend = false;
sel.showChangeDomicile().then((res) => {
@ -343,15 +363,18 @@ export default {
});
sel.getAppliedInfoList().then((res) => {
this.registeredList2 = res.data;
const regex = new RegExp('<img', 'gi');
this.registeredList2.forEach(item=>{
if(item.rejectMsg){
item.rejectMsg= item.rejectMsg.replace(regex, `<img style="max-width: 200px;"`);
}
})
const regex = new RegExp("<img", "gi");
this.registeredList2.forEach((item) => {
if (item.rejectMsg) {
item.rejectMsg = item.rejectMsg.replace(
regex,
`<img style="max-width: 200px;"`
);
}
});
});
},
tableRowClassName({ row, rowIndex }) {
tableRowClassName({ _row, rowIndex }) {
if (rowIndex % 2 == 1) {
return "warning-row";
} else if (rowIndex % 2 == 0) {
@ -371,98 +394,107 @@ export default {
background: #ffffff;
}
::v-deep .el-table thead {
color: #000000;
color: #303133;
font-size: 14px;
font-weight: 500;
}
::v-deep .el-table th,
::v-deep .el-table td {
padding: 10px 0;
}
::v-deep .diaBox {
padding: 0 60px;
padding: 0 30px;
.el-form-item {
line-height: 60px;
margin-bottom: 22px;
line-height: normal;
}
.el-form-item__label {
font-size: 18px;
font-size: 14px;
font-weight: 500;
line-height: 32px;
padding-right: 12px;
}
.el-input__inner {
width: 534px;
height: 60px;
padding: 0 20px;
font-size: 16px;
width: 100%;
height: 40px;
padding: 0 15px;
font-size: 14px;
}
.el-textarea__inner {
font-size: 14px;
padding: 8px 15px;
}
.saveBtn {
margin-top: 20px;
width: 209px;
height: 48px;
font-size: 16px;
background-color: rgba(214, 24, 32, 1);
color: #ffffff;
margin-top: 10px;
width: auto;
padding: 10px 20px;
font-size: 14px;
}
}
::v-deep .thecode .el-input__inner {
width: 280px;
}
.hqyzm1 {
background: #d5251d;
border-radius: 8px;
padding: 0 7px;
background: #e6a23c;
border-radius: 4px;
padding: 0 15px;
color: #fff;
font-size: 18px;
min-width: 190px;
height: 65px;
font-size: 14px;
height: 40px;
display: flex;
align-items: center;
margin-right: 20px;
margin-left: 10px;
justify-content: center;
cursor: pointer;
white-space: nowrap;
}
.hui {
opacity: 0.5;
}
::v-deep .oldcard .el-form-item__content {
display: flex;
.el-image {
width: 235px !important;
height: 137px !important;
}
.el-upload--picture-card:nth-child(1) {
margin-right: 60px !important;
}
}
::v-deep .oldcard .el-form-item__content,
::v-deep .newcard .el-form-item__content {
display: flex;
.el-image {
width: 235px !important;
height: 137px !important;
}
.el-upload--picture-card:nth-child(1) {
margin-right: 60px !important;
gap: 20px;
.el-image,
.image-upload-container,
.el-upload--picture-card {
width: 200px !important;
height: 120px !important;
margin-right: 0 !important;
}
}
.contain {
background: #ffffff;
box-shadow: 0px 0px 20px 0px rgba(204, 204, 204, 0.5);
border-radius: 8px 8px 8px 8px;
margin: 20px 0 20px 0;
box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.1);
border-radius: 4px;
margin: 20px;
padding: 20px;
.main_r {
.menuList {
display: flex;
margin-top: 20px;
padding: 5px 24px;
box-sizing: border-box;
border-bottom: 1px solid #e4e7ed;
margin-bottom: 20px;
.menu_i {
margin-right: 70px;
line-height: 50px;
margin-right: 40px;
padding: 0 5px;
line-height: 40px;
cursor: pointer;
font-size: 14px;
color: #606266;
border-bottom: 3px solid transparent;
transition: color 0.3s, border-color 0.3s;
}
.menu_i:hover {
color: #409eff;
}
.actMenu {
border-bottom: 5px solid #00417C;
color: #409eff;
border-bottom: 3px solid #409eff;
}
}
.xian {
height: 5px;
background: rgba(0, 0, 0, 0.05);
margin-top: -5px;
display: none;
}
}
}

View File

@ -64,7 +64,7 @@
placeholder="银行卡预留手机号"
></el-input>
</el-form-item>
<!-- <el-form-item
<el-form-item
v-if="isMainlandChinaUser && needsVerificationCode"
label="验证码:"
prop="verificationCode"
@ -82,7 +82,7 @@
>
{{ verificationCodeButtonText }}
</el-button>
</el-form-item> -->
</el-form-item>
</el-form>
</div>
<div class="dialog-footer">

View File

@ -697,24 +697,7 @@ export default {
},
getAuth() {
ads.authenticationDetails().then((res) => {
if (res.data) {
this.loginPwd = 4;
} else {
this.$confirm(`${"请先进行实名认证"}?`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$router.push({
path: "/vipCenter",
query: { id: 5, atabActiveId: 9 },
});
})
.catch(() => {});
}
});
this.loginPwd = 4;
},
isEmpty(v) {
switch (typeof v) {
@ -774,14 +757,9 @@ export default {
},
submitForm1() {
this.startTime();
api
.selfVerification()
.then((res) => {
// this.bankCode = res.data
})
.catch((err) => {
this.beginTime = 0;
});
api.resetPayPassword().catch((err) => {
this.beginTime = 0;
});
},
startTime() {
if (this.isSend) return;