@ditari/bsui 1.1.28 → 1.1.30

package/example/utils/http.ts

@@ -0,0 +1,107 @@
+import axios from "axios";
+import { message as Message, Modal } from "ant-design-vue";
+import type {
+  AxiosInstance,
+  InternalAxiosRequestConfig,
+  AxiosResponse
+} from "axios";
+
+const cancelSource = axios.CancelToken.source();
+const http: AxiosInstance = axios.create({
+  baseURL: "http://172.16.10.34:1243/",
+  timeout: 1000 * 10 * 60,
+  cancelToken: cancelSource.token,
+  withCredentials: true
+});
+
+// 因为现在的后台接口状态码真是TMD没统一
+const SUCCESS_CODE = ["200", "0"];
+// 登录失效状态码
+const EXPIRED_STATUS_CODE = ["401", "403"];
+// 超额状态码
+const OVER_AMOUNT_CODE = ["1056"];
+const BLACK_URL = ["/login"];
+
+http.interceptors.request.use((config: InternalAxiosRequestConfig) => {
+  if (!BLACK_URL.includes(config.url as any)) {
+    // 没有包含login的url 才添加token
+    // config.headers["Authorization"] = getToken;
+  }
+  return config;
+});
+
+http.interceptors.response.use(
+  async ({ data }: AxiosResponse) => {
+    const { code, data: content, message } = data;
+    const successStatus = SUCCESS_CODE.includes(code);
+
+    // 状态码在SUCCESS_CODE 里面表示成功
+    if (successStatus) {
+      // 返回响应内容
+      return content;
+    }
+
+    switch (code) {
+      case EXPIRED_STATUS_CODE[0]:
+      case EXPIRED_STATUS_CODE[1]:
+        handleExpiredToken();
+        break;
+      case OVER_AMOUNT_CODE[0]:
+        handleOverAmount(message);
+        break;
+      default:
+        handleDefaultError(message);
+        break;
+    }
+    return Promise.reject(data);
+  },
+  (error) => {
+    // 网络超时异常处理
+    if (
+      error.code === "ECONNABORTED" ||
+      error.message === "Network Error" ||
+      error.message.includes("timeout")
+    ) {
+      handleTimeoutError();
+    }
+    return Promise.reject(error);
+  }
+);
+
+function handleExpiredToken() {
+  cancelSource.cancel("token失效，取消后续请求");
+  sessionStorage.clear();
+  Message.warn({ content: "登录失效，请重新登录", duration: 5 });
+  setTimeout(() => {
+    location.href = (import.meta.env.VITE_APP_BASE_URL || "") + "/login";
+  }, 2000);
+}
+
+function handleOverAmount(message: string) {
+  Modal.confirm({
+    title: "超额提示",
+    content: message,
+    centered: true,
+    okText: "明白",
+    cancelText: "关闭",
+    onCancel() {
+      Modal.destroyAll();
+    }
+  });
+}
+
+function handleDefaultError(message: string) {
+  Message.warn({
+    content: message || "未知错误，请联系后台开发人员！！！",
+    duration: 6
+  });
+}
+
+function handleTimeoutError() {
+  Message.error({
+    content: "请求超时，请稍后重试",
+    duration: 6
+  });
+}
+
+export default http;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ditari/bsui",
-  "version": "1.1.28",
+  "version": "1.1.30",
   "description": "",
   "keywords": [],
   "author": "",

package/src/table/Table.tsx

@@ -71,11 +71,12 @@ const basePageClassName = `${prefixName}-pagination`;
  */
 const DXTable = defineComponent({
   name: "DTable",
+  inheritAttrs: false,
   props: tableProps(),
   // emits: {  "update:keys": (keys: []) => void }
   // TODO 需要做调整
   emits: ["update:keys"],
-  setup: function (props, { emit, slots }) {
+  setup: function (props, { emit, slots, attrs }) {
     //分页默认配置
     const paginationConfig = reactive({
       defaultPageSize: 20,
@@ -155,6 +156,7 @@ const DXTable = defineComponent({
             paginationHeight = useEleHeight(paginationEl as any) ?? 0;
           }
           tableHeight.value = height - (headerHeight + paginationHeight);
+
           // 设置body高度
           tableEl.getElementsByClassName("ant-table-body")[0].style.height =
             tableHeight.value + "px";
@@ -171,9 +173,9 @@ const DXTable = defineComponent({
           nextTick(() => {
             // 必须在组件挂载成功后 执行计算高度 否则无法正确获取元素的高度
             setTimeout(() => {
-              // 如果表格头 有多行的清空下，获取到的头部高度不对，需要延迟执行获取高度方法
+              // 如果表格头有很多列的情况下，获取到的头部高度不对，需要延迟执行获取高度方法
               playHeight(props.height);
-            }, 10);
+            }, 100);
           });
         }
       });
@@ -396,11 +398,12 @@ const DXTable = defineComponent({
     };
 
     return () => (
-      <div ref={tableRootRef} style={{ height: "100%" }}>
+      <div ref={tableRootRef}>
         <Table
           ref={tableRef}
           row-key={props.rowKey}
           bordered={props.config.bordered}
+          {...attrs}
           columns={columns.value}
           dataSource={dataSource.value}
           loading={props.loading}