From b620d5c71d12a68d65974d57d7c73c7ade5b563f Mon Sep 17 00:00:00 2001
From: ctw <example@email.com>
Date: Mon, 17 Nov 2025 17:57:18 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=94=B6=E8=97=8F=E9=A1=B5=EF=BC=9B?=
 =?UTF-8?q?=E5=8F=91=E5=B8=83=E6=9C=8B=E5=8F=8B=E5=9C=88=EF=BC=9B=E6=9A=97?=
 =?UTF-8?q?=E8=89=B2=E4=B8=BB=E9=A2=98=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main.scss                                 |   8 +-
 src/main.ts                                   |  21 +-
 src/pages.json                                |   7 +
 src/pages/home/city.vue                       |  52 ++--
 src/pages/home/detail.vue                     | 162 ++++++------
 src/pages/home/home.vue                       | 144 +++++-----
 src/pages/login/login.vue                     | 165 ++++--------
 src/pages/messages/messages.vue               | 194 +++++---------
 src/pages/moments/moments.vue                 |  43 ++-
 src/pages/moments/publish.vue                 |  68 ++++-
 src/pages/profile/like.vue                    |  98 +++++++
 src/pages/profile/profile.vue                 | 169 ++++--------
 src/pages/profile/userinfo.vue                | 246 +++++++++---------
 src/sheep/api/member/recent.ts                |  26 ++
 src/sheep/components/moment/moment.vue        | 175 ++++---------
 .../components/s-uploader/s-uploader.vue      |   3 +-
 src/sheep/hooks/use-scroll.ts                 |  10 +-
 src/static/upload-icon.png                    | Bin 0 -> 1581 bytes
 src/uni.scss                                  |  30 ---
 19 files changed, 757 insertions(+), 864 deletions(-)
 create mode 100644 src/pages/profile/like.vue
 create mode 100644 src/static/upload-icon.png

diff --git a/src/main.scss b/src/main.scss
index 21ddc638..43cf570b 100644
--- a/src/main.scss
+++ b/src/main.scss
@@ -11,11 +11,7 @@ page {
 body,
 html {
   user-select: none;
-  background-color: $color-background;
-  color: $color-text;
+  background-color: #222222;
+  color: #ffffff;
   font-size: 14px;
 }
-
-:root {
-  --van-back-top-background: red;
-}
diff --git a/src/main.ts b/src/main.ts
index ecc0f9a7..d505a544 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,16 +1,33 @@
 import App from './App.vue';
-import { createSSRApp } from 'vue';
+import { createSSRApp, h, defineComponent } from 'vue';
 // @ts-ignore
 import { setupPinia } from './sheep/store';
 import './main.scss';
 import 'virtual:uno.css';
 import Vant from 'vant';
 import 'vant/lib/index.css';
+import { ConfigProvider } from 'vant';
+
+// 自定义vant组件颜色变量
+const THEME_VARS = {
+  primaryColor: '#ffcd32',
+  primaryColorDark: '#ffcd32',
+  primaryColorLight: '#ffcd32',
+  tabsBottomBarColor: '#ffcd32',
+};
+
+const AppWithConfigProvider = defineComponent({
+  setup() {
+    return () =>
+      h(ConfigProvider, { theme: 'dark', themeVars: THEME_VARS }, { default: () => h(App) });
+  },
+});
 
 export function createApp() {
-  const app = createSSRApp(App);
+  const app = createSSRApp(AppWithConfigProvider);
   setupPinia(app);
   app.use(Vant);
+  app.use(ConfigProvider);
   return {
     app,
   };
diff --git a/src/pages.json b/src/pages.json
index 11b9411b..910d1340 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -77,6 +77,13 @@
             "navigationBarTitleText": "修改资料",
             "navigationStyle": "custom"
           }
+        },
+        {
+          "path": "like",
+          "style": {
+            "navigationBarTitleText": "喜欢",
+            "navigationStyle": "custom"
+          }
         }
       ]
     },
diff --git a/src/pages/home/city.vue b/src/pages/home/city.vue
index 573392f6..76c08aee 100644
--- a/src/pages/home/city.vue
+++ b/src/pages/home/city.vue
@@ -1,34 +1,32 @@
 <template>
-  <van-config-provider theme="dark">
-    <van-nav-bar title="城市" fixed z-index="10">
-      <template #left>
-        <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
-      </template>
-    </van-nav-bar>
+  <van-nav-bar title="城市" fixed z-index="10">
+    <template #left>
+      <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
+    </template>
+  </van-nav-bar>
 
-    <view class="mt-100rpx">
-      <van-search v-model="cityName" shape="round" background="#222222" placeholder="搜索" />
-    </view>
+  <view class="mt-100rpx">
+    <van-search v-model="cityName" shape="round" background="#222222" placeholder="搜索" />
+  </view>
 
-    <view class="px-3 text-sm">热门城市</view>
-    <view class="flex flex-wrap gap-3 my-3 mx-4">
-      <text
-        v-for="(item, index) in hotCity"
-        :key="index"
-        class="bg-color-light text-color-theme px-2 rounded-1"
-        @click.stop="selectHot(item)"
-      >
-        {{ item.t }}
-      </text>
-    </view>
+  <view class="px-3 text-sm">热门城市</view>
+  <view class="flex flex-wrap gap-3 my-3 mx-4">
+    <text
+      v-for="(item, index) in hotCity"
+      :key="index"
+      class="bg-color-light text-color-theme px-2 rounded-1"
+      @click.stop="selectHot(item)"
+    >
+      {{ item.t }}
+    </text>
+  </view>
 
-    <van-index-bar highlight-color="#ffcd32" :sticky-offset-top="46">
-      <template v-for="(item, index) in cityIndex" :key="index">
-        <van-index-anchor :index="item.letter" />
-        <van-cell v-for="(v, i) in item.data" :key="i" :title="v.t" @click.stop="select(v)" />
-      </template>
-    </van-index-bar>
-  </van-config-provider>
+  <van-index-bar highlight-color="#ffcd32" :sticky-offset-top="46">
+    <template v-for="(item, index) in cityIndex" :key="index">
+      <van-index-anchor :index="item.letter" />
+      <van-cell v-for="(v, i) in item.data" :key="i" :title="v.t" @click.stop="select(v)" />
+    </template>
+  </van-index-bar>
 </template>
 
 <script lang="ts">
diff --git a/src/pages/home/detail.vue b/src/pages/home/detail.vue
index 8537b089..7a335782 100644
--- a/src/pages/home/detail.vue
+++ b/src/pages/home/detail.vue
@@ -1,97 +1,95 @@
 <template>
-  <van-config-provider theme="dark">
-    <van-nav-bar title="">
-      <template #left>
-        <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
-        <view class="flex items-center" :style="navUserInfoStyle">
-          <image class="size-70rpx bg-#333 rounded-full mr-1" src="" mode="scaleToFill" />
-          <text class="truncate">稍后发非麻烦咖啡</text>
+  <van-nav-bar title="">
+    <template #left>
+      <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
+      <view class="flex items-center" :style="navUserInfoStyle">
+        <image class="size-70rpx bg-#333 rounded-full mr-1" src="" mode="scaleToFill" />
+        <text class="truncate">稍后发非麻烦咖啡</text>
+      </view>
+    </template>
+    <template #right>
+      <view class="flex items-center">
+        <view class="py-1 px-2 text-xs bg-color-theme-dark rounded-full mr-3">
+          365.56km · 在线
         </view>
-      </template>
-      <template #right>
-        <view class="flex items-center">
-          <view class="py-1 px-2 text-xs bg-color-theme-dark rounded-full mr-3">
-            365.56km · 在线
-          </view>
-          <uni-icons type="more-filled" size="28" color="#ffcd32"></uni-icons>
-        </view>
-      </template>
-    </van-nav-bar>
+        <uni-icons type="more-filled" size="28" color="#ffcd32"></uni-icons>
+      </view>
+    </template>
+  </van-nav-bar>
 
-    <scroll-view
-      style="height: calc(100vh - 100rpx)"
-      scroll-y
-      refresher-enabled
-      refresher-background="#222"
-      :refresher-triggered="refresherTriggered"
-      :refresher-threshold="100"
-      @refresherrefresh="onRefresherRefresh"
-      @refresherabort="onRefresherAbort"
-      @scrolltolower="onScrollToLower"
-      @scroll="onScroll"
-    >
-      <view class="w-full h-600rpx relative">
+  <scroll-view
+    style="height: calc(100vh - 100rpx)"
+    scroll-y
+    refresher-enabled
+    refresher-background="#222"
+    :refresher-triggered="refresherTriggered"
+    :refresher-threshold="100"
+    @refresherrefresh="onRefresherRefresh"
+    @refresherabort="onRefresherAbort"
+    @scrolltolower="onScrollToLower"
+    @scroll="onScroll"
+  >
+    <view class="w-full h-600rpx relative">
+      <image
+        class="w-full h-full absolute inset-0"
+        src="http://dummyimage.com/100x100/ac0ee3"
+        mode="aspectFill"
+      />
+      <view class="absolute bottom-40rpx left-0 right-0 flex flex-col items-center z-100 w-full">
         <image
