mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
synced 2025-12-18 08:25:55 +08:00
commit message
This commit is contained in:
Chopper
40
pages/mine/set/securityCenter/deviceManage.vue
Normal file
40
pages/mine/set/securityCenter/deviceManage.vue
Normal file
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<view class="device-manage">
|
||||
<u-cell-group>
|
||||
<u-cell-item class="border-top" :arrow="false" title="常用设备保护">
|
||||
<u-switch slot="right-icon" active-color="#1abc9c" size="40" v-model="checked"></u-switch>
|
||||
</u-cell-item>
|
||||
</u-cell-group>
|
||||
<view class="describe">开启常用设备保护后，在不常用的手机上登录时，需要进行账号及密码验证，通过后继续登录。</view>
|
||||
<view class="title">常用设备</view>
|
||||
<u-cell-group class="">
|
||||
<u-cell-item
|
||||
title="HUAWEI Mate30"
|
||||
:center="true"
|
||||
label="最近使用：2020-06-28北京市"
|
||||
value="正在使用"
|
||||
:value-style="{color:'#1abc9c','font-size':'14px'}"
|
||||
:title-style="{'color':'#333'}"
|
||||
>
|
||||
</u-cell-item>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checked:true
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.device-manage{
|
||||
.title{
|
||||
padding:0 30rpx 20rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
250
pages/mine/set/securityCenter/editPassword.vue
Normal file
250
pages/mine/set/securityCenter/editPassword.vue
Normal file
@@ -0,0 +1,250 @@
|
||||
<template>
|
||||
<view class="box">
|
||||
<view class="box-tips">
|
||||
<h2>
|
||||
{{verificationTitle[validateFlage==false ? 0 : 1].title}}
|
||||
</h2>
|
||||
<view class="verification">{{verificationTitle[step].desc}}</view>
|
||||
</view>
|
||||
<u-form :model="codeForm" class="form" ref="validateCodeForm">
|
||||
<view v-if="!validateFlage">
|
||||
<u-form-item label-width="120" label="手机号" prop="mobile">
|
||||
<u-input v-model="codeForm.mobile" placeholder="请输入您的手机号" />
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item class="sendCode" label-width="120" prop="code" label="验证码">
|
||||
<u-input v-model="codeForm.code" placeholder="请输入验证码" />
|
||||
<u-verification-code unique-key="page-edit" :seconds="seconds" @end="end" @start="start" ref="uCode" @change="codeChange"></u-verification-code>
|
||||
<view @tap="getCode" class="text-tips">{{ tips }}</view>
|
||||
</u-form-item>
|
||||
|
||||
<view class="submit" @click="validatePhone">验证</view>
|
||||
<myVerification keep-running @send="verification" class="verification" ref="verification" business="LOGIN" />
|
||||
</view>
|
||||
<view v-if="validateFlage">
|
||||
<u-form-item label-width="120" label="旧密码">
|
||||
<u-input type="password" v-model="password" placeholder="请输入您的旧密码" />
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item label-width="120" label="新密码">
|
||||
|
||||
<u-input type="password" v-model="newPassword" placeholder="请输入您的新密码" />
|
||||
|
||||
</u-form-item>
|
||||
|
||||
<view class="submit" @click="updatePassword">修改密码</view>
|
||||
</view>
|
||||
</u-form>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { sendMobile, resetByMobile, modifyPass } from "@/api/login";
|
||||
|
||||
import storage from "@/utils/storage.js";
|
||||
import { md5 } from "@/utils/md5.js";
|
||||
import myVerification from "@/components/verification/verification.vue";
|
||||
import uuid from "@/utils/uuid.modified.js";
|
||||
export default {
|
||||
components: {
|
||||
myVerification,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
uuid,
|
||||
validateFlage: false, //是否进行了手机号验证
|
||||
verificationTitle: [
|
||||
{
|
||||
title: "安全验证",
|
||||
desc: "请输入当前手机号进行安全验证",
|
||||
},
|
||||
{
|
||||
title: "修改密码",
|
||||
desc: "请输入新密码",
|
||||
},
|
||||
],
|
||||
step: 0, //当前验证步骤
|
||||
flage: false, //是否验证码验证
|
||||
// 验证码登录form
|
||||
codeForm: {
|
||||
mobile: "", //手机号
|
||||
code: "", //验证码
|
||||
},
|
||||
newPassword: "",//新密码
|
||||
password: "", //密码
|
||||
tips: "", //提示
|
||||
seconds: 60,
|
||||
|
||||
// 验证码登录校验
|
||||
codeRules: {
|
||||
mobile: [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
return this.$u.test.mobile(value);
|
||||
},
|
||||
message: "手机号码不正确",
|
||||
trigger: ["blur"],
|
||||
},
|
||||
],
|
||||
code: [
|
||||
{
|
||||
min: 4,
|
||||
max: 6,
|
||||
required: true,
|
||||
message: "请输入验证码",
|
||||
trigger: ["blur"],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
onReady() {
|
||||
// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
|
||||
this.$refs.validateCodeForm.setRules(this.codeRules);
|
||||
},
|
||||
watch: {
|
||||
flage(val) {
|
||||
if (val) {
|
||||
if (this.$refs.uCode.canGetCode) {
|
||||
uni.showLoading({
|
||||
title: "正在获取验证码",
|
||||
});
|
||||
sendMobile(this.codeForm.mobile).then((res) => {
|
||||
uni.hideLoading();
|
||||
// 这里此提示会被this.start()方法中的提示覆盖
|
||||
if (res.data.code == 200) {
|
||||
this.$refs.uCode.start();
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.data.message,
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$u.toast("请倒计时结束后再发送");
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 修改密码
|
||||
updatePassword() {
|
||||
modifyPass({
|
||||
newPassword: md5(this.newPassword),
|
||||
password: md5(this.password),
|
||||
}).then((res) => {
|
||||
if (res.data.success) {
|
||||
uni.showToast({
|
||||
title: "修改成功!",
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 验证码验证
|
||||
verification(val) {
|
||||
this.flage = val == this.$store.state.verificationKey ? true : false;
|
||||
},
|
||||
|
||||
// 验证手机号
|
||||
validatePhone() {
|
||||
this.$refs.validateCodeForm.validate((valid) => {
|
||||
if (valid) {
|
||||
resetByMobile(this.codeForm).then((res) => {
|
||||
if (res.data.success) {
|
||||
storage.setAccessToken(res.data.result.accessToken);
|
||||
storage.setRefreshToken(res.data.result.refreshToken);
|
||||
// 登录成功
|
||||
uni.showToast({
|
||||
title: "验证成功!",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
codeChange(text) {
|
||||
this.tips = text;
|
||||
},
|
||||
end() {},
|
||||
|
||||
/**判断是否是当前用户的手机号 */
|
||||
isUserPhone() {
|
||||
let flage = false;
|
||||
let user = this.$options.filters.isLogin();
|
||||
if (user.mobile != this.codeForm.mobile) {
|
||||
uni.showToast({
|
||||
title: "请输入当前绑定手机号",
|
||||
icon: "none",
|
||||
});
|
||||
flage = false;
|
||||
} else {
|
||||
flage = true;
|
||||
}
|
||||
|
||||
return flage;
|
||||
},
|
||||
/**获取验证码 */
|
||||
getCode() {
|
||||
if (this.isUserPhone()) {
|
||||
if (this.tips == "重新获取") {
|
||||
this.flage = true;
|
||||
}
|
||||
if (!this.$u.test.mobile(this.codeForm.mobile)) {
|
||||
uni.showToast({
|
||||
title: "请输入正确手机号",
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.flage) {
|
||||
this.$refs.verification.hide();
|
||||
return false;
|
||||
}
|
||||
}
|
||||
},
|
||||
start() {
|
||||
this.$u.toast("验证码已发送");
|
||||
this.flage = false;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import url("../../../passport/login.scss");
|
||||
.u-form-item {
|
||||
margin: 40rpx 0;
|
||||
}
|
||||
.sendCode {
|
||||
/deep/ .u-form-item--right__content__slot {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
.box {
|
||||
padding: 80rpx 0;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.box-tips {
|
||||
margin: 0 72rpx;
|
||||
}
|
||||
.verification {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
</style>
|
||||
84
pages/mine/set/securityCenter/faceLogin.vue
Normal file
84
pages/mine/set/securityCenter/faceLogin.vue
Normal file
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<view class="face-login">
|
||||
<u-cell-group>
|
||||
<u-cell-item class="border-top" :arrow="false" title="面容登录">
|
||||
<u-switch slot="right-icon" @change="faceSwitchChange" active-color="#1abc9c" size="40" v-model="checked"></u-switch>
|
||||
</u-cell-item>
|
||||
</u-cell-group>
|
||||
<view class="describe">开启后可使用面容认证完成快捷登录，设置仅对本机生效。</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import storage from '@/utils/storage.js';
|
||||
import { setBiolofy } from '@/api/passport.js';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checked: true
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
faceSwitchChange(value) {
|
||||
if (value === true) {
|
||||
const res = uni.getSystemInfoSync();
|
||||
plus.device.getInfo({
|
||||
success: function(e) {
|
||||
let params = {
|
||||
mobile_type: res.model,
|
||||
secret_key: e.uuid
|
||||
};
|
||||
setBiolofy(params).then(res => {
|
||||
if (res.statusCode === 200) {
|
||||
storage.setFaceLogin(true);
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: function(e) {
|
||||
//plus.nativeUI.toast('获取设备信息错误：' + JSON.stringify(e));
|
||||
console.error('getDeviceInfo failed: ' + JSON.stringify(e));
|
||||
}
|
||||
});
|
||||
} else {
|
||||
storage.setFaceLogin(false);
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// #ifdef APP-PLUS
|
||||
uni.checkIsSupportSoterAuthentication({
|
||||
success(res) {
|
||||
if (!res.supportMode.find(e => e === 'facial')) {
|
||||
plus.nativeUI.toast('此设备不支持面部识别');
|
||||
uni.navigateBack();
|
||||
}
|
||||
uni.checkIsSoterEnrolledInDevice({
|
||||
checkAuthMode: 'facial',
|
||||
success(_res) {
|
||||
if (!_res.isEnrolled) {
|
||||
plus.nativeUI.toast('此设备未录入面部信息');
|
||||
uni.navigateBack();
|
||||
}
|
||||
},
|
||||
fail(_err) {
|
||||
// plus.nativeUI.toast(JSON.stringify(_err));
|
||||
uni.navigateBack();
|
||||
}
|
||||
});
|
||||
},
|
||||
fail(err) {
|
||||
// plus.nativeUI.toast(JSON.stringify(err));
|
||||
uni.navigateBack();
|
||||
}
|
||||
});
|
||||
this.checked = storage.getFaceLogin() || false;
|
||||
// #endif
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.face-login {
|
||||
}
|
||||
</style>
|
||||
70
pages/mine/set/securityCenter/fingerLogin.vue
Normal file
70
pages/mine/set/securityCenter/fingerLogin.vue
Normal file
@@ -0,0 +1,70 @@
|
||||
<template>
|
||||
<view class="finger">
|
||||
<u-cell-group>
|
||||
<u-cell-item class="border-top" :arrow="false" title="指纹登录">
|
||||
<u-switch slot="right-icon" @change="fingerSwitchChange" active-color="#1abc9c" size="40" v-model="checked"></u-switch>
|
||||
</u-cell-item>
|
||||
</u-cell-group>
|
||||
<view class="describe">开启后可使用指纹认证完成快捷登录，设置仅对本机生效。如需修改指纹，请在系统设置中操作。</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import storage from '@/utils/storage.js';
|
||||
import { setBiolofy } from '@/api/passport.js';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
checked: false
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
fingerSwitchChange(value) {
|
||||
if (value === true) {
|
||||
const res = uni.getSystemInfoSync();
|
||||
plus.device.getInfo({
|
||||
success: function(e) {
|
||||
let params = {
|
||||
mobile_type: res.model,
|
||||
secret_key: e.uuid
|
||||
};
|
||||
setBiolofy(params).then(res => {
|
||||
if (res.statusCode === 200) {
|
||||
storage.setFingerLogin(true);
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: function(e) {
|
||||
console.error('getDeviceInfo failed: ' + JSON.stringify(e));
|
||||
}
|
||||
});
|
||||
} else {
|
||||
storage.setFingerLogin(false);
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// #ifdef APP-PLUS
|
||||
if (!plus.fingerprint.isSupport()) {
|
||||
plus.nativeUI.toast('此设备不支持指纹识别');
|
||||
uni.navigateBack();
|
||||
}
|
||||
if (!plus.fingerprint.isKeyguardSecure()) {
|
||||
plus.nativeUI.toast('此设备未设置密码锁屏');
|
||||
uni.navigateBack();
|
||||
}
|
||||
if (!plus.fingerprint.isEnrolledFingerprints()) {
|
||||
plus.nativeUI.toast('此设备未录入指纹');
|
||||
uni.navigateBack();
|
||||
}
|
||||
this.checked = storage.getFingerLogin() || false;
|
||||
// #endif
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.finger {
|
||||
}
|
||||
</style>
|
||||
36
pages/mine/set/securityCenter/securityCenter.vue
Normal file
36
pages/mine/set/securityCenter/securityCenter.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<view class="securityCenter">
|
||||
<u-cell-group>
|
||||
<u-cell-item title="修改密码" @click="navigateTo('/pages/mine/set/securityCenter/editPassword')"></u-cell-item>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mobile: "", //存储手机号
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
navigateTo(url) {
|
||||
uni.navigateTo({
|
||||
url: url + `?mobile=${this.mobile}`,
|
||||
});
|
||||
},
|
||||
},
|
||||
onLoad(option) {
|
||||
this.mobile = option.mobile;
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.securityCenter {
|
||||
.u-cell {
|
||||
line-height: normal;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user