实现消息记录功能，包括增删改查和标记已读，优化消息列表展示和未读消息计数

Entity/MessageRecord.cs

@@ -0,0 +1,22 @@
+namespace Entity;
+
+/// <summary>
+/// 消息实体
+/// </summary>
+public class MessageRecord : BaseEntity
+{
+    /// <summary>
+    /// 消息标题
+    /// </summary>
+    public string Title { get; set; } = string.Empty;
+
+    /// <summary>
+    /// 消息内容
+    /// </summary>
+    public string Content { get; set; } = string.Empty;
+
+    /// <summary>
+    /// 是否已读
+    /// </summary>
+    public bool IsRead { get; set; } = false;
+}

Repository/MessageRecordRepository.cs

@@ -0,0 +1,31 @@
+namespace Repository;
+
+public interface IMessageRecordRepository : IBaseRepository<MessageRecord>
+{
+    Task<(IEnumerable<MessageRecord> List, long Total)> GetPagedListAsync(int pageIndex, int pageSize);
+    Task<bool> MarkAllAsReadAsync();
+}
+
+public class MessageRecordRepository(IFreeSql freeSql) : BaseRepository<MessageRecord>(freeSql), IMessageRecordRepository
+{
+    public async Task<(IEnumerable<MessageRecord> List, long Total)> GetPagedListAsync(int pageIndex, int pageSize)
+    {
+        var list = await FreeSql.Select<MessageRecord>()
+            .OrderByDescending(x => x.CreateTime)
+            .Count(out var total)
+            .Page(pageIndex, pageSize)
+            .ToListAsync();
+            
+        return (list, total);
+    }
+
+    public async Task<bool> MarkAllAsReadAsync()
+    {
+        var affected = await FreeSql.Update<MessageRecord>()
+            .Set(a => a.IsRead, true)
+            .Set(a => a.UpdateTime, DateTime.Now)
+            .Where(a => !a.IsRead)
+            .ExecuteAffrowsAsync();
+        return affected >= 0;
+    }
+}

Service/EmailHandleService.cs

