333 lines
8.2 KiB
Vue
333 lines
8.2 KiB
Vue
<template>
|
||
<view class="page_container">
|
||
<view class="self_info_row"></view>
|
||
|
||
<view class="info_card">
|
||
<my-avatar :src="selfInfo.faceURL || '/static/images/default_avatar.png'" :desc="selfInfo.nickname" size="46" />
|
||
|
||
<view class="id_row">
|
||
<text class="nickname">{{ selfInfo.nickname }}</text>
|
||
<view class="id_row_copy" @click="copy">
|
||
<text class="id">{{ selfInfo.userID }}</text>
|
||
<image style="width: 32rpx; height: 32rpx" src="@/static/images/id_copy.png" mode="" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="qr" @click="toSelfQr">
|
||
<img src="static/images/self_info_qr.png" alt="" />
|
||
<img src="static/images/common_right.png" alt="" />
|
||
</view>
|
||
</view>
|
||
|
||
<view class="action_box">
|
||
<view @click="profileMenuClick(item)" class="profile_menu_item" v-for="item in profileMenus" :key="item.idx">
|
||
<view class="menu_left">
|
||
<image style="width: 48rpx; height: 48rpx" :src="item.icon" mode="" />
|
||
<text>{{ item.title }}</text>
|
||
</view>
|
||
<u-icon name="arrow-right" size="16" color="#999"></u-icon>
|
||
</view>
|
||
</view>
|
||
|
||
<u-toast ref="uToast"></u-toast>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import IMSDK from "openim-uniapp-polyfill";
|
||
import MyAvatar from "@/components/MyAvatar/index.vue";
|
||
export default {
|
||
components: {
|
||
MyAvatar,
|
||
},
|
||
data() {
|
||
return {
|
||
profileMenus: [
|
||
{
|
||
idx: 0,
|
||
title: "我的信息",
|
||
icon: require("static/images/profile_menu_info.png"),
|
||
},
|
||
{
|
||
idx: 2,
|
||
title: "账号设置",
|
||
icon: require("static/images/profile_menu_account.png"),
|
||
},
|
||
{
|
||
idx: 3,
|
||
title: "关于我们",
|
||
icon: require("static/images/profile_menu_about.png"),
|
||
},
|
||
{
|
||
idx: 4,
|
||
title: "应用更新",
|
||
icon: require("static/images/profile_menu_about.png"),
|
||
},
|
||
{
|
||
idx: 5,
|
||
title: '测试推送',
|
||
icon: require("static/images/profile_menu_about.png")
|
||
},
|
||
{
|
||
idx: 6,
|
||
title: "清除缓存",
|
||
icon: require("static/images/profile_menu_account.png"),
|
||
},
|
||
{
|
||
idx: 7,
|
||
title: "退出登录",
|
||
icon: require("static/images/profile_menu_logout.png"),
|
||
},
|
||
],
|
||
};
|
||
},
|
||
computed: {
|
||
selfInfo() {
|
||
const info = this.$store.getters.storeSelfInfo;
|
||
console.log('头像URL:', info.faceURL); // 添加这行调试
|
||
return info;
|
||
},
|
||
},
|
||
methods: {
|
||
copy() {
|
||
uni.setClipboardData({
|
||
showToast: false,
|
||
data: this.selfInfo.userID,
|
||
success: function () {
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: "复制成功",
|
||
});
|
||
},
|
||
});
|
||
},
|
||
logoutConfirm() {
|
||
IMSDK.asyncApi(IMSDK.IMMethods.Logout, IMSDK.uuid())
|
||
.then(() => {
|
||
uni.removeStorage({
|
||
key: "IMToken",
|
||
});
|
||
uni.removeStorage({
|
||
key: "BusinessToken",
|
||
});
|
||
uni.removeStorage({
|
||
key: 'oaToken'
|
||
})
|
||
})
|
||
.catch((err) => console.log(err))
|
||
.finally(() => {
|
||
uni.$u.route("/pages/login/index");
|
||
});
|
||
},
|
||
profileMenuClick({ idx }) {
|
||
switch (idx) {
|
||
case 0:
|
||
uni.navigateTo({
|
||
url: "/pages/profile/selfInfo/index",
|
||
});
|
||
break;
|
||
case 1:
|
||
uni.navigateTo({
|
||
url: "/pages/profile/messageNotification/index",
|
||
});
|
||
break;
|
||
case 2:
|
||
uni.navigateTo({
|
||
url: "/pages/profile/accountSetting/index",
|
||
});
|
||
break;
|
||
case 3:
|
||
uni.navigateTo({
|
||
url: "/pages/profile/about/index",
|
||
});
|
||
break;
|
||
case 4:
|
||
this.showUpdateOptions();
|
||
break;
|
||
case 5:
|
||
uni.createPushMessage({
|
||
content: '今天还没有报工哦',
|
||
title: "报工提醒",
|
||
success() {
|
||
console.log('推送成功')
|
||
},
|
||
fail() {
|
||
console.log("推送失败")
|
||
}
|
||
});
|
||
break;
|
||
case 6:
|
||
this.clearCache();
|
||
break;
|
||
case 7:
|
||
uni.showModal({
|
||
title: "提示",
|
||
content: "确定要退出当前账号吗？",
|
||
confirmText: "确认",
|
||
cancelText: "取消",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
this.logoutConfirm();
|
||
}
|
||
},
|
||
});
|
||
break;
|
||
default:
|
||
break;
|
||
}
|
||
},
|
||
toSelfQr() {
|
||
uni.navigateTo({
|
||
url: `/pages/common/userOrGroupQrCode/index`,
|
||
});
|
||
},
|
||
clearCache() {
|
||
uni.showModal({
|
||
title: "提示",
|
||
content: "确定要清除缓存吗？这将清除oaToken等缓存数据。",
|
||
confirmText: "确认",
|
||
cancelText: "取消",
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
// 清除oaToken
|
||
uni.removeStorage({
|
||
key: 'oaToken',
|
||
success: () => {
|
||
console.log('oaToken已清除');
|
||
},
|
||
fail: (err) => {
|
||
console.log('清除oaToken失败:', err);
|
||
}
|
||
});
|
||
|
||
// 可以在这里添加其他需要清除的缓存
|
||
// 例如清除其他相关的存储数据
|
||
|
||
uni.showToast({
|
||
icon: "success",
|
||
title: "缓存清除成功",
|
||
});
|
||
}
|
||
},
|
||
});
|
||
},
|
||
showUpdateOptions() {
|
||
const ignoredVersion = uni.$updateManager.getIgnoredVersion();
|
||
let content = '选择更新操作：';
|
||
if (ignoredVersion) {
|
||
content += `\n当前忽略版本：${ignoredVersion}`;
|
||
}
|
||
|
||
uni.showActionSheet({
|
||
itemList: ['检查更新', '清除忽略版本', '取消'],
|
||
success: (res) => {
|
||
switch (res.tapIndex) {
|
||
case 0:
|
||
// 检查更新（强制检查）
|
||
uni.$updateManager.checkUpdate(true);
|
||
break;
|
||
case 1:
|
||
// 清除忽略版本
|
||
uni.showModal({
|
||
title: '确认操作',
|
||
content: '确定要清除忽略的版本设置吗？清除后将重新提示所有版本更新。',
|
||
success: (modalRes) => {
|
||
if (modalRes.confirm) {
|
||
uni.$updateManager.clearIgnoredVersion();
|
||
uni.showToast({ title: '已清除忽略版本设置' });
|
||
}
|
||
}
|
||
});
|
||
break;
|
||
case 2:
|
||
// 取消
|
||
break;
|
||
}
|
||
}
|
||
});
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.page_container {
|
||
background-color: #f8f9fa;
|
||
|
||
.self_info_row {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
width: 100%;
|
||
height: 276rpx;
|
||
background-image: url("@/static/images/profile_top_bg.png");
|
||
background-repeat: round;
|
||
}
|
||
|
||
.info_card {
|
||
width: 640rpx;
|
||
height: 196rpx;
|
||
border-radius: 6px;
|
||
background: #fff;
|
||
margin: -120rpx auto 0 auto;
|
||
padding: 0 36rpx;
|
||
color: #0c1c33;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.id_row {
|
||
@include vCenterBox();
|
||
display: flex;
|
||
height: 46px;
|
||
margin-left: 16rpx;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
justify-content: space-between;
|
||
flex: 1;
|
||
font-size: 28rpx;
|
||
|
||
&_copy {
|
||
@include vCenterBox();
|
||
}
|
||
|
||
.nickname {
|
||
@include nomalEllipsis();
|
||
max-width: 400rpx;
|
||
font-weight: 500;
|
||
font-size: 34rpx;
|
||
}
|
||
|
||
.id {
|
||
color: #8e9ab0;
|
||
}
|
||
}
|
||
|
||
img {
|
||
width: 18px;
|
||
height: 18px;
|
||
}
|
||
}
|
||
|
||
.action_box {
|
||
margin: 24rpx 24rpx 0 24rpx;
|
||
background: #fff;
|
||
border-radius: 6px;
|
||
}
|
||
|
||
.profile_menu_item {
|
||
@include btwBox();
|
||
padding: 24rpx 36rpx;
|
||
|
||
.menu_left {
|
||
@include vCenterBox();
|
||
color: $uni-text-color;
|
||
|
||
image {
|
||
margin-right: 24rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|