Merge remote-tracking branch 'origin/master'

doum

2026-04-28 28a2f7a48f508970a10413c8aa2367a4e4790b1b

 app/pages/message/message.vue

@@ -1,6 +1,39 @@
<template>
   <view>
		
   <view class="message-page">
      <view class="message-page__nav" :style="{ paddingTop: statusBarHeight + 'px' }">
         <view class="message-page__nav-inner">
            <text class="message-page__nav-title">消息</text>
         </view>
      </view>

      <scroll-view class="message-page__body" scroll-y :style="bodyStyle" @scrolltolower="loadMore">
         <view class="message-page__list">
            <view v-for="item in messageList" :key="item.id" class="message-card" @click="handleClick(item)">
               <view class="message-card__icon-wrap">
                  <view class="message-card__icon-bg">
                     <text class="message-card__icon">🔔</text>
                  </view>
                  <view v-if="item.status === 0" class="message-card__dot"></view>
               </view>

               <view class="message-card__content">
                  <text class="message-card__title">{{ item.title }}</text>
                  <text class="message-card__desc">{{ item.content }}</text>
                  <text class="message-card__time">{{ item.createTime }}</text>
               </view>
            </view>

            <view v-if="loading" class="message-page__loading">
               <text class="message-page__loading-text">加载中...</text>
            </view>
            <view v-if="finished && messageList.length > 0" class="message-page__loading">
               <text class="message-page__loading-text">没有更多了</text>
            </view>
            <view v-if="!loading && messageList.length === 0" class="message-page__empty">
               <image class="message-page__empty-icon" src="/static/image/default_nodata@2x.png" mode="aspectFit"></image>
            </view>
         </view>
      </scroll-view>
   </view>
</template>

@@ -8,12 +41,206 @@
   export default {
      data() {
         return {
				
         };
            statusBarHeight: 0,
            navHeight: 0,
            page: 1,
            capacity: 10,
            messageList: [],
            loading: false,
            finished: false
         }
      },
      computed: {
         bodyStyle() {
            return {
               marginTop: this.navHeight + 'px',
               height: `calc(100vh - ${this.navHeight}px)`
            }
         }
      },
      onLoad() {
         const systemInfo = uni.getSystemInfoSync()
         this.statusBarHeight = systemInfo.statusBarHeight || 0
         this.navHeight = this.statusBarHeight + uni.upx2px(88)
      },

      onShow() {
         this.refreshList()
      },

      onReachBottom() {
         this.loadMore()
      },

      methods: {
         handleClick(item) {
            if (item.objType === 0) {
               uni.navigateTo({
                  url: '/pages/order-detail/order-detail?id=' + item.objId
               })
            }
         },
         refreshList() {
            this.page = 1
            this.messageList = []
            this.finished = false
            this.getMessageList()
         },

         loadMore() {
            if (this.loading || this.finished) return
            this.page++
            this.getMessageList()
         },

         getMessageList() {
            this.loading = true
            this.$u.api.driverNoticePage({ capacity: this.capacity, page: this.page, model: {} }).then(res => {
               this.loading = false
               if (res.code === 200) {
                  const list = res.data.records || []
                  if (this.page === 1) {
                     this.messageList = list
                     this.$u.api.driverReadAllNotice()
                  } else {
                     this.messageList = [...this.messageList, ...list]
                  }
                  this.finished = list.length < this.capacity
               }
            })
         }
      }
   }
</script>

<style lang="scss">
<style lang="scss" scoped>
   .message-page {
      height: 100vh;
      background: #f6f8fc;
      overflow: hidden;

</style>
      &__nav {
         position: fixed;
         left: 0;
         top: 0;
         right: 0;
         z-index: 10;
         background: linear-gradient(180deg, #1f73f6 0%, #1b6df2 100%);
      }

      &__nav-inner {
         height: 88rpx;
         display: flex;
         align-items: center;
         padding: 0 24rpx;
      }

      &__nav-title {
         font-size: 36rpx;
         font-weight: 700;
         color: #ffffff;
      }

      &__body {
         box-sizing: border-box;
      }

      &__list {
         padding: 18rpx 18rpx calc(env(safe-area-inset-bottom) + 24rpx);
      }

      &__loading {
         display: flex;
         justify-content: center;
         align-items: center;
         padding: 30rpx 0;
      }

      &__loading-text {
         font-size: 26rpx;
         color: #999;
      }

      &__empty {
         display: flex;
         justify-content: center;
         align-items: center;
         height: 100%;
      }

      &__empty-icon {
         width: 320rpx;
         height: 320rpx;
      }
   }

   .message-card {
      display: flex;
      align-items: flex-start;
      gap: 18rpx;
      padding: 24rpx 20rpx;
      margin-bottom: 18rpx;
      border-radius: 18rpx;
      background: #ffffff;
      box-shadow: 0 8rpx 20rpx rgba(28, 55, 106, 0.04);

      &__icon-wrap {
         position: relative;
         flex-shrink: 0;
      }

      &__icon-bg {
         width: 52rpx;
         height: 52rpx;
         border-radius: 50%;
         background: #fff7e3;
         display: flex;
         align-items: center;
         justify-content: center;
      }

      &__icon {
         font-size: 26rpx;
         line-height: 1;
      }

      &__dot {
         position: absolute;
         right: 0;
         top: 0;
         width: 14rpx;
         height: 14rpx;
         border-radius: 50%;
         background: #ff3b30;
         border: 2rpx solid #ffffff;
      }

      &__content {
         flex: 1;
         min-width: 0;
      }

      &__title {
         display: block;
         font-size: 36rpx;
         font-weight: 700;
         color: #2b3139;
         line-height: 1.35;
      }

      &__desc {
         display: block;
         margin-top: 10rpx;
         font-size: 28rpx;
         line-height: 1.55;
         color: #8c95a3;
      }

      &__time {
         display: block;
         margin-top: 16rpx;
         font-size: 26rpx;
         color: #b1b7c1;
      }
   }
</style>