-          class="w-full h-full absolute inset-0"
+          class="text-center size-150rpx rounded-full bg-#333 mb-20rpx"
           src="http://dummyimage.com/100x100/ac0ee3"
           mode="aspectFill"
         />
-        <view class="absolute bottom-40rpx left-0 right-0 flex flex-col items-center z-100 w-full">
-          <image
-            class="text-center size-150rpx rounded-full bg-#333 mb-20rpx"
-            src="http://dummyimage.com/100x100/ac0ee3"
-            mode="aspectFill"
-          />
-          <view class="text-sm mb-20rpx">{{ '啊发发' }}</view>
-          <view class="bg-color-theme text-sm c-black px-2 rounded-1 mb-20rpx">真人认证</view>
-          <view class="flex flex-wrap justify-center mb-20rpx">
-            <text class="px-2 rounded-1 mr-2 text-sm bg-#222 text-color-theme">女·23岁</text>
-            <text class="px-2 rounded-1 mr-2 text-sm bg-#222 text-color-theme">170cm</text>
-          </view>
-          <view class="text-sm">{{ '发哈夫哈佛哈维合法i凤凰网你' }}</view>
+        <view class="text-sm mb-20rpx">{{ '啊发发' }}</view>
+        <view class="bg-color-theme text-sm c-black px-2 rounded-1 mb-20rpx">真人认证</view>
+        <view class="flex flex-wrap justify-center mb-20rpx">
+          <text class="px-2 rounded-1 mr-2 text-sm bg-#222 text-color-theme">女·23岁</text>
+          <text class="px-2 rounded-1 mr-2 text-sm bg-#222 text-color-theme">170cm</text>
         </view>
-        <view class="absolute z-10 top-0 left-0 size-full bg-#33333333" :style="filterStyle"></view>
+        <view class="text-sm">{{ '发哈夫哈佛哈维合法i凤凰网你' }}</view>
       </view>
+      <view class="absolute z-10 top-0 left-0 size-full bg-#33333333" :style="filterStyle"></view>
+    </view>
 
-      <view class="m-4">
-        <view class="my-2 text-size-base">相册</view>
-        <image
-          class="size-140rpx rounded-1 mr-2 mb-1"
-          v-for="(item, index) in 5"
-          :key="index"
-          src="http://dummyimage.com/100x100/ac0ee3"
-        />
-      </view>
-      <view class="m-4">
-        <view class="my-2 text-base">评价1+</view>
-        <view class="flex justify-around flex-wrap text-color-theme text-base">
-          <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
-            <text>身材</text>
-            <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
-          </view>
-          <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
-            <text>颜值</text>
-            <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
-          </view>
-          <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
-            <text>耐心</text>
-            <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
-          </view>
-          <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
-            <text>有趣</text>
-            <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
-          </view>
+    <view class="m-4">
+      <view class="my-2 text-size-base">相册</view>
+      <image
+        class="size-140rpx rounded-1 mr-2 mb-1"
+        v-for="(item, index) in 5"
+        :key="index"
+        src="http://dummyimage.com/100x100/ac0ee3"
+      />
+    </view>
+    <view class="m-4">
+      <view class="my-2 text-base">评价1+</view>
+      <view class="flex justify-around flex-wrap text-color-theme text-base">
+        <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
+          <text>身材</text>
+          <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
+        </view>
+        <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
+          <text>颜值</text>
+          <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
+        </view>
+        <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
+          <text>耐心</text>
+          <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
+        </view>
+        <view class="bg-color-dark flex items-center px-2 py-1 mb-2 rounded-2 gap-2">
+          <text>有趣</text>
+          <uni-rate :value="2" :touchable="false" :readonly="true" size="18" />
         </view>
       </view>
-      <moment v-for="(item, index) in listData">{{ index }}</moment>
-      <uni-load-more
-        :status="loadMoreStatus"
-        :content-text="loadMoreContent"
-        @clickLoadMore="onClickLoadMore"
-      />
-      <view style="height: 100rpx"></view>
-    </scroll-view>
-  </van-config-provider>
+    </view>
+    <moment v-for="(item, index) in listData">{{ index }}</moment>
+    <uni-load-more
+      :status="loadMoreStatus"
+      :content-text="loadMoreContent"
+      @clickLoadMore="onClickLoadMore"
+    />
+    <view style="height: 100rpx"></view>
+  </scroll-view>
 </template>
 
 <script setup lang="ts">
diff --git a/src/pages/home/home.vue b/src/pages/home/home.vue
index 605c8d7f..d7f18722 100644
--- a/src/pages/home/home.vue
+++ b/src/pages/home/home.vue
@@ -1,81 +1,79 @@
 <template>
-  <van-config-provider theme="dark">
-    <uni-nav-bar
-      dark
-      :fixed="true"
-      :border="false"
-      :height="50"
-      title=""
-      left-text=""
-      background-color="#222"
-      leftWidth="180rpx"
-      rightWidth="180rpx"
-    >
-      <view class="m-auto">
-        <segmented v-model="current" :items="segmentedItems" @change="segmentedChange" />
+  <uni-nav-bar
+    dark
+    :fixed="true"
+    :border="false"
+    :height="50"
+    title=""
+    left-text=""
+    background-color="#222"
+    leftWidth="180rpx"
+    rightWidth="180rpx"
+  >
+    <view class="m-auto">
+      <segmented v-model="current" :items="segmentedItems" @change="segmentedChange" />
+    </view>
+    <template v-slot:left>
+      <view class="flex items-center text-size-base" @click="selectAddress">
+        <uni-icons type="location" size="24" color="#ffcd32"></uni-icons>
+        <text class="truncate">{{ userCity.t || '未选择' }}</text>
       </view>
-      <template v-slot:left>
-        <view class="flex items-center text-size-base" @click="selectAddress">
-          <uni-icons type="location" size="24" color="#ffcd32"></uni-icons>
-          <text class="truncate">{{ userCity.t || '未选择' }}</text>
-        </view>
-      </template>
-      <template v-slot:right></template>
-    </uni-nav-bar>
+    </template>
+    <template v-slot:right></template>
+  </uni-nav-bar>
 
-    <scroll-view
-      style="height: calc(100vh - 100rpx - 100rpx)"
-      scroll-y
-      refresher-enabled
-      refresher-background="#222"
-      :refresher-triggered="refresherTriggered"
-      :refresher-threshold="100"
-      @refresherrefresh="onRefresherRefresh"
-      @refresherabort="onRefresherAbort"
-      @scrolltolower="onScrollToLower"
-    >
-      <view class="flex px-6 py-2" v-for="user in listData" :key="user.id" @click="detail">
-        <image
-          class="w-200rpx h-300rpx mr-3 rounded-2 bg-#777"
-          :src="user.member.memberAvatar"
-          mode="aspectFill"
-        />
-        <view class="flex-1">
-          <view class="flex justify-between items-center">
-            <text class="text-size-base">{{ user.member.memberNickname }}</text>
-            <text class="px-2 rounded-full text-size-sm bg-color-theme-dark">{{ '在线' }}</text>
-          </view>
-          <view class="mt-2">
-            <text class="px-2 text-xs c-black rounded-full bg-color-theme-dark">真人认证</text>
-          </view>
-          <view class="mt-2 flex flex-wrap gap-3">
-            <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
-              {{ user.gender || '未知性别' }}·{{ user.member.memberAge }}岁
-            </text>
-            <text class="bg-#333 text-color-theme text-xs px-2 rounded-1"
-              >{{ user.member.memberHeight }}cm</text
-            >
-            <text class="bg-#333 text-color-theme text-xs px-2 rounded-1"
-              >{{ user.member.memberWeight }}kg</text
-            >
-            <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
-              {{ user.member.memberOcc }}
-            </text>
-            <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
-              {{ user.issueCity }}km
-            </text>
-          </view>
+  <scroll-view
+    style="height: calc(100vh - 100rpx - 100rpx)"
+    scroll-y
+    refresher-enabled
+    refresher-background="#222"
+    :refresher-triggered="refresherTriggered"
+    :refresher-threshold="100"
+    @refresherrefresh="onRefresherRefresh"
+    @refresherabort="onRefresherAbort"
+    @scrolltolower="onScrollToLower"
+  >
+    <view class="flex px-6 py-2" v-for="user in listData" :key="user.id" @click="detail">
+      <image
+        class="w-200rpx h-300rpx mr-3 rounded-2 bg-#777"
+        :src="user.member.memberAvatar"
+        mode="aspectFill"
+      />
+      <view class="flex-1">
+        <view class="flex justify-between items-center">
+          <text class="text-size-base">{{ user.member.memberNickname }}</text>
+          <text class="px-2 rounded-full text-size-sm bg-color-theme-dark">{{ '在线' }}</text>
+        </view>
+        <view class="mt-2">
+          <text class="px-2 text-xs c-black rounded-full bg-color-theme-dark">真人认证</text>
+        </view>
+        <view class="mt-2 flex flex-wrap gap-3">
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
+            {{ user.gender || '未知性别' }}·{{ user.member.memberAge }}岁
+          </text>
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1"
+            >{{ user.member.memberHeight }}cm</text
+          >
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1"
+            >{{ user.member.memberWeight }}kg</text
+          >
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
+            {{ user.member.memberOcc }}
+          </text>
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
+            {{ user.issueCity }}km
+          </text>
         </view>
       </view>
