update pay

This commit is contained in:
Zixin Zhou 2025-08-27 23:56:27 +08:00
parent 6022c6ec25
commit d734179302
5 changed files with 29 additions and 32 deletions

View File

@ -58,7 +58,8 @@ export default function DashboardPage() {
// 获取支付详情
const fetchPaymentDetails = async (sessionId: string) => {
try {
const response = await fetch(`/api/payment/checkout-status/${sessionId}?user_id=test_user_123`);
const User = JSON.parse(localStorage.getItem("currentUser") || "{}");
const response = await fetch(`/api/payment/checkout-status/${sessionId}?user_id=${User.id}`);
const result = await response.json();
if (result.successful && result.data) {

View File

@ -42,7 +42,8 @@ export default function PaymentSuccessPage() {
try {
// 使用新的Checkout Session状态查询
const { getCheckoutSessionStatus } = await import('@/lib/stripe');
const result = await getCheckoutSessionStatus(sessionId, 'test_user_123'); // 临时测试用户ID
const User = JSON.parse(localStorage.getItem("currentUser") || "{}");
const result = await getCheckoutSessionStatus(sessionId, User.id);
if (result.successful && result.data) {
setPaymentData(result.data);

View File

@ -9,7 +9,7 @@ import { fetchSubscriptionPlans, SubscriptionPlan } from '@/lib/stripe';
export default function PricingPage() {
const router = useRouter();
const [billingCycle, setBillingCycle] = useState<'monthly' | 'yearly'>('monthly');
const [billingCycle, setBillingCycle] = useState<'month' | 'year'>('month');
const [plans, setPlans] = useState<SubscriptionPlan[]>([]);
// 从后端获取订阅计划数据
@ -28,15 +28,15 @@ export default function PricingPage() {
// 转换后端数据为前端显示格式,保持原有的数据结构
const transformPlanForDisplay = (plan: SubscriptionPlan) => {
const monthlyPrice = plan.price_monthly / 100; // 后端存储的是分,转换为元
const yearlyPrice = plan.price_yearly / 100;
const monthlyPrice = plan.price_month / 100; // 后端存储的是分,转换为元
const yearlyPrice = plan.price_year / 100;
return {
name: plan.name,
displayName: plan.display_name,
price: {
monthly: monthlyPrice,
yearly: yearlyPrice
month: monthlyPrice,
year: yearlyPrice
},
description: plan.description,
features: plan.features || [],
@ -103,16 +103,16 @@ export default function PricingPage() {
<div className="inline-flex items-center bg-gray-900/50 rounded-full p-1">
<button
onClick={() => setBillingCycle('yearly')}
onClick={() => setBillingCycle('year')}
className={`flex items-center justify-center px-6 py-2.5 rounded-full transition-all duration-300 ease-out font-medium text-base ${
billingCycle === 'yearly'
billingCycle === 'year'
? 'bg-gradient-to-r from-pink-500 to-purple-600 text-white'
: 'text-gray-300 hover:text-white'
}`}
>
Pay Yearly
<span className={`ml-2 text-sm ${
billingCycle === 'yearly'
billingCycle === 'year'
? 'text-white/90'
: 'text-gray-400'
}`}>
@ -120,9 +120,9 @@ export default function PricingPage() {
</span>
</button>
<button
onClick={() => setBillingCycle('monthly')}
onClick={() => setBillingCycle('month')}
className={`px-6 py-2.5 rounded-full transition-all duration-300 ease-out font-medium text-base ${
billingCycle === 'monthly'
billingCycle === 'month'
? 'bg-gradient-to-r from-pink-500 to-purple-600 text-white'
: 'text-gray-300 hover:text-white'
}`}
@ -165,16 +165,16 @@ export default function PricingPage() {
{/* Billing Toggle */}
<div className="inline-flex items-center bg-gray-900/50 rounded-full p-1">
<button
onClick={() => setBillingCycle('yearly')}
onClick={() => setBillingCycle('year')}
className={`flex items-center justify-center px-6 py-2.5 rounded-full transition-all duration-300 ease-out font-medium text-base ${
billingCycle === 'yearly'
billingCycle === 'year'
? 'bg-gradient-to-r from-pink-500 to-purple-600 text-white'
: 'text-gray-300 hover:text-white'
}`}
>
Pay Yearly
<span className={`ml-2 text-sm ${
billingCycle === 'yearly'
billingCycle === 'year'
? 'text-white/90'
: 'text-gray-400'
}`}>
@ -182,9 +182,9 @@ export default function PricingPage() {
</span>
</button>
<button
onClick={() => setBillingCycle('monthly')}
onClick={() => setBillingCycle('month')}
className={`px-6 py-2.5 rounded-full transition-all duration-300 ease-out font-medium text-base ${
billingCycle === 'monthly'
billingCycle === 'month'
? 'bg-gradient-to-r from-pink-500 to-purple-600 text-white'
: 'text-gray-300 hover:text-white'
}`}
@ -234,7 +234,7 @@ export default function PricingPage() {
<>
<span className="text-5xl">${displayPlan.price[billingCycle]}</span>
<span className="text-lg text-gray-400 font-normal">
/{billingCycle === 'monthly' ? 'month' : 'year'}
/{billingCycle === 'month' ? 'month' : 'year'}
</span>
</>
)}

View File

@ -8,19 +8,14 @@ import { VideoCarouselLayout } from '@/components/video-carousel-layout';
import { VideoGridLayout } from '@/components/video-grid-layout';
import { motion, AnimatePresence } from "framer-motion";
import { LiquidButton } from "@/components/ui/liquid-glass-button";
import {
createScriptProject,
CreateScriptProjectRequest
} from '@/api/script_project';
import {
ProjectTypeEnum,
ModeEnum,
ResolutionEnum
} from '@/app/model/enums';
import {
getResourcesList,
Resource
} from '@/api/resources';
import {
getCheckoutSessionStatus,
PaymentStatusResponse
} from "@/lib/stripe";
export function HomePage2() {
const router = useRouter();
@ -85,8 +80,8 @@ export function HomePage2() {
// 获取支付详情
const fetchPaymentDetails = async (sessionId: string) => {
try {
const response = await fetch(`/api/payment/checkout-status/${sessionId}?user_id=test_user_123`);
const result = await response.json();
const User = JSON.parse(localStorage.getItem("currentUser") || "{}");
const result: PaymentStatusResponse = await getCheckoutSessionStatus(sessionId, User.id);
if (result.successful && result.data) {
setPaymentData(result.data);

View File

@ -9,8 +9,8 @@ export interface SubscriptionPlan {
name: string;
display_name: string;
description: string;
price_monthly: number;
price_yearly: number;
price_month: number;
price_year: number;
features: string[];
is_free: boolean;
is_popular: boolean;
@ -34,7 +34,7 @@ export type PaymentStatusResponse = ApiResponse<PaymentStatusData>;
export interface CreateCheckoutSessionRequest {
user_id: string;
plan_name: string;
billing_cycle: 'monthly' | 'yearly';
billing_cycle: 'month' | 'year';
}
export interface CreateCheckoutSessionData {