wlzboy
14 小时以前 10354e63eb3298beb9ebcc029dd9f48d8936a272
app/pages/message/index.vue
@@ -2,6 +2,10 @@
  <view class="message-container">
    <view class="message-header">
      <view class="header-title">消息中心</view>
      <view class="subscribe-btn" v-if="!subscribed" @click="subscribeMessage">
        <uni-icons type="bell" size="20" color="#007AFF"></uni-icons>
        <text>订阅通知</text>
      </view>
    </view>
    
    <scroll-view class="message-list-scroll" scroll-y="true">
@@ -10,7 +14,7 @@
        <view 
          class="message-item" 
          v-for="message in sortedMessages" 
          :key="message.id"
          :key="message.messageId"
          @click="viewMessageDetail(message)"
        >
          <view class="message-main">
@@ -19,7 +23,7 @@
              <view class="unread-dot" v-if="message.isRead === '0'"></view>
            </view>
            <view class="message-content">{{ message.messageContent }}</view>
            <view class="message-time">{{ message.createTime }}</view>
            <view class="message-time">{{ formatMessageTime(message.createTime) }}</view>
          </view>
        </view>
        
@@ -34,13 +38,16 @@
<script>
  import { getMyMessages, markAsRead } from '@/api/message'
  import { formatDateTime } from '@/utils/common'
  import subscribeManager from '@/utils/subscribe'
  
  export default {
    data() {
      return {
        // 消息列表
        messages: [],
        loading: false
        loading: false,
        subscribed: false,
      }
    },
    computed: {
@@ -48,20 +55,26 @@
      sortedMessages() {
        return [...this.messages].sort((a, b) => {
          if (a.isRead === b.isRead) {
            // 相同状态按时间倒序
            return new Date(b.createTime) - new Date(a.createTime);
            // 相同状态按时间倒序 - 使用兼容iOS的日期格式
            const timeA = a.createTime ? new Date(a.createTime.replace(/-/g, '/')) : new Date(0)
            const timeB = b.createTime ? new Date(b.createTime.replace(/-/g, '/')) : new Date(0)
            return timeB - timeA
          }
          // 未读的排在前面
          return a.isRead === '0' ? -1 : 1;
        });
          return a.isRead === '0' ? -1 : 1
        })
      }
    },
    onLoad() {
      this.loadMessages()
      // 自动订阅(如果未订阅则显示确认弹窗)
      this.autoSubscribeOnLaunch()
    },
    onShow() {
      // 每次显示页面时刷新消息
      this.loadMessages()
      // 更新TabBar徽标
      this.updateTabBarBadge()
    },
    onPullDownRefresh() {
      this.loadMessages().then(() => {
@@ -69,6 +82,21 @@
      })
    },
    methods: {
      // 自动订阅(页面加载时调用)
      autoSubscribeOnLaunch() {
        subscribeManager.autoSubscribe()
          .then((result) => {
            if (result.skipped) {
              console.log('用户已订阅,无需重复订阅')
            } else if (result.success) {
              console.log('自动订阅成功')
            }
          })
          .catch((error) => {
            console.log('自动订阅取消或失败:', error)
          })
      },
      // 加载消息列表
      async loadMessages() {
        try {
@@ -101,25 +129,74 @@
      // 查看消息详情(跳转到任务详情)
      async viewMessageDetail(message) {
        try {
          // 校验消息对象
          if (!message || !message.messageId) {
            console.error('消息数据异常:', message)
            this.$modal.showToast('消息数据异常')
            return
          }
          // 标记为已读
          if (message.isRead === '0') {
            await markAsRead(message.messageId)
            message.isRead = '1'
            // 更新徽标
            this.updateTabBarBadge()
          }
          
          // 跳转到任务详情页面
          if (message.taskId) {
            this.$tab.navigateTo(`/pages/task/detail?id=${message.taskId}`)
            this.$tab.navigateTo(`/pagesTask/detail?id=${message.taskId}`)
          } else {
            this.$modal.showToast('无法找到关联任务')
          }
        } catch (error) {
          console.error('标记消息已读失败:', error)
          // 即使标记失败,也允许跳转
          if (message.taskId) {
            this.$tab.navigateTo(`/pages/task/detail?id=${message.taskId}`)
          if (message && message.taskId) {
            this.$tab.navigateTo(`/pagesTask/detail?id=${message.taskId}`)
          }
        }
      },
      // 更新TabBar徽标
      updateTabBarBadge() {
        const unreadCount = this.messages.filter(msg => msg.isRead === '0').length
        console.log('未读消息数量:', unreadCount)
        if (unreadCount > 0) {
          uni.setTabBarBadge({
            index: 3, // 消息页面在tabBar中的索引
            text: unreadCount > 99 ? '99+' : unreadCount.toString()
          })
        } else {
          uni.removeTabBarBadge({
            index: 3
          })
        }
      },
      // 格式化消息时间显示
      formatMessageTime(dateTime) {
        if (!dateTime) return ''
        return formatDateTime(dateTime, 'MM-DD HH:mm')
      },
      // 订阅任务通知
      subscribeMessage() {
        subscribeManager.subscribeWithConfirm()
          .then((result) => {
            if (result.success) {
              uni.showToast({
                title: '订阅成功,您将收到任务通知',
                icon: 'success',
                duration: 2000
              })
            }
          })
          .catch((error) => {
            console.log('订阅失败:', error)
          })
      }
    }
  }
@@ -162,6 +239,24 @@
      font-size: 36rpx;
      font-weight: bold;
    }
    .subscribe-btn {
      display: flex;
      align-items: center;
      padding: 10rpx 20rpx;
      background-color: #f0f9ff;
      border-radius: 30rpx;
      text {
        margin-left: 8rpx;
        font-size: 26rpx;
        color: #007AFF;
      }
      &:active {
        opacity: 0.7;
      }
    }
  }
  
  .message-list-scroll {