-      <uni-load-more
-        :status="loadMoreStatus"
-        :content-text="loadMoreContent"
-        @clickLoadMore="onClickLoadMore"
-      />
-      <view style="height: 100rpx"></view>
-      <van-back-top right="6vw" bottom="10vh" />
-    </scroll-view>
-  </van-config-provider>
+    </view>
+    <uni-load-more
+      :status="loadMoreStatus"
+      :content-text="loadMoreContent"
+      @clickLoadMore="onClickLoadMore"
+    />
+    <view style="height: 100rpx"></view>
+    <van-back-top right="6vw" bottom="10vh" />
+  </scroll-view>
 </template>
 
 <script setup lang="ts">
diff --git a/src/pages/login/login.vue b/src/pages/login/login.vue
index bdcde761..d2328023 100644
--- a/src/pages/login/login.vue
+++ b/src/pages/login/login.vue
@@ -1,66 +1,95 @@
 <template>
-  <view class="page">
-    <image class="background-image" src="/static/11.png" mode="aspectFill" />
-    <view class="content">
-      <view class="title-section">
-        <view class="main-title">荷塘月色</view>
-        <view class="sub-title">• 高端社交圈 •</view>
+  <view class="relative h-screen w-screen overflow-hidden">
+    <image
+      class="absolute inset-0 h-full w-full scale-110"
+      style="filter: blur(10rpx)"
+      src="/static/11.png"
+      mode="aspectFill"
+    />
+    <view class="relative z-10 flex flex-col items-center px-40rpx">
+      <view class="my-100rpx text-center">
+        <view class="mb-30rpx text-36px font-bold text-white/80">荷塘月色</view>
+        <view class="text-15px tracking-4rpx text-white/80">• 高端社交圈 •</view>
       </view>
 
       <template v-if="scene === 'register'">
-        <view class="form-section">
-          <view class="input-wapper">
+        <view class="flex w-full flex-col items-center gap-40rpx">
+          <view class="relative flex w-full items-center">
             <input
-              class="input"
+              class="h-100rpx w-full rounded-50rpx bg-color-light px-40rpx text-32rpx text-white"
               type="number"
               placeholder="请输入手机号"
               placeholder-style="color: rgba(255, 255, 255, 0.6)"
               v-model="phone"
             />
           </view>
-          <view class="input-wapper">
+          <view class="relative flex w-full items-center">
             <input
-              class="input"
+              class="h-100rpx w-full rounded-50rpx bg-color-light px-40rpx text-32rpx text-white"
               type="number"
               placeholder="验证码"
               placeholder-style="color: rgba(255, 255, 255, 0.6)"
               v-model="smsCode"
             />
-            <view class="get-code-btn" @click="handleGetCode">获取验证码</view>
+            <view
+              class="absolute right-20rpx rounded-16rpx bg-color-theme-dark px-20rpx py-16rpx text-12px"
+              @click="handleGetCode"
+            >
+              获取验证码
+            </view>
           </view>
         </view>
-        <button class="register-btn" @click="handleRegister">注 册</button>
-        <button class="scene-change" @click="goLogin">去登录</button>
+        <button
+          class="mt-40rpx w-full rounded-50rpx bg-color-theme-dark text-18px text-white"
+          @click="handleRegister"
+        >
+          注 册
+        </button>
+        <button class="mt-40rpx border-0 bg-transparent text-white" @click="goLogin">去登录</button>
       </template>
 
       <template v-else>
-        <view class="form-section">
-          <view class="input-wapper">
+        <view class="flex w-full flex-col items-center gap-40rpx">
+          <view class="relative flex w-full items-center">
             <input
-              class="input"
+              class="h-100rpx w-full rounded-50rpx bg-color-light px-40rpx text-32rpx text-white"
               type="number"
               placeholder="请输入手机号"
               placeholder-style="color: rgba(255, 255, 255, 0.6)"
               v-model="phone"
             />
           </view>
-          <view class="input-wapper">
+          <view class="relative flex w-full items-center">
             <input
-              class="input"
+              class="h-100rpx w-full rounded-50rpx bg-color-light px-40rpx text-32rpx text-white"
               type="number"
               placeholder="验证码"
               placeholder-style="color: rgba(255, 255, 255, 0.6)"
               v-model="smsCode"
             />
-            <view class="get-code-btn" @click="handleGetCode">获取验证码</view>
+            <view
+              class="absolute right-20rpx rounded-16rpx bg-color-theme-dark px-20rpx py-16rpx text-12px"
+              @click="handleGetCode"
+            >
+              获取验证码
+            </view>
           </view>
         </view>
-        <button class="register-btn" @click="handleLogin">登 录</button>
-        <button class="scene-change" @click="goRegister">去注册</button>
+        <button
+          class="mt-40rpx w-full rounded-50rpx bg-color-theme-dark text-18px text-white"
+          @click="handleLogin"
+        >
+          登 录
+        </button>
+        <button class="mt-40rpx border-0 bg-transparent text-white" @click="goRegister">
+          去注册
+        </button>
       </template>
     </view>
 
-    <view class="agreement-text">登录即同意《用户协议》和《隐私政策》并同意授权</view>
+    <view class="absolute bottom-40rpx w-full text-center text-14px text-white">
+      登录即同意《用户协议》和《隐私政策》并同意授权
+    </view>
   </view>
 </template>
 
@@ -115,93 +144,3 @@
     scene.value = 'register';
   };
 </script>
-
-<style scoped lang="scss">
-  .page {
-    width: 100vw;
-    height: 100vh;
-    overflow: hidden;
-    position: relative;
-    .background-image {
-      width: 100%;
-      height: 100%;
-      position: absolute;
-      inset: 0;
-      filter: blur(10rpx);
-      transform: scale(1.1);
-    }
-    .content {
-      padding: 0 40rpx;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      .title-section {
-        margin: 100rpx 0;
-        text-align: center;
-        .main-title {
-          font-size: 72rpx;
-          font-weight: bold;
-          color: $color-text-ll;
-          margin-bottom: 30rpx;
-        }
-        .sub-title {
-          font-size: 30rpx;
-          color: $color-text-ll;
-          letter-spacing: 4rpx;
-        }
-      }
-      .form-section {
-        width: 100%;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        gap: 40rpx;
-        .input-wapper {
-          display: flex;
-          align-items: center;
-          width: 100%;
-          position: relative;
-          .input {
-            width: 100%;
-            height: 100rpx;
-            background: $color-highlight-background;
-            border-radius: 50rpx;
-            padding: 0 40rpx;
-            font-size: 32rpx;
-          }
-          .get-code-btn {
-            position: absolute;
-            right: 20rpx;
-            font-size: $font-size-small;
-            background: $color-theme-d;
-            white-space: nowrap;
-            padding: 16rpx;
-            border-radius: 16rpx;
-          }
-        }
-      }
-    }
-    .register-btn {
-      width: 100%;
-      margin-top: 40rpx;
-      border-radius: 50rpx;
-      align-items: center;
-      font-size: $font-size-large;
-      background: $color-theme-d;
-      color: $color-text;
-    }
-    .scene-change {
-      margin-top: 40rpx;
-      background-color: transparent;
-      border-color: transparent;
-      color: $color-text;
-    }
-    .agreement-text {
-      position: absolute;
-      width: 100%;
-      text-align: center;
-      bottom: 40rpx;
-      font-size: $font-size-medium;
-    }
-  }
-</style>
diff --git a/src/pages/messages/messages.vue b/src/pages/messages/messages.vue
index 7facb97d..24994f8f 100644
--- a/src/pages/messages/messages.vue
+++ b/src/pages/messages/messages.vue
@@ -1,134 +1,84 @@
 <template>
