73 lines
1.4 KiB
Vue
73 lines
1.4 KiB
Vue
|
<template>
|
||
|
|
<view class="container">
|
||
|
|
<uni-section title="基本信息" type="line">
|
||
|
|
<uni-list>
|
||
|
|
<uni-list-item title="账号名称" :rightText="userInfo.username" />
|
||
|
|
<uni-list-item
|
||
|
|
title="手机号"
|
||
|
|
:rightText="maskPhoneNumber(userInfo.phone)"
|
||
|
|
/>
|
||
|
|
</uni-list>
|
||
|
|
</uni-section>
|
||
|
|
|
||
|
|
<view class="footer-bar">
|
||
|
|
<button type="warn" @click="handleLogout">退出登录</button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import { ref } from "vue";
|
||
|
|
import { onLoad } from "@dcloudio/uni-app";
|
||
|
|
import { maskPhoneNumber } from "@/utils/tools.js";
|
||
|
|
|
||
|
|
const userInfo = ref({
|
||
|
|
username: "",
|
||
|
|
phone: "",
|
||
|
|
});
|
||
|
|
|
||
|
|
// 退出登录
|
||
|
|
const handleLogout = () => {
|
||
|
|
uni.showModal({
|
||
|
|
title: "确认退出",
|
||
|
|
content: "是否确认退出并清除缓存？",
|
||
|
|
success: function (res) {
|
||
|
|
if (res.confirm) {
|
||
|
|
uni.clearStorage();
|
||
|
|
uni.reLaunch({
|
||
|
|
url: "/pages/login/login",
|
||
|
|
});
|
||
|
|
} else if (res.cancel) {
|
||
|
|
}
|
||
|
|
},
|
||
|
|
});
|
||
|
|
};
|
||
|
|
|
||
|
|
function getCacheInfo() {
|
||
|
|
try {
|
||
|
|
const user = uni.getStorageSync("userInfo");
|
||
|
|
if (user) {
|
||
|
|
userInfo.value = user;
|
||
|
|
} else {
|
||
|
|
console.warn("未找到用户信息缓存");
|
||
|
|
}
|
||
|
|
} catch (e) {
|
||
|
|
console.error("获取缓存信息失败:", e);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
onLoad(() => {
|
||
|
|
getCacheInfo();
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.footer-bar {
|
||
|
|
position: fixed;
|
||
|
|
bottom: 50px;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
padding: 0 20px;
|
||
|
|
}
|
||
|
|
</style>
|