更新支付传参&首页接口&菜单栏导航后tab切换

src/components/composites/purchase/index.tsx

@@ -1,4 +1,5 @@
-import {ReactNode} from 'react'
+'use client'
+import {ReactNode, useEffect, useState} from 'react'
 import {merge} from '@/lib/utils'
 import {Tabs, TabsContent, TabsList, TabsTrigger} from '@/components/ui/tabs'
 import LongForm from '@/components/composites/purchase/long/form'
@@ -10,10 +11,16 @@ type PurchaseProps = {
   defaultType: TabType
 }
 
-export default async function Purchase(props: PurchaseProps) {
+export default function Purchase(props: PurchaseProps) {
+  const [currentTab, setCurrentTab] = useState<string>(props.defaultType)
+
+  useEffect(() => {
+    setCurrentTab(props.defaultType)
+  }, [props.defaultType])
+
   return (
     <div className="flex flex-col gap-4">
-      <Tabs defaultValue={props.defaultType} className="gap-4">
+      <Tabs value={currentTab} onValueChange={setCurrentTab} className="gap-4">
         <TabsList className="w-full p-2 bg-white rounded-lg justify-start md:justify-center overflow-auto">
           <Tab value="short">短效动态</Tab>
           <Tab value="long">长效静态</Tab>