-  <view class="messages-page">
-    <view class="header">
-      <view class="message-type">
-        <text class="message">消息</text>
-        <text>缘友</text>
-      </view>
-      <view class="interact">
-        <uni-icons type="chat" size="24" color="#333"></uni-icons>
-        <text class="text">互动消息</text>
-      </view>
+  <view class="flex h-100rpx items-center justify-between px-4">
+    <view class="flex items-center text-base">
+      <text class="mr-4">消息</text>
+      <text>缘友</text>
     </view>
+    <view class="flex items-center rounded-full bg-color-theme px-2">
+      <uni-icons type="chat" size="20" color="#333" />
+      <text class="text-sm c-black">互动消息</text>
+    </view>
+  </view>
 
-    <scroll-view class="chat-list" scroll-y>
-      <view class="chat-item" v-for="message in 10" :key="message.id">
-        <uni-badge size="small" text="100" absolute="rightTop" :offset="[10, 10]" :custom-style="{ borderColor: 'red' }">
-          <image :src="message.avatar" class="avatar" />
-        </uni-badge>
-        <view class="chat-user">
-          <view class="top">
-            <text class="username">{{ message.username }}</text>
-            <text class="time">{{ message.time }}</text>
-          </view>
-          <view class="bottom">
-            <text class="text">{{ message.lastMessage }}</text>
-          </view>
+  <scroll-view class="h-[calc(100vh-200rpx)]" scroll-y>
+    <view
+      class="flex items-center border-1 border-b-solid border-#333333 px-6 py-2"
+      v-for="message in messageList"
+      :key="message.id"
+    >
+      <uni-badge
+        size="small"
+        :text="String(message.unread)"
+        absolute="rightTop"
+        :offset="[10, 10]"
+        :custom-style="{ borderColor: 'red' }"
+      >
+        <image :src="message.avatar" class="mr-2 size-100rpx rounded-full bg-#333333" />
+      </uni-badge>
+      <view class="flex-1 overflow-hidden px-3">
+        <view class="flex items-center justify-between">
+          <text class="text-base">{{ message.username }}</text>
+          <text class="text-sm">{{ message.time }}</text>
+        </view>
+        <view class="flex">
+          <text class="mt-1 flex-1 text-sm truncate">{{ message.lastMessage }}</text>
         </view>
       </view>
-      <view style="height: 100rpx"></view>
-    </scroll-view>
-  </view>
+    </view>
+    <view class="h-100rpx"></view>
+  </scroll-view>
 </template>
 
 <script setup lang="ts">
-import { ref, computed } from "vue";
+  import { ref, computed } from 'vue';
 
-interface Message {
-  id: number;
-  username: string;
-  avatar: string;
-  lastMessage: string;
-  time: string;
-  unread: number;
-}
+  interface Message {
+    id: number;
+    username: string;
+    avatar: string;
+    lastMessage: string;
+    time: string;
+    unread: number;
+  }
 
-const messageList = ref<Message[]>();
+  const messageList = ref<Message[]>([
+    {
+      id: 1,
+      username: '1',
+      avatar: 'https://dummyimage.com/100x100/333333/ffffff&text=A',
+      lastMessage: '111',
+      time: '12:30',
+      unread: 3,
+    },
+    {
+      id: 2,
+      username: '2',
+      avatar: 'https://dummyimage.com/100x100/444444/ffffff&text=B',
+      lastMessage: '222',
+      time: '昨天',
+      unread: 0,
+    },
+    {
+      id: 3,
+      username: '3',
+      avatar: 'https://dummyimage.com/100x100/555555/ffffff&text=C',
+      lastMessage: '333',
+      time: '周二',
+      unread: 5,
+    },
+  ]);
 
-const unreadCount = computed(() => {
-  return messageList.value.reduce((total, message) => total + message.unread, 0);
-});
+  const unreadCount = computed(() => {
+    return messageList.value.reduce((total, message) => total + message.unread, 0);
+  });
 </script>
-
-<style scoped lang="scss">
-.messages-page {
-  background-color: $color-background;
-  height: calc(100vh - 100rpx);
-  .header {
-    position: relative;
-    height: 100rpx;
-    .message-type {
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 20rpx;
-      display: flex;
-      align-items: center;
-      font-size: $font-size-large;
-      .message {
-        margin-right: 20rpx;
-      }
-    }
-    .interact {
-      position: absolute;
-      right: 20rpx;
-      top: 50rpx;
-      transform: translateY(-50%);
-      display: flex;
-      align-items: center;
-      background-color: $color-theme;
-      border-radius: 40rpx;
-      padding: 4rpx 20rpx;
-      .text {
-        font-size: $font-size-medium;
-        color: #333;
-      }
-    }
-  }
-  .chat-list {
-    height: calc(100vh - 100rpx - 100rpx);
-    .chat-item {
-      display: flex;
-      align-items: center;
-      padding: 15px 20px;
-      border-bottom: 1px solid #333;
-      .avatar {
-        width: 50px;
-        height: 50px;
-        border-radius: 25px;
-        margin-right: 15rpx;
-        background-color: #333;
-      }
-      .chat-user {
-        flex: 1;
-        padding: 0 20rpx;
-        overflow: hidden;
-        .top {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-bottom: 5px;
-          .username {
-            font-size: $font-size-medium-x;
-          }
-          .time {
-            font-size: $font-size-small;
-            color: $color-text-l;
-          }
-        }
-        .bottom {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          .text {
-            font-size: $font-size-medium;
-            flex: 1;
-            margin-top: 10rpx;
-            @include no-wrap();
-          }
-        }
-      }
-    }
-  }
-}
-</style>
diff --git a/src/pages/moments/moments.vue b/src/pages/moments/moments.vue
index e0737398..8df81b3a 100644
--- a/src/pages/moments/moments.vue
+++ b/src/pages/moments/moments.vue
@@ -1,13 +1,17 @@
 <template>
-  <view class="header">
-    <segmented class="segmented" v-model="current" :items="segmentedItems"></segmented>
-    <view class="camera" @click="goPublish">
+  <view class="relative h-100rpx">
+    <segmented
+      class="absolute left-30rpx top-1/2 -translate-y-1/2"
+      v-model="current"
+      :items="segmentedItems"
+    />
+    <view class="absolute right-30rpx top-1/2 -translate-y-1/2" @click="goPublish">
       <uni-icons type="camera" size="24" color="#ffcd32"></uni-icons>
     </view>
   </view>
 
   <scroll-view
-    class="moments-list"
+    class="h-[calc(100vh-200rpx)]"
     scroll-y
     refresher-enabled
     refresher-background="#222"
@@ -38,7 +42,7 @@
       :content-text="loadMoreContent"
       @clickLoadMore="onClickLoadMore"
     />
-    <view style="height: 100rpx"></view>
+    <view class="h-100rpx"></view>
   </scroll-view>
 </template>
 
@@ -58,7 +62,12 @@
     onRefresherAbort,
     onScrollToLower,
     onClickLoadMore,
-  } = useScroll(RecentApi.quickPage);
+  } = useScroll(RecentApi.quickPage, {
+    scene: 'DYNAMIC_RECOMMEND',
+    province: '',
+    city: '',
+    memberId: '',
+  });
 
   const current = ref(0);
   const segmentedItems = ['动态', '附近'];
@@ -69,25 +78,3 @@
     });
   };
 </script>
-
-<style scoped lang="scss">
-  .header {
-    position: relative;
-    height: 100rpx;
-    .segmented {
-      position: absolute;
-      left: 30rpx;
-      top: 50rpx;
-      transform: translateY(-50%);
-    }
-    .camera {
-      position: absolute;
-      top: 50rpx;
-      transform: translateY(-50%);
-      right: 30rpx;
-    }
-  }
-  .moments-list {
-    height: calc(100vh - 100rpx - 100rpx);
-  }
-</style>
diff --git a/src/pages/moments/publish.vue b/src/pages/moments/publish.vue
index 514f22c9..aeffe4a3 100644
--- a/src/pages/moments/publish.vue
+++ b/src/pages/moments/publish.vue
@@ -1,21 +1,61 @@
 <template>
-  <van-config-provider theme="dark">
-    <van-nav-bar title="发布动态" fixed>
-      <template #left>
-        <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
-      </template>
-      <template #right>
-        <view class="bg-color-theme px-3 py-1 rounded-full c-black" @click="publishMoments">
-          发布
-        </view>
-      </template>
-    </van-nav-bar>
-  </van-config-provider>
+  <van-nav-bar title="发布动态">
+    <template #left>
+      <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
+    </template>
+    <template #right>
+      <view class="bg-color-theme px-3 py-1 rounded-full c-black" @click="publishMoments">
+        发布
+      </view>
+    </template>
+  </van-nav-bar>
+
+  <van-field
+    v-model="params.description"
+    rows="12"
+    type="textarea"
+    maxlength="1000"
+    placeholder="记录这一刻..."
+    show-word-limit
+  />
+  <van-tabs v-model:active="activeTab" sticky>
+    <van-tab title="发图片">
+      <view class="p-4">
+        <s-uploader v-model:url="params.coverPic" fileMediatype="image" limit="1" mode="grid" />
+      </view>
+    </van-tab>
+    <van-tab title="发视频">
+      <view class="p-4">
+        <s-uploader v-model:url="params.videos" fileMediatype="video" limit="1" mode="grid" />
+      </view>
+    </van-tab>
+  </van-tabs>
 </template>
 
 <script setup lang="ts">
