feat:调整文件目录结构；列表滚动

src/pages/detail/detail.vue

@@ -16,7 +16,7 @@
   </uni-nav-bar>
 
   <scroll-view class="page" scroll-y @scroll="onScroll">
-    <view class="image" style="background-image: url(http://dummyimage.com/100x100/ac0ee3&text=其)">
+    <view class="image" style="background-image: url(http://dummyimage.com/100x100/ac0ee3)">
       <view class="info">
         <image class="avatar" src="" />
         <view class="name">{{ "啊发发" }}</view>
@@ -31,7 +31,7 @@
     </view>
     <view class="album">
       <view class="title">相册</view>
-      <image class="photo" v-for="(item, index) in 5" :key="index" src="http://dummyimage.com/100x100/ac0ee3&text=其" />
+      <image class="photo" v-for="(item, index) in 5" :key="index" src="http://dummyimage.com/100x100/ac0ee3" />
     </view>
     <view class="evaluate">
       <view class="title">评价1+</view>

src/pages/home/home.vue

@@ -22,175 +22,110 @@
     <template v-slot:right></template>
   </uni-nav-bar>
 
-  <view class="home-page">
-    <scroll-view
-      class="user-list"
-      scroll-y
-      refresher-enabled
-      refresher-background="#222"
-      :refresher-triggered="refresherTriggered"
-      :refresher-threshold="100"
-      @refresherpulling="onRefresherPulling"
-      @refresherrefresh="onRefresherRefresh"
-      @refresherrestore="onRefresherRestore"
-      @refresherabort="onRefresherAbort"
-      @scrolltolower="onScrollToLower"
-      @scroll="onScroll"
-    >
-      <view class="user-card" v-for="user in userList" :key="user.id" @click="detail">
-        <image class="user-image" :src="user.avatar" />
-        <view class="user-info">
-          <view class="user">
-            <text class="user-name">{{ user.name }}</text>
-            <text class="user-status">{{ user.status || "离线" }}</text>
-          </view>
-          <view class="verification">
-            <text class="verify-badge">真人认证</text>
-          </view>
-          <view class="user-details">
-            <text class="tag">{{ user.gender }}·{{ user.age }}岁</text>
-            <text class="tag">{{ user.height }}cm</text>
-            <text class="tag">{{ user.weight }}kg</text>
-            <text class="tag">{{ user.occupation }}</text>
-            <text class="tag">{{ user.distance }}km</text>
-          </view>
+  <scroll-view
+    class="user-list"
+    scroll-y
+    refresher-enabled
+    refresher-background="#222"
+    :refresher-triggered="refresherTriggered"
+    :refresher-threshold="100"
+    @refresherrefresh="onRefresherRefresh"
+    @refresherabort="onRefresherAbort"
+    @scrolltolower="onScrollToLower"
+    @scroll="onScroll"
+  >
+    <view class="user-card" v-for="user in makeFriendList" :key="user.id" @click="detail">
+      <image class="user-image" :src="user.avatar" />
+      <view class="user-info">
+        <view class="user">
+          <text class="user-name">{{ user.name }}</text>
+          <text class="user-status">{{ user.status || "离线" }}</text>
+        </view>
+        <view class="verification">
+          <text class="verify-badge">真人认证</text>
+        </view>
+        <view class="user-details">
+          <text class="tag">{{ user.gender }}·{{ user.age }}岁</text>
+          <text class="tag">{{ user.height }}cm</text>
+          <text class="tag">{{ user.weight }}kg</text>
+          <text class="tag">{{ user.occupation }}</text>
+          <text class="tag">{{ user.distance }}km</text>
         </view>
       </view>
-
-      <!-- 加载更多组件 -->
-      <uni-load-more :status="loadMoreStatus" :content-text="loadMoreContent" @clickLoadMore="onClickLoadMore" />
-
-      <view style="height: 100rpx"></view>
-    </scroll-view>
-  </view>
+    </view>
+    <uni-load-more :status="loadMoreStatus" :content-text="loadMoreContent" @clickLoadMore="onClickLoadMore" />
+    <view style="height: 100rpx"></view>
+  </scroll-view>
 </template>
 
 <script setup lang="ts">
 import { ref, reactive, onMounted } from "vue";
 import segmented from "@/sheep/components/segmented/segmented.vue";
+import makeFriendApi from "@/sheep/api/make-friend";
 
 const current = ref(0);
 const segmentedItems = ["广场", "最近", "新人"];
 
