refactor: 使用更简洁的方式进行认证

2025-08-16 14:53:28 +08:00
parent c974de593a
commit e61cf96c07
24 changed files with 2118 additions and 2089 deletions
--- a/src/components/LabCanvas/composable/diagramManager.ts
+++ b/src/components/LabCanvas/composable/diagramManager.ts
@@ -1,4 +1,4 @@
-import { ResourcePurpose } from "@/APIClient";
+import { ResourceClient, ResourcePurpose } from "@/APIClient";
 import { AuthManager } from "@/utils/AuthManager";

 // 定义 diagram.json 的类型结构
@@ -94,7 +94,7 @@ export async function loadDiagramData(examId?: string): Promise<DiagramData> {
    // 如果提供了examId，优先从API加载实验的diagram
    if (examId) {
      try {
-        const resourceClient = AuthManager.createAuthenticatedResourceClient();
+        const resourceClient = AuthManager.createClient(ResourceClient);

        // 获取diagram类型的资源列表
        const resources = await resourceClient.getResourceList(
--- a/src/components/LogicAnalyzer/LogicAnalyzerManager.ts
+++ b/src/components/LogicAnalyzer/LogicAnalyzerManager.ts
@@ -31,8 +31,16 @@ export type Channel = {

 // 全局模式选项
 const globalModes = [
-  {value: GlobalCaptureMode.AND,label: "AND",description: "所有条件都满足时触发",},
-  {value: GlobalCaptureMode.OR,label: "OR",description: "任一条件满足时触发",},
+  {
+    value: GlobalCaptureMode.AND,
+    label: "AND",
+    description: "所有条件都满足时触发",
+  },
+  {
+    value: GlobalCaptureMode.OR,
+    label: "OR",
+    description: "任一条件满足时触发",
+  },
  { value: GlobalCaptureMode.NAND, label: "NAND", description: "AND的非" },
  { value: GlobalCaptureMode.NOR, label: "NOR", description: "OR的非" },
 ];
@@ -70,14 +78,46 @@ const channelDivOptions = [
 ];

 const ClockDivOptions = [
-  { value: AnalyzerClockDiv.DIV1, label: "120MHz", description: "采样频率120MHz" },
-  { value: AnalyzerClockDiv.DIV2, label: "60MHz", description: "采样频率60MHz" },
-  { value: AnalyzerClockDiv.DIV4, label: "30MHz", description: "采样频率30MHz" },
-  { value: AnalyzerClockDiv.DIV8, label: "15MHz", description: "采样频率15MHz" },
-  { value: AnalyzerClockDiv.DIV16, label: "7.5MHz", description: "采样频率7.5MHz" },
-  { value: AnalyzerClockDiv.DIV32, label: "3.75MHz", description: "采样频率3.75MHz" },
-  { value: AnalyzerClockDiv.DIV64, label: "1.875MHz", description: "采样频率1.875MHz" },
-  { value: AnalyzerClockDiv.DIV128, label: "937.5KHz", description: "采样频率937.5KHz" },
+  {
+    value: AnalyzerClockDiv.DIV1,
+    label: "120MHz",
+    description: "采样频率120MHz",
+  },
+  {
+    value: AnalyzerClockDiv.DIV2,
+    label: "60MHz",
+    description: "采样频率60MHz",
+  },
+  {
+    value: AnalyzerClockDiv.DIV4,
+    label: "30MHz",
+    description: "采样频率30MHz",
+  },
+  {
+    value: AnalyzerClockDiv.DIV8,
+    label: "15MHz",
+    description: "采样频率15MHz",
+  },
+  {
+    value: AnalyzerClockDiv.DIV16,
+    label: "7.5MHz",
+    description: "采样频率7.5MHz",
+  },
+  {
+    value: AnalyzerClockDiv.DIV32,
+    label: "3.75MHz",
+    description: "采样频率3.75MHz",
+  },
+  {
+    value: AnalyzerClockDiv.DIV64,
+    label: "1.875MHz",
+    description: "采样频率1.875MHz",
+  },
+  {
+    value: AnalyzerClockDiv.DIV128,
+    label: "937.5KHz",
+    description: "采样频率937.5KHz",
+  },
 ];

 // 捕获深度限制常量
@@ -170,40 +210,64 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
    // 转换通道数字到枚举值
    const getChannelDivEnum = (channelCount: number): AnalyzerChannelDiv => {
      switch (channelCount) {
-        case 1: return AnalyzerChannelDiv.ONE;
-        case 2: return AnalyzerChannelDiv.TWO;
-        case 4: return AnalyzerChannelDiv.FOUR;
-        case 8: return AnalyzerChannelDiv.EIGHT;
-        case 16: return AnalyzerChannelDiv.XVI;
-        case 32: return AnalyzerChannelDiv.XXXII;
-        default: return AnalyzerChannelDiv.EIGHT;
+        case 1:
+          return AnalyzerChannelDiv.ONE;
+        case 2:
+          return AnalyzerChannelDiv.TWO;
+        case 4:
+          return AnalyzerChannelDiv.FOUR;
+        case 8:
+          return AnalyzerChannelDiv.EIGHT;
+        case 16:
+          return AnalyzerChannelDiv.XVI;
+        case 32:
+          return AnalyzerChannelDiv.XXXII;
+        default:
+          return AnalyzerChannelDiv.EIGHT;
      }
    };

    // 验证捕获深度
-    const validateCaptureLength = (value: number): { valid: boolean; message?: string } => {
+    const validateCaptureLength = (
+      value: number,
+    ): { valid: boolean; message?: string } => {
      if (!Number.isInteger(value)) {
        return { valid: false, message: "捕获深度必须是整数" };
      }
      if (value < CAPTURE_LENGTH_MIN) {
-        return { valid: false, message: `捕获深度不能小于 ${CAPTURE_LENGTH_MIN}` };
+        return {
+          valid: false,
+          message: `捕获深度不能小于 ${CAPTURE_LENGTH_MIN}`,
+        };
      }
      if (value > CAPTURE_LENGTH_MAX) {
-        return { valid: false, message: `捕获深度不能大于 ${CAPTURE_LENGTH_MAX.toLocaleString()}` };
+        return {
+          valid: false,
+          message: `捕获深度不能大于 ${CAPTURE_LENGTH_MAX.toLocaleString()}`,
+        };
      }
      return { valid: true };
    };

    // 验证预捕获深度
-    const validatePreCaptureLength = (value: number, currentCaptureLength: number): { valid: boolean; message?: string } => {
+    const validatePreCaptureLength = (
+      value: number,
+      currentCaptureLength: number,
+    ): { valid: boolean; message?: string } => {
      if (!Number.isInteger(value)) {
        return { valid: false, message: "预捕获深度必须是整数" };
      }
      if (value < PRE_CAPTURE_LENGTH_MIN) {
-        return { valid: false, message: `预捕获深度不能小于 ${PRE_CAPTURE_LENGTH_MIN}` };
+        return {
+          valid: false,
+          message: `预捕获深度不能小于 ${PRE_CAPTURE_LENGTH_MIN}`,
+        };
      }
      if (value >= currentCaptureLength) {
-        return { valid: false, message: `预捕获深度不能大于等于捕获深度 (${currentCaptureLength})` };
+        return {
+          valid: false,
+          message: `预捕获深度不能大于等于捕获深度 (${currentCaptureLength})`,
+        };
      }
      return { valid: true };
    };
@@ -241,7 +305,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
    // 设置通道组
    const setChannelDiv = (channelCount: number) => {
      // 验证通道数量是否有效
-      if (!channelDivOptions.find(option => option.value === channelCount)) {
+      if (!channelDivOptions.find((option) => option.value === channelCount)) {
        console.error(`无效的通道组设置: ${channelCount}`);
        return;
      }
@@ -257,7 +321,9 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
        channels[i].enabled = true;
      }

-      const option = channelDivOptions.find(opt => opt.value === channelCount);
+      const option = channelDivOptions.find(
+        (opt) => opt.value === channelCount,
+      );
      alert?.success(`已设置为${option?.label}`, 2000);
    };

@@ -294,7 +360,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(

    const getCaptureData = async () => {
      try {
-        const client = AuthManager.createAuthenticatedLogicAnalyzerClient();
+        const client = AuthManager.createClient(LogicAnalyzerClient);
        // 获取捕获数据，使用当前设置的捕获长度
        const base64Data = await client.getCaptureData(captureLength.value);

@@ -324,10 +390,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
          ); // 转换为微秒

          // 创建通道数据数组
-          y = Array.from(
-            { length: 1 },
-            () => new Array(sampleCount),
-          );
+          y = Array.from({ length: 1 }, () => new Array(sampleCount));

          // 解析数据：每个字节的8个位对应8个时间单位
          for (let byteIndex = 0; byteIndex < bytes.length; byteIndex++) {
@@ -348,10 +411,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
          ); // 转换为微秒

          // 创建通道数据数组
-          y = Array.from(
-            { length: 2 },
-            () => new Array(sampleCount),
-          );
+          y = Array.from({ length: 2 }, () => new Array(sampleCount));

          // 解析数据：每个字节的8个位对应4个时间单位的2通道数据
          // 位分布：[T3_CH1, T3_CH0, T2_CH1, T2_CH0, T1_CH1, T1_CH0, T0_CH1, T0_CH0]
@@ -375,10 +435,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
          ); // 转换为微秒

          // 创建通道数据数组
-          y = Array.from(
-            { length: 4 },
-            () => new Array(sampleCount),
-          );
+          y = Array.from({ length: 4 }, () => new Array(sampleCount));

          // 解析数据：每个字节的8个位对应2个时间单位的4通道数据
          // 位分布：[T1_CH3, T1_CH2, T1_CH1, T1_CH0, T0_CH3, T0_CH2, T0_CH1, T0_CH0]
@@ -408,10 +465,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
          ); // 转换为微秒

          // 创建8个通道的数据
-          y = Array.from(
-            { length: 8 },
-            () => new Array(sampleCount),
-          );
+          y = Array.from({ length: 8 }, () => new Array(sampleCount));

          // 解析每个字节的8个位到对应通道
          for (let i = 0; i < sampleCount; i++) {
@@ -432,10 +486,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
          ); // 转换为微秒

          // 创建16个通道的数据
-          y = Array.from(
-            { length: 16 },
-            () => new Array(sampleCount),
-          );
+          y = Array.from({ length: 16 }, () => new Array(sampleCount));

          // 解析数据：每2个字节为一个时间单位
          for (let timeIndex = 0; timeIndex < sampleCount; timeIndex++) {
@@ -464,10 +515,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
          ); // 转换为微秒

          // 创建32个通道的数据
-          y = Array.from(
-            { length: 32 },
-            () => new Array(sampleCount),
-          );
+          y = Array.from({ length: 32 }, () => new Array(sampleCount));

          // 解析数据：每4个字节为一个时间单位
          for (let timeIndex = 0; timeIndex < sampleCount; timeIndex++) {
@@ -525,7 +573,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(
      isCapturing.value = true;
      const release = await operationMutex.acquire();
      try {
-        const client = AuthManager.createAuthenticatedLogicAnalyzerClient();
+        const client = AuthManager.createClient(LogicAnalyzerClient);

        // 1. 先应用配置
        alert?.info("正在应用配置...", 2000);
@@ -632,7 +680,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(

      const release = await operationMutex.acquire();
      try {
-        const client = AuthManager.createAuthenticatedLogicAnalyzerClient();
+        const client = AuthManager.createClient(LogicAnalyzerClient);

        // 执行强制捕获来停止当前捕获
        const forceSuccess = await client.setCaptureMode(false, false);
@@ -661,7 +709,7 @@ const [useProvideLogicAnalyzer, useLogicAnalyzerState] = createInjectionState(

      const release = await operationMutex.acquire();
      try {
-        const client = AuthManager.createAuthenticatedLogicAnalyzerClient();
+        const client = AuthManager.createClient(LogicAnalyzerClient);

        // 执行强制捕获来停止当前捕获
        const forceSuccess = await client.setCaptureMode(true, true);
--- a/src/components/MarkdownRenderer.vue
+++ b/src/components/MarkdownRenderer.vue
@@ -1,26 +1,27 @@
 <script setup lang="ts">
-import { computed, onMounted, ref, watch } from 'vue';
-import { marked } from 'marked';
-import hljs from 'highlight.js';
+import { computed, onMounted, ref, watch } from "vue";
+import { marked } from "marked";
+import hljs from "highlight.js";
 // 导入亮色主题样式
-import 'highlight.js/styles/github.css'; // 亮色主题
+import "highlight.js/styles/github.css"; // 亮色主题
 // 导入主题存储
-import { useThemeStore } from '@/stores/theme';
-import { AuthManager } from '@/utils/AuthManager';
+import { useThemeStore } from "@/stores/theme";
+import { AuthManager } from "@/utils/AuthManager";
+import { ResourceClient, ResourcePurpose } from "@/APIClient";

 const props = defineProps({
  content: {
    type: String,
-        required: true
+    required: true,
  },
  removeFirstH1: {
    type: Boolean,
-        default: false
+    default: false,
  },
  examId: {
    type: String,
-        default: ''
-    }
+    default: "",
+  },
 });

 // 使用主题存储
@@ -32,17 +33,26 @@ const isDarkMode = computed(() => themeStore.isDarkTheme());
 const imageResourceCache = ref<Map<string, string>>(new Map());

 // 获取图片资源ID的函数
-async function getImageResourceId(examId: string, imagePath: string): Promise<string | null> {
+async function getImageResourceId(
+  examId: string,
+  imagePath: string,
+): Promise<string | null> {
  try {
-    const client = AuthManager.createAuthenticatedResourceClient();
-    const resources = await client.getResourceList(examId, 'images', 'template');
+    const client = AuthManager.createClient(ResourceClient);
+    const resources = await client.getResourceList(
+      examId,
+      "images",
+      ResourcePurpose.Template,
+    );

    // 查找匹配的图片资源
-    const imageResource = resources.find(r => r.name === imagePath || r.name.endsWith(imagePath));
+    const imageResource = resources.find(
+      (r) => r.name === imagePath || r.name.endsWith(imagePath),
+    );

    return imageResource ? imageResource.id.toString() : null;
  } catch (error) {
-    console.error('获取图片资源ID失败:', error);
+    console.error("获取图片资源ID失败:", error);
    return null;
  }
 }
@@ -50,7 +60,7 @@ async function getImageResourceId(examId: string, imagePath: string): Promise<st
 // 通过资源ID获取图片数据URL
 async function getImageDataUrl(resourceId: string): Promise<string | null> {
  try {
-    const client = AuthManager.createAuthenticatedResourceClient();
+    const client = AuthManager.createClient(ResourceClient);
    const response = await client.getResourceById(parseInt(resourceId));

    if (response && response.data) {
@@ -59,16 +69,19 @@ async function getImageDataUrl(resourceId: string): Promise<string | null> {

    return null;
  } catch (error) {
-    console.error('获取图片数据失败:', error);
+    console.error("获取图片数据失败:", error);
    return null;
  }
 }

 // 监听主题变化
-watch(() => themeStore.currentTheme, () => {
+watch(
+  () => themeStore.currentTheme,
+  () => {
    // 主题变化时更新代码高亮样式
    updateCodeBlocksTheme();
-});
+  },
+);

 // 更新代码块主题样式
 const updateCodeBlocksTheme = () => {
@@ -78,17 +91,17 @@ const updateCodeBlocksTheme = () => {
 };

 const renderedContent = computed(() => {
-    if (!props.content) return '<p>没有内容</p>';
+  if (!props.content) return "<p>没有内容</p>";

  let processedContent = props.content;

  // 如果需要，移除第一个一级标题
  if (props.removeFirstH1) {
-        const lines = processedContent.split('\n');
-        const firstH1Index = lines.findIndex(line => line.startsWith('# '));
+    const lines = processedContent.split("\n");
+    const firstH1Index = lines.findIndex((line) => line.startsWith("# "));

    if (firstH1Index !== -1) {
-            processedContent = lines.slice(firstH1Index + 1).join('\n');
+      processedContent = lines.slice(firstH1Index + 1).join("\n");
    }
  }

@@ -102,28 +115,33 @@ const renderedContent = computed(() => {
    console.log(`原始图片路径: ${href}, examId: ${props.examId}`);

    // 如果是相对路径且有实验ID，需要通过动态API获取
-        if (props.examId && href && href.startsWith('./')) {
+    if (props.examId && href && href.startsWith("./")) {
      // 对于相对路径的图片，我们需要先获取图片资源ID，然后通过动态API获取
      // 暂时保留原始路径，在后处理中进行替换
      src = href;
      console.log(`保留原始路径用于后处理: ${src}`);
    }

-        const titleAttr = title ? ` title="${title}"` : '';
-        const altAttr = text ? ` alt="${text}"` : '';
-        const dataOriginal = href && href.startsWith('./') ? ` data-original-src="${href}"` : '';
-        console.log(`最终渲染的HTML: <img src="${src}"${titleAttr}${altAttr}${dataOriginal} />`);
+    const titleAttr = title ? ` title="${title}"` : "";
+    const altAttr = text ? ` alt="${text}"` : "";
+    const dataOriginal =
+      href && href.startsWith("./") ? ` data-original-src="${href}"` : "";
+    console.log(
+      `最终渲染的HTML: <img src="${src}"${titleAttr}${altAttr}${dataOriginal} />`,
+    );
    return `<img src="${src}"${titleAttr}${altAttr}${dataOriginal} />`;
  };

  // 重写代码块渲染方法，添加语言信息
  renderer.code = (code, incomingLanguage) => {
    // 确保语言参数是字符串
-        const language = incomingLanguage || 'plaintext';
+    const language = incomingLanguage || "plaintext";
    // 验证语言
-        const validLanguage = hljs.getLanguage(language) ? language : 'plaintext';
+    const validLanguage = hljs.getLanguage(language) ? language : "plaintext";
    // 高亮代码
-        const highlightedCode = hljs.highlight(code, { language: validLanguage }).value;
+    const highlightedCode = hljs.highlight(code, {
+      language: validLanguage,
+    }).value;

    // 添加语言标签到代码块
    return `<pre class="hljs" data-language="${validLanguage}"><code class="language-${validLanguage}">${highlightedCode}</code></pre>`;
@@ -133,23 +151,30 @@ const renderedContent = computed(() => {
  let html = marked.parse(processedContent, {
    renderer: renderer,
    gfm: true,
-        breaks: true
+    breaks: true,
  }) as string;

  // 后处理HTML，异步处理图片
  if (props.examId) {
    // 查找所有需要处理的图片
-        const imgMatches = Array.from(html.matchAll(/(<img[^>]+data-original-src=["'])\.\/([^"']+)(["'][^>]*>)/g));
+    const imgMatches = Array.from(
+      html.matchAll(
+        /(<img[^>]+data-original-src=["'])\.\/([^"']+)(["'][^>]*>)/g,
+      ),
+    );

    // 异步处理每个图片
    imgMatches.forEach(async (match) => {
      const [fullMatch, prefix, path, suffix] = match;
-            const imagePath = path.replace('images/', '');
+      const imagePath = path.replace("images/", "");

      // 检查缓存
      if (imageResourceCache.value.has(imagePath)) {
        const cachedUrl = imageResourceCache.value.get(imagePath)!;
-                html = html.replace(fullMatch, `${prefix}${cachedUrl}${suffix.replace(' data-original-src="./'+path+'"', '')}`);
+        html = html.replace(
+          fullMatch,
+          `${prefix}${cachedUrl}${suffix.replace(' data-original-src="./' + path + '"', "")}`,
+        );
        return;
      }

@@ -164,14 +189,19 @@ const renderedContent = computed(() => {
            imageResourceCache.value.set(imagePath, dataUrl);

            // 更新HTML中的图片src
-                        const updatedHtml = html.replace(fullMatch, `${prefix}${dataUrl}${suffix.replace(' data-original-src="./'+path+'"', '')}`);
+            const updatedHtml = html.replace(
+              fullMatch,
+              `${prefix}${dataUrl}${suffix.replace(' data-original-src="./' + path + '"', "")}`,
+            );

            // 触发重新渲染
            setTimeout(() => {
-                            const imgElements = document.querySelectorAll(`img[data-original-src="./${path}"]`);
-                            imgElements.forEach(img => {
+              const imgElements = document.querySelectorAll(
+                `img[data-original-src="./${path}"]`,
+              );
+              imgElements.forEach((img) => {
                (img as HTMLImageElement).src = dataUrl;
-                                img.removeAttribute('data-original-src');
+                img.removeAttribute("data-original-src");
              });
            }, 0);
          }
@@ -192,7 +222,11 @@ onMounted(() => {
 </script>

 <template>
-    <div class="markdown-content" :data-theme="themeStore.currentTheme" v-html="renderedContent"></div>
+  <div
+    class="markdown-content"
+    :data-theme="themeStore.currentTheme"
+    v-html="renderedContent"
+  ></div>
 </template>

 <style scoped>
@@ -268,7 +302,7 @@ onMounted(() => {
 .markdown-content :deep(h4::before),
 .markdown-content :deep(h5::before),
 .markdown-content :deep(h6::before) {
-  content: '▶';
+  content: "▶";
  color: hsl(var(--p) / 0.7);
  position: absolute;
  left: 0.2rem;
@@ -349,7 +383,7 @@ onMounted(() => {
 }

 .markdown-content :deep(pre::before) {
-  content: '';
+  content: "";
  position: absolute;
  top: 0;
  left: 0;
@@ -375,7 +409,9 @@ onMounted(() => {

 /* 内联代码样式 */
 .markdown-content :deep(code) {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+    "Courier New", monospace;
  background-color: var(--inline-code-bg, hsl(var(--b3) / 0.7));
  padding: 0.2rem 0.5rem;
  border-radius: 0.25rem;
@@ -392,7 +428,9 @@ onMounted(() => {
  color: inherit;
  font-size: 0.95em;
  line-height: 1.5;
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-family:
+    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
+    "Courier New", monospace;
 }

 /* 为常见语言添加一些特殊的高亮效果 */
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -145,6 +145,7 @@ import {
  ChevronDownIcon,
 } from "lucide-vue-next";
 import { AuthManager } from "@/utils/AuthManager";
+import { DataClient } from "@/APIClient";

 const router = useRouter();

@@ -158,7 +159,7 @@ const loadUserInfo = async () => {
  try {
    const authenticated = await AuthManager.isAuthenticated();
    if (authenticated) {
-      const client = AuthManager.createAuthenticatedDataClient();
+      const client = AuthManager.createClient(DataClient);
      const userInfo = await client.getUserInfo();
      userName.value = userInfo.name;
      isLoggedIn.value = true;
--- a/src/components/Oscilloscope/OscilloscopeManager.ts
+++ b/src/components/Oscilloscope/OscilloscopeManager.ts
@@ -4,6 +4,7 @@ import { Mutex } from "async-mutex";
 import {
  OscilloscopeFullConfig,
  OscilloscopeDataResponse,
+  OscilloscopeApiClient,
 } from "@/APIClient";
 import { AuthManager } from "@/utils/AuthManager";
 import { useAlertStore } from "@/components/Alert";
@@ -31,7 +32,8 @@ const DEFAULT_CONFIG: OscilloscopeFullConfig = new OscilloscopeFullConfig({
 });

 // 采样频率常量（后端返回）
-const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() => {
+const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(
+  () => {
    const oscData = shallowRef<OscilloscopeDataType>();
    const alert = useRequiredInjection(useAlertStore);

@@ -43,14 +45,18 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
    const isCapturing = ref(false);

    // 配置
-  const config = reactive<OscilloscopeFullConfig>(new OscilloscopeFullConfig({ ...DEFAULT_CONFIG }));
+    const config = reactive<OscilloscopeFullConfig>(
+      new OscilloscopeFullConfig({ ...DEFAULT_CONFIG }),
+    );

    // 采样点数（由后端数据决定）
    const sampleCount = ref(0);

    // 采样周期（ns），由adFrequency计算
    const samplePeriodNs = computed(() =>
-    oscData.value?.adFrequency ? 1_000_000_000 / oscData.value.adFrequency : 200
+      oscData.value?.adFrequency
+        ? 1_000_000_000 / oscData.value.adFrequency
+        : 200,
    );

    // 应用配置
@@ -62,7 +68,7 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
      const release = await operationMutex.acquire();
      isApplying.value = true;
      try {
-      const client = AuthManager.createAuthenticatedOscilloscopeApiClient();
+        const client = AuthManager.createClient(OscilloscopeApiClient);
        const success = await client.initialize({ ...config });
        if (success) {
          alert.success("示波器配置已应用", 2000);
@@ -85,12 +91,12 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =

    const clearOscilloscopeData = () => {
      oscData.value = undefined;
-  }
+    };

    // 获取数据
    const getOscilloscopeData = async () => {
      try {
-      const client = AuthManager.createAuthenticatedOscilloscopeApiClient();
+        const client = AuthManager.createClient(OscilloscopeApiClient);
        const resp: OscilloscopeDataResponse = await client.getData();

        // 解析波形数据
@@ -104,7 +110,7 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
        // 构建时间轴
        const x = Array.from(
          { length: bytes.length },
-        (_, i) => (i * samplePeriodNs.value) / 1000 // us
+          (_, i) => (i * samplePeriodNs.value) / 1000, // us
        );
        const y = Array.from(bytes);

@@ -154,7 +160,7 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
      isCapturing.value = true;
      const release = await operationMutex.acquire();
      try {
-      const client = AuthManager.createAuthenticatedOscilloscopeApiClient();
+        const client = AuthManager.createClient(OscilloscopeApiClient);
        const started = await client.startCapture();
        if (!started) throw new Error("无法启动捕获");
        alert.info("开始捕获...", 2000);
@@ -180,7 +186,7 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
      stopAutoRefresh();
      const release = await operationMutex.acquire();
      try {
-      const client = AuthManager.createAuthenticatedOscilloscopeApiClient();
+        const client = AuthManager.createClient(OscilloscopeApiClient);
        const stopped = await client.stopCapture();
        if (!stopped) throw new Error("无法停止捕获");
        alert.info("捕获已停止", 2000);
@@ -193,7 +199,7 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =

    // 更新触发参数
    const updateTrigger = async (level: number, risingEdge: boolean) => {
-    const client = AuthManager.createAuthenticatedOscilloscopeApiClient();
+      const client = AuthManager.createClient(OscilloscopeApiClient);
      try {
        const ok = await client.updateTrigger(level, risingEdge);
        if (ok) {
@@ -209,8 +215,11 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
    };

    // 更新采样参数
-  const updateSampling = async (horizontalShift: number, decimationRate: number) => {
-    const client = AuthManager.createAuthenticatedOscilloscopeApiClient();
+    const updateSampling = async (
+      horizontalShift: number,
+      decimationRate: number,
+    ) => {
+      const client = AuthManager.createClient(OscilloscopeApiClient);
      try {
        const ok = await client.updateSampling(horizontalShift, decimationRate);
        if (ok) {
@@ -227,7 +236,7 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =

    // 手动刷新RAM
    const refreshRAM = async () => {
-    const client = AuthManager.createAuthenticatedOscilloscopeApiClient();
+      const client = AuthManager.createClient(OscilloscopeApiClient);
      try {
        const ok = await client.refreshRAM();
        if (ok) {
@@ -245,9 +254,12 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
      const freq = 5_000_000;
      const duration = 0.001; // 1ms
      const points = Math.floor(freq * duration);
-    const x = Array.from({ length: points }, (_, i) => (i * 1_000_000_000 / freq) / 1000);
+      const x = Array.from(
+        { length: points },
+        (_, i) => (i * 1_000_000_000) / freq / 1000,
+      );
      const y = Array.from({ length: points }, (_, i) =>
-      Math.floor(Math.sin(i * 0.01) * 127 + 128)
+        Math.floor(Math.sin(i * 0.01) * 127 + 128),
      );
      oscData.value = {
        x,
@@ -282,6 +294,7 @@ const [useProvideOscilloscope, useOscilloscopeState] = createInjectionState(() =
      refreshRAM,
      generateTestData,
    };
-});
+  },
+);

 export { useProvideOscilloscope, useOscilloscopeState, DEFAULT_CONFIG };
--- a/src/components/TutorialCarousel.vue
+++ b/src/components/TutorialCarousel.vue
@@ -81,7 +81,7 @@
 import { ref, onMounted, onUnmounted } from "vue";
 import { useRouter } from "vue-router";
 import { AuthManager } from "@/utils/AuthManager";
-import type { ExamInfo } from "@/APIClient";
+import { ExamClient, ResourceClient, type ExamInfo } from "@/APIClient";

 // 接口定义
 interface Tutorial {
@@ -121,7 +121,7 @@ onMounted(async () => {
    console.log("正在从数据库加载实验数据...");

    // 创建认证客户端
-    const client = AuthManager.createAuthenticatedExamClient();
+    const client = AuthManager.createClient(ExamClient);

    // 获取实验列表
    const examList: ExamInfo[] = await client.getExamList();
@@ -142,7 +142,7 @@ onMounted(async () => {

      try {
        // 获取实验的封面资源（模板资源）
-        const resourceClient = AuthManager.createAuthenticatedResourceClient();
+        const resourceClient = AuthManager.createClient(ResourceClient);
        const resourceList = await resourceClient.getResourceList(
          exam.id,
          "cover",
--- a/src/components/UploadCard.vue
+++ b/src/components/UploadCard.vue
@@ -95,6 +95,7 @@ import {
 import { ProgressStatus } from "@/utils/signalR/server.Hubs";
 import { useRequiredInjection } from "@/utils/Common";
 import { useAlertStore } from "./Alert";
+import { ResourceClient } from "@/APIClient";

 interface Props {
  maxMemory?: number;
@@ -138,8 +139,7 @@ const progressHubReceiver: IProgressReceiver = {
  },
 };
 onMounted(async () => {
-  progressHubConnection.value =
-    AuthManager.createAuthenticatedProgressHubConnection();
+  progressHubConnection.value = AuthManager.createHubConnection("ProgressHub");
  progressHubProxy.value = getHubProxyFactory("IProgressHub").createHubProxy(
    progressHubConnection.value,
  );
@@ -175,7 +175,7 @@ async function loadAvailableBitstreams() {
  }

  try {
-    const resourceClient = AuthManager.createAuthenticatedResourceClient();
+    const resourceClient = AuthManager.createClient(ResourceClient);
    // 使用新的ResourceClient API获取比特流模板资源列表
    const resources = await resourceClient.getResourceList(
      props.examId,
@@ -199,7 +199,7 @@ async function downloadExampleBitstream(bitstream: {

  isDownloading.value = true;
  try {
-    const resourceClient = AuthManager.createAuthenticatedResourceClient();
+    const resourceClient = AuthManager.createClient(ResourceClient);

    // 使用新的ResourceClient API获取资源文件
    const response = await resourceClient.getResourceById(bitstream.id);
--- a/src/components/equipments/DDSPropertyEditor.vue
+++ b/src/components/equipments/DDSPropertyEditor.vue
@@ -212,6 +212,7 @@ import { useEquipments } from "@/stores/equipments";
 import { useDialogStore } from "@/stores/dialog";
 import { toInteger } from "lodash";
 import { AuthManager } from "@/utils/AuthManager";
+import { DDSClient } from "@/APIClient";

 // Component Attributes
 const props = defineProps<{
@@ -221,7 +222,7 @@ const props = defineProps<{
 const emit = defineEmits(["update:modelValue"]);

 // Global varibles
-const dds = AuthManager.createAuthenticatedDDSClient();
+const dds = AuthManager.createClient(DDSClient);
 const eqps = useEquipments();
 const dialog = useDialogStore();

--- a/src/components/equipments/Switch.vue
+++ b/src/components/equipments/Switch.vue
@@ -1,4 +1,3 @@
-// filepath: c:\_Project\FPGA_WebLab\FPGA_WebLab\src\components\equipments\Switch.vue
 <template>
  <svg
    xmlns="http://www.w3.org/2000/svg"
@@ -9,9 +8,23 @@
  >
    <defs>
      <filter id="glow" x="-50%" y="-50%" width="200%" height="200%">
-        <feFlood result="flood" flood-color="#f08a5d" flood-opacity="1"></feFlood>
-        <feComposite in="flood" result="mask" in2="SourceGraphic" operator="in"></feComposite>
-        <feMorphology in="mask" result="dilated" operator="dilate" radius="0.02"></feMorphology>
+        <feFlood
+          result="flood"
+          flood-color="#f08a5d"
+          flood-opacity="1"
+        ></feFlood>
+        <feComposite
+          in="flood"
+          result="mask"
+          in2="SourceGraphic"
+          operator="in"
+        ></feComposite>
+        <feMorphology
+          in="mask"
+          result="dilated"
+          operator="dilate"
+          radius="0.02"
+        ></feMorphology>
        <feGaussianBlur in="dilated" stdDeviation="0.05" result="blur1" />
        <feGaussianBlur in="dilated" stdDeviation="0.1" result="blur2" />
        <feGaussianBlur in="dilated" stdDeviation="0.2" result="blur3" />
@@ -23,12 +36,24 @@
        </feMerge>
      </filter>
    </defs>
-    
    <g>
-      <!-- 红色背景随开关数量变化宽度 -->
-      <rect :width="props.switchCount + 2" height="4" x="4" y="6" fill="#c01401" rx="0.1" />
-      <text v-if="props.showLabels" fill="white" font-size="0.7" x="4.25" y="6.75">ON</text>
-      
+      <rect
+        :width="props.switchCount + 2"
+        height="4"
+        x="4"
+        y="6"
+        fill="#c01401"
+        rx="0.1"
+      />
+      <text
+        v-if="props.showLabels"
+        fill="white"
+        font-size="0.7"
+        x="4.25"
+        y="6.75"
+      >
+        ON
+      </text>
      <g>
        <template v-for="(_, index) in Array(props.switchCount)" :key="index">
          <rect
@@ -53,9 +78,11 @@
          </text>
        </template>
      </g>
-      
      <g>
-        <template v-for="(location, index) in btnLocation" :key="`btn-${index}`">
+        <template
+          v-for="(location, index) in btnLocation"
+          :key="`btn-${index}`"
+        >
          <rect
            class="interactive"
            @click="toggleBtnStatus(index)"
@@ -74,118 +101,99 @@
 </template>

 <script lang="ts" setup>
-import { computed, ref, watch } from "vue";
+import { ref, computed, watch, onMounted } from "vue";

 interface Props {
  size?: number;
  switchCount?: number;
-  // 新增属性
-  initialValues?: boolean[] | string; // 开关的初始状态，可以是布尔数组或逗号分隔的字符串
-  showLabels?: boolean;      // 是否显示标签
+  initialValues?: boolean[] | string;
+  showLabels?: boolean;
 }

 const props = withDefaults(defineProps<Props>(), {
  size: 1,
  switchCount: 6,
  initialValues: () => [],
-  showLabels: true
+  showLabels: true,
 });
+const emit = defineEmits(["change"]);

-// 计算实际宽高
-const width = computed(() => {
-  // 每个开关占用25px宽度，再加上两侧边距(20px)
-  return (props.switchCount * 25 + 20) * props.size;
-});
-const height = computed(() => 85 * props.size); // 高度保持固定比例
-
-// 定义发出的事件
-const emit = defineEmits(['change', 'switch-toggle']);
-
-// 解析初始值，支持字符串和数组两种格式
-const parseInitialValues = () => {
+// 解析初始值
+function parseInitialValues(): boolean[] {
  if (Array.isArray(props.initialValues)) {
    return [...props.initialValues].slice(0, props.switchCount);
-  } else if (typeof props.initialValues === 'string' && props.initialValues.trim() !== '') {
-    // 将逗号分隔的字符串转换为布尔数组
-    const values = props.initialValues.split(',')
-      .map(val => val.trim() === '1' || val.trim().toLowerCase() === 'true')
-      .slice(0, props.switchCount);
-    
-    // 如果数组长度小于开关数量，用 false 填充
-    while (values.length < props.switchCount) {
-      values.push(false);
  }
-    
-    return values;
+  if (
+    typeof props.initialValues === "string" &&
+    props.initialValues.trim() !== ""
+  ) {
+    const arr = props.initialValues
+      .split(",")
+      .map((val) => val.trim() === "1" || val.trim().toLowerCase() === "true");
+    while (arr.length < props.switchCount) arr.push(false);
+    return arr.slice(0, props.switchCount);
  }
-  // 默认返回全部为 false 的数组
  return Array(props.switchCount).fill(false);
-};
-
-// 初始化按钮状态
-const btnStatus = ref(parseInitialValues());
-
-// 监听 switchCount 变化，调整开关状态数组
-watch(() => props.switchCount, (newCount) => {
-  if (newCount !== btnStatus.value.length) {
-    // 如果新数量大于当前数量，则扩展数组
-    if (newCount > btnStatus.value.length) {
-      btnStatus.value = [
-        ...btnStatus.value,
-        ...Array(newCount - btnStatus.value.length).fill(false)
-      ];
-    } else {
-      // 如果新数量小于当前数量，则截断数组
-      btnStatus.value = btnStatus.value.slice(0, newCount);
 }
-  }
-}, { immediate: true });

-// 监听 initialValues 变化，更新开关状态
-watch(() => props.initialValues, () => {
+// 状态唯一真相
+const btnStatus = ref<boolean[]>(parseInitialValues());
+
+// 计算宽高
+const width = computed(() => (props.switchCount * 25 + 20) * props.size);
+const height = computed(() => 85 * props.size);
+
+// 按钮位置
+const btnLocation = computed(() =>
+  btnStatus.value.map((status) => (status ? 7.025 : 8.325)),
+);
+
+// 状态变更统一处理
+function updateStatus(newStates: boolean[], index?: number) {
+  btnStatus.value = newStates.slice(0, props.switchCount);
+  SwitchClient.setStates(btnStatus.value); // 同步后端
+  emit("change", {
+    index,
+    value: index !== undefined ? btnStatus.value[index] : undefined,
+    states: [...btnStatus.value],
+  });
+}
+
+// 切换单个
+function toggleBtnStatus(idx: number) {
+  if (idx < 0 || idx >= btnStatus.value.length) return;
+  const newStates = [...btnStatus.value];
+  newStates[idx] = !newStates[idx];
+  updateStatus(newStates, idx);
+}
+
+// 一次性设置全部
+function setAllStates(states: boolean[]) {
+  updateStatus(states);
+}
+
+// 单个设置
+function setBtnStatus(idx: number, isOn: boolean) {
+  if (idx < 0 || idx >= btnStatus.value.length) return;
+  const newStates = [...btnStatus.value];
+  newStates[idx] = isOn;
+  updateStatus(newStates, idx);
+}
+
+// 监听 props 变化只同步一次
+watch(
+  () => [props.switchCount, props.initialValues],
+  () => {
    btnStatus.value = parseInitialValues();
+    SwitchClient.setStates(btnStatus.value);
+  },
+);
+
+// 监听后端推送
+onMounted(() => {
+  SwitchClient.onStateChange((states: boolean[]) => {
+    btnStatus.value = states.slice(0, props.switchCount);
  });
-
-const btnLocation = computed(() => {
-  return btnStatus.value.map((status) => {
-    return status ? 7.025 : 8.325;
-  });
-});
-
-function setBtnStatus(btnNum: number, isOn: boolean): void {
-  if (btnNum >= 0 && btnNum < btnStatus.value.length) {
-    btnStatus.value[btnNum] = isOn;
-    emit('change', { index: btnNum, value: isOn, states: [...btnStatus.value] });
-  }
-}
-
-function toggleBtnStatus(btnNum: number): void {
-  if (btnNum >= 0 && btnNum < btnStatus.value.length) {
-    btnStatus.value[btnNum] = !btnStatus.value[btnNum];
-    emit('switch-toggle', { 
-      index: btnNum, 
-      value: btnStatus.value[btnNum], 
-      states: [...btnStatus.value] 
-    });
-  }
-}
-
-// 一次性设置所有开关状态
-function setAllStates(states: boolean[]): void {
-  const newStates = states.slice(0, props.switchCount);
-  while (newStates.length < props.switchCount) {
-    newStates.push(false);
-  }
-  btnStatus.value = newStates;
-  emit('change', { states: [...btnStatus.value] });
-}
-
-// 暴露组件方法和状态
-defineExpose({
-  setBtnStatus,
-  toggleBtnStatus,
-  setAllStates,
-  getBtnStatus: () => [...btnStatus.value]
 });
 </script>

@@ -194,16 +202,14 @@ defineExpose({
  display: block;
  padding: 0;
  margin: 0;
-  line-height: 0; /* 移除行高导致的额外间距 */
-  font-size: 0; /* 防止文本节点造成的间距 */
+  line-height: 0;
+  font-size: 0;
  box-sizing: content-box;
  overflow: visible;
 }
-
 rect {
  transition: all 100ms ease-in-out;
 }
-
 .interactive {
  cursor: pointer;
 }
--- a/src/stores/equipments.ts
+++ b/src/stores/equipments.ts
@@ -17,7 +17,14 @@ import {
  getHubProxyFactory,
  getReceiverRegister,
 } from "@/utils/signalR/TypedSignalR.Client";
-import { ResourcePurpose, type ResourceInfo } from "@/APIClient";
+import {
+  JtagClient,
+  MatrixKeyClient,
+  PowerClient,
+  ResourceClient,
+  ResourcePurpose,
+  type ResourceInfo,
+} from "@/APIClient";
 import type {
  IDigitalTubesHub,
  IJtagHub,
@@ -46,8 +53,7 @@ export const useEquipments = defineStore("equipments", () => {

  onMounted(async () => {
    // 每次挂载都重新创建连接
-    jtagHubConnection.value =
-      AuthManager.createAuthenticatedJtagHubConnection();
+    jtagHubConnection.value = AuthManager.createHubConnection("JtagHub");
    jtagHubProxy.value = getHubProxyFactory("IJtagHub").createHubProxy(
      jtagHubConnection.value,
    );
@@ -101,7 +107,7 @@ export const useEquipments = defineStore("equipments", () => {
      // 自动开启电源
      await powerSetOnOff(true);

-      const resourceClient = AuthManager.createAuthenticatedResourceClient();
+      const resourceClient = AuthManager.createClient(ResourceClient);
      const resp = await resourceClient.addResource(
        "bitstream",
        ResourcePurpose.User,
@@ -133,7 +139,7 @@ export const useEquipments = defineStore("equipments", () => {
      // 自动开启电源
      await powerSetOnOff(true);

-      const jtagClient = AuthManager.createAuthenticatedJtagClient();
+      const jtagClient = AuthManager.createClient(JtagClient);
      const resp = await jtagClient.downloadBitstream(
        boardAddr.value,
        boardPort.value,
@@ -155,7 +161,7 @@ export const useEquipments = defineStore("equipments", () => {
      // 自动开启电源
      await powerSetOnOff(true);

-      const jtagClient = AuthManager.createAuthenticatedJtagClient();
+      const jtagClient = AuthManager.createClient(JtagClient);
      const resp = await jtagClient.getDeviceIDCode(
        boardAddr.value,
        boardPort.value,
@@ -175,7 +181,7 @@ export const useEquipments = defineStore("equipments", () => {
      // 自动开启电源
      await powerSetOnOff(true);

-      const jtagClient = AuthManager.createAuthenticatedJtagClient();
+      const jtagClient = AuthManager.createClient(JtagClient);
      const resp = await jtagClient.setSpeed(
        boardAddr.value,
        boardPort.value,
@@ -221,8 +227,7 @@ export const useEquipments = defineStore("equipments", () => {
  async function matrixKeypadSetKeyStates(keyStates: boolean[]) {
    const release = await matrixKeypadClientMutex.acquire();
    try {
-      const matrixKeypadClient =
-        AuthManager.createAuthenticatedMatrixKeyClient();
+      const matrixKeypadClient = AuthManager.createClient(MatrixKeyClient);
      const resp = await matrixKeypadClient.setMatrixKeyStatus(
        boardAddr.value,
        boardPort.value,
@@ -240,8 +245,7 @@ export const useEquipments = defineStore("equipments", () => {
  async function matrixKeypadEnable(enable: boolean) {
    const release = await matrixKeypadClientMutex.acquire();
    try {
-      const matrixKeypadClient =
-        AuthManager.createAuthenticatedMatrixKeyClient();
+      const matrixKeypadClient = AuthManager.createClient(MatrixKeyClient);
      if (enable) {
        const resp = await matrixKeypadClient.enabelMatrixKey(
          boardAddr.value,
@@ -276,7 +280,7 @@ export const useEquipments = defineStore("equipments", () => {
  async function powerSetOnOff(enable: boolean) {
    const release = await powerClientMutex.acquire();
    try {
-      const powerClient = AuthManager.createAuthenticatedPowerClient();
+      const powerClient = AuthManager.createClient(PowerClient);
      const resp = await powerClient.setPowerOnOff(
        boardAddr.value,
        boardPort.value,
@@ -338,7 +342,7 @@ export const useEquipments = defineStore("equipments", () => {
  onMounted(async () => {
    // 每次挂载都重新创建连接
    sevenSegmentDisplayHub.value =
-      AuthManager.createAuthenticatedDigitalTubesHubConnection();
+      AuthManager.createHubConnection("DigitalTubesHub");
    sevenSegmentDisplayHubProxy.value = getHubProxyFactory(
      "IDigitalTubesHub",
    ).createHubProxy(sevenSegmentDisplayHub.value);
--- a/src/utils/AuthManager.ts
+++ b/src/utils/AuthManager.ts
@@ -1,322 +1,105 @@
-import {
-  DataClient,
-  VideoStreamClient,
-  BsdlParserClient,
-  DDSClient,
-  JtagClient,
-  MatrixKeyClient,
-  PowerClient,
-  RemoteUpdateClient,
-  TutorialClient,
-  UDPClient,
-  LogicAnalyzerClient,
-  NetConfigClient,
-  OscilloscopeApiClient,
-  DebuggerClient,
-  ExamClient,
-  ResourceClient,
-  HdmiVideoStreamClient,
-} from "@/APIClient";
-import router from "@/router";
+import { DataClient } from "@/APIClient";
 import { HubConnectionBuilder } from "@microsoft/signalr";
 import axios, { type AxiosInstance } from "axios";
-import { isNull } from "lodash";
-
-// 支持的客户端类型联合类型
-type SupportedClient =
-  | DataClient
-  | VideoStreamClient
-  | BsdlParserClient
-  | DDSClient
-  | JtagClient
-  | MatrixKeyClient
-  | PowerClient
-  | RemoteUpdateClient
-  | TutorialClient
-  | LogicAnalyzerClient
-  | UDPClient
-  | NetConfigClient
-  | OscilloscopeApiClient
-  | DebuggerClient
-  | ExamClient
-  | ResourceClient
-  | HdmiVideoStreamClient;

+// 简单到让人想哭的认证管理器
 export class AuthManager {
-  // 存储token到localStorage
-  public static setToken(token: string): void {
-    localStorage.setItem("authToken", token);
+  private static readonly TOKEN_KEY = "authToken";
+
+  // 核心数据：就是个字符串
+  static getToken(): string | null {
+    return localStorage.getItem(this.TOKEN_KEY);
  }

-  // 从localStorage获取token
-  public static getToken(): string | null {
-    return localStorage.getItem("authToken");
+  static setToken(token: string): void {
+    localStorage.setItem(this.TOKEN_KEY, token);
  }

-  // 清除token
-  public static clearToken(): void {
-    localStorage.removeItem("authToken");
+  static clearToken(): void {
+    localStorage.removeItem(this.TOKEN_KEY);
  }

-  // 检查是否已认证
-  public static async isAuthenticated(): Promise<boolean> {
-    return await AuthManager.verifyToken();
+  // 核心功能：创建带认证的HTTP配置
+  static getAuthHeaders(): Record<string, string> {
+    const token = this.getToken();
+    return token ? { Authorization: `Bearer ${token}` } : {};
  }

-  // 通用的为HTTP请求添加Authorization header的方法
-  public static addAuthHeader(client: SupportedClient): void {
-    const token = AuthManager.getToken();
-    if (token) {
-      // 创建一个自定义的 http 对象，包装原有的 fetch 方法
-      const customHttp = {
-        fetch: (url: RequestInfo, init?: RequestInit) => {
-          if (!init) init = {};
-          if (!init.headers) init.headers = {};
-
-          // 添加Authorization header
-          if (typeof init.headers === "object" && init.headers !== null) {
-            (init.headers as any)["Authorization"] = `Bearer ${token}`;
-          }
-
-          // 使用全局 fetch 或 window.fetch
-          return (window as any).fetch(url, init);
-        },
-      };
-
-      // 重新构造客户端，传入自定义的 http 对象
-      const ClientClass = client.constructor as new (
+  // 一个方法搞定所有客户端，不要17个垃圾方法
+  static createClient<T>(
+    ClientClass: new (baseUrl?: string, config?: any) => T,
    baseUrl?: string,
-        http?: any,
-      ) => SupportedClient;
-      const newClient = new ClientClass(undefined, customHttp);
-
-      // 将新客户端的属性复制到原客户端（这是一个 workaround）
-      // 更好的做法是返回新的客户端实例
-      Object.setPrototypeOf(client, Object.getPrototypeOf(newClient));
-      Object.assign(client, newClient);
-    }
-  }
-
-  // 私有方法：创建带认证的HTTP客户端
-  private static createAuthenticatedHttp() {
-    const token = AuthManager.getToken();
-    if (!token) {
-      return null;
-    }
-
-    return {
-      fetch: (url: RequestInfo, init?: RequestInit) => {
-        if (!init) init = {};
-        if (!init.headers) init.headers = {};
-
-        if (typeof init.headers === "object" && init.headers !== null) {
-          (init.headers as any)["Authorization"] = `Bearer ${token}`;
-        }
-
-        return (window as any).fetch(url, init);
-      },
-    };
-  }
-
-  // 私有方法：创建带认证的Axios实例
-  private static createAuthenticatedAxiosInstance(): AxiosInstance | null {
-    const token = AuthManager.getToken();
-    if (!token) return null;
-
-    const instance = axios.create();
-    instance.interceptors.request.use((config) => {
-      config.headers = config.headers || {};
-      (config.headers as any)["Authorization"] = `Bearer ${token}`;
-      return config;
-    });
-    return instance;
-  }
-
-  // 通用的创建已认证客户端的方法（使用泛型）
-  public static createAuthenticatedClient<T extends SupportedClient>(
-    ClientClass: new (baseUrl?: string, instance?: AxiosInstance) => T,
  ): T {
-    const axiosInstance = AuthManager.createAuthenticatedAxiosInstance();
-    return axiosInstance
-      ? new ClientClass(undefined, axiosInstance)
-      : new ClientClass();
+    const token = this.getToken();
+    if (!token) {
+      return new ClientClass(baseUrl);
    }

-  // 便捷方法：创建已配置认证的各种客户端
-  public static createAuthenticatedDataClient(): DataClient {
-    return AuthManager.createAuthenticatedClient(DataClient);
+    // 对于axios客户端
+    const axiosInstance = axios.create({
+      headers: this.getAuthHeaders(),
+    });
+
+    return new ClientClass(baseUrl, axiosInstance);
  }

-  public static createAuthenticatedVideoStreamClient(): VideoStreamClient {
-    return AuthManager.createAuthenticatedClient(VideoStreamClient);
-  }
-
-  public static createAuthenticatedBsdlParserClient(): BsdlParserClient {
-    return AuthManager.createAuthenticatedClient(BsdlParserClient);
-  }
-
-  public static createAuthenticatedDDSClient(): DDSClient {
-    return AuthManager.createAuthenticatedClient(DDSClient);
-  }
-
-  public static createAuthenticatedJtagClient(): JtagClient {
-    return AuthManager.createAuthenticatedClient(JtagClient);
-  }
-
-  public static createAuthenticatedMatrixKeyClient(): MatrixKeyClient {
-    return AuthManager.createAuthenticatedClient(MatrixKeyClient);
-  }
-
-  public static createAuthenticatedPowerClient(): PowerClient {
-    return AuthManager.createAuthenticatedClient(PowerClient);
-  }
-
-  public static createAuthenticatedRemoteUpdateClient(): RemoteUpdateClient {
-    return AuthManager.createAuthenticatedClient(RemoteUpdateClient);
-  }
-
-  public static createAuthenticatedTutorialClient(): TutorialClient {
-    return AuthManager.createAuthenticatedClient(TutorialClient);
-  }
-
-  public static createAuthenticatedUDPClient(): UDPClient {
-    return AuthManager.createAuthenticatedClient(UDPClient);
-  }
-
-  public static createAuthenticatedLogicAnalyzerClient(): LogicAnalyzerClient {
-    return AuthManager.createAuthenticatedClient(LogicAnalyzerClient);
-  }
-
-  public static createAuthenticatedNetConfigClient(): NetConfigClient {
-    return AuthManager.createAuthenticatedClient(NetConfigClient);
-  }
-
-  public static createAuthenticatedOscilloscopeApiClient(): OscilloscopeApiClient {
-    return AuthManager.createAuthenticatedClient(OscilloscopeApiClient);
-  }
-
-  public static createAuthenticatedDebuggerClient(): DebuggerClient {
-    return AuthManager.createAuthenticatedClient(DebuggerClient);
-  }
-
-  public static createAuthenticatedExamClient(): ExamClient {
-    return AuthManager.createAuthenticatedClient(ExamClient);
-  }
-
-  public static createAuthenticatedResourceClient(): ResourceClient {
-    return AuthManager.createAuthenticatedClient(ResourceClient);
-  }
-
-  public static createAuthenticatedHdmiVideoStreamClient(): HdmiVideoStreamClient {
-    return AuthManager.createAuthenticatedClient(HdmiVideoStreamClient);
-  }
-
-  public static createAuthenticatedJtagHubConnection() {
+  // SignalR连接 - 简单明了
+  static createHubConnection(
+    hubPath: "ProgressHub" | "JtagHub" | "DigitalTubesHub",
+  ) {
    return new HubConnectionBuilder()
-      .withUrl("http://127.0.0.1:5000/hubs/JtagHub", {
+      .withUrl(`http://127.0.0.1:5000/hubs/${hubPath}`, {
        accessTokenFactory: () => this.getToken() ?? "",
      })
      .withAutomaticReconnect()
      .build();
  }

-  public static createAuthenticatedProgressHubConnection() {
-    return new HubConnectionBuilder()
-      .withUrl("http://127.0.0.1:5000/hubs/ProgressHub", {
-        accessTokenFactory: () => this.getToken() ?? "",
-      })
-      .withAutomaticReconnect()
-      .build();
-  }
-
-  public static createAuthenticatedDigitalTubesHubConnection() {
-    return new HubConnectionBuilder()
-      .withUrl("http://127.0.0.1:5000/hubs/DigitalTubesHub", {
-        accessTokenFactory: () => this.getToken() ?? "",
-      })
-      .withAutomaticReconnect()
-      .build();
-  }
-
-  // 登录函数
-  public static async login(
-    username: string,
-    password: string,
-  ): Promise<boolean> {
+  // 认证逻辑 - 去除所有废话
+  static async login(username: string, password: string): Promise<boolean> {
    try {
      const client = new DataClient();
      const token = await client.login(username, password);

-      if (token) {
-        AuthManager.setToken(token);
+      if (!token) return false;

-        // 验证token
-        const authClient = AuthManager.createAuthenticatedDataClient();
-        await authClient.testAuth();
+      this.setToken(token);

+      // 验证token - 如果失败直接抛异常
+      await this.createClient(DataClient).testAuth();
      return true;
-      }
-      return false;
-    } catch (error) {
-      AuthManager.clearToken();
-      throw error;
+    } catch {
+      this.clearToken();
+      throw new Error("Login failed");
    }
  }

-  // 登出函数
-  public static logout(): void {
-    AuthManager.clearToken();
+  static logout(): void {
+    this.clearToken();
  }

-  // 验证当前token是否有效
-  public static async verifyToken(): Promise<boolean> {
+  // 简单的验证 - 不要搞复杂
+  static async isAuthenticated(): Promise<boolean> {
+    if (!this.getToken()) return false;
+
    try {
-      const token = AuthManager.getToken();
-      if (!token) {
-        return false;
-      }
-
-      const client = AuthManager.createAuthenticatedDataClient();
-      await client.testAuth();
+      await this.createClient(DataClient).testAuth();
      return true;
-    } catch (error) {
-      AuthManager.clearToken();
+    } catch {
+      this.clearToken();
      return false;
    }
  }

-  // 验证管理员权限
-  public static async verifyAdminAuth(): Promise<boolean> {
+  static async isAdminAuthenticated(): Promise<boolean> {
+    if (!this.getToken()) return false;
+
    try {
-      const token = AuthManager.getToken();
-      if (!token) {
-        return false;
-      }
-
-      const client = AuthManager.createAuthenticatedDataClient();
-      await client.testAdminAuth();
+      await this.createClient(DataClient).testAdminAuth();
      return true;
-    } catch (error) {
-      // 只有在token完全无效的情况下才清除token
-      // 401错误表示token有效但权限不足，不应清除token
-      if (error && typeof error === "object" && "status" in error) {
-        // 如果是403 (Forbidden) 或401 (Unauthorized)，说明token有效但权限不足
-        if (error.status === 401 || error.status === 403) {
-          return false;
-        }
-        // 其他状态码可能表示token无效，清除token
-        AuthManager.clearToken();
-      } else {
-        // 网络错误等，不清除token
-        console.error("管理员权限验证失败:", error);
-      }
+    } catch {
+      this.clearToken();
      return false;
    }
  }
-
-  // 检查客户端是否已配置认证
-  public static isClientAuthenticated(client: SupportedClient): boolean {
-    const token = AuthManager.getToken();
-    return !!token;
-  }
 }
--- a/src/utils/BoardManager.ts
+++ b/src/utils/BoardManager.ts
@@ -17,7 +17,7 @@ export interface BoardData extends Board {
 const [useProvideBoardManager, useBoardManager] = createInjectionState(() => {
  // 远程升级相关参数
  const devPort = 1234;
-  const remoteUpdater = AuthManager.createAuthenticatedRemoteUpdateClient();
+  const remoteUpdater = AuthManager.createClient(RemoteUpdateClient);

  // 统一的板卡数据
  const boards = ref<BoardData[]>([]);
@@ -35,13 +35,13 @@ const [useProvideBoardManager, useBoardManager] = createInjectionState(() => {
  async function getAllBoards(): Promise<{ success: boolean; error?: string }> {
    try {
      // 验证管理员权限
-      const hasAdminAuth = await AuthManager.verifyAdminAuth();
+      const hasAdminAuth = await AuthManager.isAdminAuthenticated();
      if (!hasAdminAuth) {
        console.error("权限验证失败");
        return { success: false, error: "权限不足" };
      }

-      const client = AuthManager.createAuthenticatedDataClient();
+      const client = AuthManager.createClient(DataClient);
      const result = await client.getAllBoards();

      if (result) {
@@ -77,7 +77,7 @@ const [useProvideBoardManager, useBoardManager] = createInjectionState(() => {
  ): Promise<{ success: boolean; error?: string; boardId?: string }> {
    try {
      // 验证管理员权限
-      const hasAdminAuth = await AuthManager.verifyAdminAuth();
+      const hasAdminAuth = await AuthManager.isAdminAuthenticated();
      if (!hasAdminAuth) {
        console.error("权限验证失败");
        return { success: false, error: "权限不足" };
@@ -89,7 +89,7 @@ const [useProvideBoardManager, useBoardManager] = createInjectionState(() => {
        return { success: false, error: "参数不完整" };
      }

-      const client = AuthManager.createAuthenticatedDataClient();
+      const client = AuthManager.createClient(DataClient);
      const boardId = await client.addBoard(name);

      if (boardId) {
@@ -119,7 +119,7 @@ const [useProvideBoardManager, useBoardManager] = createInjectionState(() => {
  ): Promise<{ success: boolean; error?: string }> {
    try {
      // 验证管理员权限
-      const hasAdminAuth = await AuthManager.verifyAdminAuth();
+      const hasAdminAuth = await AuthManager.isAdminAuthenticated();
      if (!hasAdminAuth) {
        console.error("权限验证失败");
        return { success: false, error: "权限不足" };
@@ -130,7 +130,7 @@ const [useProvideBoardManager, useBoardManager] = createInjectionState(() => {
        return { success: false, error: "板卡ID不能为空" };
      }

-      const client = AuthManager.createAuthenticatedDataClient();
+      const client = AuthManager.createClient(DataClient);
      const result = await client.deleteBoard(boardId);

      if (result > 0) {
--- a/src/views/AuthView.vue
+++ b/src/views/AuthView.vue
@@ -274,7 +274,7 @@ const handleSignUp = async () => {
 // 页面初始化时检查是否已有有效token
 const checkExistingToken = async () => {
  try {
-    const isValid = await AuthManager.verifyToken();
+    const isValid = await AuthManager.isAuthenticated();
    if (isValid) {
      // 如果token仍然有效，直接跳转到project页面
      router.go(-1);
--- a/src/views/Exam/ExamEditModal.vue
+++ b/src/views/Exam/ExamEditModal.vue
@@ -418,7 +418,12 @@ import {
  FileArchiveIcon,
  FileJsonIcon,
 } from "lucide-vue-next";
-import { ExamDto, type FileParameter } from "@/APIClient";
+import {
+  ExamClient,
+  ExamDto,
+  ResourceClient,
+  type FileParameter,
+} from "@/APIClient";
 import { useAlertStore } from "@/components/Alert";
 import { AuthManager } from "@/utils/AuthManager";
 import { useRequiredInjection } from "@/utils/Common";
@@ -618,7 +623,7 @@ const submitCreateExam = async () => {
  isUpdating.value = true;

  try {
-    const client = AuthManager.createAuthenticatedExamClient();
+    const client = AuthManager.createClient(ExamClient);

    let exam: ExamInfo;
    if (mode.value === "create") {
@@ -671,7 +676,7 @@ const submitCreateExam = async () => {

 // 上传实验资源
 async function uploadExamResources(examId: string) {
-  const client = AuthManager.createAuthenticatedResourceClient();
+  const client = AuthManager.createClient(ResourceClient);

  try {
    // 上传MD文档
@@ -750,7 +755,7 @@ function close() {
 }

 async function editExam(examId: string) {
-  const client = AuthManager.createAuthenticatedExamClient();
+  const client = AuthManager.createClient(ExamClient);
  const examInfo = await client.getExam(examId);

  editExamInfo.value = {
--- a/src/views/Exam/ExamInfoModal.vue
+++ b/src/views/Exam/ExamInfoModal.vue
@@ -250,7 +250,13 @@
  </div>
 </template>
 <script setup lang="ts">
-import { ResourcePurpose, type ExamInfo, type ResourceInfo } from "@/APIClient";
+import {
+  ExamClient,
+  ResourceClient,
+  ResourcePurpose,
+  type ExamInfo,
+  type ResourceInfo,
+} from "@/APIClient";
 import { useAlertStore } from "@/components/Alert";
 import { AuthManager } from "@/utils/AuthManager";
 import { useRequiredInjection } from "@/utils/Common";
@@ -274,7 +280,7 @@ const props = defineProps<{

 const commitsList = ref<ResourceInfo[]>();
 async function updateCommits() {
-  const client = AuthManager.createAuthenticatedExamClient();
+  const client = AuthManager.createClient(ExamClient);
  const list = await client.getCommitsByExamId(props.selectedExam.id);
  commitsList.value = list;
 }
@@ -288,7 +294,7 @@ const downloadResources = async () => {
  downloadingResources.value = true;

  try {
-    const resourceClient = AuthManager.createAuthenticatedResourceClient();
+    const resourceClient = AuthManager.createClient(ResourceClient);

    // 获取资源包列表（模板资源）
    const resourceList = await resourceClient.getResourceList(
--- a/src/views/Exam/Index.vue
+++ b/src/views/Exam/Index.vue
@@ -181,7 +181,7 @@
 import { ref, onMounted, computed } from "vue";
 import { useRoute } from "vue-router";
 import { AuthManager } from "@/utils/AuthManager";
-import { type ExamInfo } from "@/APIClient";
+import { ExamClient, type ExamInfo } from "@/APIClient";
 import { formatDate } from "@/utils/Common";
 import ExamInfoModal from "./ExamInfoModal.vue";
 import ExamEditModal from "./ExamEditModal.vue";
@@ -206,7 +206,7 @@ async function refreshExams() {
  error.value = "";

  try {
-    const client = AuthManager.createAuthenticatedExamClient();
+    const client = AuthManager.createClient(ExamClient);
    exams.value = await client.getExamList();
  } catch (err: any) {
    error.value = err.message || "获取实验列表失败";
@@ -218,7 +218,7 @@ async function refreshExams() {

 async function viewExam(examId: string) {
  try {
-    const client = AuthManager.createAuthenticatedExamClient();
+    const client = AuthManager.createClient(ExamClient);
    selectedExam.value = await client.getExam(examId);
    showInfoModal.value = true;
  } catch (err: any) {
@@ -248,7 +248,7 @@ onMounted(async () => {
    router.push("/login");
  }

-  isAdmin.value = await AuthManager.verifyAdminAuth();
+  isAdmin.value = await AuthManager.isAdminAuthenticated();

  await refreshExams();

--- a/src/views/Project/Debugger.vue
+++ b/src/views/Project/Debugger.vue
@@ -266,7 +266,12 @@
 </template>

 <script setup lang="ts">
-import { CaptureMode, ChannelConfig, DebuggerConfig } from "@/APIClient";
+import {
+  CaptureMode,
+  ChannelConfig,
+  DebuggerClient,
+  DebuggerConfig,
+} from "@/APIClient";
 import { useAlertStore } from "@/components/Alert";
 import BaseInputField from "@/components/InputField/BaseInputField.vue";
 import type { LogicDataType } from "@/components/WaveformDisplay";
@@ -421,7 +426,7 @@ async function startCapture() {
  }

  isCapturing.value = true;
-  const client = AuthManager.createAuthenticatedDebuggerClient();
+  const client = AuthManager.createClient(DebuggerClient);

  // 构造API配置
  const channelConfigs = channels.value
--- a/src/views/Project/HdmiVideoStream.vue
+++ b/src/views/Project/HdmiVideoStream.vue
@@ -13,13 +13,22 @@
          <div class="stats shadow">
            <div class="stat bg-base-100">
              <div class="stat-figure text-primary">
-                <div class="badge" :class="endpoint ? 'badge-success' : 'badge-warning'">
+                <div
+                  class="badge"
+                  :class="endpoint ? 'badge-success' : 'badge-warning'"
+                >
                  {{ endpoint ? "已连接" : "未配置" }}
                </div>
              </div>
              <div class="stat-title">板卡状态</div>
              <div class="stat-value text-primary">HDMI</div>
-              <div class="stat-desc">{{ endpoint ? `板卡: ${endpoint.boardId.substring(0, 8)}...` : "请先连接板卡" }}</div>
+              <div class="stat-desc">
+                {{
+                  endpoint
+                    ? `板卡: ${endpoint.boardId.substring(0, 8)}...`
+                    : "请先连接板卡"
+                }}
+              </div>
            </div>
          </div>

@@ -40,12 +49,20 @@

        <!-- 操作按钮 -->
        <div class="card-actions justify-end mt-4">
-          <button class="btn btn-outline btn-primary" @click="refreshEndpoint" :disabled="loading">
+          <button
+            class="btn btn-outline btn-primary"
+            @click="refreshEndpoint"
+            :disabled="loading"
+          >
            <RefreshCw v-if="loading" class="animate-spin h-4 w-4 mr-2" />
            <RefreshCw v-else class="h-4 w-4 mr-2" />
            {{ loading ? "刷新中..." : "刷新连接" }}
          </button>
-          <button class="btn btn-primary" @click="testConnection" :disabled="testing || !endpoint">
+          <button
+            class="btn btn-primary"
+            @click="testConnection"
+            :disabled="testing || !endpoint"
+          >
            <RefreshCw v-if="testing" class="animate-spin h-4 w-4 mr-2" />
            <TestTube v-else class="h-4 w-4 mr-2" />
            {{ testing ? "测试中..." : "测试连接" }}
@@ -62,17 +79,33 @@
          HDMI视频预览
        </h2>

-        <div class="relative bg-black rounded-lg overflow-hidden cursor-pointer" :class="[
-          { 'cursor-not-allowed': !isPlaying || hasVideoError || !endpoint }
-        ]" style="aspect-ratio: 16/9" @click="handleVideoClick">
+        <div
+          class="relative bg-black rounded-lg overflow-hidden cursor-pointer"
+          :class="[
+            { 'cursor-not-allowed': !isPlaying || hasVideoError || !endpoint },
+          ]"
+          style="aspect-ratio: 16/9"
+          @click="handleVideoClick"
+        >
          <!-- 视频播放器 - 使用img标签直接显示MJPEG流 -->
-          <div v-show="isPlaying && endpoint" class="w-full h-full flex items-center justify-center">
-            <img :src="currentVideoSource" alt="HDMI视频流" class="max-w-full max-h-full object-contain"
-              @error="handleVideoError" @load="handleVideoLoad" />
+          <div
+            v-show="isPlaying && endpoint"
+            class="w-full h-full flex items-center justify-center"
+          >
+            <img
+              :src="currentVideoSource"
+              alt="HDMI视频流"
+              class="max-w-full max-h-full object-contain"
+              @error="handleVideoError"
+              @load="handleVideoLoad"
+            />
          </div>

          <!-- 错误信息显示 -->
-          <div v-if="hasVideoError" class="absolute inset-0 flex items-center justify-center bg-black bg-opacity-70">
+          <div
+            v-if="hasVideoError"
+            class="absolute inset-0 flex items-center justify-center bg-black bg-opacity-70"
+          >
            <div class="card bg-error text-white shadow-lg w-full max-w-lg">
              <div class="card-body">
                <h3 class="card-title flex items-center gap-2">
@@ -87,7 +120,10 @@
                  <li>HDMI视频流服务是否已启动</li>
                </ul>
                <div class="card-actions justify-end mt-2">
-                  <button class="btn btn-sm btn-outline btn-primary" @click="tryReconnect">
+                  <button
+                    class="btn btn-sm btn-outline btn-primary"
+                    @click="tryReconnect"
+                  >
                    重试连接
                  </button>
                </div>
@@ -96,13 +132,19 @@
          </div>

          <!-- 占位符 -->
-          <div v-show="(!isPlaying && !hasVideoError) || !endpoint"
-            class="absolute inset-0 flex items-center justify-center text-white">
+          <div
+            v-show="(!isPlaying && !hasVideoError) || !endpoint"
+            class="absolute inset-0 flex items-center justify-center text-white"
+          >
            <div class="text-center">
              <Video class="w-16 h-16 mx-auto mb-4 opacity-50" />
              <p class="text-lg opacity-75">{{ videoStatus }}</p>
              <p class="text-sm opacity-60 mt-2">
-                {{ endpoint ? '点击"播放HDMI视频流"按钮开始查看实时视频' : '请先刷新连接以获取板卡信息' }}
+                {{
+                  endpoint
+                    ? '点击"播放HDMI视频流"按钮开始查看实时视频'
+                    : "请先刷新连接以获取板卡信息"
+                }}
              </p>
            </div>
          </div>
@@ -118,11 +160,18 @@
          </div>
          <div class="space-x-2">
            <div class="dropdown dropdown-hover dropdown-top dropdown-end">
-              <div tabindex="0" role="button" class="btn btn-sm btn-outline btn-accent">
+              <div
+                tabindex="0"
+                role="button"
+                class="btn btn-sm btn-outline btn-accent"
+              >
                <MoreHorizontal class="w-4 h-4 mr-1" />
                更多功能
              </div>
-              <ul tabindex="0" class="dropdown-content z-[1] menu p-2 shadow bg-base-200 rounded-box w-52">
+              <ul
+                tabindex="0"
+                class="dropdown-content z-[1] menu p-2 shadow bg-base-200 rounded-box w-52"
+              >
                <li>
                  <a @click="openInNewTab(endpoint.videoUrl)">
                    <ExternalLink class="w-4 h-4" />
@@ -143,11 +192,19 @@
                </li>
              </ul>
            </div>
-            <button class="btn btn-success btn-sm" @click="startStream" :disabled="isPlaying || !endpoint">
+            <button
+              class="btn btn-success btn-sm"
+              @click="startStream"
+              :disabled="isPlaying || !endpoint"
+            >
              <Play class="w-4 h-4 mr-1" />
              播放HDMI视频流
            </button>
-            <button class="btn btn-error btn-sm" @click="stopStream" :disabled="!isPlaying">
+            <button
+              class="btn btn-error btn-sm"
+              @click="stopStream"
+              :disabled="!isPlaying"
+            >
              <Square class="w-4 h-4 mr-1" />
              停止视频流
            </button>
@@ -165,11 +222,20 @@
        </h2>

        <div class="bg-base-300 rounded-lg p-4 h-48 overflow-y-auto">
-          <div v-for="(log, index) in logs" :key="index" class="text-sm font-mono mb-1">
-            <span class="text-base-content/50">[{{ formatTime(log.time) }}]</span>
+          <div
+            v-for="(log, index) in logs"
+            :key="index"
+            class="text-sm font-mono mb-1"
+          >
+            <span class="text-base-content/50"
+              >[{{ formatTime(log.time) }}]</span
+            >
            <span :class="getLogClass(log.level)">{{ log.message }}</span>
          </div>
-          <div v-if="logs.length === 0" class="text-base-content/50 text-center py-8">
+          <div
+            v-if="logs.length === 0"
+            class="text-base-content/50 text-center py-8"
+          >
            暂无日志记录
          </div>
        </div>
@@ -200,7 +266,10 @@ import {
  AlertTriangle,
  MoreHorizontal,
 } from "lucide-vue-next";
-import { HdmiVideoStreamClient, type HdmiVideoStreamEndpoint } from "@/APIClient";
+import {
+  HdmiVideoStreamClient,
+  type HdmiVideoStreamEndpoint,
+} from "@/APIClient";
 import { AuthManager } from "@/utils/AuthManager";
 import { useAlertStore } from "@/components/Alert";

@@ -212,27 +281,27 @@ const loading = ref(false);
 const testing = ref(false);
 const isPlaying = ref(false);
 const hasVideoError = ref(false);
-const videoStatus = ref('未连接');
+const videoStatus = ref("未连接");

 // HDMI视频流数据
 const endpoint = ref<HdmiVideoStreamEndpoint | null>(null);
-const currentVideoSource = ref('');
+const currentVideoSource = ref("");

 // 日志系统
 interface LogEntry {
  time: Date;
-  level: 'info' | 'success' | 'warning' | 'error';
+  level: "info" | "success" | "warning" | "error";
  message: string;
 }

 const logs = ref<LogEntry[]>([]);

 // 添加日志
-function addLog(level: LogEntry['level'], message: string) {
+function addLog(level: LogEntry["level"], message: string) {
  logs.value.unshift({
    time: new Date(),
    level,
-    message
+    message,
  });

  // 保持最近100条日志
@@ -247,51 +316,54 @@ function formatTime(date: Date): string {
 }

 // 获取日志样式类
-function getLogClass(level: LogEntry['level']): string {
+function getLogClass(level: LogEntry["level"]): string {
  switch (level) {
-    case 'success':
-      return 'text-success';
-    case 'warning':
-      return 'text-warning';
-    case 'error':
-      return 'text-error';
+    case "success":
+      return "text-success";
+    case "warning":
+      return "text-warning";
+    case "error":
+      return "text-error";
    default:
-      return 'text-base-content';
+      return "text-base-content";
  }
 }

 // 清空日志
 function clearLogs() {
  logs.value = [];
-  addLog('info', '日志已清空');
+  addLog("info", "日志已清空");
 }

 // 刷新HDMI视频流端点
 async function refreshEndpoint() {
  loading.value = true;
  try {
-    addLog('info', '正在获取HDMI视频流端点...');
+    addLog("info", "正在获取HDMI视频流端点...");

-    const client = AuthManager.createAuthenticatedHdmiVideoStreamClient();
+    const client = AuthManager.createClient(HdmiVideoStreamClient);
    const result = await client.getMyEndpoint();

    if (result) {
      endpoint.value = result;
-      videoStatus.value = '已连接板卡，可以播放视频流';
-      addLog('success', `成功获取HDMI视频流端点，板卡ID: ${result.boardId.substring(0, 8)}...`);
-      alert?.success('HDMI视频流连接成功');
+      videoStatus.value = "已连接板卡，可以播放视频流";
+      addLog(
+        "success",
+        `成功获取HDMI视频流端点，板卡ID: ${result.boardId.substring(0, 8)}...`,
+      );
+      alert?.success("HDMI视频流连接成功");
    } else {
      endpoint.value = null;
-      videoStatus.value = '无法获取板卡信息';
-      addLog('error', '未找到绑定的板卡或板卡未配置HDMI输入');
-      alert?.error('未找到绑定的板卡');
+      videoStatus.value = "无法获取板卡信息";
+      addLog("error", "未找到绑定的板卡或板卡未配置HDMI输入");
+      alert?.error("未找到绑定的板卡");
    }
  } catch (error) {
-    console.error('获取HDMI视频流端点失败:', error);
+    console.error("获取HDMI视频流端点失败:", error);
    endpoint.value = null;
-    videoStatus.value = '连接失败';
-    addLog('error', `获取HDMI视频流端点失败: ${error}`);
-    alert?.error('获取HDMI视频流信息失败');
+    videoStatus.value = "连接失败";
+    addLog("error", `获取HDMI视频流端点失败: ${error}`);
+    alert?.error("获取HDMI视频流信息失败");
  } finally {
    loading.value = false;
  }
@@ -300,34 +372,34 @@ async function refreshEndpoint() {
 // 测试连接
 async function testConnection() {
  if (!endpoint.value) {
-    alert?.warn('请先刷新连接获取板卡信息');
+    alert?.warn("请先刷新连接获取板卡信息");
    return;
  }

  testing.value = true;
  try {
-    addLog('info', '正在测试HDMI视频流连接...');
+    addLog("info", "正在测试HDMI视频流连接...");

    // 尝试获取快照来测试连接
    const response = await fetch(endpoint.value.snapshotUrl, {
-      method: 'GET',
+      method: "GET",
      headers: {
-        'Cache-Control': 'no-cache'
-      }
+        "Cache-Control": "no-cache",
+      },
    });

    if (response.ok) {
-      addLog('success', 'HDMI视频流连接测试成功');
-      alert?.success('HDMI连接测试成功');
-      videoStatus.value = '连接正常，可以播放视频流';
+      addLog("success", "HDMI视频流连接测试成功");
+      alert?.success("HDMI连接测试成功");
+      videoStatus.value = "连接正常，可以播放视频流";
    } else {
      throw new Error(`HTTP ${response.status}: ${response.statusText}`);
    }
  } catch (error) {
-    console.error('HDMI视频流连接测试失败:', error);
-    addLog('error', `连接测试失败: ${error}`);
-    alert?.error('HDMI连接测试失败');
-    videoStatus.value = '连接测试失败';
+    console.error("HDMI视频流连接测试失败:", error);
+    addLog("error", `连接测试失败: ${error}`);
+    alert?.error("HDMI连接测试失败");
+    videoStatus.value = "连接测试失败";
  } finally {
    testing.value = false;
  }
@@ -336,7 +408,7 @@ async function testConnection() {
 // 开始播放视频流
 function startStream() {
  if (!endpoint.value) {
-    alert?.warn('请先刷新连接获取板卡信息');
+    alert?.warn("请先刷新连接获取板卡信息");
    return;
  }

@@ -346,42 +418,42 @@ function startStream() {
    currentVideoSource.value = `${endpoint.value.mjpegUrl}&t=${timestamp}`;
    isPlaying.value = true;
    hasVideoError.value = false;
-    videoStatus.value = '正在加载视频流...';
+    videoStatus.value = "正在加载视频流...";

-    addLog('info', '开始播放HDMI视频流');
-    alert?.success('开始播放HDMI视频流');
+    addLog("info", "开始播放HDMI视频流");
+    alert?.success("开始播放HDMI视频流");
  } catch (error) {
-    console.error('启动HDMI视频流失败:', error);
-    addLog('error', `启动视频流失败: ${error}`);
-    alert?.error('启动HDMI视频流失败');
+    console.error("启动HDMI视频流失败:", error);
+    addLog("error", `启动视频流失败: ${error}`);
+    alert?.error("启动HDMI视频流失败");
  }
 }

 // 停止播放视频流
 function stopStream() {
  isPlaying.value = false;
-  currentVideoSource.value = '';
-  videoStatus.value = '已停止播放';
+  currentVideoSource.value = "";
+  videoStatus.value = "已停止播放";

-  const client = AuthManager.createAuthenticatedHdmiVideoStreamClient();
+  const client = AuthManager.createClient(HdmiVideoStreamClient);
  client.disableHdmiTransmission();

-  addLog('info', '停止播放HDMI视频流');
-  alert?.info('已停止播放HDMI视频流');
+  addLog("info", "停止播放HDMI视频流");
+  alert?.info("已停止播放HDMI视频流");
 }

 // 处理视频加载错误
 function handleVideoError() {
  hasVideoError.value = true;
-  videoStatus.value = '视频流加载失败';
-  addLog('error', 'HDMI视频流加载失败');
+  videoStatus.value = "视频流加载失败";
+  addLog("error", "HDMI视频流加载失败");
 }

 // 处理视频加载成功
 function handleVideoLoad() {
  hasVideoError.value = false;
-  videoStatus.value = '视频流播放中';
-  addLog('success', 'HDMI视频流加载成功');
+  videoStatus.value = "视频流播放中";
+  addLog("success", "HDMI视频流加载成功");
 }

 // 处理视频点击
@@ -391,7 +463,7 @@ function handleVideoClick() {
  }

  // 可以在这里添加点击视频的交互逻辑
-  addLog('info', '视频画面被点击');
+  addLog("info", "视频画面被点击");
 }

 // 重试连接
@@ -404,47 +476,47 @@ function tryReconnect() {

 // 在新标签页打开视频
 function openInNewTab(url: string) {
-  window.open(url, '_blank');
-  addLog('info', '在新标签页打开HDMI视频页面');
+  window.open(url, "_blank");
+  addLog("info", "在新标签页打开HDMI视频页面");
 }

 // 获取快照
 async function takeSnapshot() {
  if (!endpoint.value) {
-    alert?.warn('请先刷新连接获取板卡信息');
+    alert?.warn("请先刷新连接获取板卡信息");
    return;
  }

  try {
-    addLog('info', '正在获取HDMI视频快照...');
+    addLog("info", "正在获取HDMI视频快照...");

    const response = await fetch(endpoint.value.snapshotUrl, {
-      method: 'GET',
+      method: "GET",
      headers: {
-        'Cache-Control': 'no-cache'
-      }
+        "Cache-Control": "no-cache",
+      },
    });

    if (response.ok) {
      const blob = await response.blob();
      const url = URL.createObjectURL(blob);
-      const a = document.createElement('a');
+      const a = document.createElement("a");
      a.href = url;
-      a.download = `hdmi_snapshot_${new Date().toISOString().replace(/:/g, '-')}.jpg`;
+      a.download = `hdmi_snapshot_${new Date().toISOString().replace(/:/g, "-")}.jpg`;
      document.body.appendChild(a);
      a.click();
      document.body.removeChild(a);
      URL.revokeObjectURL(url);

-      addLog('success', '快照下载成功');
-      alert?.success('HDMI快照下载成功');
+      addLog("success", "快照下载成功");
+      alert?.success("HDMI快照下载成功");
    } else {
      throw new Error(`HTTP ${response.status}: ${response.statusText}`);
    }
  } catch (error) {
-    console.error('获取HDMI快照失败:', error);
-    addLog('error', `获取快照失败: ${error}`);
-    alert?.error('获取HDMI快照失败');
+    console.error("获取HDMI快照失败:", error);
+    addLog("error", `获取快照失败: ${error}`);
+    alert?.error("获取HDMI快照失败");
  }
 }

@@ -452,18 +524,18 @@ async function takeSnapshot() {
 async function copyToClipboard(text: string) {
  try {
    await navigator.clipboard.writeText(text);
-    addLog('success', '地址已复制到剪贴板');
-    alert?.success('地址已复制到剪贴板');
+    addLog("success", "地址已复制到剪贴板");
+    alert?.success("地址已复制到剪贴板");
  } catch (error) {
-    console.error('复制到剪贴板失败:', error);
-    addLog('error', '复制到剪贴板失败');
-    alert?.error('复制到剪贴板失败');
+    console.error("复制到剪贴板失败:", error);
+    addLog("error", "复制到剪贴板失败");
+    alert?.error("复制到剪贴板失败");
  }
 }

 // 组件挂载时初始化
 onMounted(() => {
-  addLog('info', 'HDMI视频流界面已初始化');
+  addLog("info", "HDMI视频流界面已初始化");
  refreshEndpoint();
 });

@@ -476,7 +548,8 @@ onUnmounted(() => {
 <style scoped>
 /* 对焦动画效果 */
@keyframes focus-pulse {
-  0%, 100% { 
+  0%,
+  100% {
    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7);
  }
  50% {
--- a/src/views/Project/Index.vue
+++ b/src/views/Project/Index.vue
@@ -80,7 +80,9 @@
        <!-- 功能底栏 -->
        <SplitterPanel
          id="splitter-group-v-panel-bar"
-          :default-size="isBottomBarFullscreen ? 100 : (100 - verticalSplitterSize)"
+          :default-size="
+            isBottomBarFullscreen ? 100 : 100 - verticalSplitterSize
+          "
          :min-size="isBottomBarFullscreen ? 100 : 15"
          class="w-full overflow-hidden pt-3"
        >
@@ -114,14 +116,40 @@
        @click="navbarControl.toggleNavbar"
        class="btn btn-circle btn-primary shadow-lg hover:shadow-xl transition-all duration-300"
        :class="{ 'btn-outline': navbarControl.showNavbar.value }"
-        :title="navbarControl.showNavbar.value ? '隐藏顶部导航栏' : '显示顶部导航栏'"
+        :title="
+          navbarControl.showNavbar.value ? '隐藏顶部导航栏' : '显示顶部导航栏'
+        "
      >
        <!-- 使用SVG图标表示菜单/关闭状态 -->
-        <svg v-if="navbarControl.showNavbar.value" xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+        <svg
+          v-if="navbarControl.showNavbar.value"
+          xmlns="http://www.w3.org/2000/svg"
+          class="h-6 w-6"
+          fill="none"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+        >
+          <path
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            d="M6 18L18 6M6 6l12 12"
+          />
        </svg>
-        <svg v-else xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+        <svg
+          v-else
+          xmlns="http://www.w3.org/2000/svg"
+          class="h-6 w-6"
+          fill="none"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+        >
+          <path
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            d="M4 6h16M4 12h16M4 18h16"
+          />
        </svg>
      </button>
    </div>
@@ -131,7 +159,7 @@
 <script setup lang="ts">
 import { ref, onMounted, watch, inject, type Ref } from "vue";
 import { useRouter } from "vue-router";
-import { useLocalStorage } from '@vueuse/core'; // 添加VueUse导入
+import { useLocalStorage } from "@vueuse/core"; // 添加VueUse导入
 import { SplitterGroup, SplitterPanel, SplitterResizeHandle } from "reka-ui";
 import DiagramCanvas from "@/components/LabCanvas/DiagramCanvas.vue";
 import ComponentSelector from "@/components/LabCanvas/ComponentSelector.vue";
@@ -143,7 +171,7 @@ import { useProvideComponentManager } from "@/components/LabCanvas";
 import { useAlertStore } from "@/components/Alert";
 import { AuthManager } from "@/utils/AuthManager";
 import { useEquipments } from "@/stores/equipments";
-import type { Board } from "@/APIClient";
+import { DataClient, ResourceClient, type Board } from "@/APIClient";

 import { useRoute } from "vue-router";
 const route = useRoute();
@@ -158,20 +186,29 @@ const equipments = useEquipments();
 const alert = useAlertStore();

 // --- Navbar控制 ---
-const navbarControl = inject('navbar') as {
+const navbarControl = inject("navbar") as {
  showNavbar: Ref<boolean>;
  toggleNavbar: () => void;
 };

 // --- 使用VueUse保存分栏状态 ---
 // 左右分栏比例（默认60%）
-const horizontalSplitterSize = useLocalStorage('project-horizontal-splitter-size', 60);
+const horizontalSplitterSize = useLocalStorage(
+  "project-horizontal-splitter-size",
+  60,
+);
 // 上下分栏比例（默认80%）
-const verticalSplitterSize = useLocalStorage('project-vertical-splitter-size', 80);
+const verticalSplitterSize = useLocalStorage(
+  "project-vertical-splitter-size",
+  80,
+);
 // 底栏全屏状态
-const isBottomBarFullscreen = useLocalStorage('project-bottom-bar-fullscreen', false);
+const isBottomBarFullscreen = useLocalStorage(
+  "project-bottom-bar-fullscreen",
+  false,
+);
 // 文档面板显示状态
-const showDocPanel = useLocalStorage('project-show-doc-panel', false);
+const showDocPanel = useLocalStorage("project-show-doc-panel", false);

 function handleToggleBottomBarFullscreen() {
  isBottomBarFullscreen.value = !isBottomBarFullscreen.value;
@@ -216,11 +253,11 @@ async function loadDocumentContent() {
    const examId = route.query.examId as string;
    if (examId) {
      // 如果有实验ID，从API加载实验文档
-      console.log('加载实验文档:', examId);
-      const client = AuthManager.createAuthenticatedResourceClient();
+      console.log("加载实验文档:", examId);
+      const client = AuthManager.createClient(ResourceClient);

      // 获取markdown类型的模板资源列表
-      const resources = await client.getResourceList(examId, 'doc', 'template');
+      const resources = await client.getResourceList(examId, "doc", "template");

      if (resources && resources.length > 0) {
        // 获取第一个markdown资源
@@ -230,7 +267,7 @@ async function loadDocumentContent() {
        const response = await client.getResourceById(markdownResource.id);

        if (!response || !response.data) {
-          throw new Error('获取markdown文件失败');
+          throw new Error("获取markdown文件失败");
        }

        const content = await response.data.text();
@@ -279,17 +316,17 @@ function updateComponentDirectProp(
 // 检查并初始化用户实验板
 async function checkAndInitializeBoard() {
  try {
-    const client = AuthManager.createAuthenticatedDataClient();
+    const client = AuthManager.createClient(DataClient);
    const userInfo = await client.getUserInfo();

-    if (userInfo.boardID && userInfo.boardID.trim() !== '') {
+    if (userInfo.boardID && userInfo.boardID.trim() !== "") {
      // 用户已绑定实验板，获取实验板信息并更新到equipment
      try {
        const board = await client.getBoardByID(userInfo.boardID);
        updateEquipmentFromBoard(board);
        alert?.show(`实验板 ${board.boardName} 已连接`, "success");
      } catch (boardError) {
-        console.error('获取实验板信息失败:', boardError);
+        console.error("获取实验板信息失败:", boardError);
        alert?.show("获取实验板信息失败", "error");
        showRequestBoardDialog.value = true;
      }
@@ -298,7 +335,7 @@ async function checkAndInitializeBoard() {
      showRequestBoardDialog.value = true;
    }
  } catch (error) {
-    console.error('检查用户实验板失败:', error);
+    console.error("检查用户实验板失败:", error);
    alert?.show("检查用户信息失败", "error");
    showRequestBoardDialog.value = true;
  }
@@ -313,7 +350,7 @@ function updateEquipmentFromBoard(board: Board) {
    address: board.ipAddr,
    port: board.port,
    boardName: board.boardName,
-    boardId: board.id
+    boardId: board.id,
  });
 }

@@ -321,7 +358,7 @@ function updateEquipmentFromBoard(board: Board) {
 function handleRequestBoardClose() {
  showRequestBoardDialog.value = false;
  // 如果用户取消申请，可以选择返回上一页或显示警告
-  router.push('/');
+  router.push("/");
 }

 // 处理申请实验板成功
@@ -338,12 +375,12 @@ onMounted(async () => {
    const isAuthenticated = await AuthManager.isAuthenticated();
    if (!isAuthenticated) {
      // 验证失败，跳转到登录页面
-      router.push('/login');
+      router.push("/login");
      return;
    }
  } catch (error) {
-    console.error('身份验证失败:', error);
-    router.push('/login');
+    console.error("身份验证失败:", error);
+    router.push("/login");
    return;
  }

--- a/src/views/Project/RequestBoardDialog.vue
+++ b/src/views/Project/RequestBoardDialog.vue
@@ -75,7 +75,7 @@ import { ref, watch } from "vue";
 import { CheckCircle } from "lucide-vue-next";
 import { AuthManager } from "@/utils/AuthManager";
 import { useAlertStore } from "@/components/Alert";
-import type { Board } from "@/APIClient";
+import { DataClient, type Board } from "@/APIClient";

 interface Props {
  open: boolean;
@@ -113,7 +113,7 @@ async function checkUserBoard() {
  boardInfo.value = null;

  try {
-    const client = AuthManager.createAuthenticatedDataClient();
+    const client = AuthManager.createClient(DataClient);
    const userInfo = await client.getUserInfo();

    if (userInfo.boardID && userInfo.boardID.trim() !== "") {
@@ -140,7 +140,7 @@ async function requestBoard() {
  requesting.value = true;

  try {
-    const client = AuthManager.createAuthenticatedDataClient();
+    const client = AuthManager.createClient(DataClient);
    const board = await client.getAvailableBoard(undefined);

    if (board) {
--- a/src/views/Project/VideoStream.vue
+++ b/src/views/Project/VideoStream.vue
@@ -433,7 +433,7 @@ const currentVideoSource = ref("");
 const logs = ref<Array<{ time: Date; level: string; message: string }>>([]);

 // API 客户端
-const videoClient = AuthManager.createAuthenticatedVideoStreamClient();
+const videoClient = AuthManager.createClient(VideoStreamClient);

 // 添加日志
 const addLog = (level: string, message: string) => {
--- a/src/views/User/AddBoardDialog.vue
+++ b/src/views/User/AddBoardDialog.vue
@@ -174,7 +174,12 @@
 import { ref, reactive, watch } from "vue";
 import { AuthManager } from "../../utils/AuthManager";
 import { useAlertStore } from "../../components/Alert";
-import { BoardStatus, type NetworkConfigDto } from "../../APIClient";
+import {
+  BoardStatus,
+  DataClient,
+  NetConfigClient,
+  type NetworkConfigDto,
+} from "../../APIClient";
 import { useRequiredInjection } from "@/utils/Common";
 import { useBoardManager } from "@/utils/BoardManager";

@@ -267,8 +272,7 @@ async function handleSubmit() {
  isSubmitting.value = true;

  try {
-    // 通过 AuthManager 获取认证的 DataClient
-    const dataClient = AuthManager.createAuthenticatedDataClient();
+    const dataClient = AuthManager.createClient(DataClient);

    // 添加板卡到数据库
    const boardId = await dataClient.addBoard(form.name.trim());
@@ -293,8 +297,7 @@ async function handleCancelPairing() {
  if (!addedBoardId.value) return;

  try {
-    // 通过 AuthManager 获取认证的 DataClient
-    const dataClient = AuthManager.createAuthenticatedDataClient();
+    const dataClient = AuthManager.createClient(DataClient);

    // 删除添加的板卡
    await dataClient.deleteBoard(addedBoardId.value);
@@ -317,8 +320,8 @@ async function handlePairingConfirm() {

  try {
    // 通过 AuthManager 获取认证的客户端
-    const dataClient = AuthManager.createAuthenticatedDataClient();
-    const netConfigClient = AuthManager.createAuthenticatedNetConfigClient();
+    const dataClient = AuthManager.createClient(DataClient);
+    const netConfigClient = AuthManager.createClient(NetConfigClient);

    // 获取数据库中对应分配的板卡信息
    const boardInfo = await dataClient.getBoardByID(addedBoardId.value);
@@ -365,7 +368,7 @@ async function handlePairingConfirm() {

    // 配置失败，删除数据库中的板卡信息
    try {
-      const dataClient = AuthManager.createAuthenticatedDataClient();
+      const dataClient = AuthManager.createClient(DataClient);
      await dataClient.deleteBoard(addedBoardId.value);
    } catch (deleteError) {
      console.error("删除板卡失败:", deleteError);
--- a/src/views/User/Index.vue
+++ b/src/views/User/Index.vue
@@ -62,14 +62,14 @@ onMounted(async () => {
    }

    // 验证管理员权限
-    isAdmin.value = await AuthManager.verifyAdminAuth();
+    isAdmin.value = await AuthManager.isAdminAuthenticated();

    // 如果当前页面是管理员页面但用户不是管理员，切换到用户信息页面
    if (activePage.value === 100 && !isAdmin.value) {
      activePage.value = 1;
    }
  } catch (error) {
-    console.error('用户认证检查失败:', error);
+    console.error("用户认证检查失败:", error);
    // 可以在这里处理错误，比如显示错误信息或重定向到登录页面
  }
 });
--- a/src/views/User/UserInfo.vue
+++ b/src/views/User/UserInfo.vue
@@ -273,7 +273,13 @@
 <script setup lang="ts">
 import { ref, onMounted } from "vue";
 import { AuthManager } from "@/utils/AuthManager";
-import { UserInfo, Board, BoardStatus } from "@/APIClient";
+import {
+  UserInfo,
+  Board,
+  BoardStatus,
+  DataClient,
+  JtagClient,
+} from "@/APIClient";
 import { Alert, useAlertStore } from "@/components/Alert";
 import {
  User,
@@ -319,7 +325,7 @@ const loadBoardInfo = async () => {
  }

  try {
-    const client = AuthManager.createAuthenticatedDataClient();
+    const client = AuthManager.createClient(DataClient);
    boardInfo.value = await client.getBoardByID(userInfo.value.boardID);
  } catch (err) {
    console.error("加载实验板信息失败:", err);
@@ -335,7 +341,7 @@ const loadUserInfo = async (showSuccessMessage = false) => {
  try {
    await new Promise((resolve) => setTimeout(resolve, 200));

-    const client = AuthManager.createAuthenticatedDataClient();
+    const client = AuthManager.createClient(DataClient);
    userInfo.value = await client.getUserInfo();

    // 如果有绑定的实验板ID，加载实验板信息
@@ -370,7 +376,7 @@ const applyBoard = async () => {
  alertStore?.info("正在申请实验板...");

  try {
-    const client = AuthManager.createAuthenticatedDataClient();
+    const client = AuthManager.createClient(DataClient);

    // 获取可用的实验板
    const availableBoard = await client.getAvailableBoard(undefined);
@@ -407,7 +413,7 @@ const testBoardConnection = async () => {
  alertStore?.info("正在测试连接...");

  try {
-    const jtagClient = AuthManager.createAuthenticatedJtagClient();
+    const jtagClient = AuthManager.createClient(JtagClient);

    // 使用JTAG客户端读取设备ID Code
    const idCode = await jtagClient.getDeviceIDCode(
@@ -444,7 +450,7 @@ const unbindBoard = async () => {
  alertStore?.info("正在解绑实验板...");

  try {
-    const client = AuthManager.createAuthenticatedDataClient();
+    const client = AuthManager.createClient(DataClient);
    const success = await client.unbindBoard();

    if (success) {