chore: 全站改为免费+联盟模式,原支付保留备用
- 课程详情页下架付费购买与扫码支付弹窗 - 首页/能力导览文案 购买→免费使用 - 付费面(会员/技能广场/用量包/课程)均已免费化,原 orders/payment 模块保留后端备用
This commit is contained in:
@@ -5,7 +5,7 @@ import { useParams } from 'next/navigation';
|
||||
import Link from 'next/link';
|
||||
import { Skeleton } from '@/components/ui/skeleton';
|
||||
import { API_BASE } from '@/lib/config';
|
||||
import { BookOpen, AlertTriangle, Menu, ChevronLeft, X } from 'lucide-react';
|
||||
import { BookOpen, AlertTriangle, Menu, ChevronLeft } from 'lucide-react';
|
||||
|
||||
interface Lesson {
|
||||
id: number; title: string; content?: string; sortOrder: number; status: string;
|
||||
@@ -33,39 +33,6 @@ function LoadingSkeleton() {
|
||||
);
|
||||
}
|
||||
|
||||
function PayModal({ paying, qrCodeUrl, onClose }: { paying: boolean; qrCodeUrl: string; onClose: () => void }) {
|
||||
if (!paying) return null;
|
||||
return (
|
||||
<div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
|
||||
<div className="bg-card rounded-2xl p-8 max-w-md w-full text-center shadow-xl border border-border">
|
||||
<div className="flex items-center justify-between mb-4">
|
||||
<h3 className="text-lg font-semibold text-foreground">扫码支付</h3>
|
||||
<button onClick={onClose} className="p-1 rounded-lg hover:bg-muted">
|
||||
<X className="w-5 h-5 text-muted-foreground" />
|
||||
</button>
|
||||
</div>
|
||||
{qrCodeUrl ? (
|
||||
<>
|
||||
<div className="bg-muted/50 rounded-xl p-6 mb-4 inline-block">
|
||||
<img
|
||||
src={`https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=${encodeURIComponent(qrCodeUrl)}`}
|
||||
alt="支付二维码"
|
||||
className="rounded-lg"
|
||||
/>
|
||||
</div>
|
||||
<p className="text-sm text-muted-foreground mb-4">请使用微信扫描二维码完成支付</p>
|
||||
</>
|
||||
) : (
|
||||
<div className="py-12">
|
||||
<div className="w-10 h-10 border-2 border-brand-600 border-t-transparent rounded-full animate-spin mx-auto mb-4" />
|
||||
<p className="text-sm text-muted-foreground">正在生成支付二维码...</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function CourseDetailClient() {
|
||||
const params = useParams();
|
||||
const [course, setCourse] = useState<Course | null>(null);
|
||||
@@ -73,8 +40,6 @@ export default function CourseDetailClient() {
|
||||
const [error, setError] = useState('');
|
||||
const [activeLesson, setActiveLesson] = useState<Lesson | null>(null);
|
||||
const [sidebarOpen, setSidebarOpen] = useState(true);
|
||||
const [paying, setPaying] = useState(false);
|
||||
const [qrCodeUrl, setQrCodeUrl] = useState('');
|
||||
|
||||
useEffect(() => {
|
||||
if (!params.id) return;
|
||||
@@ -107,11 +72,6 @@ export default function CourseDetailClient() {
|
||||
|
||||
return (
|
||||
<>
|
||||
<PayModal
|
||||
paying={paying}
|
||||
qrCodeUrl={qrCodeUrl}
|
||||
onClose={() => { setPaying(false); setQrCodeUrl(''); }}
|
||||
/>
|
||||
|
||||
<div className="flex h-[calc(100vh-4rem)] max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
{/* Sidebar */}
|
||||
@@ -185,41 +145,9 @@ export default function CourseDetailClient() {
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-2 text-xs text-muted-foreground shrink-0">
|
||||
{course.isFree ? (
|
||||
<span className="bg-green-100 dark:bg-green-950/30 text-green-700 dark:text-green-400 px-2 py-0.5 rounded font-medium">
|
||||
免费
|
||||
</span>
|
||||
) : (
|
||||
<>
|
||||
<span className="bg-brand-100 dark:bg-brand-950/30 text-brand-700 dark:text-brand-400 px-2 py-0.5 rounded font-medium">
|
||||
¥{course.price}
|
||||
</span>
|
||||
<button
|
||||
onClick={async () => {
|
||||
setPaying(true);
|
||||
try {
|
||||
const res = await fetch(`${API_BASE}/payment/wxpay/unified-order`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
description: course.title,
|
||||
outTradeNo: `COURSE_${course.id}_${Date.now()}`,
|
||||
amount: course.price,
|
||||
tradeType: 'NATIVE',
|
||||
}),
|
||||
});
|
||||
const data = await res.json();
|
||||
if (data.codeUrl) {
|
||||
setQrCodeUrl(data.codeUrl);
|
||||
}
|
||||
} catch {}
|
||||
}}
|
||||
className="px-3 py-1 bg-brand-600 text-white text-xs rounded-lg hover:bg-brand-700 transition-colors font-medium"
|
||||
>
|
||||
立即购买
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
<span className="bg-green-100 dark:bg-green-950/30 text-green-700 dark:text-green-400 px-2 py-0.5 rounded font-medium">
|
||||
免费
|
||||
</span>
|
||||
{course.category && (
|
||||
<span className="bg-muted px-2 py-0.5 rounded">{course.category.name}</span>
|
||||
)}
|
||||
|
||||
@@ -234,7 +234,7 @@ export default function HomePage() {
|
||||
{ icon: BarChart3, title: '数据分析', desc: '分析数据、生成图表、洞察趋势,让数据说话', href: '/sandbox', cta: '打开沙盒' },
|
||||
{ icon: FileText, title: '提示词工程', desc: '学习编写高效提示词,掌握与 AI 沟通的最佳实践', href: '/prompts', cta: '浏览提示词库' },
|
||||
{ icon: GraduationCap, title: '技能实战', desc: '在真实场景中练习 AI 技能,获得即时评分反馈', href: '/practices', cta: '开始练习' },
|
||||
{ icon: Puzzle, title: '工作流技能', desc: '购买即用的 AI 工作流技能,解决具体业务问题', href: '/marketplace', cta: '前往技能广场' },
|
||||
{ icon: Puzzle, title: '工作流技能', desc: '免费使用的 AI 工作流技能,解决具体业务问题', href: '/marketplace', cta: '前往技能广场' },
|
||||
].map((item) => {
|
||||
const Icon = item.icon;
|
||||
return (
|
||||
|
||||
Reference in New Issue
Block a user