's'

app/cloudphone/components/sections/CTASection.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect } from "react";
 import Link from "next/link";
 import { CTA_CONFIG } from "../../config/course";
 import { isPaid } from "../../lib/payment";
+import { triggerPay } from "@/app/lib/triggerPay";
 
 export function CTASection() {
   const [paid, setPaid] = useState(false);
@@ -34,12 +35,22 @@ export function CTASection() {
             </span>
           ))}
         </div>
-        <Link
-          href={paid ? "/cloudphone/course/0/0" : "/cloudphone/pay"}
-          className="inline-flex items-center gap-2 rounded-full bg-[var(--accent)] px-8 py-4 text-lg font-semibold text-[var(--accent-foreground)] shadow-lg shadow-[var(--accent)]/25 transition-all duration-300 hover:scale-105 hover:opacity-95 hover:shadow-xl hover:shadow-[var(--accent)]/30 sm:px-10"
-        >
-          {paid ? "开始学习 →" : "立即加入 →"}
-        </Link>
+        {paid ? (
+          <Link
+            href="/cloudphone/course/0/0"
+            className="inline-flex items-center gap-2 rounded-full bg-[var(--accent)] px-8 py-4 text-lg font-semibold text-[var(--accent-foreground)] shadow-lg shadow-[var(--accent)]/25 transition-all duration-300 hover:scale-105 hover:opacity-95 hover:shadow-xl hover:shadow-[var(--accent)]/30 sm:px-10"
+          >
+            开始学习 →
+          </Link>
+        ) : (
+          <button
+            type="button"
+            onClick={() => triggerPay()}
+            className="inline-flex items-center gap-2 rounded-full bg-[var(--accent)] px-8 py-4 text-lg font-semibold text-[var(--accent-foreground)] shadow-lg shadow-[var(--accent)]/25 transition-all duration-300 hover:scale-105 hover:opacity-95 hover:shadow-xl hover:shadow-[var(--accent)]/30 sm:px-10"
+          >
+            立即加入 →
+          </button>
+        )}
       </div>
     </section>
   );

app/cloudphone/components/sections/Hero.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect } from "react";
 import Link from "next/link";
 import { HERO_CONFIG, CURRICULUM_CONFIG } from "../../config/course";
 import { isPaid } from "../../lib/payment";
+import { triggerPay } from "@/app/lib/triggerPay";
 import { getLastWatched, getProgress } from "../../lib/learning";
 import { ParticleBackground } from "../ParticleBackground";
 
@@ -74,13 +75,21 @@ export function Hero() {
             >
               继续学习 →
             </Link>
-          ) : (
+          ) : paid ? (
             <Link
-              href={paid ? "/cloudphone/course/0/0" : "/cloudphone/pay"}
+              href="/cloudphone/course/0/0"
               className="inline-flex shrink-0 items-center gap-2 rounded-full bg-[var(--accent)] px-8 py-4 text-lg font-semibold text-[var(--accent-foreground)] transition hover:opacity-90 sm:px-10"
             >
-              {paid ? "进入课程 →" : "立即报名 →"}
+              进入课程 →
             </Link>
+          ) : (
+            <button
+              type="button"
+              onClick={() => triggerPay()}
+              className="inline-flex shrink-0 items-center gap-2 rounded-full bg-[var(--accent)] px-8 py-4 text-lg font-semibold text-[var(--accent-foreground)] transition hover:opacity-90 sm:px-10"
+            >
+              立即报名 →
+            </button>
           )}
         </div>
         {paid && progress.completed > 0 && (