完善 ip 提取功能，优化更新主题样式

src/components/composites/purchase/index.tsx

@@ -0,0 +1,27 @@
+import PurchaseForm from '@/components/composites/purchase/_client/form'
+
+export type PurchaseProps = {}
+
+export default async function Purchase(props: PurchaseProps) {
+
+  return (
+    <div className="flex flex-col gap-4">
+      <ul role={`tablist`} className={`flex justify-center items-stretch bg-white rounded-lg`}>
+        <li role={`tab`}>
+          <button className={`h-14 px-8 text-lg`}>短效动态套餐</button>
+        </li>
+        <li role={`tab`}>
+          <button className={`h-14 px-8 text-lg`}>长效静态套餐</button>
+        </li>
+        <li role={`tab`}>
+          <button className={`h-14 px-8 text-lg`}>固定套餐</button>
+        </li>
+        <li role={`tab`}>
+          <button className={`h-14 px-8 text-lg`}>定制套餐</button>
+        </li>
+      </ul>
+      <PurchaseForm/>
+    </div>
+  )
+}
+