Răsfoiți Sursa

优化:收益页面公告显示逻辑调整

haiyang 16 ore în urmă
părinte
comite
d064b88f59
2 a modificat fișierele cu 15 adăugiri și 10 ștergeri
  1. 15 9
      src/pages/income/income.vue
  2. 0 1
      src/utils/systemInfo.ts

+ 15 - 9
src/pages/income/income.vue

@@ -2,7 +2,7 @@
 import type { AccountDetailItem } from '@/api/income'
 import { useRequest } from 'alova/client'
 import { storeToRefs } from 'pinia'
-import { ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { getAccountCount } from '@/api/home'
 import { getAccountDetailTotalAmount, getCouponIssuerAccountByPageMap } from '@/api/income'
 import { useScroll } from '@/hooks/useScroll'
@@ -136,6 +136,11 @@ onShow(async () => {
         // 数据会在useScroll的onMounted中自动加载,这里不需要额外调用
     }
 })
+const isUnlock = computed(() => accountCountData && accountCountData?.status === 0)
+
+watch(() => accountCountData, (newVal) => {
+    console.log(newVal)
+})
 
 function showTimeFilter() {
     show.value = true
@@ -170,9 +175,9 @@ function goPage(page: string) {
         :style="{ height: `calc(100vh - ${safeAreaInsets.top}px - ${safeAreaInsets.bottom}px)` }">
         <!-- 顶部区域 -->
         <view class="income-header"
-            :style="{ background: `url(${getImageUrl('@img/income/income-bg.png')}) no-repeat center center`, backgroundSize: 'cover' }">
+            :style="{ background: `url(${getImageUrl('@img/income/income-bg.png')})`, backgroundSize: '100% 110%', backgroundPosition: 'left bottom', backgroundRepeat: 'no-repeat' }">
             <view class="income-header-avatar-info"
-                :style="{ paddingTop: `${safeAreaInsets.top + menuButtonInfo.height + 12}px` }">
+                :style="{ paddingTop: `calc(${safeAreaInsets.top}px + ${menuButtonInfo.height}px)` }">
                 <view class="income-header-balance">
                     当前账户余额(元)
                 </view>
@@ -181,8 +186,7 @@ function goPage(page: string) {
                         {{ accountCountData?.balance || 0 }}
                     </view>
                     <view class="income-header-balance-num-btns">
-                        <view v-if="accountCountData?.status === 0" class="income-header-balance-num-btn js"
-                            @click="goPage('unlockRewards')">
+                        <view v-if="isUnlock" class="income-header-balance-num-btn js" @click="goPage('unlockRewards')">
                             解锁
                         </view>
                     </view>
@@ -208,7 +212,7 @@ function goPage(page: string) {
             </view>
         </view>
         <!-- 公告 -->
-        <view class="income-header-notice">
+        <view v-if="isUnlock" class="income-header-notice">
             <view class="income-header-notice-icon">
                 <image :src="getImageUrl('@img/income/notice.png')" mode="aspectFit" />
             </view>
@@ -217,7 +221,7 @@ function goPage(page: string) {
             </view>
         </view>
         <!-- 菜单 -->
-        <view class="income-header-menu">
+        <view class="income-header-menu" :style="{ marginTop: isUnlock ? '24rpx' : '-50rpx' }">
             <!-- 结算筛选 -->
             <view class="income-header-menu-filter">
                 <view class="income-header-menu-filter-item" :class="[activeTab === 'pending' ? 'active' : '']"
@@ -299,7 +303,7 @@ function goPage(page: string) {
     /* 添加这行,设置容器高度为视口高度 */
 
     .income-header {
-        height: 525rpx;
+        height: 526rpx;
 
         .income-header-avatar-info {
             display: flex;
@@ -425,7 +429,9 @@ function goPage(page: string) {
     .income-header-menu {
         // background: #ffffff;
         border-radius: 10rpx 10rpx 0rpx 0rpx;
-        margin: 24rpx 24rpx 23rpx;
+        margin-left: 24rpx;
+        margin-bottom: 24rpx;
+        margin-right: 23rpx;
         flex: 1;
         display: flex;
         flex-direction: column;

+ 0 - 1
src/utils/systemInfo.ts

@@ -7,7 +7,6 @@ const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
 // #ifdef MP-WEIXIN
 // 微信小程序使用新的API
 systemInfo = uni.getWindowInfo()
-console.log(9990, systemInfo)
 safeAreaInsets = systemInfo.safeArea
     ? {
         top: systemInfo.safeArea.top,