-  // 发布
-  const publishMoments = () => {};
+  import { reactive, ref } from 'vue';
+  import sUploader from '@/sheep/components/s-uploader/s-uploader.vue';
+  import RecentApi from '@/sheep/api/member/recent';
+
+  const activeTab = ref();
+  const params = reactive({
+    description: '',
+    coverPic: [],
+    videos: [],
+    issueLong: '30.750651',
+    issueLat: '120.731208',
+    issueProvince: '浙江省',
+    issueCity: '嘉兴市',
+    issueDistrict: '南湖区',
+    issueAddress: '南湖区嘉兴学院农银大学(浙江分校)南100米',
+  });
+
+  // 发布朋友圈
+  const publishMoments = async () => {
+    console.log({ ...params, coverPic: params.coverPic[0] });
+
+    await RecentApi.createMoment({ ...params, coverPic: params.coverPic[0] });
+  };
 
   function back() {
     uni.navigateBack();
diff --git a/src/pages/profile/like.vue b/src/pages/profile/like.vue
new file mode 100644
index 00000000..634a5965
--- /dev/null
+++ b/src/pages/profile/like.vue
@@ -0,0 +1,98 @@
+<template>
+  <van-nav-bar title="">
+    <template #left>
+      <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
+    </template>
+    <template #title>
+      <segmented v-model="current" :items="segmentedItems" @change="segmentedChange" />
+    </template>
+  </van-nav-bar>
+
+  <scroll-view
+    style="height: calc(100vh - 100rpx - 100rpx)"
+    scroll-y
+    refresher-enabled
+    refresher-background="#222"
+    :refresher-triggered="refresherTriggered"
+    :refresher-threshold="100"
+    @refresherrefresh="onRefresherRefresh"
+    @refresherabort="onRefresherAbort"
+    @scrolltolower="onScrollToLower"
+  >
+    <view class="flex px-6 py-2" v-for="user in listData" :key="user.id" @click="detail">
+      <image
+        class="w-200rpx h-300rpx mr-3 rounded-2 bg-#777"
+        :src="user.member.memberAvatar"
+        mode="aspectFill"
+      />
+      <view class="flex-1">
+        <view class="flex justify-between items-center">
+          <text class="text-size-base">{{ user.member.memberNickname }}</text>
+          <text class="px-2 rounded-full text-size-sm bg-color-theme-dark">{{ '在线' }}</text>
+        </view>
+        <view class="mt-2">
+          <text class="px-2 text-xs c-black rounded-full bg-color-theme-dark">真人认证</text>
+        </view>
+        <view class="mt-2 flex flex-wrap gap-3">
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
+            {{ user.gender || '未知性别' }}·{{ user.member.memberAge }}岁
+          </text>
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1"
+            >{{ user.member.memberHeight }}cm</text
+          >
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1"
+            >{{ user.member.memberWeight }}kg</text
+          >
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
+            {{ user.member.memberOcc }}
+          </text>
+          <text class="bg-#333 text-color-theme text-xs px-2 rounded-1">
+            {{ user.issueCity }}km
+          </text>
+        </view>
+      </view>
+    </view>
+    <uni-load-more
+      :status="loadMoreStatus"
+      :content-text="loadMoreContent"
+      @clickLoadMore="onClickLoadMore"
+    />
+    <view style="height: 100rpx"></view>
+    <van-back-top right="6vw" bottom="10vh" />
+  </scroll-view>
+</template>
+
+<script setup lang="ts">
+  import { onLoad } from '@dcloudio/uni-app';
+  import { ref } from 'vue';
+  import segmented from '@/sheep/components/segmented/segmented.vue';
+  import useScroll from '@/sheep/hooks/use-scroll';
+  import RecentApi from '@/sheep/api/member/recent';
+
+  const current = ref(0);
+  const segmentedItems = ['我喜欢', '喜欢我'];
+
+  const {
+    listData,
+    refresherTriggered,
+    loadMoreContent,
+    loadMoreStatus,
+    onRefresherRefresh,
+    onRefresherAbort,
+    onScrollToLower,
+    onClickLoadMore,
+  } = useScroll(RecentApi.likeIt);
+
+  onLoad((options: any) => {
+    const { type } = options;
+    current.value = type;
+  });
+
+  const segmentedChange = () => {};
+
+  const detail = () => {};
+
+  function back() {
+    uni.navigateBack();
+  }
+</script>
diff --git a/src/pages/profile/profile.vue b/src/pages/profile/profile.vue
index 3e48bbe6..2537207b 100644
--- a/src/pages/profile/profile.vue
+++ b/src/pages/profile/profile.vue
@@ -1,31 +1,58 @@
 <template>
-  <view class="profile-page">
-    <view class="header">
-      <view class="name">我的</view>
-      <view class="edit-info" @click="editUserInfo">
-        <uni-icons type="auth" size="20" color="#333"></uni-icons>
-        <text class="text">编辑资料</text>
+  <!-- 顶部导航 -->
+  <view class="relative h-100rpx">
+    <text class="mx-auto text-base absolute left-1/2 top-1/2 -translate-1/2">我的</text>
+    <view
+      class="absolute right-20rpx top-50rpx flex -translate-y-1/2 items-center rounded-full bg-color-theme px-2 text-black"
+      @click="editUserInfo"
+    >
+      <uni-icons type="auth" size="20" color="#333"></uni-icons>
+      <text class="text-sm">编辑资料</text>
+    </view>
+  </view>
+
+  <scroll-view class="h-[calc(100vh-200rpx)]" scroll-y>
+    <!-- 个人信息 -->
+    <view class="flex items-center px-6 pb-3">
+      <image :src="userInfo.avatar" class="mr-4 size-80px rounded-full bg-#333" />
+      <view class="flex-1">
+        <view class="mb-1 text-lg">{{ userInfo.username }}</view>
+        <view class="mb-1 text-xs text-#ffffff80">ID: {{ userInfo.id }}</view>
+        <view class="inline-block rounded-full bg-color-theme px-2 text-xs c-black">
+          {{ 'vip' }}
+        </view>
       </view>
     </view>
-    <scroll-view class="content" scroll-y>
-      <view class="user-card">
-        <image :src="userInfo.avatar" class="user-avatar" />
-        <view class="user-info">
-          <text class="username">{{ userInfo.username }}</text>
-          <text class="user-id">ID: {{ userInfo.id }}</text>
-          <text class="tag">{{ 'vip' }}</text>
-        </view>
+
+    <view class="flex justify-around my-2">
+      <view class="flex flex-col items-center" @click="goLike(0)">
+        <text class="text-color-theme font-bold">{{ 1 }}</text>
+        <text class="text-color-theme">我喜欢</text>
       </view>
-      <view class="menu-section">
-        <view class="menu-item" v-for="item in menuList" :key="item.id">
-          <view class="menu-icon">{{ item.icon }}</view>
-          <text class="menu-text">{{ item.text }}</text>
-          <uni-icons type="right" size="16" color="#999999"></uni-icons>
-        </view>
+      <view class="flex flex-col items-center" @click="goLike(1)">
+        <text class="text-color-theme font-bold">{{ 1 }}</text>
+        <text class="text-color-theme">喜欢我</text>
       </view>
-      <view style="height: 100rpx"></view>
-    </scroll-view>
-  </view>
+      <view class="flex flex-col items-center">
+        <text class="text-color-theme font-bold">{{ 1 }}</text>
+        <text class="text-color-theme">钱包</text>
+      </view>
+    </view>
+
+    <!-- 菜单 -->
+    <view class="mx-12 my-4">
+      <view
+        v-for="item in menuList"
+        :key="item.id"
+        class="flex items-center border-1 border-b-solid border-#333 py-3 text-base"
+      >
+        <view class="mr-2 w-60">{{ item.icon }}</view>
+        <text class="flex-1">{{ item.text }}</text>
+        <uni-icons type="right" size="16" color="#999999"></uni-icons>
+      </view>
+    </view>
+    <view style="height: 100rpx"></view>
+  </scroll-view>
 </template>
 
 <script setup lang="ts">
@@ -65,93 +92,11 @@
       url: '/pages/profile/userinfo',
     });
   };
-</script>
 
