From 9126b65e2887d559dedf2792c9b8010bbba78d8f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8E=E8=82=96=E7=A3=8A?= <18851179580@163.com>
Date: Mon, 2 Dec 2024 16:42:55 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=AF=B7=E6=B1=82=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91=E5=A4=84=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/filter-form/index.vue   | 18 ++++++++++++++++-
 .../model-custom/model-custom-content.vue     |  4 +++-
 src/utils/request.ts                          | 20 +++++++++++++++++++
 3 files changed, 40 insertions(+), 2 deletions(-)

diff --git a/src/components/common/filter-form/index.vue b/src/components/common/filter-form/index.vue
index c4821c6e..db5e9408 100644
--- a/src/components/common/filter-form/index.vue
+++ b/src/components/common/filter-form/index.vue
@@ -2,7 +2,7 @@
     <div :class="props.direction == 'vertical' ? 'flex-col gap-x-18' : 'flex-row gap-y-20 jc-e'">
         <div v-for="(item, index) in props.filterData" :key="index" class="filter-style flex-row gap-12">
             <div v-if="!isEmpty(item.title)" :class="['title text-line-1', props.direction == 'vertical' ? '' : 'horizontal-title']" :style="`width: ${ Number(props.titleWidth) > 0 ? props.titleWidth + 'px;' : '100%' }`">{{ item.title }}</div>
-            <div class="w h flex-1">
+            <div class="w h flex-1 vertical-style">
                 <template v-if="item.type == 'select'">
                     <template v-if="item.config.is_level.toString() == '1'">
                         <div class="flex-row gap-10">
@@ -164,6 +164,22 @@ const contains_value = (list: any[], config: any, result: any[], children?: stri
     min-height: 3.2rem;
     min-width: 20rem;
 }
+.vertical-style {
+    min-width: 20rem;
+}
+// 输入框超出隐藏，不换行
+:deep(.el-cascader) {
+    height: 3.2rem;
+    .el-input {
+        height: 3.2rem;
+    }
+    .el-cascader__tags {
+        flex-wrap: nowrap !important;
+    }
+    .el-tag {
+        max-width: 10rem;
+    }
+}
 .horizontal-title {
     flex-basis: max-content;
 }
diff --git a/src/components/model-custom/model-custom-content.vue b/src/components/model-custom/model-custom-content.vue
index 80c62bfe..8757794e 100644
--- a/src/components/model-custom/model-custom-content.vue
+++ b/src/components/model-custom/model-custom-content.vue
@@ -188,8 +188,10 @@ const default_data = () => {
         form.value.data_source_carousel_col = show_number[0];
     }
     // 如果存在默认数据类型的时候, 并且跟当前的不一致时，默认选中第一个
-    if (!isEmpty(data_type) && isEmpty(data_source_content.data_type) && !data_type.includes(data_source_content.data_type)) {
+    if (!isEmpty(data_type) && isEmpty(data_source_content.data_type) && !data_type.includes(Number(data_source_content.data_type))) {
         form.value.data_source_content.data_type = data_type[0];
+    } else if (!isEmpty(data_source_content.data_type) && typeof data_source_content.data_type == 'string') { // 老数据使用的是字符串类型，需要转换一下
+        form.value.data_source_content.data_type = Number(form.value.data_source_content.data_type);
     }
 }
 // 处理显示的图片和传递到下去的数据结构
diff --git a/src/utils/request.ts b/src/utils/request.ts
index 67899a4c..26f07979 100644
--- a/src/utils/request.ts
+++ b/src/utils/request.ts
@@ -20,6 +20,9 @@ const message_error = (info: string) => {
 // 创建一个状态变量来跟踪是否已经弹出了退出登录的弹窗
 const isLogoutModalShown = ref(true);
 
+// 用于存储每个请求的CancelToken
+const pendingRequests = new Map();
+
 // 创建 axios 实例
 const index = window.location.href.lastIndexOf('?s=');
 const pro_url = window.location.href.substring(0, index);
@@ -43,6 +46,17 @@ service.interceptors.request.use(
                 config.url = config.url + '&token=' + (JSON.parse(cookie) !== 'null' ? JSON.parse(cookie)?.token : '');
             }
         }
+        // 检查是否有相同请求正在进行，如果有则取消, 防止重复请求导致返回数据有误
+        if (pendingRequests.has(config.url)) {
+            const cancelToken = pendingRequests.get(config.url);
+            cancelToken.cancel('canceled');
+            pendingRequests.delete(config.url);
+        }
+        // 创建一个新的 CancelToken
+        const source = axios.CancelToken.source();
+        config.cancelToken = source.token;
+        pendingRequests.set(config.url, source);
+
         return config;
     },
     (error: any) => {
@@ -52,6 +66,9 @@ service.interceptors.request.use(
 // 响应拦截器
 service.interceptors.response.use(
     (response: AxiosResponse) => {
+        // 请求完成后，从pendingRequests中移除
+        pendingRequests.delete(response.config.url);
+
         const { code, msg, message, data } = response.data;
         if (code == 0) {
             return response.data;
@@ -74,9 +91,12 @@ service.interceptors.response.use(
         }
     },
     (error: any) => {
+        console.log(error);
         if (error.response && error.response.data) {
             const { msg, message } = error.response.data;
             message_error(msg || message || '系统出错');
+        } else if (error.message == 'canceled') {
+            console.log('请求已取消');
         } else {
             message_error(error.message);
         }