feat(sdk详情页): 添加标签页过滤器和返回按钮

- 在SDK详情页添加TabFilter组件，支持多标签页切换
- 为TabFilter组件添加actions插槽，支持右侧操作按钮
- 添加返回按钮并调整TabFilter组件样式布局

src/components/TabFilter/index.vue

@@ -31,9 +31,14 @@ function handleClick(value: string | number) {
 
 <template>
   <div class="tab-filter">
-    <div v-for="option in options" :key="option.value" class="tab-item"
-      :class="{ active: activeValue === option.value }" @click="handleClick(option.value)">
-      {{ option.label }}
+    <div class="tab-filter-left">
+      <div v-for="option in options" :key="option.value" class="tab-item"
+        :class="{ active: activeValue === option.value }" @click="handleClick(option.value)">
+        {{ option.label }}
+      </div>
+    </div>
+    <div class="tab-filter-right">
+      <slot name="actions"></slot>
     </div>
   </div>
 </template>
@@ -42,12 +47,24 @@ function handleClick(value: string | number) {
 .tab-filter {
   display: flex;
   align-items: center;
-  gap: 8px;
-  padding: 22px 4px;
+  padding: 10px;
   background: var(--admin-card-bg);
   border-radius: 8px;
 }
 
+.tab-filter-left {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.tab-filter-right {
+  margin-left: auto;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
 .tab-item {
   position: relative;
   padding: 8px 16px;

src/views/sdk/detail.vue

@@ -1,7 +1,29 @@
 <template>
 	<Breadcrumb />
-	
+	<TabFilter v-model="activeTab" :options="options" @change="handleTabChange">
+		<template #actions>
+			<el-button :icon="ArrowLeft" type="primary" class="is-gradient">返回</el-button>
+		</template>
+	</TabFilter>
+
 </template>
 <script setup lang="ts">
+import { ArrowLeft } from '@element-plus/icons-vue'
+const activeTab = ref('all')
+const options = [
+	{ label: 'SDK详情', value: 'all' },
+	{ label: '转发规则', value: 'normal' },
+	{ label: '连接清单', value: 'expiring' },
+	{ label: '用量分析', value: 'disabled' },
+	{ label: '限制多开', value: 'disabled' },
+	{ label: '风险IP段', value: 'disabled' },
+	{ label: '封禁IP段', value: 'disabled' },
+	{ label: '生成SDK', value: 'disabled' },
+]
+
+function handleTabChange(value: string | number) {
+	console.log('切换到:', value)
+}
+
 </script>
 <style lang="scss" scoped></style>