mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
synced 2026-08-06 10:57:25 +08:00
refactor: 重构多个组件以支持 Vue 3 语法和功能
- 将多个组件转换为 `<script setup>` 语法，提升可读性和性能 - 优化状态管理和事件处理逻辑，简化代码结构 - 更新样式和布局以适应新组件结构 - 添加新功能和修复已知问题，提升用户体验
This commit is contained in:
Yer11214
@@ -1,227 +1,211 @@
|
||||
<template>
|
||||
<view class="box">
|
||||
<view class="box-tips">
|
||||
<h2 class='h2'>
|
||||
绑定手机号码
|
||||
</h2>
|
||||
<h2 class="h2">绑定手机号码</h2>
|
||||
<view class="verification"></view>
|
||||
</view>
|
||||
<view class="form">
|
||||
<u-form :model="codeForm" ref="validateCodeForm">
|
||||
<view v-if="!validateFlage">
|
||||
<u-form-item label-width="120" label="手机号" prop="mobile">
|
||||
<up-form
|
||||
:model="codeForm"
|
||||
ref="validateCodeForm"
|
||||
label-position="left"
|
||||
label-width="180rpx"
|
||||
>
|
||||
<view v-if="!phoneVerified">
|
||||
<up-form-item label-width="180rpx" label="手机号" prop="mobile">
|
||||
<u-input maxlength="11" 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-code unique-key="page-edit" :seconds="seconds" @end="end" @start="start"
|
||||
ref="uCode" @change="codeChange"></u-code>
|
||||
<view @tap="getCode" class="text-tips">{{ tips }}</view>
|
||||
</u-form-item>
|
||||
</up-form-item>
|
||||
|
||||
<view class="submit" @click="validatePhone">绑定</view>
|
||||
<myVerification keep-running @send="verification" class="verification" ref="verification"
|
||||
business="BIND_MOBILE" />
|
||||
<up-form-item class="sendCode" label-width="180rpx" prop="code" label="验证码">
|
||||
<u-input v-model="codeForm.code" placeholder="请输入验证码" />
|
||||
<u-code
|
||||
unique-key="page-edit"
|
||||
:seconds="seconds"
|
||||
@end="onCodeCountdownEnd"
|
||||
@start="onCodeCountdownStart"
|
||||
ref="uCodeRef"
|
||||
@change="onCodeTextChange"
|
||||
></u-code>
|
||||
<view @tap="requestSmsCode" class="text-tips">{{ codeTips }}</view>
|
||||
</up-form-item>
|
||||
|
||||
<view class="submit" @click="submitBindMobile">绑定</view>
|
||||
<myVerification
|
||||
keep-running
|
||||
@send="onVerificationPassed"
|
||||
class="verification"
|
||||
ref="verificationRef"
|
||||
business="BIND_MOBILE"
|
||||
/>
|
||||
</view>
|
||||
</u-form>
|
||||
</up-form>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
sendMobile,
|
||||
bindMobile
|
||||
} from "@/api/login";
|
||||
import { getUserInfo } from "@/api/members.js";
|
||||
import storage from "@/utils/storage.js";
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, watch, getCurrentInstance } from 'vue'
|
||||
import { onLoad, onReady } from '@dcloudio/uni-app'
|
||||
import { useStore } from '@/store'
|
||||
import { sendMobile, bindMobile } from '@/api/login'
|
||||
import { getUserInfo } from '@/api/members.js'
|
||||
import storage from '@/utils/storage.js'
|
||||
import MyVerification from '@/components/verification/verification.vue'
|
||||
|
||||
import myVerification from "@/components/verification/verification.vue"; //验证
|
||||
import uuid from "@/utils/uuid.modified.js";
|
||||
export default {
|
||||
components: {
|
||||
myVerification,
|
||||
const store = useStore()
|
||||
const { proxy } = getCurrentInstance()!
|
||||
|
||||
const phoneVerified = ref(false)
|
||||
const verificationPassed = ref(false)
|
||||
const codeForm = reactive({
|
||||
mobile: '',
|
||||
code: '',
|
||||
username: '',
|
||||
})
|
||||
const codeTips = ref('')
|
||||
const seconds = 69
|
||||
|
||||
const validateCodeForm = ref<any>(null)
|
||||
const uCodeRef = ref<any>(null)
|
||||
const verificationRef = ref<any>(null)
|
||||
|
||||
const codeRules = {
|
||||
mobile: [
|
||||
{
|
||||
validator: (_rule: any, value: string) => proxy.$u.test.mobile(value),
|
||||
message: '手机号码不正确',
|
||||
trigger: ['blur'],
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
uuid,
|
||||
validateFlage: false, //是否进行了手机号验证
|
||||
step: 0, //当前验证步骤
|
||||
flage: false, //是否验证码验证
|
||||
codeForm: {
|
||||
mobile: "", //手机号
|
||||
code: "", //验证码
|
||||
username: "", //用户名
|
||||
},
|
||||
tips: "", //提示
|
||||
seconds: 69, // 60s等待时间
|
||||
|
||||
// 验证码登录校验
|
||||
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"],
|
||||
}, ],
|
||||
},
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
this.codeForm.username = options.username;
|
||||
},
|
||||
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, "BIND_MOBILE").then((res) => {
|
||||
if (this.$store.state.isShowToast){ uni.hideLoading() };
|
||||
// 这里此提示会被this.start()方法中的提示覆盖
|
||||
if (res.data.success) {
|
||||
this.$refs.uCode.start();
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.data.message,
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
this.flage = false;
|
||||
this.$refs.verification.getCode();
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$u.toast("请倒计时结束后再发送");
|
||||
}
|
||||
}
|
||||
},
|
||||
],
|
||||
code: [
|
||||
{
|
||||
min: 4,
|
||||
max: 6,
|
||||
required: true,
|
||||
message: '请输入验证码',
|
||||
trigger: ['blur'],
|
||||
},
|
||||
],
|
||||
}
|
||||
|
||||
methods: {
|
||||
// 验证码验证
|
||||
verification(val) {
|
||||
this.flage = val == this.$store.state.verificationKey ? true : false;
|
||||
},
|
||||
onLoad((options) => {
|
||||
codeForm.username = options?.username || ''
|
||||
})
|
||||
|
||||
// 验证手机号
|
||||
validatePhone() {
|
||||
this.$refs.validateCodeForm.validate((valid) => {
|
||||
if (valid) {
|
||||
bindMobile(this.codeForm).then((res) => {
|
||||
if (res.data.success) {
|
||||
this.validateFlage = !this.validateFlage;
|
||||
// 获取最新的用户信息并更新缓存
|
||||
getUserInfo().then(userRes => {
|
||||
if (userRes.data.success) {
|
||||
storage.setUserInfo(userRes.data.result);
|
||||
}
|
||||
// 显示成功提示
|
||||
uni.showToast({
|
||||
title: "绑定成功!",
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
// 返回上一页
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
}, 1000);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
onReady(() => {
|
||||
validateCodeForm.value?.setRules(codeRules)
|
||||
})
|
||||
|
||||
codeChange(text) {
|
||||
this.tips = text;
|
||||
},
|
||||
end() {
|
||||
|
||||
this.flage = false;
|
||||
this.$refs.verification.getCode()
|
||||
},
|
||||
|
||||
/**获取验证码 */
|
||||
getCode() {
|
||||
if (this.tips == "重新获取") {
|
||||
this.$refs.verification.error(); //发送
|
||||
}
|
||||
if (!this.$u.test.mobile(this.codeForm.mobile)) {
|
||||
uni.showToast({
|
||||
title: "请输入正确手机号",
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.flage) {
|
||||
this.$refs.verification.error(); //发送
|
||||
return false;
|
||||
}
|
||||
},
|
||||
start() {
|
||||
this.$u.toast("验证码已发送");
|
||||
this.flage = true;
|
||||
|
||||
this.$refs.verification.hide();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import url("@/pages/passport/login.scss");
|
||||
|
||||
::v-deep .u-form-item {
|
||||
margin: 40rpx 0;
|
||||
watch(verificationPassed, (val) => {
|
||||
if (!val) return
|
||||
if (!uCodeRef.value?.canGetCode) {
|
||||
proxy.$u.toast('请倒计时结束后再发送')
|
||||
return
|
||||
}
|
||||
|
||||
.sendCode {
|
||||
::v-deep .u-form-item--right__content__slot {
|
||||
display: flex;
|
||||
uni.showLoading({ title: '正在获取验证码' })
|
||||
sendMobile(codeForm.mobile, 'BIND_MOBILE').then((res) => {
|
||||
if (store.state.isShowToast) uni.hideLoading()
|
||||
if (res.data.success) {
|
||||
uCodeRef.value?.start()
|
||||
} else {
|
||||
uni.showToast({ title: res.data.message, duration: 2000, icon: 'none' })
|
||||
verificationPassed.value = false
|
||||
verificationRef.value?.getCode()
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
.h2 {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
function onVerificationPassed(val: string) {
|
||||
verificationPassed.value = val === store.state.verificationKey
|
||||
}
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
function submitBindMobile() {
|
||||
validateCodeForm.value?.validate((valid: boolean) => {
|
||||
if (!valid) return
|
||||
bindMobile(codeForm).then((res) => {
|
||||
if (res.data.success) {
|
||||
phoneVerified.value = true
|
||||
getUserInfo().then((userRes) => {
|
||||
if (userRes.data.success) {
|
||||
storage.setUserInfo(userRes.data.result)
|
||||
}
|
||||
uni.showToast({ title: '绑定成功!', duration: 2000, icon: 'none' })
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({ delta: 1 })
|
||||
}, 1000)
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 80rpx 0;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
function onCodeTextChange(text: string) {
|
||||
codeTips.value = text
|
||||
}
|
||||
|
||||
.submit {
|
||||
background: $light-color;
|
||||
}
|
||||
function onCodeCountdownEnd() {
|
||||
verificationPassed.value = false
|
||||
verificationRef.value?.getCode()
|
||||
}
|
||||
|
||||
.box-tips {
|
||||
margin: 0 72rpx;
|
||||
function requestSmsCode() {
|
||||
if (codeTips.value === '重新获取') {
|
||||
verificationRef.value?.error()
|
||||
}
|
||||
if (!proxy.$u.test.mobile(codeForm.mobile)) {
|
||||
uni.showToast({ title: '请输入正确手机号', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (!verificationPassed.value) {
|
||||
verificationRef.value?.error()
|
||||
}
|
||||
}
|
||||
|
||||
.verification {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
function onCodeCountdownStart() {
|
||||
proxy.$u.toast('验证码已发送')
|
||||
verificationPassed.value = true
|
||||
verificationRef.value?.hide()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import url("@/pages/passport/login.scss");
|
||||
|
||||
::v-deep .u-form-item {
|
||||
margin: 40rpx 0;
|
||||
}
|
||||
|
||||
.sendCode {
|
||||
::v-deep .u-form-item__body__right__content__slot {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.h2 {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 80rpx 0;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.submit {
|
||||
background: $light-color;
|
||||
}
|
||||
|
||||
.box-tips {
|
||||
margin: 0 72rpx;
|
||||
}
|
||||
|
||||
.verification {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,160 +1,99 @@
|
||||
<template>
|
||||
<view class="box">
|
||||
<view class="box-tips">
|
||||
<h2 class='h2'>
|
||||
{{verificationTitle.title}}
|
||||
</h2>
|
||||
<view class="verification">{{verificationTitle.desc}}</view>
|
||||
<h2 class="h2">{{ verificationTitle.title }}</h2>
|
||||
<view class="verification">{{ verificationTitle.desc }}</view>
|
||||
</view>
|
||||
<view class="form">
|
||||
<u-form :model="codeForm" ref="validateCodeForm">
|
||||
<u-form-item label-width="120" label="旧密码">
|
||||
<u-input type="password" v-model="oldPassword" placeholder="请输入您的旧密码" />
|
||||
</u-form-item>
|
||||
<up-form
|
||||
:model="codeForm"
|
||||
ref="validateCodeForm"
|
||||
label-position="left"
|
||||
label-width="180rpx"
|
||||
>
|
||||
<up-form-item label-width="180rpx" label="旧密码">
|
||||
<u-input type="password" v-model="oldPassword" placeholder="请输入您的旧密码" />
|
||||
</up-form-item>
|
||||
|
||||
<u-form-item label-width="120" label="密码">
|
||||
<u-input type="password" v-model="password" placeholder="请输入您的密码" />
|
||||
</u-form-item>
|
||||
<up-form-item label-width="180rpx" label="密码">
|
||||
<u-input type="password" v-model="password" placeholder="请输入您的密码" />
|
||||
</up-form-item>
|
||||
|
||||
<u-form-item label-width="120" label="确认密码">
|
||||
<u-input type="password" v-model="newPassword" placeholder="请再次输入您的密码" />
|
||||
</u-form-item>
|
||||
<up-form-item label-width="180rpx" label="确认密码">
|
||||
<u-input type="password" v-model="confirmPassword" placeholder="请再次输入您的密码" />
|
||||
</up-form-item>
|
||||
|
||||
<view class="submit" @click="updatePassword">修改密码</view>
|
||||
</u-form>
|
||||
<view class="submit" @click="updatePassword">修改密码</view>
|
||||
</up-form>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
resetByMobile,
|
||||
modifyPass
|
||||
} from "@/api/login";
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive } from 'vue'
|
||||
import { modifyPass } from '@/api/login'
|
||||
import { md5 } from '@/utils/md5.js'
|
||||
|
||||
import {
|
||||
md5
|
||||
} from "@/utils/md5.js"; // md5
|
||||
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: "请验证并输入密码",
|
||||
},
|
||||
step: 0, //当前验证步骤
|
||||
flage: false, //是否验证码验证
|
||||
const verificationTitle = {
|
||||
title: '修改密码',
|
||||
desc: '请验证并输入密码',
|
||||
}
|
||||
const codeForm = reactive({ mobile: '', code: '' })
|
||||
const oldPassword = ref('')
|
||||
const password = ref('')
|
||||
const confirmPassword = ref('')
|
||||
|
||||
codeForm: {
|
||||
mobile: "", //手机号
|
||||
code: "", //验证码
|
||||
},
|
||||
newPassword: "", //新密码
|
||||
password: "", //密码
|
||||
oldPassword: '', //旧密码
|
||||
tips: "", //提示
|
||||
seconds: 69, // 60s等待时间
|
||||
|
||||
// 验证码登录校验
|
||||
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);
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 修改密码
|
||||
updatePassword() {
|
||||
if(this.password !== this.newPassword){
|
||||
uni.showToast({
|
||||
title: "两次输入密码不一致!",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
modifyPass({
|
||||
password: md5(this.oldPassword),
|
||||
newPassword: md5(this.newPassword),
|
||||
}).then((res) => {
|
||||
if (res.data.success) {
|
||||
uni.showToast({
|
||||
title: "修改成功!",
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import url("@/pages/passport/login.scss");
|
||||
|
||||
::v-deep .u-form-item {
|
||||
margin: 40rpx 0;
|
||||
function updatePassword() {
|
||||
if (password.value !== confirmPassword.value) {
|
||||
uni.showToast({ title: '两次输入密码不一致!', icon: 'none' })
|
||||
return
|
||||
}
|
||||
|
||||
.sendCode {
|
||||
::v-deep .u-form-item--right__content__slot {
|
||||
display: flex;
|
||||
modifyPass({
|
||||
password: md5(oldPassword.value),
|
||||
newPassword: md5(password.value),
|
||||
}).then((res) => {
|
||||
if (res.data.success) {
|
||||
uni.showToast({ title: '修改成功!', duration: 2000, icon: 'none' })
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({ delta: 1 })
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
.h2 {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
<style lang="scss" scoped>
|
||||
@import url("@/pages/passport/login.scss");
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
::v-deep .u-form-item {
|
||||
margin: 40rpx 0;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 80rpx 0;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.h2 {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.submit {
|
||||
background: $light-color;
|
||||
}
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.box-tips {
|
||||
margin: 0 72rpx;
|
||||
}
|
||||
.box {
|
||||
padding: 80rpx 0;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.verification {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.submit {
|
||||
background: $light-color;
|
||||
}
|
||||
|
||||
.box-tips {
|
||||
margin: 0 72rpx;
|
||||
}
|
||||
|
||||
.verification {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,281 +1,238 @@
|
||||
<template>
|
||||
<view class="box">
|
||||
<view class="box-tips">
|
||||
<h2 class='h2'>
|
||||
{{verificationTitle[validateFlage==false ? 0 : 1].title}}
|
||||
</h2>
|
||||
<view class="verification">{{verificationTitle[step].desc}}</view>
|
||||
<h2 class="h2">{{ verificationTitle[phoneVerified ? 1 : 0].title }}</h2>
|
||||
<view class="verification">{{ verificationTitle[step].desc }}</view>
|
||||
</view>
|
||||
<view class="form">
|
||||
<u-form :model="codeForm" ref="validateCodeForm">
|
||||
<view v-if="!validateFlage">
|
||||
<u-form-item label-width="120" label="手机号" prop="mobile">
|
||||
<up-form
|
||||
:model="codeForm"
|
||||
ref="validateCodeForm"
|
||||
label-position="left"
|
||||
label-width="180rpx"
|
||||
>
|
||||
<view v-if="!phoneVerified">
|
||||
<up-form-item label-width="180rpx" label="手机号" prop="mobile">
|
||||
<u-input maxlength="11" v-model="codeForm.mobile" placeholder="请输入您的手机号" />
|
||||
</u-form-item>
|
||||
</up-form-item>
|
||||
|
||||
<u-form-item class="sendCode" label-width="120" prop="code" label="验证码">
|
||||
<up-form-item class="sendCode" label-width="180rpx" prop="code" label="验证码">
|
||||
<u-input v-model="codeForm.code" placeholder="请输入验证码" />
|
||||
<u-code unique-key="page-edit" :seconds="seconds" @end="end" @start="start"
|
||||
ref="uCode" @change="codeChange"></u-code>
|
||||
<view @tap="getCode" class="text-tips">{{ tips }}</view>
|
||||
</u-form-item>
|
||||
<u-code
|
||||
unique-key="page-edit"
|
||||
:seconds="seconds"
|
||||
@end="onCodeCountdownEnd"
|
||||
@start="onCodeCountdownStart"
|
||||
ref="uCodeRef"
|
||||
@change="onCodeTextChange"
|
||||
></u-code>
|
||||
<view @tap="requestSmsCode" class="text-tips">{{ codeTips }}</view>
|
||||
</up-form-item>
|
||||
|
||||
<view class="submit" @click="validatePhone">验证</view>
|
||||
<myVerification keep-running @send="verification" class="verification" ref="verification"
|
||||
business="FIND_USER" />
|
||||
<view class="submit" @click="verifyMobile">验证</view>
|
||||
<myVerification
|
||||
keep-running
|
||||
@send="onVerificationPassed"
|
||||
class="verification"
|
||||
ref="verificationRef"
|
||||
business="FIND_USER"
|
||||
/>
|
||||
</view>
|
||||
<view v-if="validateFlage">
|
||||
<u-form-item label-width="120" label="密码">
|
||||
<view v-if="phoneVerified">
|
||||
<up-form-item label-width="180rpx" label="密码">
|
||||
<u-input type="password" v-model="password" placeholder="请输入您的密码" />
|
||||
</u-form-item>
|
||||
</up-form-item>
|
||||
|
||||
<u-form-item label-width="120" label="确认密码">
|
||||
<u-input type="password" v-model="newPassword" placeholder="请再次输入您的密码" />
|
||||
</u-form-item>
|
||||
<up-form-item label-width="180rpx" label="确认密码">
|
||||
<u-input type="password" v-model="confirmPassword" placeholder="请再次输入您的密码" />
|
||||
</up-form-item>
|
||||
|
||||
<view class="submit" @click="updatePassword">修改密码</view>
|
||||
</view>
|
||||
</u-form>
|
||||
</up-form>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
sendMobile,
|
||||
resetByMobile,
|
||||
resetPassword
|
||||
} from "@/api/login";
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, watch, getCurrentInstance } from 'vue'
|
||||
import { onReady } from '@dcloudio/uni-app'
|
||||
import { useStore } from '@/store'
|
||||
import { isLogin } from '@/utils/filters.js'
|
||||
import { sendMobile, resetByMobile, resetPassword } from '@/api/login'
|
||||
import { md5 } from '@/utils/md5.js'
|
||||
import MyVerification from '@/components/verification/verification.vue'
|
||||
|
||||
import {
|
||||
md5
|
||||
} from "@/utils/md5.js"; // md5
|
||||
import myVerification from "@/components/verification/verification.vue"; //验证
|
||||
import uuid from "@/utils/uuid.modified.js";
|
||||
export default {
|
||||
components: {
|
||||
myVerification,
|
||||
const store = useStore()
|
||||
const { proxy } = getCurrentInstance()!
|
||||
|
||||
const phoneVerified = ref(false)
|
||||
const verificationPassed = ref(false)
|
||||
const verificationTitle = [
|
||||
{ title: '安全验证', desc: '请输入当前手机号进行安全验证' },
|
||||
{ title: '修改密码', desc: '请输入新密码' },
|
||||
]
|
||||
const step = ref(0)
|
||||
const codeForm = reactive({ mobile: '', code: '' })
|
||||
const password = ref('')
|
||||
const confirmPassword = ref('')
|
||||
const codeTips = ref('')
|
||||
const seconds = 69
|
||||
|
||||
const validateCodeForm = ref<any>(null)
|
||||
const uCodeRef = ref<any>(null)
|
||||
const verificationRef = ref<any>(null)
|
||||
|
||||
const codeRules = {
|
||||
mobile: [
|
||||
{
|
||||
validator: (_rule: any, value: string) => proxy.$u.test.mobile(value),
|
||||
message: '手机号码不正确',
|
||||
trigger: ['blur'],
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
uuid,
|
||||
validateFlage: false, //是否进行了手机号验证
|
||||
verificationTitle: [{
|
||||
title: "安全验证",
|
||||
desc: "请输入当前手机号进行安全验证",
|
||||
},
|
||||
{
|
||||
title: "修改密码",
|
||||
desc: "请输入新密码",
|
||||
},
|
||||
],
|
||||
step: 0, //当前验证步骤
|
||||
flage: false, //是否验证码验证
|
||||
|
||||
codeForm: {
|
||||
mobile: "", //手机号
|
||||
code: "", //验证码
|
||||
},
|
||||
newPassword: "", //新密码
|
||||
password: "", //密码
|
||||
tips: "", //提示
|
||||
seconds: 69, // 60s等待时间
|
||||
|
||||
// 验证码登录校验
|
||||
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"],
|
||||
}, ],
|
||||
},
|
||||
};
|
||||
],
|
||||
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, "FIND_USER").then((res) => {
|
||||
if (this.$store.state.isShowToast){ uni.hideLoading() };
|
||||
// 这里此提示会被this.start()方法中的提示覆盖
|
||||
if (res.data.success) {
|
||||
this.$refs.uCode.start();
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.data.message,
|
||||
duration: 2000,
|
||||
icon: "none",
|
||||
});
|
||||
this.flage = false;
|
||||
this.$refs.verification.getCode();
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$u.toast("请倒计时结束后再发送");
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
onReady(() => {
|
||||
validateCodeForm.value?.setRules(codeRules)
|
||||
})
|
||||
|
||||
methods: {
|
||||
// 修改密码
|
||||
updatePassword() {
|
||||
if(this.password !== this.newPassword){
|
||||
uni.showToast({
|
||||
title: "两次输入密码不一致!",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
resetPassword({
|
||||
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) {
|
||||
this.validateFlage = !this.validateFlage;
|
||||
// 登录成功
|
||||
uni.showToast({
|
||||
title: "验证成功!",
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
codeChange(text) {
|
||||
this.tips = text;
|
||||
},
|
||||
end() {
|
||||
|
||||
this.flage = false;
|
||||
this.$refs.verification.getCode()
|
||||
},
|
||||
|
||||
/**判断是否是当前用户的手机号 */
|
||||
isUserPhone() {
|
||||
let flage = false;
|
||||
let user = this.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.$refs.verification.error(); //发送
|
||||
}
|
||||
if (!this.$u.test.mobile(this.codeForm.mobile)) {
|
||||
uni.showToast({
|
||||
title: "请输入正确手机号",
|
||||
icon: "none",
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.flage) {
|
||||
this.$refs.verification.error(); //发送
|
||||
return false;
|
||||
}
|
||||
}
|
||||
},
|
||||
start() {
|
||||
this.$u.toast("验证码已发送");
|
||||
this.flage = true;
|
||||
|
||||
this.$refs.verification.hide();
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import url("@/pages/passport/login.scss");
|
||||
|
||||
::v-deep .u-form-item {
|
||||
margin: 40rpx 0;
|
||||
watch(verificationPassed, (val) => {
|
||||
if (!val) return
|
||||
if (!uCodeRef.value?.canGetCode) {
|
||||
proxy.$u.toast('请倒计时结束后再发送')
|
||||
return
|
||||
}
|
||||
|
||||
.sendCode {
|
||||
::v-deep .u-form-item--right__content__slot {
|
||||
display: flex;
|
||||
uni.showLoading({ title: '正在获取验证码' })
|
||||
sendMobile(codeForm.mobile, 'FIND_USER').then((res) => {
|
||||
if (store.state.isShowToast) uni.hideLoading()
|
||||
if (res.data.success) {
|
||||
uCodeRef.value?.start()
|
||||
} else {
|
||||
uni.showToast({ title: res.data.message, duration: 2000, icon: 'none' })
|
||||
verificationPassed.value = false
|
||||
verificationRef.value?.getCode()
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
.h2 {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
function onVerificationPassed(val: string) {
|
||||
verificationPassed.value = val === store.state.verificationKey
|
||||
}
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
function updatePassword() {
|
||||
if (password.value !== confirmPassword.value) {
|
||||
uni.showToast({ title: '两次输入密码不一致!', icon: 'none' })
|
||||
return
|
||||
}
|
||||
resetPassword({ password: md5(password.value) }).then((res) => {
|
||||
if (res.data.success) {
|
||||
uni.showToast({ title: '修改成功!', duration: 2000, icon: 'none' })
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({ delta: 1 })
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 80rpx 0;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
function verifyMobile() {
|
||||
validateCodeForm.value?.validate((valid: boolean) => {
|
||||
if (!valid) return
|
||||
resetByMobile(codeForm).then((res) => {
|
||||
if (res.data.success) {
|
||||
phoneVerified.value = true
|
||||
uni.showToast({ title: '验证成功!', icon: 'none' })
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
.submit {
|
||||
background: $light-color;
|
||||
}
|
||||
function onCodeTextChange(text: string) {
|
||||
codeTips.value = text
|
||||
}
|
||||
|
||||
.box-tips {
|
||||
margin: 0 72rpx;
|
||||
}
|
||||
function onCodeCountdownEnd() {
|
||||
verificationPassed.value = false
|
||||
verificationRef.value?.getCode()
|
||||
}
|
||||
|
||||
.verification {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
function isCurrentUserPhone() {
|
||||
const user = isLogin()
|
||||
if (user?.mobile !== codeForm.mobile) {
|
||||
uni.showToast({ title: '请输入当前绑定手机号', icon: 'none' })
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
|
||||
function requestSmsCode() {
|
||||
if (!isCurrentUserPhone()) return
|
||||
if (codeTips.value === '重新获取') {
|
||||
verificationRef.value?.error()
|
||||
}
|
||||
if (!proxy.$u.test.mobile(codeForm.mobile)) {
|
||||
uni.showToast({ title: '请输入正确手机号', icon: 'none' })
|
||||
return
|
||||
}
|
||||
if (!verificationPassed.value) {
|
||||
verificationRef.value?.error()
|
||||
}
|
||||
}
|
||||
|
||||
function onCodeCountdownStart() {
|
||||
proxy.$u.toast('验证码已发送')
|
||||
verificationPassed.value = true
|
||||
verificationRef.value?.hide()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import url("@/pages/passport/login.scss");
|
||||
|
||||
::v-deep .u-form-item {
|
||||
margin: 40rpx 0;
|
||||
}
|
||||
|
||||
.sendCode {
|
||||
::v-deep .u-form-item__body__right__content__slot {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
.h2 {
|
||||
font-size: 40rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.box {
|
||||
padding: 80rpx 0;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.submit {
|
||||
background: $light-color;
|
||||
}
|
||||
|
||||
.box-tips {
|
||||
margin: 0 72rpx;
|
||||
}
|
||||
|
||||
.verification {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<u-cell-group>
|
||||
<u-cell class="border-top" :isLink="false" title="面容登录">
|
||||
<template #right-icon>
|
||||
<u-switch @change="faceSwitchChange" active-color="#1abc9c" size="40" v-model="checked"></u-switch>
|
||||
<u-switch @change="onFaceSwitchChange" active-color="#1abc9c" size="40" v-model="enabled"></u-switch>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-cell-group>
|
||||
@@ -12,74 +12,65 @@
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import storage from "@/utils/storage.js";
|
||||
import { setBiolofy } from "@/api/passport.js";
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import storage from '@/utils/storage.js'
|
||||
import { setBiolofy } from '@/api/passport.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
lightColor: this.$lightColor,
|
||||
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);
|
||||
const enabled = ref(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() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
})
|
||||
},
|
||||
},
|
||||
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() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
})
|
||||
enabled.value = storage.getFaceLogin() || false
|
||||
// #endif
|
||||
})
|
||||
|
||||
function onFaceSwitchChange(value: boolean) {
|
||||
if (value) {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
plus.device.getInfo({
|
||||
success(e) {
|
||||
setBiolofy({
|
||||
mobile_type: systemInfo.model,
|
||||
secret_key: e.uuid,
|
||||
}).then((res) => {
|
||||
if (res.statusCode === 200) {
|
||||
storage.setFaceLogin(true)
|
||||
}
|
||||
})
|
||||
},
|
||||
fail(err) {
|
||||
// plus.nativeUI.toast(JSON.stringify(err));
|
||||
uni.navigateBack();
|
||||
console.error('getDeviceInfo failed: ' + JSON.stringify(err))
|
||||
},
|
||||
});
|
||||
this.checked = storage.getFaceLogin() || false;
|
||||
// #endif
|
||||
},
|
||||
};
|
||||
})
|
||||
} else {
|
||||
storage.setFaceLogin(false)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<u-cell-group>
|
||||
<u-cell class="border-top" :isLink="false" title="指纹登录">
|
||||
<template #right-icon>
|
||||
<u-switch @change="fingerSwitchChange" :active-color="lightColor" size="40" v-model="checked"></u-switch>
|
||||
<u-switch @change="onFingerSwitchChange" :active-color="lightColor" size="40" v-model="enabled"></u-switch>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-cell-group>
|
||||
@@ -12,60 +12,57 @@
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import storage from "@/utils/storage.js";
|
||||
import { setBiolofy } from "@/api/passport.js";
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import { useStore } from '@/store'
|
||||
import storage from '@/utils/storage.js'
|
||||
import { setBiolofy } from '@/api/passport.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
lightColor: this.$lightColor,
|
||||
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
|
||||
},
|
||||
};
|
||||
const store = useStore()
|
||||
const lightColor = computed(() => store.getters.lightColor)
|
||||
const enabled = ref(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()
|
||||
}
|
||||
enabled.value = storage.getFingerLogin() || false
|
||||
// #endif
|
||||
})
|
||||
|
||||
function onFingerSwitchChange(value: boolean) {
|
||||
if (value) {
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
plus.device.getInfo({
|
||||
success(e) {
|
||||
setBiolofy({
|
||||
mobile_type: systemInfo.model,
|
||||
secret_key: e.uuid,
|
||||
}).then((res) => {
|
||||
if (res.statusCode === 200) {
|
||||
storage.setFingerLogin(true)
|
||||
}
|
||||
})
|
||||
},
|
||||
fail(err) {
|
||||
console.error('getDeviceInfo failed: ' + JSON.stringify(err))
|
||||
},
|
||||
})
|
||||
} else {
|
||||
storage.setFingerLogin(false)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
@@ -2,56 +2,44 @@
|
||||
<view class="securityCenter">
|
||||
<u-cell-group>
|
||||
<u-cell title="修改密码" @click="navigateTo('/pages/mine/set/securityCenter/updatePwdTab')"></u-cell>
|
||||
<u-cell title="注销账户" @click="zhuxiao"></u-cell>
|
||||
<u-cell title="注销账户" @click="confirmAccountDeletion"></u-cell>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mobile: "", //存储手机号
|
||||
};
|
||||
},
|
||||
<script setup lang="ts">
|
||||
function navigateTo(url: string) {
|
||||
uni.navigateTo({ url })
|
||||
}
|
||||
|
||||
methods: {
|
||||
zhuxiao(){
|
||||
|
||||
uni.showModal({
|
||||
title: "警告",
|
||||
content: "您确定要注销当前账号吗？",
|
||||
confirmText: "确定注销",
|
||||
confirmColor: "#FF0000",
|
||||
cancelText: "取消",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showModal({
|
||||
title: "谨慎操作",
|
||||
content: "再次向您确认，您确定要注销当前账号吗？",
|
||||
confirmText: "坚持注销",
|
||||
confirmColor: "#FF0000",
|
||||
cancelText: "取消",
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showToast({
|
||||
title: "您的注销申请已经提交，待管理员审核后。会自动注销当前账号",
|
||||
duration: 10000,
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
function confirmAccountDeletion() {
|
||||
uni.showModal({
|
||||
title: '警告',
|
||||
content: '您确定要注销当前账号吗？',
|
||||
confirmText: '确定注销',
|
||||
confirmColor: '#FF0000',
|
||||
cancelText: '取消',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
uni.showModal({
|
||||
title: '谨慎操作',
|
||||
content: '再次向您确认，您确定要注销当前账号吗？',
|
||||
confirmText: '坚持注销',
|
||||
confirmColor: '#FF0000',
|
||||
cancelText: '取消',
|
||||
success: (confirmRes) => {
|
||||
if (confirmRes.confirm) {
|
||||
uni.showToast({
|
||||
title: '您的注销申请已经提交，待管理员审核后。会自动注销当前账号',
|
||||
duration: 10000,
|
||||
})
|
||||
}
|
||||
},
|
||||
})
|
||||
}
|
||||
},
|
||||
navigateTo(url) {
|
||||
uni.navigateTo({
|
||||
url: url,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@@ -7,22 +7,10 @@
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mobile: "", //存储手机号
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
navigateTo(url) {
|
||||
uni.navigateTo({
|
||||
url: url,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
<script setup lang="ts">
|
||||
function navigateTo(url: string) {
|
||||
uni.navigateTo({ url })
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
Reference in New Issue
Block a user