-<style scoped lang="scss">
-  .profile-page {
-    background-color: $color-background;
-    height: calc(100vh - 100rpx);
-    .header {
-      position: relative;
-      height: 100rpx;
-      .name {
-        position: absolute;
-        left: 50%;
-        top: 50%;
-        transform: translate(-50%, -50%);
-        font-size: $font-size-medium-x;
-      }
-      .edit-info {
-        position: absolute;
-        right: 20rpx;
-        top: 50rpx;
-        transform: translateY(-50%);
-        display: flex;
-        align-items: center;
-        background-color: $color-theme;
-        border-radius: 40rpx;
-        padding: 0 10rpx;
-        .text {
-          font-size: $font-size-medium;
-          color: #333;
-        }
-      }
-    }
-    .content {
-      height: calc(100vh - 100rpx - 100rpx);
-      .user-card {
-        display: flex;
-        align-items: center;
-        border-bottom: 1px solid #333;
-        padding: 0 40rpx 20rpx;
-        .user-avatar {
-          width: 80px;
-          height: 80px;
-          border-radius: 40px;
-          margin-right: 15px;
-          background-color: #333;
-        }
-        .user-info {
-          flex: 1;
-          .username {
-            display: block;
-            font-size: $font-size-medium-x;
-            font-weight: bold;
-            margin-bottom: 8px;
-          }
-          .user-id {
-            display: block;
-            font-size: 12px;
-            color: $color-text-l;
-            margin-bottom: 8px;
-          }
-          .tag {
-            background-color: $color-theme;
-            color: #000;
-            padding: 2px 8px;
-            border-radius: 10px;
-            font-size: $font-size-small;
-          }
-        }
-      }
-      .menu-section {
-        margin: 20px 40px;
-        .menu-item {
-          display: flex;
-          align-items: center;
-          padding: 15px 0;
-          border-bottom: 1px solid #333;
-          font-size: $font-size-medium;
-          .menu-icon {
-            width: 30px;
-            font-size: 18px;
-            margin-right: 15px;
-          }
-          .menu-text {
-            flex: 1;
-          }
-        }
-      }
-    }
-  }
-</style>
+  // type: 0-我喜欢 1-喜欢我
+  const goLike = (type: 0 | 1) => {
+    uni.navigateTo({
+      url: `/pages/profile/like?type=${type}`,
+    });
+  };
+</script>
diff --git a/src/pages/profile/userinfo.vue b/src/pages/profile/userinfo.vue
index 5a8f2caa..ad6f116e 100644
--- a/src/pages/profile/userinfo.vue
+++ b/src/pages/profile/userinfo.vue
@@ -1,133 +1,131 @@
 <template>
-  <van-config-provider theme="dark">
-    <van-nav-bar title="修改资料" fixed>
-      <template #left>
-        <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
-      </template>
-      <template #right>
-        <view class="bg-color-theme px-3 py-1 rounded-full c-black" @click="saveUserInfo">
-          保存
-        </view>
-      </template>
-    </van-nav-bar>
+  <van-nav-bar title="修改资料" fixed>
+    <template #left>
+      <uni-icons type="back" size="30" color="#ffcd32" @click="back"></uni-icons>
+    </template>
+    <template #right>
+      <view class="bg-color-theme px-3 py-1 rounded-full c-black" @click="saveUserInfo">
+        保存
+      </view>
+    </template>
+  </van-nav-bar>
 
-    <view class="my-100rpx">
-      <scroll-view scroll-y>
-        <view class="flex-row-center my-8">
-          <s-uploader
-            v-model:url="userinfo.avatar"
-            fileMediatype="image"
-            limit="1"
-            mode="grid"
-            :imageStyles="{ width: '168rpx', height: '168rpx' }"
-          />
-        </view>
+  <view class="my-100rpx">
+    <scroll-view scroll-y>
+      <view class="flex-row-center my-8">
+        <s-uploader
+          v-model:url="userinfo.avatar"
+          fileMediatype="image"
+          limit="1"
+          mode="grid"
+          :imageStyles="{ width: '168rpx', height: '168rpx' }"
+        />
+      </view>
 
-        <view class="ml-5 mb-3">语音签名</view>
-        <van-cell-group inset>
-          <van-cell title="单元格" value="去录制" is-link>
-            <template #title>
-              <view class="flex items-center">
-                <uni-icons type="mic" size="30" color="#ffcd32"></uni-icons>
-                <text class="truncate">添加语音签名，让你更受关注</text>
-              </view>
-            </template>
-          </van-cell>
-        </van-cell-group>
+      <view class="ml-5 mb-3">语音签名</view>
+      <van-cell-group inset>
+        <van-cell title="单元格" value="去录制" is-link>
+          <template #title>
+            <view class="flex items-center">
+              <uni-icons type="mic" size="30" color="#ffcd32"></uni-icons>
+              <text class="truncate">添加语音签名，让你更受关注</text>
+            </view>
+          </template>
+        </van-cell>
+      </van-cell-group>
 
-        <view class="ml-5 my-3">基本资料</view>
-        <van-cell-group inset>
-          <van-cell title="昵称" value="输入">
-            <template #value>
-              <input type="text" v-model="userinfo.nickname" :maxlength="12" />
-            </template>
-          </van-cell>
-          <van-cell
-            title="生日"
-            :value="userinfo.birthday || '未填写'"
-            is-link
-            @click="showPopupPicker('birthday')"
-          />
-          <van-cell
-            title="身高"
-            :value="userinfo.height ? userinfo.height + 'cm' : '未填写'"
-            is-link
-            @click="showPopupPicker('height')"
-          />
-          <van-cell
-            title="体重"
-            :value="userinfo.weight ? userinfo.weight + 'kg' : '未填写'"
-            is-link
-            @click="showPopupPicker('weight')"
-          />
-          <van-cell
-            title="从事职业"
-            :value="userinfo.occ || '未填写'"
-            is-link
-            @click="showPopupPicker('occ')"
-          />
-        </van-cell-group>
+      <view class="ml-5 my-3">基本资料</view>
+      <van-cell-group inset>
+        <van-cell title="昵称" value="输入">
+          <template #value>
+            <input type="text" v-model="userinfo.nickname" :maxlength="12" />
+          </template>
+        </van-cell>
+        <van-cell
+          title="生日"
+          :value="userinfo.birthday || '未填写'"
+          is-link
+          @click="showPopupPicker('birthday')"
+        />
+        <van-cell
+          title="身高"
+          :value="userinfo.height ? userinfo.height + 'cm' : '未填写'"
+          is-link
+          @click="showPopupPicker('height')"
+        />
+        <van-cell
+          title="体重"
+          :value="userinfo.weight ? userinfo.weight + 'kg' : '未填写'"
+          is-link
+          @click="showPopupPicker('weight')"
+        />
+        <van-cell
+          title="从事职业"
+          :value="userinfo.occ || '未填写'"
+          is-link
+          @click="showPopupPicker('occ')"
+        />
+      </van-cell-group>
 
-        <view class="ml-5 my-3">个人简介</view>
-        <van-cell-group inset>
-          <van-field
-            v-model="userinfo.description"
-            rows="2"
-            autosize
-            type="textarea"
-            maxlength="50"
-            placeholder="说点什么吧..."
-            show-word-limit
-          />
-        </van-cell-group>
+      <view class="ml-5 my-3">个人简介</view>
+      <van-cell-group inset>
+        <van-field
+          v-model="userinfo.description"
+          rows="2"
+          autosize
+          type="textarea"
+          maxlength="50"
+          placeholder="说点什么吧..."
+          show-word-limit
+        />
+      </van-cell-group>
 
-        <view class="mx-5 my-3 flex justify-between">
-          <text>个人相册</text>
-          <text>{{ userinfo.photo.length || 0 }}/9</text>
-        </view>
-        <view class="px-4">
-          <s-uploader v-model:url="userinfo.photo" fileMediatype="image" limit="9" mode="grid" />
-        </view>
-        <view class="h-100"></view>
-      </scroll-view>
-    </view>
+      <view class="mx-5 my-3 flex justify-between">
+        <text>个人相册</text>
+        <text>{{ userinfo.photo.length || 0 }}/9</text>
+      </view>
+      <view class="px-4">
+        <s-uploader v-model:url="userinfo.photo" fileMediatype="image" limit="9" mode="grid" />
+      </view>
+      <view class="h-100"></view>
+    </scroll-view>
+  </view>
 
