Menu

管理后台定价计划管理功能

定价计划是支付系统的核心,它定义了用户可以购买的产品、价格、支付方式以及权益。NEXTY.DEV 提供了完整的管理界面和 API 来管理定价计划。

定价计划数据结构

基础字段

{
  id: string;                    // UUID,自动生成
  environment: 'test' | 'live';   // 环境:测试或生产
  cardTitle: string;              // 卡片标题
  cardDescription?: string;        // 卡片描述
  provider: 'stripe' | 'creem' | 'none';  // 支付提供商
  isActive: boolean;              // 是否激活
  isHighlighted: boolean;         // 是否高亮显示
  displayOrder: number;           // 显示顺序
}

支付配置字段

Stripe 配置

{
  stripePriceId?: string;         // Stripe Price ID
  stripeProductId?: string;       // Stripe Product ID
  stripeCouponId?: string;        // Stripe 优惠券 ID
  enableManualInputCoupon: boolean; // 开启手动输入优惠券入口
}

Creem 配置

{
  creemProductId?: string;        // Creem Product ID
  creemDiscountCode?: string;      // Creem 折扣码
}

支付类型和间隔

{
  paymentType: 'one_time' | 'onetime' | 'recurring' | null; // Stripe 和 Creem 定义不同,模板保留服务商原始定义
  recurringInterval: 'month' | 'year' | 'every-month' | 'every-year' | null; // Stripe 和 Creem 定义不同,模板保留服务商原始定义
}

价格信息

{
  price?: string;                 // 实际价格(数字字符串)
  currency?: string;              // 货币代码(如 USD, CNY)
  displayPrice?: string;          // 显示价格(如 "$10")
  originalPrice?: string;          // 原价(用于显示折扣)
  priceSuffix?: string;            // 价格后缀(如 "month", "year")
}

多语言支持 (langJsonb)

langJsonb 是一个 JSONB 字段,用于存储多语言内容:

{
  "en": {
    "cardTitle": "Pro Plan",
    "cardDescription": "Best for professionals",
    "displayPrice": "$29",
    "priceSuffix": "month",
    "buttonText": "Get Started",
    "features": [
      { "description": "Feature 1", "included": true },
      { "description": "Feature 2", "included": true }
    ]
  },
  "zh": {
    "cardTitle": "专业版",
    "cardDescription": "适合专业人士",
    "displayPrice": "¥199",
    "priceSuffix": "月",
    "buttonText": "立即开始",
    "features": [
      { "description": "功能 1", "included": true },
      { "description": "功能 2", "included": true }
    ]
  }
}

权益配置 (benefitsJsonb)

benefitsJsonb 用于定义计划授予用户的权益,特别是积分:

{
  "oneTimeCredits": 100,          // 一次性积分(一次性支付)
  "monthlyCredits": 50,            // 月度积分(订阅)
  "totalMonths": 12                // 总月数(年度订阅)
}

功能列表 (features)

功能列表是一个数组,用于显示计划包含的功能:

[
  {
    "description": "Unlimited projects",
    "included": true,
    "bold": false
  },
  {
    "description": "Priority support",
    "included": true,
    "bold": true
  },
  {
    "description": "Advanced analytics",
    "included": false,
    "bold": false
  }
]

创建定价计划

通过管理界面创建

  1. 访问 /dashboard/prices(需要管理员权限)
  2. 点击"新建计划"按钮
  3. 填写计划信息:
    • 基础信息: 标题、描述、环境
    • 支付提供商: 选择 Stripe、Creem 或 None
    • 支付配置: 根据选择的提供商填写相应配置
    • 价格信息: 价格、货币、显示价格等
    • 多语言内容: 在 langJsonb 字段中填写多语言内容
    • 权益配置: 在 benefitsJsonb 中配置积分等权益
    • 功能列表: 添加计划包含的功能

通过 API 创建

使用 createPricingPlanAction 函数:

import { createPricingPlanAction } from '@/actions/prices/admin';
 
const result = await createPricingPlanAction({
  planData: {
    environment: 'live',
    cardTitle: 'Pro Plan',
    provider: 'stripe',
    stripePriceId: 'price_xxx',
    paymentType: 'recurring',
    recurringInterval: 'month',
    price: '29.00',
    currency: 'USD',
    displayPrice: '$29',
    priceSuffix: 'month',
    isActive: true,
    isHighlighted: false,
    displayOrder: 1,
    langJsonb: {
      en: {
        cardTitle: 'Pro Plan',
        cardDescription: 'Best for professionals',
        displayPrice: '$29',
        priceSuffix: 'month',
        buttonText: 'Get Started',
        features: [
          { description: 'Feature 1', included: true }
        ]
      }
    },
    benefitsJsonb: {
      monthlyCredits: 100
    },
    features: [
      { description: 'Unlimited projects', included: true }
    ]
  },
  locale: 'en'
});

更新定价计划

