修该关注页

src/components/FollowUserCard/index.scss

@@ -5,7 +5,9 @@
   align-items: center;
   padding: 8px 20px;
   background: #ffffff;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+  height: 56px;
+  margin-top: 12px;
+  box-sizing: border-box;
   
   .user_info {
     display: flex;

src/components/FollowUserCard/index.tsx

@@ -92,7 +92,7 @@ const FollowUserCard: React.FC<FollowUserCardProps> = ({ user, onFollowChange })
         <View className="user_details">
           <Text className="nickname">{user.nickname}</Text>
           <Text className="signature">
-            {user.personal_profile || '签名写在这里'}
+            {user.personal_profile?.replace(/\n/g, ' ') || '签名写在这里'}
           </Text>
         </View>
       </View>

src/components/UserInfo/index.scss

@@ -96,8 +96,8 @@
         &.clickable {
           cursor: pointer;
           transition: all 0.2s ease;
-          padding: 4px 8px;
-          border-radius: 8px;
+          // padding: 4px 8px;
+          // border-radius: 8px;
 
           &:hover {
             background-color: rgba(0, 0, 0, 0.05);

src/static/userInfo/back_icon.svg

@@ -0,0 +1,3 @@
+<svg width="11" height="20" viewBox="0 0 11 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.66675 18L1.66675 10L9.66675 2" stroke="black" stroke-width="2.66667" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/user_pages/follow/index.scss

@@ -1,7 +1,8 @@
 // 球友关注页面样式
 .follow_page {
   min-height: 100vh;
-  background: #FAFAFA;
+  display: flex;
+  flex-direction: column;
 
   // 导航栏内容
   .navbar_content {
@@ -20,9 +21,9 @@
       margin-left: 10px;
 
       .back_icon {
-        width: 8px;
         height: 16px;
-        background: url("data:image/svg+xml,%3Csvg width='8' height='16' viewBox='0 0 8 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.66667 2L1.33333 8L6.66667 14' stroke='%23000000' stroke-width='2.66667' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
+        width: 8px;
+        background: url("../../static/userInfo/back_icon.svg") no-repeat center;
         background-size: contain;
       }
     }
@@ -64,7 +65,12 @@
     background: #ffffff;
     height: 44px;
     overflow-x: auto;
-    margin-top: 110px;
+    position: fixed;
+    top: 110px;
+    left: 0;
+    right: 0;
+    z-index: 100;
+    flex-shrink: 0;
 
 
     .tab_item {
@@ -124,13 +130,13 @@
         .tab_text {
           font-weight: 600 !important;
           color: #000000 !important;
-        }
+          position: relative;
           
-        // 下边框
+          // 下边框只应用在文字上
           &::after {
             content: '';
             position: absolute;
-          bottom: 0;
+            bottom: -8px; // 调整距离文字底部的位置
             left: 0;
             right: 0;
             height: 2px;
@@ -138,6 +144,7 @@
             z-index: 1;
           }
         }
+      }
 
       // 移除默认的粉丝标签激活样式，完全依赖 active 类
     }
@@ -145,9 +152,13 @@
 
   // 用户列表容器
   .user_list_container {
-    flex: 1;
-    margin-top: 12px;
+    position: absolute;
+    top: 154px; // 110px(导航栏高度) + 44px(tab导航高度)
+    left: 0;
+    right: 0;
+    bottom: 0;
     background: #ffffff;
+    overflow-y: auto;
 
     // 加载状态提示
     .loading_tip,

src/user_pages/follow/index.tsx

@@ -97,10 +97,8 @@ const FollowPage: React.FC = () => {
 
     set_active_tab(tab);
 
-    // 如果该标签页还没有数据，则加载
-    if (user_lists[tab].length === 0) {
+    // 每次切换tab都重新加载数据
     load_user_list(tab, true);
-    }
   };
 
   // 处理关注状态变化
@@ -108,16 +106,16 @@ const FollowPage: React.FC = () => {
     try {
       if (is_following) {
         await FollowService.follow_user(user_id);
-        Taro.showToast({
-          title: '关注成功',
-          icon: 'success'
-        });
+        // Taro.showToast({
+        //   title: '关注成功',
+        //   icon: 'success'
+        // });
       } else {
         await FollowService.unfollow_user(user_id);
-        Taro.showToast({
-          title: '取消关注成功',
-          icon: 'success'
-        });
+        // Taro.showToast({
+        //   title: '取消关注成功',
+        //   icon: 'success'
+        // });
       }
 
       // 更新用户列表中的关注状态