sync: soul-admin 页面 | 原因: 前端页面修改

soul-admin/src/pages/find-partner/FindPartnerPage.tsx

@@ -1,4 +1,5 @@
 import { useState } from 'react'
+import { Button } from '@/components/ui/button'
 import { Users, Handshake, GraduationCap, UserPlus, BarChart3, Link2 } from 'lucide-react'
 import { FindPartnerTab } from './tabs/FindPartnerTab'
 import { ResourceDockingTab } from './tabs/ResourceDockingTab'
@@ -13,30 +14,42 @@ const TABS = [
   { id: 'resource', label: '资源对接', icon: Handshake },
   { id: 'mentor', label: '导师预约', icon: GraduationCap },
   { id: 'team', label: '团队招募', icon: UserPlus },
-  { id: 'ckb', label: '存客宝', icon: Link2 },
 ] as const
 
 type TabId = (typeof TABS)[number]['id']
 
 export function FindPartnerPage() {
   const [activeTab, setActiveTab] = useState<TabId>('stats')
+  const [showCKBPanel, setShowCKBPanel] = useState(false)
 
   return (
     <div className="p-8 w-full">
-      <div className="mb-6">
-        <h2 className="text-2xl font-bold text-white flex items-center gap-2">
-          <Users className="w-6 h-6 text-[#38bdac]" />
-          找伙伴
-        </h2>
-        <p className="text-gray-400 mt-1">
-          数据统计、匹配池与记录、资源对接、导师预约、团队招募、存客宝
-        </p>
+      <div className="mb-6 flex items-start justify-between gap-4">
+        <div>
+          <h2 className="text-2xl font-bold text-white flex items-center gap-2">
+            <Users className="w-6 h-6 text-[#38bdac]" />
+            找伙伴
+          </h2>
+          <p className="text-gray-400 mt-1">
+            数据统计、匹配池与记录、资源对接、导师预约、团队招募
+          </p>
+        </div>
+        <Button
+          type="button"
+          variant="outline"
+          onClick={() => setShowCKBPanel((v) => !v)}
+          className="border-orange-500/40 text-orange-300 hover:bg-orange-500/10 bg-transparent"
+        >
+          <Link2 className="w-4 h-4 mr-2" />
+          存客宝
+        </Button>
       </div>
 
+      {showCKBPanel && <CKBConfigPanel />}
+
       <div className="flex flex-wrap gap-1 mb-6 bg-[#0f2137] rounded-lg p-1 border border-gray-700/50">
         {TABS.map((tab) => {
           const isActive = activeTab === tab.id
-          const isCKB = tab.id === 'ckb'
           return (
             <button
               key={tab.id}
@@ -44,8 +57,8 @@ export function FindPartnerPage() {
               onClick={() => setActiveTab(tab.id)}
               className={`flex items-center gap-2 px-5 py-2.5 rounded-md text-sm font-medium transition-all ${
                 isActive
-                  ? isCKB ? 'bg-orange-500 text-white shadow-lg' : 'bg-[#38bdac] text-white shadow-lg'
-                  : isCKB ? 'text-orange-400/70 hover:text-orange-400 hover:bg-orange-500/10' : 'text-gray-400 hover:text-white hover:bg-gray-700/50'
+                  ? 'bg-[#38bdac] text-white shadow-lg'
+                  : 'text-gray-400 hover:text-white hover:bg-gray-700/50'
               }`}
             >
               <tab.icon className="w-4 h-4" />
@@ -60,7 +73,6 @@ export function FindPartnerPage() {
       {activeTab === 'resource' && <ResourceDockingTab />}
       {activeTab === 'mentor' && <MentorTab />}
       {activeTab === 'team' && <TeamRecruitTab />}
-      {activeTab === 'ckb' && <CKBConfigPanel />}
     </div>
   )
 }