通过管理界面更新

  1. 访问 /dashboard/prices
  2. 点击要更新的计划
  3. 修改计划信息
  4. 保存更改

通过 API 更新

使用 updatePricingPlanAction 函数:

import { updatePricingPlanAction } from '@/actions/prices/admin';
 
const result = await updatePricingPlanAction({
  id: 'plan-id',
  planData: {
    displayPrice: '$39',  // 只更新需要修改的字段
    isHighlighted: true
  },
  locale: 'en'
});

删除定价计划

通过管理界面删除

  1. 访问 /dashboard/prices
  2. 点击要删除的计划
  3. 点击删除按钮
  4. 确认删除

通过 API 删除

使用 deletePricingPlanAction 函数:

import { deletePricingPlanAction } from '@/actions/prices/admin';
 
const result = await deletePricingPlanAction({
  id: 'plan-id',
  locale: 'en'
});

查询定价计划

管理员查询所有计划

import { getAdminPricingPlans } from '@/actions/prices/admin';
 
const result = await getAdminPricingPlans();
if (result.success) {
  const plans = result.data;  // 所有计划(包括未激活的)
}

公开查询激活的计划

import { getPublicPricingPlans } from '@/actions/prices/public';
 
const result = await getPublicPricingPlans();
if (result.success) {
  const plans = result.data;  // 只返回激活的计划
}

系统会根据当前环境(NODE_ENV)自动过滤:

  • 生产环境: 返回 environment = 'live' 的计划
  • 其他环境: 返回 environment = 'test' 的计划

根据 ID 查询单个计划

import { getPricingPlanById } from '@/actions/prices/admin';
 
const result = await getPricingPlanById('plan-id');
if (result.success) {
  const plan = result.data;
}

定价计划显示

使用 Pricing 组件(按类型分类)

Pricing.tsx 组件会根据支付类型将计划分类显示:

import Pricing from '@/components/home/Pricing';
 
export default function PricingPage() {
  return <Pricing />;
}

组件会自动:

  • 将计划按月度订阅、年度订阅、一次性支付分类
  • 使用 Tabs 组件切换显示不同类型的计划
  • 根据当前语言环境显示对应的多语言内容

使用 PricingAll 组件(显示所有计划)

PricingAll.tsx 组件会一次性显示所有激活的计划:

import PricingAll from '@/components/home/PricingAll';
 
export default function PricingPage() {
  return <PricingAll />;
}

自定义样式

你也可以修改 PricingCardDisplay 组件的样式,来满足你的需求。

多语言内容管理

语言代码

系统使用标准的语言代码(如 en, zh, ja)来标识不同语言。

多语言字段

以下字段支持多语言:

  • cardTitle
  • cardDescription
  • displayPrice
  • originalPrice
  • priceSuffix
  • buttonText
  • highlightText
  • features

多语言回退机制

如果当前语言环境的内容不存在,系统会自动回退到默认语言(通常是 en):

const localizedPlan = 
  plan.langJsonb?.[currentLocale] || 
  plan.langJsonb?.[DEFAULT_LOCALE] || 
  {};

权益配置最佳实践

一次性支付权益

{
  "oneTimeCredits": 100
}

用户购买一次性计划后,会立即获得 100 积分。

月度订阅权益

{
  "monthlyCredits": 50
}

用户订阅月度计划后:

  • 立即获得 50 积分
  • 每月续费时重置为 50 积分

年度订阅权益

{
  "monthlyCredits": 50,
  "totalMonths": 12
}

用户订阅年度计划后:

  • 立即获得 50 积分
  • 之后每月分配 50 积分
  • 共分配 12 个月

支付提供商配置

Stripe 配置步骤

  1. 在 Stripe Dashboard 创建 Product
  2. 创建 Price(选择一次性或订阅)
  3. 复制 Price ID
  4. 在定价计划中填写 stripePriceId

Creem 配置步骤

  1. 在 Creem Dashboard 创建 Product
  2. 复制 Product ID
  3. 在定价计划中填写 creemProductId

优惠券配置

Stripe 优惠券

  • 在 Stripe Dashboard 创建 Coupon
  • 在定价计划中选择创建的 Coupon,无需手动填写
  • Stripe 的定价,如果设置了默认 Coupon,则不允许手动修改优惠码,你可以通过 enableManualInputCoupon 字段开启手动输入优惠券入口

Creem 折扣码

  • 在 Creem Dashboard 创建 Discount Code
  • 填写到 creemDiscountCode 字段

常见问题

Q: 如何创建一个免费计划?

A: 设置 provider = 'none',这样计划会显示但不会触发支付流程。你可以使用 buttonLink 字段设置一个自定义链接,来引导用户到功能使用页面。

Q: 如何隐藏某个计划?

A: 设置 isActive = false,该计划将不会在公开 API 中返回,也不会在定价页面显示。

Q: 如何调整计划的显示顺序?

A: 修改 displayOrder 字段,数字越小越靠前显示。