feat: 登录拦截功能完善

pages/module/recommend/RecommendPostsList.vue

@@ -7,7 +7,9 @@
         :key="index"
       >
         <view class="mk-card-item" @click="sendReply(item)">
-          <image :src="item.coverPhoto" mode="aspectFill"></image>
+          <Interceptor />
+          <image class="card-img" :src="item.coverPhoto" mode="aspectFill" />
+
           <view class="overlay-gradient">
             <text class="overlay-text">{{ item.topic }}</text>
           </view>
@@ -18,9 +20,11 @@
 </template>
 
 <script setup>
-import ModuleTitle from "@/components/ModuleTitle/index.vue";
 import { defineProps } from "vue";
-import { RECOMMEND_POSTS_TITLE } from "@/constant/constant.js";
+import { RECOMMEND_POSTS_TITLE } from "@/constant/constant";
+import { checkToken } from "@/hooks/useGoLogin";
+import Interceptor from "@/components/Interceptor/index.vue";
+import ModuleTitle from "@/components/ModuleTitle/index.vue";
 
 const props = defineProps({
   recommendTheme: {
@@ -30,63 +34,13 @@ const props = defineProps({
 });
 
 const sendReply = (item) => {
-  const topic = item.userInputContent || item.topic.replace(/^#/, "");
-  uni.$emit(RECOMMEND_POSTS_TITLE, topic);
+  checkToken().then(() => {
+    const topic = item.userInputContent || item.topic.replace(/^#/, "");
+    uni.$emit(RECOMMEND_POSTS_TITLE, topic);
+  });
 };
 </script>
 
 <style lang="scss" scoped>
-.container {
-  width: 100%;
-}
-
-.container-scroll {
-  display: flex;
-  flex-direction: row;
-  overflow-x: auto;
-  margin: 4px 0 6px;
-
-  .mk-card-item {
-    flex-shrink: 0; /* 关键：防止 flex 布局压缩子元素宽度 */
-    width: 142px;
-    height: 126px;
-    border-radius: 10px;
-    overflow: hidden;
-    margin-right: 8px;
-    position: relative;
-
-    image {
-      width: 100%;
-      height: 100%;
-      display: block;
-    }
-
-    /* 渐变背景层 */
-    .overlay-gradient {
-      position: absolute;
-      bottom: 0;
-      left: 0;
-      width: 100%;
-      height: 50px; /* 渐变层高度，可调 */
-      background: linear-gradient(
-        to bottom,
-        rgba(0, 0, 0, 0.001) 0%,
-        rgba(0, 0, 0, 0.5) 100%
-      );
-      display: flex;
-      align-items: flex-end; /* 文字贴近底部 */
-      padding: 0 8px 6px; /* 内边距让文字与边缘保持距离 */
-      box-sizing: border-box;
-    }
-
-    /* 渐变层上的文字 */
-    .overlay-text {
-      color: #fff;
-      font-weight: 500;
-      font-size: 12px;
-      text-align: left;
-      width: 100%;
-    }
-  }
-}
+@import "./styles/RecommendPostsList.scss";
 </style>

pages/module/recommend/styles/RecommendPostsList.scss

@@ -0,0 +1,53 @@
+.container {
+  width: 100%;
+}
+
+.container-scroll {
+  display: flex;
+  flex-direction: row;
+  overflow-x: auto;
+  margin: 4px 0 6px;
+}
+
+.mk-card-item {
+  flex-shrink: 0; /* 关键：防止 flex 布局压缩子元素宽度 */
+  width: 142px;
+  height: 126px;
+  border-radius: 10px;
+  overflow: hidden;
+  margin-right: 8px;
+  position: relative;
+
+  .card-img {
+    width: 100%;
+    height: 100%;
+    display: block;
+  }
+
+  /* 渐变背景层 */
+  .overlay-gradient {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 50px; /* 渐变层高度，可调 */
+    background: linear-gradient(
+      to bottom,
+      rgba(0, 0, 0, 0.001) 0%,
+      rgba(0, 0, 0, 0.5) 100%
+    );
+    display: flex;
+    align-items: flex-end; /* 文字贴近底部 */
+    padding: 0 8px 6px; /* 内边距让文字与边缘保持距离 */
+    box-sizing: border-box;
+  }
+
+  /* 渐变层上的文字 */
+  .overlay-text {
+    color: #fff;
+    font-weight: 500;
+    font-size: 12px;
+    text-align: left;
+    width: 100%;
+  }
+}