feat: 继续重构 Community 子组件和 EventDetail 子组件
This commit is contained in:
zdl
@@ -24,6 +24,7 @@ import {
|
||||
Divider,
|
||||
} from '@chakra-ui/react';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { logger } from '../../../utils/logger';
|
||||
|
||||
// Custom components
|
||||
import Card from 'components/Card/Card.js';
|
||||
@@ -100,34 +101,35 @@ function Subscription() {
|
||||
|
||||
const fetchSubscriptionPlans = async () => {
|
||||
try {
|
||||
console.log('🔄 正在获取订阅套餐...');
|
||||
logger.debug('Subscription', '正在获取订阅套餐');
|
||||
const response = await fetch('/api/subscription/plans');
|
||||
console.log('📡 套餐API响应状态:', response.status);
|
||||
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('📦 套餐API响应数据:', data);
|
||||
|
||||
|
||||
if (data.success && Array.isArray(data.data)) {
|
||||
// 确保每个套餐都有必要的字段
|
||||
const validPlans = data.data.filter(plan =>
|
||||
plan &&
|
||||
plan.name &&
|
||||
typeof plan.monthly_price === 'number' &&
|
||||
const validPlans = data.data.filter(plan =>
|
||||
plan &&
|
||||
plan.name &&
|
||||
typeof plan.monthly_price === 'number' &&
|
||||
typeof plan.yearly_price === 'number'
|
||||
);
|
||||
console.log('✅ 有效套餐数量:', validPlans.length);
|
||||
logger.debug('Subscription', '套餐加载成功', {
|
||||
status: response.status,
|
||||
validPlansCount: validPlans.length
|
||||
});
|
||||
setSubscriptionPlans(validPlans);
|
||||
} else {
|
||||
console.warn('⚠️ 套餐数据格式异常:', data);
|
||||
logger.warn('Subscription', '套餐数据格式异常', { data });
|
||||
setSubscriptionPlans([]);
|
||||
}
|
||||
} else {
|
||||
console.error('❌ 获取套餐失败，状态码:', response.status);
|
||||
logger.error('Subscription', 'fetchSubscriptionPlans', new Error(`HTTP ${response.status}`));
|
||||
setSubscriptionPlans([]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('❌ 获取订阅套餐失败:', error);
|
||||
logger.error('Subscription', 'fetchSubscriptionPlans', error);
|
||||
setSubscriptionPlans([]);
|
||||
}
|
||||
};
|
||||
@@ -139,14 +141,18 @@ function Subscription() {
|
||||
});
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('👤 用户数据:', data);
|
||||
logger.debug('Subscription', '用户数据获取成功', { data });
|
||||
if (data.success) {
|
||||
setCurrentUser(data.user);
|
||||
console.log('✅ 用户信息已更新:', data.user);
|
||||
logger.debug('Subscription', '用户信息已更新', {
|
||||
userId: data.user?.id,
|
||||
subscriptionType: data.user?.subscription_type,
|
||||
subscriptionStatus: data.user?.subscription_status
|
||||
});
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取用户信息失败:', error);
|
||||
logger.error('Subscription', 'fetchCurrentUser', error);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -243,23 +249,28 @@ function Subscription() {
|
||||
|
||||
// 自动检查支付状态
|
||||
const startAutoPaymentCheck = (orderId) => {
|
||||
console.log('🔄 开始自动检查支付状态...');
|
||||
|
||||
logger.info('Subscription', '开始自动检查支付状态', { orderId });
|
||||
|
||||
const checkInterval = setInterval(async () => {
|
||||
try {
|
||||
const response = await fetch(`/api/payment/order/${orderId}/status`, {
|
||||
credentials: 'include'
|
||||
});
|
||||
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('📡 支付状态检查结果:', data);
|
||||
|
||||
logger.debug('Subscription', '支付状态检查结果', {
|
||||
orderId,
|
||||
paymentSuccess: data.payment_success,
|
||||
data
|
||||
});
|
||||
|
||||
if (data.success && data.payment_success) {
|
||||
// 支付成功
|
||||
clearInterval(checkInterval);
|
||||
setAutoCheckInterval(null);
|
||||
|
||||
|
||||
logger.info('Subscription', '自动检测到支付成功', { orderId });
|
||||
toast({
|
||||
title: '支付成功！',
|
||||
description: '订阅已激活，正在跳转...',
|
||||
@@ -267,7 +278,7 @@ function Subscription() {
|
||||
duration: 3000,
|
||||
isClosable: true,
|
||||
});
|
||||
|
||||
|
||||
// 延迟2秒后跳转到个人中心
|
||||
setTimeout(() => {
|
||||
onPaymentModalClose();
|
||||
@@ -276,10 +287,10 @@ function Subscription() {
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('自动检查支付状态失败:', error);
|
||||
logger.error('Subscription', 'startAutoPaymentCheck', error, { orderId });
|
||||
}
|
||||
}, 10000); // 每10秒检查一次
|
||||
|
||||
|
||||
setAutoCheckInterval(checkInterval);
|
||||
};
|
||||
|
||||
@@ -287,7 +298,7 @@ function Subscription() {
|
||||
if (autoCheckInterval) {
|
||||
clearInterval(autoCheckInterval);
|
||||
setAutoCheckInterval(null);
|
||||
console.log('⏹️ 停止自动检查支付状态');
|
||||
logger.debug('Subscription', '停止自动检查支付状态');
|
||||
}
|
||||
};
|
||||
|
||||
@@ -316,22 +327,26 @@ function Subscription() {
|
||||
// 强制更新支付状态
|
||||
const handleForceUpdatePayment = async () => {
|
||||
if (!paymentOrder) return;
|
||||
|
||||
|
||||
setForceUpdating(true);
|
||||
try {
|
||||
const response = await fetch(`/api/payment/order/${paymentOrder.id}/force-update`, {
|
||||
method: 'POST',
|
||||
credentials: 'include'
|
||||
});
|
||||
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('🔧 强制更新支付状态结果:', data);
|
||||
|
||||
logger.info('Subscription', '强制更新支付状态结果', {
|
||||
orderId: paymentOrder.id,
|
||||
paymentSuccess: data.payment_success,
|
||||
data
|
||||
});
|
||||
|
||||
if (data.success && data.payment_success) {
|
||||
// 支付成功
|
||||
stopAutoPaymentCheck();
|
||||
|
||||
|
||||
toast({
|
||||
title: '状态更新成功！',
|
||||
description: '订阅已激活，正在刷新页面...',
|
||||
@@ -339,7 +354,7 @@ function Subscription() {
|
||||
duration: 3000,
|
||||
isClosable: true,
|
||||
});
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
onPaymentModalClose();
|
||||
window.location.reload();
|
||||
@@ -357,6 +372,9 @@ function Subscription() {
|
||||
throw new Error('网络错误');
|
||||
}
|
||||
} catch (error) {
|
||||
logger.error('Subscription', 'handleForceUpdatePayment', error, {
|
||||
orderId: paymentOrder?.id
|
||||
});
|
||||
toast({
|
||||
title: '强制更新失败',
|
||||
description: error.message,
|
||||
@@ -372,24 +390,29 @@ function Subscription() {
|
||||
// 手动检查支付状态
|
||||
const handleCheckPaymentStatus = async () => {
|
||||
if (!paymentOrder) return;
|
||||
|
||||
|
||||
setCheckingPayment(true);
|
||||
try {
|
||||
const response = await fetch(`/api/payment/order/${paymentOrder.id}/status`, {
|
||||
credentials: 'include'
|
||||
});
|
||||
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
console.log('🔍 手动检查支付状态结果:', data);
|
||||
console.log('🔍 支付成功标志:', data.payment_success);
|
||||
console.log('🔍 订单数据:', data.data);
|
||||
|
||||
logger.info('Subscription', '手动检查支付状态结果', {
|
||||
orderId: paymentOrder.id,
|
||||
paymentSuccess: data.payment_success,
|
||||
data: data.data
|
||||
});
|
||||
|
||||
if (data.success) {
|
||||
if (data.payment_success) {
|
||||
// 支付成功
|
||||
stopAutoPaymentCheck();
|
||||
|
||||
|
||||
logger.info('Subscription', '手动检测到支付成功', {
|
||||
orderId: paymentOrder.id
|
||||
});
|
||||
toast({
|
||||
title: '支付成功！',
|
||||
description: '订阅已激活，正在跳转...',
|
||||
@@ -397,12 +420,12 @@ function Subscription() {
|
||||
duration: 3000,
|
||||
isClosable: true,
|
||||
});
|
||||
|
||||
|
||||
setTimeout(() => {
|
||||
onPaymentModalClose();
|
||||
window.location.reload();
|
||||
}, 2000);
|
||||
|
||||
|
||||
} else {
|
||||
// 还未支付
|
||||
toast({
|
||||
@@ -420,6 +443,9 @@ function Subscription() {
|
||||
throw new Error('网络错误');
|
||||
}
|
||||
} catch (error) {
|
||||
logger.error('Subscription', 'handleCheckPaymentStatus', error, {
|
||||
orderId: paymentOrder?.id
|
||||
});
|
||||
toast({
|
||||
title: '查询失败',
|
||||
description: error.message,
|
||||
@@ -788,8 +814,8 @@ function Subscription() {
|
||||
size='sm'
|
||||
variant='ghost'
|
||||
onClick={() => {
|
||||
console.log('🔍 当前支付订单:', paymentOrder);
|
||||
console.log('🔍 用户信息:', currentUser);
|
||||
logger.debug('Subscription', '调试信息 - 当前支付订单', { paymentOrder });
|
||||
logger.debug('Subscription', '调试信息 - 用户信息', { currentUser });
|
||||
}}
|
||||
>
|
||||
调试信息
|
||||
@@ -870,7 +896,11 @@ function Subscription() {
|
||||
</VStack>
|
||||
<Divider my={3} />
|
||||
<HStack spacing={2}>
|
||||
<Button size='sm' onClick={() => console.log('当前状态:', { currentUser, paymentOrder, autoCheckInterval })}>
|
||||
<Button size='sm' onClick={() => logger.debug('Subscription', '调试 - 当前状态', {
|
||||
currentUser,
|
||||
paymentOrder,
|
||||
autoCheckInterval: autoCheckInterval ? '运行中' : '已停止'
|
||||
})}>
|
||||
打印状态
|
||||
</Button>
|
||||
<Button size='sm' onClick={handleRefreshUserStatus}>
|
||||
|
||||
Reference in New Issue
Block a user