Pārlūkot izejas kodu

💄 style(profile): 调整个人中心页面样式和布局

- 减少内容区域上边距从340rpx到200rpx,优化视觉间距
- 为ScrollView添加key属性,下拉刷新时强制重新渲染以解决滚动位置问题
- 统一调整欠款信息卡片和订单状态卡片的顶部内边距为pt-2
- 修复布局结构,将内容区域包裹在flex容器中确保正确布局
yourname 4 nedēļas atpakaļ
vecāks
revīzija
c2a039a2f3

+ 1 - 1
mini/src/pages/profile/index.css

@@ -11,7 +11,7 @@
 
 /* 内容区域定位 */
 .tdesign-user-center-content {
-  margin-top: 340rpx;
+  margin-top: 200rpx;
   min-height: calc(100vh - 340rpx);
 }
 

+ 7 - 3
mini/src/pages/profile/index.tsx

@@ -25,6 +25,7 @@ const ProfilePage: React.FC = () => {
   const [editingAvatar, setEditingAvatar] = useState<string | undefined>(undefined)
   const [editingAvatarFileId, setEditingAvatarFileId] = useState<number | undefined>(undefined)
   const [editingNickname, setEditingNickname] = useState('')
+  const [scrollViewKey, setScrollViewKey] = useState(0)
 
   // 查询用户信用额度
   const {
@@ -76,6 +77,7 @@ const ProfilePage: React.FC = () => {
     ]).finally(() => {
       console.debug('个人中心下拉刷新完成')
       Taro.stopPullDownRefresh()
+      setScrollViewKey(prev => prev + 1)
     })
   })
 
@@ -318,12 +320,13 @@ const ProfilePage: React.FC = () => {
       />
 
       {/* 内容区域 - 使用 margin-top 定位 */}
-      <ScrollView className="flex-1 bg-gray-50 tdesign-user-center-content z-10">
+      <ScrollView key={scrollViewKey} className="flex-1 bg-gray-50 tdesign-user-center-content z-10">
+        <View className="flex flex-col flex-shrink-0">
 
 
            {/* 欠款信息卡片 */}
            {creditBalance && creditBalance.usedAmount > 0 && (
-          <View className="px-4 pt-4">
+          <View className="px-4 pt-2">
             <View className="bg-white rounded-2xl overflow-hidden">
               <View className="p-5 border-b border-gray-100">
                 <View className="flex items-center justify-between">
@@ -388,7 +391,7 @@ const ProfilePage: React.FC = () => {
 
 
         {/* 订单状态卡片 */}
-        <View className="px-4 pt-4">
+        <View className="px-4 pt-2">
           <TDesignOrderGroup
             orderTagInfos={orderTagInfos}
             title="我的订单"
@@ -446,6 +449,7 @@ const ProfilePage: React.FC = () => {
             v0.0.14 - 小程序版
           </Text>
         </View>
+        </View>
       </ScrollView>
       {/* 客服弹窗 */}
       <TDesignPopup