'界面功能优化'

app/topic/components/TopicCurriculum.tsx

@@ -87,7 +87,7 @@ export function TopicCurriculum({ topicId }: TopicCurriculumProps) {
                   <ul className="border-t border-[var(--border)]">
                     {module.lessons.map((lesson, li) => {
                       const origMod = module.originalModuleIndex;
-                      const free = origMod === 0 && li < 2;
+                      const free = false; /* 暂时全部加锁 */
                       const unlocked = canWatchLesson(origMod, li);
                       const key = `${origMod}-${li}`;
                       const bookmarked = isBookmarked(origMod, li);

app/topic/components/TopicFooter.tsx

@@ -4,6 +4,7 @@ import { useState, useEffect } from "react";
 import Link from "next/link";
 import { getTopicConfig } from "../config";
 import { isPaid } from "@/app/cloudphone/lib/payment";
+import { InstantQaVipModal } from "@/app/components/InstantQaVipModal";
 
 type TopicFooterProps = {
   topicId: string;
@@ -14,6 +15,7 @@ const CHAT_URL = "https://chatwoot.hackrobot.cn/livechat?user_id=hackrobot";
 export function TopicFooter({ topicId }: TopicFooterProps) {
   const config = getTopicConfig(topicId);
   const [paid, setPaid] = useState(false);
+  const [modalOpen, setModalOpen] = useState(false);
 
   useEffect(() => {
     setPaid(isPaid());
@@ -48,22 +50,23 @@ export function TopicFooter({ topicId }: TopicFooterProps) {
               即时问答
             </a>
           ) : (
-            <Link
-              href="/"
+            <button
+              type="button"
+              onClick={() => setModalOpen(true)}
               className="inline-flex items-center gap-1.5 rounded-full bg-[var(--accent)]/15 px-4 py-2 text-sm font-medium text-[var(--accent)] transition hover:bg-[var(--accent)]/25"
-              title="开通VIP解锁即时问答"
             >
               <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
                 <path d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
               </svg>
               即时问答
-            </Link>
+            </button>
           )}
         </div>
         <div className="text-center text-sm text-[var(--muted-foreground)]">
           {config ? `${config.icon} ${config.title} · 异度星球` : "异度星球 · 数字游民社群"}
         </div>
       </div>
+      <InstantQaVipModal open={modalOpen} onClose={() => setModalOpen(false)} />
     </footer>
   );
 }

app/topic/components/TopicHeader.tsx

@@ -6,6 +6,7 @@ import { ThemeToggle } from "@/app/components/ThemeToggle";
 import { getTopicConfig } from "../config";
 import { isPaid } from "@/app/cloudphone/lib/payment";
 import { triggerPay } from "@/app/lib/triggerPay";
+import { InstantQaVipModal } from "@/app/components/InstantQaVipModal";
 
 type TopicHeaderProps = {
   topicId: string;
@@ -13,6 +14,7 @@ type TopicHeaderProps = {
 
 export function TopicHeader({ topicId }: TopicHeaderProps) {
   const [paid, setPaid] = useState(false);
+  const [qaModalOpen, setQaModalOpen] = useState(false);
   const config = getTopicConfig(topicId);
 
   useEffect(() => {
@@ -25,6 +27,7 @@ export function TopicHeader({ topicId }: TopicHeaderProps) {
   const isEnrollCta = !config?.externalUrl && !paid;
 
   return (
+    <>
     <header
       className="fixed left-0 right-0 top-0 z-50 border-b border-[var(--border)] bg-[var(--background)]/95 backdrop-blur-xl"
       style={{ animationFillMode: "both" }}
@@ -57,16 +60,16 @@ export function TopicHeader({ topicId }: TopicHeaderProps) {
               即时问答
             </a>
           ) : (
-            <Link
-              href="/"
+            <button
+              type="button"
+              onClick={() => setQaModalOpen(true)}
               className="hidden items-center gap-1.5 rounded-full border border-[var(--accent)]/40 bg-[var(--accent)]/10 px-3 py-1.5 text-xs font-medium text-[var(--accent)] transition hover:bg-[var(--accent)]/20 sm:inline-flex sm:px-4 sm:py-2 sm:text-sm"
-              title="开通VIP解锁即时问答"
             >
               <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
                 <path d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
               </svg>
               即时问答
-            </Link>
+            </button>
           )}
           {config?.externalUrl ? (
             <Link
@@ -96,5 +99,7 @@ export function TopicHeader({ topicId }: TopicHeaderProps) {
         </nav>
       </div>
     </header>
+    <InstantQaVipModal open={qaModalOpen} onClose={() => setQaModalOpen(false)} />
+    </>
   );
 }