-    <van-popup v-model:show="showPicker" position="bottom">
-      <van-date-picker
-        v-if="pickerFiled === 'birthday'"
-        :model-value="userinfo.birthday?.split('-') || []"
-        title="生日"
-        :min-date="new Date(1980, 1, 1)"
-        :max-date="new Date()"
-        @confirm="(e) => onConfirm(e, 'birthday')"
-        @cancel="showPicker = false"
-      />
-      <van-picker
-        v-else-if="pickerFiled === 'height'"
-        :model-value="[userinfo.height]"
-        title="身高"
-        :columns="columnsHeight"
-        @confirm="(e) => onConfirm(e, 'height')"
-        @cancel="showPicker = false"
-      />
-      <van-picker
-        v-else-if="pickerFiled === 'weight'"
-        :model-value="[userinfo.weight]"
-        title="体重"
-        :columns="columnsWeight"
-        @confirm="(e) => onConfirm(e, 'weight')"
-        @cancel="showPicker = false"
-      />
-      <van-picker
-        v-else-if="pickerFiled === 'occ'"
-        :model-value="[userinfo.occ]"
-        title="选择职业"
-        :columns="columnsOcc"
-        @confirm="(e) => onConfirm(e, 'occ')"
-        @cancel="showPicker = false"
-      />
-    </van-popup>
-  </van-config-provider>
+  <van-popup v-model:show="showPicker" position="bottom">
+    <van-date-picker
+      v-if="pickerFiled === 'birthday'"
+      :model-value="userinfo.birthday?.split('-') || []"
+      title="生日"
+      :min-date="new Date(1980, 1, 1)"
+      :max-date="new Date()"
+      @confirm="(e) => onConfirm(e, 'birthday')"
+      @cancel="showPicker = false"
+    />
+    <van-picker
+      v-else-if="pickerFiled === 'height'"
+      :model-value="[userinfo.height]"
+      title="身高"
+      :columns="columnsHeight"
+      @confirm="(e) => onConfirm(e, 'height')"
+      @cancel="showPicker = false"
+    />
+    <van-picker
+      v-else-if="pickerFiled === 'weight'"
+      :model-value="[userinfo.weight]"
+      title="体重"
+      :columns="columnsWeight"
+      @confirm="(e) => onConfirm(e, 'weight')"
+      @cancel="showPicker = false"
+    />
+    <van-picker
+      v-else-if="pickerFiled === 'occ'"
+      :model-value="[userinfo.occ]"
+      title="选择职业"
+      :columns="columnsOcc"
+      @confirm="(e) => onConfirm(e, 'occ')"
+      @cancel="showPicker = false"
+    />
+  </van-popup>
 </template>
 
 <script lang="ts">
@@ -156,7 +154,7 @@
 
 <script setup lang="ts">
   import { onLoad } from '@dcloudio/uni-app';
-  import { reactive, ref, watch } from 'vue';
+  import { reactive, ref } from 'vue';
   // @ts-ignore
   import UserApi from '@/sheep/api/member/user';
   import sUploader from '@/sheep/components/s-uploader/s-uploader.vue';
diff --git a/src/sheep/api/member/recent.ts b/src/sheep/api/member/recent.ts
index 9cae3d34..c2792843 100644
--- a/src/sheep/api/member/recent.ts
+++ b/src/sheep/api/member/recent.ts
@@ -13,6 +13,32 @@ const RecentApi = {
       },
     });
   },
+  // 创建朋友圈
+  createMoment: (data: any) => {
+    return request({
+      url: '/member/recent/create',
+      method: 'POST',
+      data,
+      custom: {
+        showLoading: true,
+        showSuccess: true,
+        loadingMsg: '提交中',
+        successMsg: '提交成功',
+      },
+    });
+  },
+  // 查看我喜欢
+  likeIt: (data: any) => {
+    return request({
+      url: '/member/recent/like/it-page',
+      method: 'POST',
+      data,
+      custom: {
+        showLoading: true,
+        loadingMsg: '加载中',
+      },
+    });
+  },
 };
 
 export default RecentApi;
diff --git a/src/sheep/components/moment/moment.vue b/src/sheep/components/moment/moment.vue
index d07e1cce..6f3ef891 100644
--- a/src/sheep/components/moment/moment.vue
+++ b/src/sheep/components/moment/moment.vue
@@ -1,144 +1,69 @@
 <template>
-  <view class="moment">
-    <view class="user">
-      <image :src="avatar" class="avatar" />
-      <view class="details">
-        <view>
-          <text class="username">{{ name }}</text>
-          <text v-if="verification" class="verification">实人认证</text>
+  <view class="border-1 border-b-solid border-#333333 px-6 py-2">
+    <view class="mb-30rpx flex items-center">
+      <image :src="avatar" class="mr-3 h-88rpx w-88rpx rounded-full bg-#333333" />
+      <view class="flex-1">
+        <view class="flex items-center">
+          <text class="mr-2 text-base">{{ name }}</text>
+          <text v-if="verification" class="rounded-6rpx bg-color-theme px-2 py-1 text-sm text-black"
+            >实人认证</text
+          >
         </view>
-        <view class="info">女 · 20岁 | 学生</view>
+        <view class="mt-6 text-xs text-white/80">女 · 20岁 | 学生</view>
       </view>
     </view>
-    <view class="content">
-      <text class="text">{{ content }}</text>
-      <view class="images" v-if="images && images.length > 0">
-        <image v-for="(img, index) in images" :key="index" :src="img" class="moment-image" />
+    <view class="mb-30rpx px-40rpx">
+      <text class="leading-[1.5] text-white">{{ content }}</text>
+      <view class="mt-20rpx flex flex-wrap gap-20rpx" v-if="images && images.length > 0">
+        <image
+          v-for="(img, index) in images"
+          :key="index"
+          :src="img"
+          class="size-200rpx rounded-full bg-#333333"
+        />
       </view>
     </view>
-    <view class="address">
+    <view class="mb-20rpx flex items-center gap-10rpx px-40rpx text-xs text-white/70">
       <uni-icons type="location" size="16" color="#B5B4BC"></uni-icons>
-      <text class="city">{{ location }}</text>
+      <text>{{ location }}</text>
     </view>
-    <view class="actions">
-      <view class="action-btn">
+    <view class="flex gap-60rpx px-40rpx text-white">
+      <view class="flex items-center gap-10rpx text-sm">
         <uni-icons type="heart" size="24" color="#B5B4BC"></uni-icons>
         <uni-icons type="heart-filled" size="24" color="#ffcd32"></uni-icons>
-        <text class="text">{{ likes }} 喜欢</text>
+        <text>{{ likes }} 喜欢</text>
       </view>
-      <view class="action-btn">
+      <view class="flex items-center gap-10rpx text-sm">
         <uni-icons type="chat" size="24" color="#B5B4BC"></uni-icons>
-        <text class="text">{{ comments }} 打招呼</text>
+        <text>{{ comments }} 打招呼</text>
       </view>
     </view>
   </view>
 </template>
 
 <script setup lang="ts">
-withDefaults(
-  defineProps<
-    Partial<{
-      avatar: string;
-      name: string;
-      verification: boolean;
-      content: string;
-      images: string[];
-      location: string;
-      likes: number | string;
-      comments: number | string;
-    }>
-  >(),
-  {
-    avatar: "",
-    name: "",
-    verification: false,
-    content: "",
-    images: () => [],
-    location: "",
-    likes: 0,
-    comments: 0,
-  }
-);
+  withDefaults(
+    defineProps<
+      Partial<{
+        avatar: string;
+        name: string;
+        verification: boolean;
+        content: string;
+        images: string[];
+        location: string;
+        likes: number | string;
+        comments: number | string;
+      }>
+    >(),
+    {
+      avatar: '',
+      name: '',
+      verification: false,
+      content: '',
+      images: () => [],
+      location: '',
+      likes: 0,
+      comments: 0,
+    },
+  );
 </script>
