liqupan/webUI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首次

Browse Source
This commit is contained in:
Tivibra
2025-09-27 16:28:38 +08:00
parent 86cfcc5af1
commit 4b8498203d
21 changed files with 3997 additions and 343 deletions
Download Patch File Download Diff File Expand all files Collapse all files

374
src/pages/mine/mine.vue
View File

@@ -51,8 +51,12 @@
</view>
<!-- 退出登录按钮，仅登录后显示 -->
<view class="logout-section" v-if="isLoggedIn">
<view class="logout-section">
<button class="logout-btn" @click="handleLogout">退出登录</button>
<button class="logout-btn" style="margin-top: 20rpx; background-color: #ff9800; color: white;" @click="testDirectApiCall">直接测试API</button>
<text style="display: block; margin-top: 20rpx; text-align: center; color: #999;">
登录状态: {{ isLoggedIn ? '已登录' : '未登录' }}
</text>
</view>
<!-- 用户须知弹窗 -->
@@ -81,15 +85,7 @@ const avatarUrl = ref('/static/default-avatar.png');
// 登录按钮文本
const loginButtonText = computed(() => {
// #ifdef MP-WEIXIN
return '微信一键登录';
// #endif
// #ifdef H5
return '立即登录';
// #endif
return '一键登录';
});
// 初始化函数
@@ -104,9 +100,22 @@ const initUserInfo = () => {
avatarUrl.value = parsedInfo.avatarUrl || '/static/default-avatar.png';
openid.value = parsedInfo.openid || '';
isLoggedIn.value = !!parsedInfo.token;
// 调试信息
uni.showToast({
title: `登录状态: ${isLoggedIn.value ? '已登录' : '未登录'}`,
icon: 'none',
duration: 2000
});
} catch (e) {
console.error('Parse user info error:', e);
}
} else {
uni.showToast({
title: '没有找到用户信息',
icon: 'none',
duration: 2000
});
}
} catch (e) {
console.error('Load user info error:', e);
@@ -115,102 +124,133 @@ const initUserInfo = () => {
// 页面加载时初始化
onMounted(() => {
// 初始化用户信息
// 初始化用户store
userStore.init();
// 初始化本地状态
initUserInfo();
});
// 登录处理
const handleLogin = () => {
// H5环境
// #ifdef H5
nickName.value = 'H5测试用户';
avatarUrl.value = '/static/default-avatar.png';
openid.value = 'h5-mock-openid';
isLoggedIn.value = true;
// 保存到本地
const userInfo = {
token: 'h5-mock-token',
nickName: nickName.value,
avatarUrl: avatarUrl.value,
openid: openid.value
};
const handleLogin = async () => {
try {
uni.setStorageSync('userInfo', JSON.stringify(userInfo));
} catch (e) {
console.error('Save user info error:', e);
}
uni.showToast({
title: '登录成功',
icon: 'success'
});
return;
// #endif
// 微信环境
// #ifdef MP-WEIXIN
uni.getUserProfile({
desc: '用于完善用户资料',
success: (res) => {
const userInfo = res.userInfo;
nickName.value = userInfo.nickName;
avatarUrl.value = userInfo.avatarUrl;
openid.value = 'wx-' + Date.now();
isLoggedIn.value = true;
// 保存到本地
const storeInfo = {
token: 'wx-mock-token',
nickName: nickName.value,
avatarUrl: avatarUrl.value,
openid: openid.value
};
try {
uni.setStorageSync('userInfo', JSON.stringify(storeInfo));
} catch (e) {
console.error('Save user info error:', e);
}
uni.showToast({
title: '登录成功',
icon: 'success'
});
},
fail: (err) => {
console.error('Login failed:', err);
uni.showToast({
title: '登录失败',
icon: 'none'
});
// 先清理假登录数据
console.log('开始登录，先清理假登录数据...');
userStore.clearFakeLoginData();
uni.showLoading({
title: '登录中...'
});
// 使用store中的真实登录方法
await userStore.login();
// 登录成功后更新本地状态
initUserInfo();
uni.hideLoading();
uni.showToast({
title: '登录成功',
icon: 'success'
});
} catch (error) {
uni.hideLoading();
console.error('Login failed:', error);
let errorMessage = '登录失败';
if (error.message) {
errorMessage = error.message;
} else if (typeof error === 'string') {
errorMessage = error;
}
});
// #endif
// 显示详细的错误信息
uni.showModal({
title: '登录失败',
content: `错误信息：${errorMessage}\n\n请检查：\n1. 网络连接是否正常\n2. 后端服务是否运行\n3. 微信小程序配置是否正确`,
showCancel: false
});
}
};
// 退出登录
const handleLogout = () => {
const handleLogout = async () => {
// 用弹窗显示调试信息，确保用户能看到
uni.showToast({
title: '点击了退出登录',
icon: 'none',
duration: 2000
});
uni.showModal({
title: '提示',
content: '确定要退出登录吗？',
success: (res) => {
success: async (res) => {
if (res.confirm) {
try {
uni.removeStorageSync('userInfo');
} catch (e) {
console.error('Remove user info error:', e);
}
nickName.value = '';
avatarUrl.value = '/static/default-avatar.png';
openid.value = '';
isLoggedIn.value = false;
uni.showToast({
title: '已退出登录',
icon: 'success'
title: '确认退出',
icon: 'none',
duration: 1000
});
try {
uni.showLoading({
title: '退出中...'
});
// 显示token信息
uni.showToast({
title: `Token: ${userStore.token ? '有' : '无'}`,
icon: 'none',
duration: 2000
});
console.log('mine.vue: 开始调用userStore.logout()');
console.log('mine.vue: 当前store中的token:', userStore.token);
// 使用store中的真实登出方法
await userStore.logout();
uni.showToast({
title: 'logout执行完成',
icon: 'none',
duration: 1000
});
// 清空本地状态
nickName.value = '';
avatarUrl.value = '/static/default-avatar.png';
openid.value = '';
isLoggedIn.value = false;
uni.hideLoading();
uni.showToast({
title: '已退出登录',
icon: 'success'
});
} catch (error) {
uni.hideLoading();
uni.showToast({
title: '登出异常: ' + error.message,
icon: 'none',
duration: 3000
});
// 即使后台退出失败，也要清空本地状态
nickName.value = '';
avatarUrl.value = '/static/default-avatar.png';
openid.value = '';
isLoggedIn.value = false;
uni.showToast({
title: '已退出登录',
icon: 'success'
});
}
} else {
uni.showToast({
title: '取消退出',
icon: 'none',
duration: 1000
});
}
}
@@ -219,25 +259,169 @@ const handleLogout = () => {
// 显示用户须知
const showAgreement = () => {
console.log('showAgreement clicked, current showAgreementModal:', showAgreementModal.value);
showAgreementModal.value = true;
console.log('showAgreementModal set to:', showAgreementModal.value);
};
// 处理同意用户须知
const handleAgreeTerms = () => {
showAgreementModal.value = false;
const handleAgreeTerms = async () => {
console.log('mine.vue: handleAgreeTerms called');
try {
// 先关闭弹窗
showAgreementModal.value = false;
// 等待DOM更新
await uni.$nextTick?.() || Promise.resolve();
// 设置本地存储
uni.setStorageSync('hasAgreedToTerms', 'true');
uni.setStorageSync('hasVisitedMinePage', 'true');
// 显示成功提示
uni.showToast({
title: '已确认用户须知',
icon: 'success',
duration: 2000
});
} catch (e) {
console.error('Save agreement status error:', e);
uni.showToast({
title: '操作失败，请重试',
icon: 'none',
duration: 2000
});
// 如果失败，重新显示弹窗
showAgreementModal.value = true;
}
};
// 处理不同意用户须知
const handleDisagreeTerms = () => {
showAgreementModal.value = false;
const handleDisagreeTerms = async () => {
console.log('mine.vue: handleDisagreeTerms called');
try {
// 先关闭弹窗
showAgreementModal.value = false;
// 等待DOM更新
await uni.$nextTick?.() || Promise.resolve();
// 显示提示
uni.showToast({
title: '您可随时查看用户须知',
icon: 'none',
duration: 2000
});
} catch (e) {
console.error('Handle disagree error:', e);
showAgreementModal.value = false;
}
};
// 直接测试API
const testDirectApiCall = () => {
// 从store获取token
const currentToken = userStore.token;
uni.showModal({
title: '选择测试方法',
content: '请选择要测试的API调用方式',
cancelText: '普通方法',
confirmText: '请求体方法',
success: (res1) => {
if (res1.confirm) {
// 尝试在请求体中发送token
uni.showModal({
title: '请求体方法',
content: '在请求体中发送token',
showCancel: false,
success: () => {
uni.request({
url: 'http://8.145.52.111:8084/app/logout',
method: 'POST',
header: {
'Content-Type': 'application/json'
},
data: {
token: currentToken || ''
},
complete: (res) => {
uni.showModal({
title: '调用结果(请求体)',
content: JSON.stringify(res),
showCancel: false
});
}
});
}
});
} else {
// 普通方法: 选择URL方式
uni.showModal({
title: '普通方法',
content: '选择URL方式',
cancelText: '带参数URL',
confirmText: 'Header方式',
success: (res2) => {
if (res2.confirm) {
// Header方式
uni.showModal({
title: '调用信息',
content: `
在Header中发送token
Token: ${currentToken || '无'}
`,
showCancel: false,
success: () => {
uni.request({
url: 'http://8.145.52.111:8084/app/logout',
method: 'POST',
header: {
'Content-Type': 'application/json',
'Authorization': currentToken || ''
},
complete: (res) => {
uni.showModal({
title: '调用结果(Header)',
content: JSON.stringify(res),
showCancel: false
});
}
});
}
});
} else {
// 带参数URL方式
uni.showModal({
title: '调用信息',
content: `尝试带token参数的URL`,
showCancel: false,
success: () => {
const url = `http://8.145.52.111:8084/app/logout?token=${currentToken || ''}`;
uni.request({
url: url,
method: 'POST',
header: {
'Content-Type': 'application/json'
},
complete: (res) => {
uni.showModal({
title: '调用结果(URL参数)',
content: JSON.stringify(res),
showCancel: false
});
}
});
}
});
}
}
});
}
}
});
};
</script>