@moluoxixi/ajax-package 0.0.12 → 0.0.14-beta.1

package/es/index.mjs

@@ -2,9 +2,9 @@
   "use strict";
   try {
     if (typeof document !== "undefined") {
-      if (!document.getElementById("c6a35fc5-e19d-40c8-8129-fe6481835a30")) {
+      if (!document.getElementById("ffe3dd99-bf7e-4730-8936-fd7b509c3c02")) {
         var elementStyle = document.createElement("style");
-        elementStyle.id = "c6a35fc5-e19d-40c8-8129-fe6481835a30";
+        elementStyle.id = "ffe3dd99-bf7e-4730-8936-fd7b509c3c02";
         elementStyle.appendChild(document.createTextNode("._root_11p33_1 .el-dialog__header {\n  padding: 0 12px 12px;\n}\n\n._root_11p33_1 .el-dialog__body {\n  border-top: 1px solid #e5e7eb;\n  border-bottom: 1px solid #e5e7eb;\n  padding: 0 12px;\n}\n\n._root_11p33_1 .el-dialog__footer {\n  padding: 0 12px;\n}"));
         document.head.appendChild(elementStyle);
       }
@@ -12170,7 +12170,11 @@ function extractSystemErrorInfo(response, code, message2) {
     errorMessage: message2
   };
 }
-function defaultOnLoginRequired() {
+function defaultOnLoginRequired(messageInstance) {
+  messageInstance == null ? void 0 : messageInstance.error({
+    message: "登录已过期，请重新登录",
+    duration: 5 * 1e3
+  });
   if (typeof window !== "undefined") {
     window.location.href = `/login?redirect=${encodeURIComponent(window.location.href)}`;
   }
@@ -12179,6 +12183,10 @@ function defaultGetToken() {
   return typeof localStorage !== "undefined" ? localStorage.getItem("token") || "" : "";
 }
 class BaseHttpClient {
+  /**
+   * 创建 BaseHttpClient 实例
+   * @param config - HTTP 客户端配置对象
+   */
   constructor(config) {
     __publicField(this, "baseURL", "");
     __publicField(this, "timeout", 5e3);
@@ -12208,18 +12216,101 @@ class BaseHttpClient {
       baseURL: this.baseURL,
       timeout: this.timeout,
       ...axiosConfig
+      // 将所有剩余参数传给axios.create
     });
     this.setupInterceptors();
   }
+  /**
+   * 处理请求配置，子类可重写此方法自定义请求配置
+   * @param config - 请求配置对象
+   * @returns 处理后的请求配置
+   */
   processRequestConfig(config) {
     return config;
   }
+  /**
+   * 处理响应配置，子类可重写此方法自定义响应处理
+   * 按照标准 HTTP 结构处理响应
+   * @param response - Axios 响应对象
+   * @returns 解析后的响应数据
+   */
   processResponseConfig(response) {
+    this.handleHttpStatus(response);
+    return this.handleSuccessResponse(response);
+  }
+  /**
+   * 处理 HTTP 状态码
+   * 子类可重写此方法来自定义 HTTP 状态码处理逻辑
+   * @param response - Axios 响应对象
+   */
+  handleHttpStatus(response) {
+    var _a2;
+    if (response.status !== 200) {
+      throw new Error(((_a2 = response.data) == null ? void 0 : _a2.message) || `HTTP Error: ${response.status}`);
+    }
+  }
+  /**
+   * 处理成功响应
+   * 子类可重写此方法来自定义成功响应的处理逻辑
+   * @param response - Axios 响应对象
+   * @returns 解析后的响应数据
+   */
+  handleSuccessResponse(response) {
     return response.data;
   }
+  /**
+   * 处理响应错误，子类可重写此方法自定义错误处理
+   * 按照标准 HTTP 错误结构处理错误
+   * @param error - Axios 错误对象
+   * @returns 处理后的错误对象
+   */
   async processResponseError(error) {
+    this.handleAuthenticationError(error);
+    this.handleTimeoutError(error);
+    this.handleNetworkError(error);
     return error;
   }
+  /**
+   * 处理认证错误（401 - 未授权/登录失效）
+   * 子类可重写此方法来自定义认证错误处理逻辑
+   * @param error - Axios 错误对象
+   */
+  handleAuthenticationError(error) {
+    var _a2, _b;
+    if (((_a2 = error.response) == null ? void 0 : _a2.status) === 401) {
+      (_b = this.onLoginRequired) == null ? void 0 : _b.call(this, this.messageInstance);
+    }
+  }
+  /**
+   * 处理超时错误
+   * 子类可重写此方法来自定义超时错误处理逻辑
+   * @param error - Axios 错误对象
+   */
+  handleTimeoutError(error) {
+    if (error.code === "ECONNABORTED" && error.message.includes("timeout")) {
+      this.onTimeout(this.messageInstance);
+    }
+  }
+  /**
+   * 处理网络错误（其他错误）
+   * 子类可重写此方法来自定义网络错误处理逻辑
+   * @param error - Axios 错误对象
+   */
+  handleNetworkError(error) {
+    var _a2, _b, _c;
+    if (((_a2 = error.response) == null ? void 0 : _a2.status) !== 401 && error.code !== "ECONNABORTED") {
+      const fallbackError = error;
+      (_c = this.messageInstance) == null ? void 0 : _c.error({
+        message: ((_b = fallbackError.response) == null ? void 0 : _b.data) || fallbackError.message || "网络错误",
+        duration: 5 * 1e3
+      });
+    }
+  }
+  /**
+   * 设置请求和响应拦截器
+   * 请求拦截器：自动添加 Token
+   * 响应拦截器：处理成功响应和错误响应（401、超时等）
+   */
   setupInterceptors() {
     this.instance.interceptors.request.use(
       (config) => {
@@ -12238,53 +12329,67 @@ class BaseHttpClient {
     );
     this.instance.interceptors.response.use(
       (res) => {
-        var _a2;
-        if (res.status !== 200) {
-          return Promise.reject(new Error(((_a2 = res.data) == null ? void 0 : _a2.message) || "Error"));
-        }
         return this.processResponseConfig(res);
       },
       async (error) => {
-        var _a2, _b, _c, _d, _e, _f;
         await this.processResponseError(error);
-        if (((_a2 = error.response) == null ? void 0 : _a2.status) === 401) {
-          (_b = this.onLoginRequired) == null ? void 0 : _b.call(this);
-          (_c = this.messageInstance) == null ? void 0 : _c.error({
-            message: "登录已过期，请重新登录",
-            duration: 5 * 1e3
-          });
-        } else if (error.code === "ECONNABORTED" && error.message.includes("timeout")) {
-          this.onTimeout();
-          (_d = this.messageInstance) == null ? void 0 : _d.error({
-            message: "请求超时，请检查网络连接或稍后重试",
-            duration: 5 * 1e3
-          });
-        } else {
-          const fallbackError = error;
-          (_f = this.messageInstance) == null ? void 0 : _f.error({
-            message: ((_e = fallbackError.response) == null ? void 0 : _e.data) || fallbackError.message || "网络错误",
-            duration: 5 * 1e3
-          });
-        }
         return Promise.reject(error);
       }
     );
   }
+  /**
+   * 发送 HTTP 请求，所有 HTTP 方法最终都调用此方法
+   * @param config - Axios 请求配置对象
+   * @returns 解析后的响应数据
+   */
   async request(config) {
     return this.instance.request(config);
   }
+  /**
+   * 发送 GET 请求
+   * @param url - 请求 URL 路径
+   * @param params - 查询参数对象
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
   async get(url, params, config) {
     return this.request({ ...config, url, method: "get", params });
   }
+  /**
+   * 发送 POST 请求
+   * @param url - 请求 URL 路径
+   * @param data - 请求体数据
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
   async post(url, data, config) {
     return this.request({ ...config, url, method: "post", data });
   }
+  /**
+   * 发送 DELETE 请求
+   * @param url - 请求 URL 路径
+   * @param params - 查询参数对象
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
   async delete(url, params, config) {
     return this.request({ ...config, url, method: "delete", params });
   }
+  /**
+   * 发送 PUT 请求
+   * @param url - 请求 URL 路径
+   * @param data - 请求体数据
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
   async put(url, data, config) {
     return this.request({ ...config, url, method: "put", data });
   }
+  /**
+   * 批量请求，并发发送多个请求
+   * @param requests - 请求配置数组或已发起的请求 Promise 数组
+   * @returns 所有请求的响应数据数组
+   */
   async all(requests) {
     if (!requests.length)
       return [];
@@ -12297,6 +12402,13 @@ class BaseHttpClient {
     const promises = requests.map((config) => this.request(config));
     return await Promise.all(promises);
   }
+  /**
+   * 文件上传，将文件包装为 FormData 发送
+   * @param url - 上传地址
+   * @param file - 文件对象
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
   async uploadFile(url, file, config) {
     const formData = new FormData();
     formData.append("file", file);
@@ -12308,6 +12420,25 @@ class BaseHttpClient {
       }
     });
   }
+  /**
+   * 下载文件，将 Blob 对象下载到本地
+   * @param blob - Blob 对象
+   * @param filename - 文件名，如果不提供则使用时间戳
+   */
+  downloadFile(blob, filename) {
+    if (typeof window === "undefined") {
+      console.warn("downloadFile: 非浏览器环境，无法下载文件");
+      return;
+    }
+    const url = window.URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    link.href = url;
+    link.download = filename || `download-${Date.now()}`;
+    document.body.appendChild(link);
+    link.click();
+    link.remove();
+    window.URL.revokeObjectURL(url);
+  }
 }
 async function dynamicImports(modulePromise, exportNames) {
   const module = await modulePromise;
@@ -12409,10 +12540,12 @@ function createApiDialog(DialogComponent) {
               cleanup();
             }
           },
+          // 监听关闭事件
           onClose: () => {
             reject(new Error("对话框已关闭"));
             cleanup();
           },
+          // 监听确认事件（如有）
           onConfirm: (data) => {
             resolve(data);
             cleanup();
@@ -12463,6 +12596,10 @@ function createApiDialog(DialogComponent) {
 const hasDocument = typeof document !== "undefined";
 let systemErrorDialogInstance = null;
 class BaseApi extends BaseHttpClient {
+  /**
+   * 创建 BaseApi 实例
+   * @param config - API 配置对象
+   */
   constructor(config) {
     const {
       responseFields,
@@ -12482,20 +12619,90 @@ class BaseApi extends BaseHttpClient {
     };
     this.enableSystemErrorDialog = enableSystemErrorDialog;
   }
+  /**
+   * 处理请求配置，子类可重写此方法自定义请求配置
+   * 显式声明以确保类型一致性，避免打包后的类型不兼容问题
+   * @param config - 请求配置对象
+   * @returns 处理后的请求配置
+   */
   processRequestConfig(config) {
     return super.processRequestConfig(config);
   }
+  /**
+   * 处理响应配置，子类可重写此方法自定义响应处理
+   * 显式声明以确保类型一致性，避免打包后的类型不兼容问题
+   * @param response - Axios 响应对象
+   * @returns 解析后的响应数据
+   */
+  processResponseConfig(response) {
+    return super.processResponseConfig(response);
+  }
+  /**
+   * 处理响应错误，子类可重写此方法自定义错误处理
+   * 显式声明以确保类型一致性，避免打包后的类型不兼容问题
+   * @param error - Axios 错误对象
+   * @returns 处理后的错误对象
+   */
   async processResponseError(error) {
     return super.processResponseError(error);
   }
-  processResponseConfig(response) {
-    const data = response.data;
-    const { code, message: message2, responseData } = this.parseResponseFields(data);
-    this.handleErrorCode(response, code, message2, responseData);
-    this.handleErrors(responseData);
+  /**
+   * 处理 HTTP 状态码
+   * 重写父类方法，确保子类可以重写此方法
+   * @param response - Axios 响应对象
+   */
+  handleHttpStatus(response) {
+    return super.handleHttpStatus(response);
+  }
+  /**
+   * 处理认证错误（401 - 未授权/登录失效）
+   * 重写父类方法，处理 HTTP 401 错误
+   * 子类可重写此方法来自定义 HTTP 认证错误处理逻辑
+   * @param error - Axios 错误对象
+   */
+  handleAuthenticationError(error) {
+    super.handleAuthenticationError(error);
+  }
+  /**
+   * 处理超时错误
+   * 重写父类方法，确保子类可以重写此方法
+   * @param error - Axios 错误对象
+   */
+  handleTimeoutError(error) {
+    return super.handleTimeoutError(error);
+  }
+  /**
+   * 处理网络错误（其他错误）
+   * 重写父类方法，确保子类可以重写此方法
+   * @param error - Axios 错误对象
+   */
+  handleNetworkError(error) {
+    return super.handleNetworkError(error);
+  }
+  /**
+   * 处理成功响应
+   * 重写父类方法，在标准 HTTP 成功响应基础上，处理业务特定的响应结构
+   * 支持嵌套路径解析，自动处理业务层的登录失效、系统异常等错误
+   * 注意：HTTP 层的错误（如 HTTP 401、超时等）由父类 BaseHttpClient 处理
+   * @param response - Axios 响应对象
+   * @returns 解析后的响应数据
+   */
+  handleSuccessResponse(response) {
+    const httpData = super.handleSuccessResponse(response);
+    const parsedFields = this.parseResponseFields(httpData);
+    const { code, message: message2, responseData } = parsedFields;
+    this.handleSystemError(response, code, message2, responseData);
+    this.handleBusinessError(code, message2);
+    this.handleErrorArray(responseData);
     this.handleTips(responseData);
     return responseData;
   }
+  /**
+   * 解析响应字段，支持嵌套路径解析
+   * 子类可重写此方法来自定义字段解析逻辑
+   * @param data - 响应数据对象
+   * @returns 解析后的字段值对象
+   */
   parseResponseFields(data) {
     var _a2, _b, _c;
     const getValueByPath = (obj, path) => {
@@ -12517,11 +12724,15 @@ class BaseApi extends BaseHttpClient {
     const responseData = getValueByPath(data, (_c = this.responseFields) == null ? void 0 : _c.data);
     return { code, message: message2, responseData };
   }
-  handleErrorCode(response, code, message2, responseData) {
-    var _a2;
-    if (code === 401) {
-      throw new Error("登录失效，请重新登录");
-    }
+  /**
+   * 处理系统异常错误（-1 - 系统异常）
+   * 子类可重写此方法来自定义系统异常处理逻辑
+   * @param response - Axios 响应对象
+   * @param code - 响应状态码
+   * @param message - 错误消息
+   * @param responseData - 响应数据
+   */
+  handleSystemError(response, code, message2, responseData) {
     if (code === -1) {
       if (this.enableSystemErrorDialog) {
         this.showSystemExceptionDialog(response, responseData, code, message2).catch((error) => {
@@ -12530,6 +12741,15 @@ class BaseApi extends BaseHttpClient {
       }
       throw new Error(message2 || "系统异常");
     }
+  }
+  /**
+   * 处理业务错误（其他非200错误码）
+   * 子类可重写此方法来自定义业务错误处理逻辑
+   * @param code - 响应状态码
+   * @param message - 错误消息
+   */
+  handleBusinessError(code, message2) {
+    var _a2;
     if (code && code !== 200) {
       (_a2 = this.messageInstance) == null ? void 0 : _a2.error({
         message: message2 || "请求失败",
@@ -12538,55 +12758,90 @@ class BaseApi extends BaseHttpClient {
       throw new Error(message2 || "请求失败");
     }
   }
-  handleErrors(responseData) {
-    var _a2, _b, _c;
+  /**
+   * 处理错误数组 errors（如果有配置）
+   * 子类可重写此方法来自定义错误数组处理逻辑
+   * @param responseData - 响应数据
+   */
+  handleErrorArray(responseData) {
+    var _a2;
     const errorsField = (_a2 = this.responseFields) == null ? void 0 : _a2.errors;
     if (errorsField) {
       const errors = responseData == null ? void 0 : responseData[errorsField];
       if (Array.isArray(errors) && errors.length) {
-        const html = errors.map((item) => `<div style="font-size: 14px;color:red">${item.code}：${item.message}</div>`).join("");
-        if (hasDocument) {
-          (_b = this.notificationInstance) == null ? void 0 : _b.call(this, {
-            title: "提示",
-            message: html,
-            type: "error"
-          });
-        } else {
-          const errorMessages = errors.map((item) => `${item.code}：${item.message}`).join("\n");
-          (_c = this.notificationInstance) == null ? void 0 : _c.call(this, {
-            title: "提示",
-            message: errorMessages,
-            type: "error"
-          });
-        }
+        this.showErrorArrayNotification(errors);
         throw new Error("请求错误");
       }
     }
   }
+  /**
+   * 显示错误数组通知
+   * 子类可重写此方法来自定义错误数组通知显示方式
+   * @param errors - 错误数组
+   */
+  showErrorArrayNotification(errors) {
+    var _a2, _b;
+    const html = errors.map((item) => `<div style="font-size: 14px;color:red">${item.code}：${item.message}</div>`).join("");
+    if (hasDocument) {
+      (_a2 = this.notificationInstance) == null ? void 0 : _a2.call(this, {
+        title: "提示",
+        message: html,
+        type: "error"
+      });
+    } else {
+      const errorMessages = errors.map((item) => `${item.code}：${item.message}`).join("\n");
+      (_b = this.notificationInstance) == null ? void 0 : _b.call(this, {
+        title: "提示",
+        message: errorMessages,
+        type: "error"
+      });
+    }
+  }
+  /**
+   * 处理提示信息 tips（如果有配置）
+   * 子类可重写此方法来自定义提示信息处理逻辑
+   * @param responseData - 响应数据
+   */
   handleTips(responseData) {
-    var _a2, _b, _c;
+    var _a2;
     const tipsField = (_a2 = this.responseFields) == null ? void 0 : _a2.tips;
     if (tipsField) {
       const tips = responseData == null ? void 0 : responseData[tipsField];
       if (Array.isArray(tips) && tips.length) {
-        const html = tips.map((item) => `<div style="font-size: 14px;color:#E6A23C">${item.code}：${item.message}</div>`).join("");
-        if (hasDocument) {
-          (_b = this.notificationInstance) == null ? void 0 : _b.call(this, {
-            title: "提示",
-            message: html,
-            type: "warning"
-          });
-        } else {
-          const tipMessages = tips.map((item) => `${item.code}：${item.message}`).join("\n");
-          (_c = this.notificationInstance) == null ? void 0 : _c.call(this, {
-            title: "提示",
-            message: tipMessages,
-            type: "warning"
-          });
-        }
+        this.showTipsNotification(tips);
       }
     }
   }
+  /**
+   * 显示提示信息通知
+   * 子类可重写此方法来自定义提示信息通知显示方式
+   * @param tips - 提示信息数组
+   */
+  showTipsNotification(tips) {
+    var _a2, _b;
+    const html = tips.map((item) => `<div style="font-size: 14px;color:#E6A23C">${item.code}：${item.message}</div>`).join("");
+    if (hasDocument) {
+      (_a2 = this.notificationInstance) == null ? void 0 : _a2.call(this, {
+        title: "提示",
+        message: html,
+        type: "warning"
+      });
+    } else {
+      const tipMessages = tips.map((item) => `${item.code}：${item.message}`).join("\n");
+      (_b = this.notificationInstance) == null ? void 0 : _b.call(this, {
+        title: "提示",
+        message: tipMessages,
+        type: "warning"
+      });
+    }
+  }
+  /**
+   * 显示系统异常对话框，当响应状态码为 -1 时调用
+   * @param response - Axios 响应对象
+   * @param responseData - 响应数据
+   * @param code - 错误状态码
+   * @param message - 错误消息
+   */
   async showSystemExceptionDialog(response, responseData, code, message2) {
     if (!hasDocument) {
       console.error("系统异常信息：", responseData);
@@ -12625,6 +12880,10 @@ class BaseApi extends BaseHttpClient {
       console.error("系统异常信息：", responseData);
     }
   }
+  /**
+   * 上报错误信息到服务器，默认实现仅显示提示，子类可重写实现真实上报
+   * @param errorInfo - 错误信息对象
+   */
   async reportError(errorInfo) {
     var _a2, _b;
     try {
@@ -12642,11 +12901,98 @@ class BaseApi extends BaseHttpClient {
       });
     }
   }
+  /**
+   * 发送 HTTP 请求，所有 HTTP 方法最终都调用此方法
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param config - Axios 请求配置对象
+   * @returns 解析后的响应数据
+   */
+  async request(config) {
+    return super.request(config);
+  }
+  /**
+   * 发送 GET 请求
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param url - 请求 URL 路径
+   * @param params - 查询参数对象
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
+  async get(url, params, config) {
+    return super.get(url, params, config);
+  }
+  /**
+   * 发送 POST 请求
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param url - 请求 URL 路径
+   * @param data - 请求体数据
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
+  async post(url, data, config) {
+    return super.post(url, data, config);
+  }
+  /**
+   * 发送 DELETE 请求
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param url - 请求 URL 路径
+   * @param params - 查询参数对象
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
+  async delete(url, params, config) {
+    return super.delete(url, params, config);
+  }
+  /**
+   * 发送 PUT 请求
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param url - 请求 URL 路径
+   * @param data - 请求体数据
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
+  async put(url, data, config) {
+    return super.put(url, data, config);
+  }
+  /**
+   * 批量请求，并发发送多个请求
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param requests - 请求配置数组或已发起的请求 Promise 数组
+   * @returns 所有请求的响应数据数组
+   */
+  async all(requests) {
+    return super.all(requests);
+  }
+  /**
+   * 文件上传，将文件包装为 FormData 发送
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param url - 上传地址
+   * @param file - 文件对象
+   * @param config - 额外的请求配置
+   * @returns 解析后的响应数据
+   */
+  async uploadFile(url, file, config) {
+    return super.uploadFile(url, file, config);
+  }
+  /**
+   * 下载文件，将 Blob 对象下载到本地
+   * 显式声明以确保类型一致性，子类可重写此方法
+   * @param blob - Blob 对象
+   * @param filename - 文件名，如果不提供则使用时间戳
+   */
+  downloadFile(blob, filename) {
+    return super.downloadFile(blob, filename);
+  }
 }
 function createHttpService(options = {}) {
   return new BaseApi(options);
 }
 const VueAxiosPlugin = {
+  /**
+   * 安装插件
+   * @param app - Vue 应用实例
+   * @param options - 插件配置选项
+   */
   install(app, options = {}) {
     const httpService = createHttpService(options.default ?? {});
     app.config.globalProperties.$http = httpService;
@@ -12827,10 +13173,12 @@ const SystemErrorDialog = defineComponent({
             h("span", { style: { fontWeight: "bold", fontSize: "16px" } }, props.title || "系统异常信息")
           ]),
           default: () => h("div", { style: { padding: 0, maxHeight: "500px", overflowY: "auto" } }, [
+            // 第一块：无法完成您的请求
             h("div", { style: { padding: "20px", borderBottom: "1px solid #ebeef5" } }, [
               h("h3", { style: { margin: "0 0 12px 0", fontSize: "16px", fontWeight: "bold", color: "#303133" } }, "无法完成您的请求"),
               h("p", { style: { margin: 0, color: "#606266", lineHeight: 1.5 } }, "系统在处理您的请求时遇到了问题，可能是由于服务暂时不可用。")
             ]),
+            // 第二块：技术摘要（可展开）
             h("div", { style: { borderBottom: "1px solid #ebeef5" } }, [
               h(
                 "div",
@@ -12892,6 +13240,7 @@ const SystemErrorDialog = defineComponent({
                 )
               ) : null
             ]),
+            // SkyWalking 按钮
             h("div", { style: { padding: "16px 20px", borderBottom: "1px solid #ebeef5" } }, [
               h(
                 ElButton,
@@ -12903,6 +13252,7 @@ const SystemErrorDialog = defineComponent({
                 { default: () => "📊 在SkyWalking中查看详情" }
               )
             ]),
+            // 黑色错误信息区域
             h("div", { style: { backgroundColor: "#2c3e50", color: "#fff", padding: "16px 20px", fontFamily: 'Monaco, Consolas, "Courier New", monospace', fontSize: "12px", lineHeight: 1.5, maxHeight: "200px", overflowY: "auto" } }, [
               h("div", { style: { marginBottom: "8px", color: "#ecf0f1" } }, `Trace ID: ${props.traceId || "a1b2c3d4-e5f6-7890-g1h2-i3j4k5l6m7n8"}`),
               h("div", { style: { color: "#e74c3c", fontWeight: "bold" } }, `Error: ${props.errorMessage || "Connection timeout after 5000ms"}`)