-
-<style scoped lang="scss">
-.moment {
-  padding: 20px;
-  border-bottom: 1px solid #333;
-  .user {
-    display: flex;
-    align-items: center;
-    margin-bottom: 15px;
-    .avatar {
-      width: 44px;
-      height: 44px;
-      border-radius: 20px;
-      margin-right: 10px;
-      background-color: #333;
-    }
-    .details {
-      flex: 1;
-      .username {
-        font-size: $font-size-medium-x;
-        margin-right: 20rpx;
-      }
-      .verification {
-        background-color: $color-theme;
-        font-size: $font-size-small;
-        color: black;
-        padding: 4rpx;
-        border-radius: 6rpx;
-      }
-      .info {
-        font-size: $font-size-small;
-        margin-top: 20rpx;
-      }
-    }
-  }
-  .content {
-    flex: 1;
-    padding: 0 20px;
-    margin-bottom: 15px;
-    .text {
-      line-height: 1.5;
-    }
-    .images {
-      margin-top: 20rpx;
-      display: flex;
-      gap: 10px;
-      flex-wrap: wrap;
-      .moment-image {
-        width: 100px;
-        height: 100px;
-        border-radius: 8px;
-        background-color: #333;
-      }
-    }
-  }
-  .address {
-    display: flex;
-    align-items: center;
-    gap: 10rpx;
-    padding: 0 20rpx;
-    margin-bottom: 20rpx;
-    .city {
-      font-size: $font-size-small;
-    }
-  }
-  .actions {
-    display: flex;
-    gap: 60rpx;
-    padding: 0 20rpx;
-    .action-btn {
-      display: flex;
-      align-items: center;
-      gap: 10rpx;
-      color: $color-text;
-      font-size: $font-size-medium;
-      .text {
-        font-size: $font-size-medium;
-      }
-    }
-  }
-}
-</style>
diff --git a/src/sheep/components/s-uploader/s-uploader.vue b/src/sheep/components/s-uploader/s-uploader.vue
index e0a37e34..044f4808 100644
--- a/src/sheep/components/s-uploader/s-uploader.vue
+++ b/src/sheep/components/s-uploader/s-uploader.vue
@@ -199,7 +199,8 @@
       return {
         files: [],
         localValue: [],
-        imgsrc: sheep.$url.static('/static/img/shop/upload-camera.png'),
+        // imgsrc: sheep.$url.static('/static/img/shop/upload-camera.png'),
+        imgsrc: '/static/upload-icon.png',
       };
     },
     watch: {
diff --git a/src/sheep/hooks/use-scroll.ts b/src/sheep/hooks/use-scroll.ts
index 89d7b4f0..fa979fef 100644
--- a/src/sheep/hooks/use-scroll.ts
+++ b/src/sheep/hooks/use-scroll.ts
@@ -26,17 +26,17 @@ export default function useScroll(fetchList: (...arg: any) => Promise<any>, fetc
       }
       if (isRefresh) {
         pageInfo.current = 1;
-        const { data } = await fetchList({ ...pageInfo, ...fetchBody });
-        listData.value = data.list;
+        const { data = [] } = await fetchList({ ...pageInfo, ...fetchBody });
+        listData.value = data.list ?? [];
         pageInfo.total = data.total;
       } else {
-        const { data } = await fetchList({ ...pageInfo, ...fetchBody });
-        listData.value.push(...data.list);
+        const { data = [] } = await fetchList({ ...pageInfo, ...fetchBody });
+        listData.value.push(...(data.list ?? []));
         pageInfo.total = data.total;
       }
       pageInfo.current = pageInfo.current + 1;
 
-      if (listData.value.length >= pageInfo.total) {
+      if (listData.value?.length >= pageInfo.total) {
         loadMoreStatus.value = 'noMore';
       } else {
         loadMoreStatus.value = 'more';
diff --git a/src/static/upload-icon.png b/src/static/upload-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..5cb0cfa4eee6c772a2dfd495ae6897d6b3828862
GIT binary patch
literal 1581
zcmV+|2GaS7P)<h;3K|Lk000e1NJLTq003kF003kN1^@s6aN?Cz000HzNkl<ZcmeF2
zQI8W<6vxlG)tBuQOxU)|7a+F710TQ#QBi^-LLg)bfe?^D2m~c4sK`Q4gb)ZyP(%qz
zSP3hEAcR2B<vU2HXn5A`bPdUNipjb&*E36Yvm2NlrtI9g)10QKy}do>o-_a7%-p%1
zQ~*D;Qh<SIg#&<rFc8fY(5xIjLKui<3TReN>W`42zvgrf4VdpbwNkHbn}%lkMlL7y
zK*V#IJ|X0{fY{vuvJqJU%>q&lr1AHQF9RSMj6WK+a?kjO6gE-~B!zm1mK+a|(6sCj
zqyPg6QYN8(29l8QL1`ICkTMDNGmwOY4@%2Gf|N<9pMfMKd{9~j5~NH*{R|`_;e*mL
zkRW9e>Q57pgd|d%mVv0%J2V>u36)5#0|Qa3cW5>S5-O2e2L_^6@6c=vBvc}`4h%%C
z-l5qTNT@_=9T<pOy+gAxkWh)#IxrBmdWU9XAfXbebzmTB^$yL(Ktd%_>%c(N>K&Sm
zfrLt=)`5Yj)jKpB0|}K#tpfv5t9NKN1`;Y!OAajuF_4y}izkqQ#G`A=qcV_|rHdz!
zfyAS0%cC-omZgg)kb%UbYs;ff3FN_pc`rD1v%6U@f7+;-dzyCXW5+J<CfnuIN*|Ez
zbn4|DPThRZsh74l?D96Utqt4U(i|*pZq&+~nssv{*@hvzw4UPDIfLd}id*B<%B%ma
zo2#4wv%6uJRz9@LD;l=B{9$eGvgTmvouPs95{g^gte4(w+NDK~Z7y{Fnftm^D=lya
z%db-G{GhG&|1Pbo1=T#(9|*+Xpy&S^?guG*rG$Nma=!#TK!Kl=9R$QfWQRe*5%M_-
z5|1Ikak4KF<O%8FNksTsN_mRxv;h2$;?964&jR8PfN;*0@;nIHi+~qAfQuB@=b?9r
zVlN8;S19hPlz2@7UI&mj!1Znd;w|vtHpTvi8PQK;PI@B3UcX;gYuM#KnzVyWDtf{P
zF`+%VDR2dK%p>FHG%A1qb7<#V8Z=}u5Wsp+5cfZ$0uqLUMhFCwD_T8t`2P|V$o<ct
z0OFmX=s+NTKsIl^?TJiDy54+U&98H!(N5GO5nrKs<~5q17Jw9QKn52gz#<prTZm#Y
zA};ZyTq=ZIMsw71k--%bV5LOaEf7}$!fKiq*MPva0Jx4$G3#l5+dy#}rG!n0uvtpE
zMFMUm0k_fowjDft9}stdgq<|@hZMI906vnQ{DflnP~2X!ec8<L%v{0hqwk*hr175E
zKi)Z`^Y?qX+4t_~XyZjrXm}pTT)xt8bXmU|oz>e$@$M~SR^?{4VBMIRuU^mQ?_SI1
zD_3U}t5-TYtCw@d%B7B3m7htZi@ALDLPx&xlaaU18^!85qqFj(QK+1qQLxTr3)Sx_
z?sTqboyz8|Z*s-z$y}jwqN8AaWfZE%jjqZuBVRdc6s;pP_F;-UWE8A}xvuJG6nh|7
zwDyzr;H>*Y6Uu$884BdF2+cbLO4^|{FLH|V+71W+G7!+{A?bv!Q8|%I;UgrnWbp>H
z9T1N$YvPqG-qG6*h~POS-aRJr=z=Hph?>Rh?gGv0G3SVJcoE~+$qX%MX_!prY027l
zKqR1?7G)9|r0swJ@Eig<J?O?3uhew{;<+B5vUCC>__9|g8~~ojle$(!1Yh=Q#REX{
zRhAY+#)@zW$yhs$?`^jZ5xfr3Y(L~VL^B{RUuEe<gx4XO@c`hTPIN-z@-1AQaQL<G
zI>c8&8_Q%Eh&C|%LfjFTf9>^!(8a{G9wF+tN~lj6Z$@{7*CFvL9C37>Lm~<mzq`ll
zkoZM@`V1oycv63Qx#IWCfZ!t}ewia=;H#_%VySTDb%+X;Bjn&CB!XB9Tr+%6U4hCG
zQjDbFlr`1nh^fBR{X74!+H{Tk=UAP7+wU9uoW}Q50~r<E9e#;!NqsSDetWbty)UT;
zlAC?MZgg3@ee>JtMe(Te)B}068SV4RKr~~?Kp2Q-3TRdiA0e6n`5yoP|Nmcgychrg
f00v1!K~w_(7FOTqlkcA-00000NkvXXu0mjfuW;!a

literal 0
HcmV?d00001

diff --git a/src/uni.scss b/src/uni.scss
index c39c7b7b..f7e0a709 100644
--- a/src/uni.scss
+++ b/src/uni.scss
@@ -74,33 +74,3 @@ $uni-color-subtitle: #555; // 二级标题颜色
 $uni-font-size-subtitle: 18px;
 $uni-color-paragraph: #3f536e; // 文章段落颜色
 $uni-font-size-paragraph: 15px;
-
-// ---------------------------------------------------------------------------------------------
-
-// 自定义scss变量
-// 颜色
-$color-background: #222222;
-$color-background-d: rgba(0, 0, 0, 0.3);
-$color-highlight-background: #333;
-$color-theme: #ffcd32;
-$color-theme-d: rgba(255, 205, 49, 0.5);
-$color-sub-theme: #d93f30;
-$color-text: #ffffff;
-$color-text-d: rgba(255, 255, 255, 0.3);
-$color-text-l: rgba(255, 255, 255, 0.5);
-$color-text-ll: rgba(255, 255, 255, 0.8);
-$color-dialog-background: #666;
-
-// 字体
-$font-size-small-s: 10px;
-$font-size-small: 12px;
-$font-size-medium: 14px;
-$font-size-medium-x: 16px;
-$font-size-large: 18px;
-$font-size-large-x: 22px;
-
-@mixin no-wrap() {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}