-interface User {
-  id: number;
-  name: string;
-  avatar: string;
-  gender: string;
-  age: number;
-  height: string;
-  weight: string;
-  occupation: string;
-  distance: string;
-  photoCount: number;
-  isVip: boolean;
-  status?: string;
-}
-
-// 数据状态管理
-const userList = ref<User[]>([]);
 const refresherTriggered = ref(false);
 const loadMoreStatus = ref<"more" | "loading" | "noMore">("more");
 const loadMoreContent = reactive({
-  contentdown: "上拉显示更多",
+  contentdown: " ",
   contentrefresh: "正在加载...",
   contentnomore: "没有更多数据了",
 });
 
-// 分页参数
+const makeFriendList = ref<any[]>([]);
 const pageInfo = reactive({
-  current: 1,
-  pageSize: 10,
+  current: 0,
   total: 0,
   hasMore: true,
 });
 
-// 模拟数据
-const mockUsers: User[] = Array.from({ length: 70 }).map((_, index) => ({
-  id: index,
-  name: "山峰",
-  avatar: "/static/avatar2.jpg",
-  gender: "男",
-  age: 30,
-  height: "185",
-  weight: "75",
-  occupation: "健身教练",
-  distance: "5.2",
-  photoCount: 3,
-  isVip: false,
-  status: "在线",
-}));
-
-// 模拟API请求
-const fetchUserList = async (page: number = 1, isRefresh: boolean = false) => {
+const loadData = async (isRefresh: boolean = false) => {
   try {
-    // 模拟网络延迟
-    await new Promise((resolve) => setTimeout(resolve, 1000));
-
-    const startIndex = (page - 1) * pageInfo.pageSize;
-    const endIndex = startIndex + pageInfo.pageSize;
-    const newUsers = mockUsers.slice(startIndex, endIndex);
+    const { total, data } = await makeFriendApi.getMakeFriendList(pageInfo.current + 1);
+    pageInfo.total = total;
 
     if (isRefresh) {
-      userList.value = newUsers;
-      pageInfo.current = 1;
+      makeFriendList.value = data;
+      pageInfo.current = pageInfo.current + 1;
     } else {
-      userList.value.push(...newUsers);
+      makeFriendList.value.push(...data);
+      pageInfo.current = pageInfo.current + 1;
     }
 
-    pageInfo.current = page;
-    pageInfo.total = mockUsers.length;
-    pageInfo.hasMore = endIndex < mockUsers.length;
-
-    // 更新加载状态
-    if (pageInfo.hasMore) {
-      loadMoreStatus.value = "more";
-    } else {
+    if (makeFriendList.value.length >= total) {
       loadMoreStatus.value = "noMore";
+    } else {
+      loadMoreStatus.value = "more";
     }
 
     return true;
   } catch (error) {
-    console.error("获取用户列表失败:", error);
-    uni.showToast({
-      title: "加载失败",
-      icon: "none",
-    });
+    console.error("加载数据失败:", error);
     return false;
   }
 };
 
-// 下拉刷新事件
-const onRefresherPulling = () => {
-  console.log("下拉刷新中...");
-};
-
 const onRefresherRefresh = async () => {
   console.log("触发下拉刷新");
   refresherTriggered.value = true;
 
-  const success = await fetchUserList(1, true);
+  pageInfo.current = 0;
+  const success = await loadData(true);
 
   refresherTriggered.value = false;
 
   if (success) {
-    uni.showToast({
-      title: "刷新成功",
-      icon: "success",
-    });
+    uni.showToast({ title: "刷新成功", icon: "success" });
   }
 };
 
-const onRefresherRestore = () => {
-  console.log("下拉刷新复位");
-};
-
 const onRefresherAbort = () => {
   console.log("下拉刷新中止");
   refresherTriggered.value = false;
 };
 
-// 上拉加载更多
 const onScrollToLower = async () => {
   if (loadMoreStatus.value === "loading" || loadMoreStatus.value === "noMore") {
     return;
@@ -199,35 +134,27 @@ const onScrollToLower = async () => {
   console.log("触发上拉加载更多");
   loadMoreStatus.value = "loading";
 
-  const success = await fetchUserList(pageInfo.current + 1, false);
-
-  if (!success) {
-    loadMoreStatus.value = "more";
-  }
+  await loadData(false);
 };
 
-// 点击加载更多
 const onClickLoadMore = () => {
   if (loadMoreStatus.value === "more") {
     onScrollToLower();
   }
 };
 
-// 滚动事件
 const onScroll = (e: any) => {
-  // console.log('滚动事件:', e.detail);
+  // console.log('滚动:', e.detail);
 };
 
-// 用户详情
-function detail() {
+const detail = () => {
   uni.navigateTo({
     url: "/pages/detail/detail",
   });
-}
+};
 
-// 页面加载时获取数据
 onMounted(() => {
-  fetchUserList(1, true);
+  loadData(false);
 });
 </script>
 
@@ -240,70 +167,67 @@ onMounted(() => {
   align-items: center;
   font-size: $font-size-medium;
 }
-.home-page {
+.user-list {
   background-color: $color-background;
   height: calc(100vh - 100rpx - 100rpx);
-  .user-list {
-    height: 100%;
-    .user-card {
+  .user-card {
+    height: 300rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 30rpx;
+    .user-image {
+      width: 200rpx;
       height: 300rpx;
+      margin-right: 20rpx;
+      border-radius: 16rpx;
+      background-color: #777777;
+    }
+    .user-info {
+      flex: 1;
+      width: 100%;
+      height: 100%;
       display: flex;
-      justify-content: center;
-      align-items: center;
-      padding: 30rpx;
-      .user-image {
-        width: 200rpx;
-        height: 300rpx;
-        margin-right: 20rpx;
-        border-radius: 16rpx;
-        background-color: #777777;
-      }
-      .user-info {
-        flex: 1;
-        width: 100%;
-        height: 100%;
+      flex-direction: column;
+      justify-content: start;
+      .user {
         display: flex;
-        flex-direction: column;
-        justify-content: start;
-        .user {
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          margin-top: 16rpx;
-          .user-name {
-            font-size: $font-size-large;
-            font-weight: bold;
-          }
-          .user-status {
-            background-color: $color-theme-d;
-            font-size: $font-size-small;
-            padding: 10rpx 20rpx;
-            border-radius: 36rpx;
-            color: white;
-          }
+        align-items: center;
+        justify-content: space-between;
+        margin-top: 16rpx;
+        .user-name {
+          font-size: $font-size-large;
+          font-weight: bold;
         }
-        .verification {
-          margin-top: 16rpx;
-          .verify-badge {
-            background-color: $color-theme;
-            font-size: $font-size-small;
-            color: black;
-            padding: 6rpx 12rpx;
-            border-radius: 6rpx;
-          }
-        }
-        .user-details {
-          margin-top: 26rpx;
-          display: flex;
-          flex-wrap: wrap;
-          gap: 20rpx;
+        .user-status {
+          background-color: $color-theme-d;
           font-size: $font-size-small;
-          color: $color-text-ll;
-          .tag {
-            background-color: $color-highlight-background;
-            padding: 10rpx 16rpx;
-            border-radius: 6rpx;
-          }
+          padding: 10rpx 20rpx;
+          border-radius: 36rpx;
+          color: white;
+        }
+      }
+      .verification {
+        margin-top: 16rpx;
+        .verify-badge {
+          background-color: $color-theme;
+          font-size: $font-size-small;
+          color: black;
+          padding: 6rpx 12rpx;
+          border-radius: 6rpx;
+        }
+      }
+      .user-details {
+        margin-top: 26rpx;
+        display: flex;
+        flex-wrap: wrap;
+        gap: 20rpx;
+        font-size: $font-size-small;
+        color: $color-text-ll;
+        .tag {
+          background-color: $color-highlight-background;
+          padding: 10rpx 16rpx;
+          border-radius: 6rpx;
         }
       }
     }

src/pages/messages/messages.vue

@@ -22,7 +22,7 @@
             <text class="time">{{ message.time }}</text>
           </view>
           <view class="bottom">
-            <text class="text">{{ message.lastMessage }}吼吼吼吼吼吼吼吼吼吼吼吼吼吼吼吼</text>
+            <text class="text">{{ message.lastMessage }}</text>
           </view>
         </view>
       </view>

src/sheep/api/make-friend.ts

@@ -0,0 +1,43 @@
+// import request from "@/sheep/request";
+
+const mockUsers = Array.from({ length: 26 }).map((_, index) => ({
+  id: index,
+  name: "山峰" + (index + 1),
+  avatar: "/static/avatar2.jpg",
+  gender: "男",
+  age: 30,
+  height: "185",
+  weight: "75",
+  occupation: "健身教练",
+  distance: "5.2",
+  photoCount: 3,
+  isVip: false,
+  status: "在线",
+}));
+
+const makeFriendApi = {
+  // 获得用户收件地址列表
+  // getAddressList: () => {
+  // return request({
+  //   url: "/member/address/list",
+  //   method: "GET",
+  // });
+  // },
+
+  getMakeFriendList: async (page: number = 1, pageSize: number = 10) => {
+    await new Promise((resolve) => setTimeout(resolve, 1000));
+
+    const startIndex = (page - 1) * pageSize;
+    const endIndex = startIndex + pageSize;
+    const newUsers = mockUsers.slice(startIndex, endIndex);
+
+    return {
+      page,
+      pageSize,
+      total: 26,
+      data: newUsers,
+    };
+  },
+};
+
+export default makeFriendApi;