@@ -20,7 +20,8 @@ public class EmailHandleService(
     ILogger<EmailHandleService> logger,
     IEmailMessageRepository emailRepo,
     ITransactionRecordRepository trxRepo,
-    IEnumerable<IEmailParseServices> emailParsers
+    IEnumerable<IEmailParseServices> emailParsers,
+    IMessageRecordService messageRecordService
 ) : IEmailHandleService
 {
     public async Task<bool> HandleEmailAsync(
@@ -60,10 +61,18 @@ public class EmailHandleService(
             );
         if (parsed == null || parsed.Length == 0)
         {
+            await messageRecordService.AddAsync(
+                "邮件解析失败",
+                $"来自 {from} 发送给 {to} 的邮件（主题：{subject}）未能成功解析内容，可能格式已变更或不受支持。"
+            );
             logger.LogWarning("未能成功解析邮件内容，跳过账单处理");
             return true;
         }
 
+        await messageRecordService.AddAsync(
+            "邮件解析成功",
+            $"来自 {from} 发送给 {to} 的邮件（主题：{subject}）已成功解析出 {parsed.Length} 条交易记录。"
+        );
         logger.LogInformation("成功解析邮件，共 {Count} 条交易记录", parsed.Length);
 
         bool allSuccess = true;

Service/MessageRecordService.cs

@@ -0,0 +1,68 @@
+namespace Service;
+
+public interface IMessageRecordService
+{
+    Task<(IEnumerable<MessageRecord> List, long Total)> GetPagedListAsync(int pageIndex, int pageSize);
+    Task<MessageRecord?> GetByIdAsync(long id);
+    Task<bool> AddAsync(MessageRecord message);
+    Task<bool> AddAsync(string title, string content);
+    Task<bool> MarkAsReadAsync(long id);
+    Task<bool> MarkAllAsReadAsync();
+    Task<bool> DeleteAsync(long id);
+    Task<long> GetUnreadCountAsync();
+}
+
+public class MessageRecordService(IMessageRecordRepository messageRepo) : IMessageRecordService
+{
+    public async Task<(IEnumerable<MessageRecord> List, long Total)> GetPagedListAsync(int pageIndex, int pageSize)
+    {
+        return await messageRepo.GetPagedListAsync(pageIndex, pageSize);
+    }
+
+    public async Task<MessageRecord?> GetByIdAsync(long id)
+    {
+        return await messageRepo.GetByIdAsync(id);
+    }
+
+    public async Task<bool> AddAsync(MessageRecord message)
+    {
+        return await messageRepo.AddAsync(message);
+    }
+
+    public async Task<bool> AddAsync(string title, string content)
+    {
+        var message = new MessageRecord
+        {
+            Title = title,
+            Content = content,
+            IsRead = false
+        };
+        return await messageRepo.AddAsync(message);
+    }
+
+    public async Task<bool> MarkAsReadAsync(long id)
+    {
+        var message = await messageRepo.GetByIdAsync(id);
+        if (message == null) return false;
+        
+        message.IsRead = true;
+        message.UpdateTime = DateTime.Now;
+        return await messageRepo.UpdateAsync(message);
+    }
+
+    public async Task<bool> MarkAllAsReadAsync()
+    {
+        return await messageRepo.MarkAllAsReadAsync();
+    }
+
+    public async Task<bool> DeleteAsync(long id)
+    {
+        return await messageRepo.DeleteAsync(id);
+    }
+
+    public async Task<long> GetUnreadCountAsync()
+    {
+        var list = await messageRepo.GetAllAsync();
+        return list.Count(x => !x.IsRead);
+    }
+}

Web/src/App.vue

@@ -12,54 +12,30 @@
         <van-tabbar-item name="balance" icon="balance-list" to="/balance" @click="handleTabClick('/balance')">
           账单
         </van-tabbar-item>
-        <van-tabbar-item name="message" icon="comment" to="/message" @click="handleTabClick('/message')">
+        <van-tabbar-item name="message" icon="comment" to="/message" @click="handleTabClick('/message')" :badge="messageStore.unreadCount || null">
           消息
         </van-tabbar-item>
         <van-tabbar-item name="setting" icon="setting" to="/setting">
           设置
         </van-tabbar-item>
       </van-tabbar>
-      
-      <!-- 调试信息覆盖层 -->
-      <div v-if="showDebug" class="debug-overlay" @click="showDebug = false">
-        <div>VH: {{ debugInfo.vh }}</div>
-        <div>InnerHeight: {{ debugInfo.innerHeight }}</div>
-        <div>ClientHeight: {{ debugInfo.clientHeight }}</div>
-        <div>BodyHeight: {{ debugInfo.bodyHeight }}</div>
-        <div>SafeAreaBottom: {{ debugInfo.safeAreaBottom }}</div>
-      </div>
     </div>
   </van-config-provider>
 </template>
 
 <script setup>
 import { RouterView, useRoute } from 'vue-router'
-import { ref, onMounted, onUnmounted, computed, watch, reactive } from 'vue'
+import { ref, onMounted, onUnmounted, computed, watch } from 'vue'
+import { useMessageStore } from '@/stores/message'
 import '@/styles/common.css'
 
-const showDebug = ref(false) // 默认关闭，可以通过特定操作开启，或者先开启让用户看
+const messageStore = useMessageStore()
-const debugInfo = reactive({
-  vh: 0,
-  innerHeight: 0,
-  clientHeight: 0,
-  bodyHeight: 0,
-  safeAreaBottom: 'unknown'
-})
-
-const updateDebugInfo = () => {
-  debugInfo.vh = window.innerHeight
-  debugInfo.innerHeight = window.innerHeight
-  debugInfo.clientHeight = document.documentElement.clientHeight
-  debugInfo.bodyHeight = document.body.clientHeight
-  debugInfo.safeAreaBottom = getComputedStyle(document.documentElement).getPropertyValue('--safe-area-inset-bottom') || 'env(safe-area-inset-bottom)'
-}
 
 const updateVh = () => {
   // 获取真实的视口高度（PWA 模式下准确）
   const vh = window.innerHeight
   // 设置 CSS 变量，让所有组件使用准确的视口高度
   document.documentElement.style.setProperty('--vh', `${vh}px`)
-  updateDebugInfo()
 }
 
 onMounted(() => {
@@ -101,6 +77,7 @@ const updateTheme = () => {
 let mediaQuery
 onMounted(() => {
   updateTheme()
+  messageStore.updateUnreadCount()
   mediaQuery = window.matchMedia('(prefers-color-scheme: dark)')
   mediaQuery.addEventListener('change', updateTheme)
   setActive(route.path)

Web/src/api/message.js

@@ -0,0 +1,81 @@
+import request from './request'
+
+/**
+ * 消息相关 API
+ */
+
+/**
+ * 获取消息列表
+ * @param {Object} params - 查询参数
+ * @param {number} [params.pageIndex] - 页码
+ * @param {number} [params.pageSize] - 每页数量
+ * @returns {Promise<{success: boolean, data: Array, total: number}>}
+ */
+export const getMessageList = (params = {}) => {
+  return request({
+    url: '/MessageRecord/GetList',
+    method: 'get',
+    params
+  })
+}
+
+/**
+ * 获取未读消息数量
+ * @returns {Promise<{success: boolean, data: number}>}
+ */
+export const getUnreadCount = () => {
+  return request({
+    url: '/MessageRecord/GetUnreadCount',
+    method: 'get'
+  })
+}
+
+/**
+ * 标记消息为已读
+ * @param {number} id - 消息ID
+ * @returns {Promise<{success: boolean}>}
+ */
+export const markAsRead = (id) => {
+  return request({
+    url: '/MessageRecord/MarkAsRead',
+    method: 'post',
+    params: { id }
+  })
+}
+
+/**
+ * 全部标记为已读
+ * @returns {Promise<{success: boolean}>}
+ */
+export const markAllAsRead = () => {
+  return request({
+    url: '/MessageRecord/MarkAllAsRead',
+    method: 'post'
+  })
+}
+
+/**
+ * 删除消息
+ * @param {number} id - 消息ID
+ * @returns {Promise<{success: boolean}>}
+ */
+export const deleteMessage = (id) => {
+  return request({
+    url: '/MessageRecord/Delete',
+    method: 'post',
+    params: { id }
+  })
+}
+
+/**
+ * 新增消息 (测试用)
+ * @param {Object} data - 消息数据
+ * @returns {Promise<{success: boolean}>}
+ */
+export const addMessage = (data) => {
+  return request({
+    url: '/MessageRecord/Add',
+    method: 'post',
+    data
+  })
+}

Web/src/stores/message.js

@@ -0,0 +1,20 @@
+import { ref } from 'vue'
+import { defineStore } from 'pinia'
+import { getUnreadCount } from '@/api/message'
+
+export const useMessageStore = defineStore('message', () => {
+  const unreadCount = ref(0)
+
+  const updateUnreadCount = async () => {
+    try {
+      const res = await getUnreadCount()
+      if (res.success) {
+        unreadCount.value = res.data
+      }
+    } catch (error) {
+      console.error('获取未读消息数量失败', error)
+    }
+  }
+
+  return { unreadCount, updateUnreadCount }
+})

Web/src/views/MessageView.vue

@@ -1,9 +1,287 @@
 <template>
-  <div>
+  <div class="page-container-flex message-page">
-  1
+    <van-nav-bar title="消息中心">
+      <template #right>
+        <van-icon name="passed" size="18" @click="handleMarkAllRead" />
+      </template>
+    </van-nav-bar>
+    
+    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
+      <van-list
+        v-model:loading="loading"
+        :finished="finished"
+        finished-text="没有更多了"
+        @load="onLoad"
+      >
+        <van-cell-group v-if="list.length" inset style="margin-top: 10px">
+          <van-swipe-cell v-for="item in list" :key="item.id">
+            <div class="message-card" @click="viewDetail(item)">
+              <div class="card-left">
+                <div class="message-title" :class="{ 'unread': !item.isRead }">
+                  {{ item.title }}
+                </div>
+                <div class="message-info">
+                  {{ item.createTime }}
+                </div>
+              </div>
+              <div class="card-right">
+                <van-tag v-if="!item.isRead" type="danger">未读</van-tag>
+                <van-icon name="arrow" size="16" class="arrow-icon" />
+              </div>
+            </div>
+            <template #right>
+              <van-button square text="删除" type="danger" class="delete-button" @click="handleDelete(item)" />
+            </template>
+          </van-swipe-cell>
+        </van-cell-group>
+        <van-empty v-else-if="!loading" description="暂无消息" />
+      </van-list>
+    </van-pull-refresh>
+
+    <!-- 详情弹出层 -->
+    <van-popup 
+      v-model:show="detailVisible" 
+      position="bottom"
+      :style="{ height: '50%' }"
+      round
+      closeable
+    >
+      <div class="message-detail">
+        <div class="detail-header">
+          <h3>{{ currentMessage.title }}</h3>
+          <span class="detail-time">{{ currentMessage.createTime }}</span>
+        </div>
+        <div class="detail-content">
+          {{ currentMessage.content }}
+        </div>
+      </div>
+    </van-popup>
   </div>
 </template>
 
 <script setup>
+import { ref, onMounted } from 'vue';
+import { showToast, showDialog } from 'vant';
+import { getMessageList, markAsRead, deleteMessage, markAllAsRead } from '@/api/message';
+import { useMessageStore } from '@/stores/message';
+
+const messageStore = useMessageStore();
+const list = ref([]);
+const loading = ref(false);
+const finished = ref(false);
+const refreshing = ref(false);
+const pageIndex = ref(1);
+const pageSize = ref(20);
+
+const detailVisible = ref(false);
+const currentMessage = ref({});
+
+const onLoad = async () => {
+  if (refreshing.value) {
+    list.value = [];
+    pageIndex.value = 1;
+    refreshing.value = false;
+  }
+
+  try {
+    const res = await getMessageList({
+      pageIndex: pageIndex.value,
+      pageSize: pageSize.value
+    });
+    
+    if (res.success) {
+      // 格式化时间
+      const data = res.data.map(item => ({
+        ...item,
+        createTime: new Date(item.createTime).toLocaleString()
+      }));
+      
+      if (pageIndex.value === 1) {
+        list.value = data;
+      } else {
+        list.value = [...list.value, ...data];
+      }
+      
+      // 判断是否加载完成
+      if (list.value.length >= res.total || data.length < pageSize.value) {
+        finished.value = true;
+      } else {
+        pageIndex.value++;
+      }
+    } else {
+      showToast(res.message || '加载失败');
+      finished.value = true;
+    }
+  } catch (error) {
+    console.error(error);
+    showToast('加载失败');
+    finished.value = true;
+  } finally {
+    loading.value = false;
+  }
+};
+
+const onRefresh = () => {
+  finished.value = false;
+  loading.value = true;
+  onLoad();
+};
+
+const viewDetail = async (item) => {
+  currentMessage.value = item;
+  detailVisible.value = true;
   
-</script>
+  if (!item.isRead) {
+    try {
+      await markAsRead(item.id);
+      item.isRead = true;
+      messageStore.updateUnreadCount();
+    } catch (error) {
+      console.error('标记已读失败', error);
+    }
+  }
+};
+
+const handleDelete = (item) => {
+  showDialog({
+    title: '提示',
+    message: '确定要删除这条消息吗？',
+    showCancelButton: true,
+  }).then(async (action) => {
+    if (action === 'confirm') {
+      try {
+        const res = await deleteMessage(item.id);
+        if (res.success) {
+          showToast('删除成功');
+          const wasUnread = !item.isRead;
+          list.value = list.value.filter(i => i.id !== item.id);
+          if (wasUnread) {
+            messageStore.updateUnreadCount();
+          }
+        } else {
+          showToast(res.message || '删除失败');
+        }
+      } catch (error) {
+        showToast('删除失败');
+      }
+    }
+  });
+};
+
+const handleMarkAllRead = () => {
+  showDialog({
+    title: '提示',
+    message: '确定要将所有消息标记为已读吗？',
+    showCancelButton: true,
+  }).then(async (action) => {
+    if (action === 'confirm') {
+      try {
+        const res = await markAllAsRead();
+        if (res.success) {
+          showToast('操作成功');
+          // 刷新列表
+          onRefresh();
+          // 更新未读计数
+          messageStore.updateUnreadCount();
+        } else {
+          showToast(res.message || '操作失败');
+        }
+      } catch (error) {
+        showToast('操作失败');
+      }
+    }
+  });
+};
+
+onMounted(() => {
+  // onLoad 会由 van-list 自动触发
+});
+</script>
+
+<style scoped>
+.message-page {
+  background-color: var(--van-background-2);
+}
+
+.message-card {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px 16px;
+  background-color: var(--van-background);
+  cursor: pointer;
+}
+
+.card-left {
+  flex: 1;
+  min-width: 0;
+  padding-right: 12px;
+}
+
+.card-right {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
+.arrow-icon {
+  color: var(--van-gray-5);
+}
+
+.message-title {
+  font-size: 15px;
+  margin-bottom: 6px;
+  color: var(--van-text-color);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.message-title.unread {
+  font-weight: bold;
+}
+
+.message-info {
+  font-size: 12px;
+  color: var(--van-text-color-2);
+}
+
+.delete-button {
+  height: 100%;
+}
+
+.message-detail {
+  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  background-color: var(--van-background);
+}
+
+.detail-header {
+  margin-bottom: 20px;
+  border-bottom: 1px solid var(--van-border-color);
+  padding-bottom: 10px;
+}
+
+.detail-header h3 {
+  margin: 0 0 10px 0;
+  font-size: 18px;
+  color: var(--van-text-color);
+}
+
+.detail-time {
+  color: var(--van-text-color-2);
+  font-size: 14px;
+}
+
+.detail-content {
+  flex: 1;
+  overflow-y: auto;
+  font-size: 16px;
+  line-height: 1.6;
+  color: var(--van-text-color);
+  white-space: pre-wrap;
+}
+</style>

Web/src/views/TransactionsRecord.vue

@@ -297,7 +297,6 @@ const loadData = async (isRefresh = false) => {
 // 下拉刷新
 const onRefresh = () => {
   finished.value = false
-  lastId.value = null
   transactionList.value = []
   loadData(false)
 }
@@ -315,8 +314,6 @@ const onSearchChange = () => {
 
 const onSearch = () => {
   // 重置分页状态并刷新数据
-  lastId.value = null
-  lastTime.value = null
   transactionList.value = []
   finished.value = false
   loadData(true)

WebApi/Controllers/Dto/BaseResponse.cs

@@ -20,6 +20,14 @@ public class BaseResponse
             Message = message
         };
     }
+
+    public static BaseResponse Done()
+    {
+        return new BaseResponse
+        {
+            Success = true
+        };
+    }
 }
 
 public class BaseResponse<T> : BaseResponse
@@ -37,5 +45,14 @@ public class BaseResponse<T> : BaseResponse
             Message = message
         };
     }
+
+    public static BaseResponse<T> Done(T data)
+    {
+        return new BaseResponse<T>
+        {
+            Success = true,
+            Data = data
+        };
+    }
 }
 

WebApi/Controllers/Dto/PagedResponse.cs

@@ -22,4 +22,16 @@ public class PagedResponse<T> : BaseResponse<T[]>
             Message = message
         };
     }
+
+    public static PagedResponse<T> Done(T[] data, int total, long lastId = 0, DateTime? lastTime = null)
+    {
+        return new PagedResponse<T>
+        {
+            Success = true,
+            Data = data,
+            LastId = lastId,
+            LastTime = lastTime,
+            Total = total
+        };
+    }
 }

WebApi/Controllers/MessageRecordController.cs

@@ -0,0 +1,117 @@
+using Microsoft.AspNetCore.Authorization;
+
+namespace WebApi.Controllers;
+
+[Authorize]
+[ApiController]
+[Route("api/[controller]/[action]")]
+public class MessageRecordController(IMessageRecordService messageService, ILogger<MessageRecordController> logger) : ControllerBase
+{
+    /// <summary>
+    /// 获取消息列表
+    /// </summary>
+    [HttpGet]
+    public async Task<PagedResponse<MessageRecord>> GetList([FromQuery] int pageIndex = 1, [FromQuery] int pageSize = 20)
+    {
+        try
+        {
+            var (list, total) = await messageService.GetPagedListAsync(pageIndex, pageSize);
+            return PagedResponse<MessageRecord>.Done(list.ToArray(), (int)total);
+        }
+        catch (Exception ex)
+        {
+            logger.LogError(ex, "获取消息列表失败");
+            return PagedResponse<MessageRecord>.Fail($"获取消息列表失败: {ex.Message}");
+        }
+    }
+
+    /// <summary>
+    /// 获取未读消息数量
+    /// </summary>
+    [HttpGet]
+    public async Task<BaseResponse<long>> GetUnreadCount()
+    {
+        try
+        {
+            var count = await messageService.GetUnreadCountAsync();
+            return BaseResponse<long>.Done(count);
+        }
+        catch (Exception ex)
+        {
+            logger.LogError(ex, "获取未读消息数量失败");
+            return BaseResponse<long>.Fail($"获取未读消息数量失败: {ex.Message}");
+        }
+    }
+
+    /// <summary>
+    /// 标记已读
+    /// </summary>
+    [HttpPost]
+    public async Task<BaseResponse<bool>> MarkAsRead([FromQuery] long id)
+    {
+        try
+        {
+            var result = await messageService.MarkAsReadAsync(id);
+            return BaseResponse<bool>.Done(result);
+        }
+        catch (Exception ex)
+        {
+            logger.LogError(ex, "标记消息已读失败，ID: {Id}", id);
+            return BaseResponse<bool>.Fail($"标记消息已读失败: {ex.Message}");
+        }
+    }
+
+    /// <summary>
+    /// 全部标记已读
+    /// </summary>
+    [HttpPost]
+    public async Task<BaseResponse<bool>> MarkAllAsRead()
+    {
+        try
+        {
+            var result = await messageService.MarkAllAsReadAsync();
+            return BaseResponse<bool>.Done(result);
+        }
+        catch (Exception ex)
+        {
+            logger.LogError(ex, "全部标记已读失败");
+            return BaseResponse<bool>.Fail($"全部标记已读失败: {ex.Message}");
+        }
+    }
+
+    /// <summary>
+    /// 删除消息
+    /// </summary>
+    [HttpPost]
+    public async Task<BaseResponse<bool>> Delete([FromQuery] long id)
+    {
+        try
+        {
+            var result = await messageService.DeleteAsync(id);
+            return BaseResponse<bool>.Done(result);
+        }
+        catch (Exception ex)
+        {
+            logger.LogError(ex, "删除消息失败，ID: {Id}", id);
+            return BaseResponse<bool>.Fail($"删除消息失败: {ex.Message}");
+        }
+    }
+
+    /// <summary>
+    /// 新增消息 (测试用)
+    /// </summary>
+    [HttpPost]
+    public async Task<BaseResponse<bool>> Add([FromBody] MessageRecord message)
+    {
+        try
+        {
+            var result = await messageService.AddAsync(message);
+            return BaseResponse<bool>.Done(result);
+        }
+        catch (Exception ex)
+        {
+            logger.LogError(ex, "新增消息失败");
+            return BaseResponse<bool>.Fail($"新增消息失败: {ex.Message}");
+        }
+    }
+}