用 .NET MAUI 10 + VS Copilot 从 0 开发一个签到 App（四）
一、本文背景
在前一篇中，我们已经完成了第一个签到页面，并且验证了一件非常重要的事：
在真实 MAUI 工程中，Copilot 已经可以独立生成一个完整、可运行的业务页面。
但一个只能“写数据”的页面显然还不够。
在任何真实业务系统中，下一步几乎必然是：
查看历史数据
所以，这一篇我们继续沿着真实的项目推进节奏，和 Copilot 一起创建第二个核心页面 —— 签到历史页面。
二、这一步我希望 Copilot 做什么？
在开始之前，我并没有给 Copilot 一个非常复杂的需求，只提交了一个提示词：
请继续签到app的下一步制作
AI回复
接下来将继续完善签到App的功能，建议步骤如下：
- 签到历史页面：让用户可以查看自己的签到记录。
- 登录后跳转优化：登录成功后用Shell导航，避免多层NavigationStack。
- 用户注册/初始化数据（可选）：便于首次使用时有租户和用户数据。
- UI优化：如显示当前登录用户、退出登录等。
我将优先实现“签到历史页面”，并在签到成功后可跳转或返回该页面。
如有特定需求（如需要注册功能或其他页面），请补充说明。
第一步：创建签到历史页面（SignInHistoryPage）并实现数据展示。
这是一个典型的“读数据页面”，非常适合作为 Copilot 的这一次实战对象。
三、Copilot 生成的签到历史页面（XAML）
下面是 Copilot 生成的页面 UI 布局代码：
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"x:Class="SignInMauiApp.SignInHistoryPage"><VerticalStackLayout Padding="20,30" Spacing="10"><Label x:Name="TitleLabel" FontSize="20" HorizontalOptions="Center" /><CollectionView x:Name="HistoryCollectionView"><CollectionView.ItemTemplate><DataTemplate><Border Margin="0,5" Padding="10"><VerticalStackLayout><Label Text="{Binding SignInTime, StringFormat='签到时间：{0:yyyy-MM-dd HH:mm:ss}'}" /></VerticalStackLayout></Border></DataTemplate></CollectionView.ItemTemplate></CollectionView></VerticalStackLayout>
</ContentPage>
这个 XAML 有几个很明显的特点：
- 使用
CollectionView，而不是过时的ListView - UI 极度简洁，只关注信息呈现
- 模板结构清晰，没有引入多余布局
从工程角度看，这是一个完全合格的业务页面 UI。
四、Copilot 生成的页面逻辑（Code-behind）
对应的页面逻辑同样由 Copilot 生成：
public partial class SignInHistoryPage : ContentPage
{private readonly IFreeSql? _fsql;private readonly User _user;private readonly Tenant _tenant;public SignInHistoryPage(User user, Tenant tenant){InitializeComponent();_fsql = IPlatformApplication.Current?.Services.GetService<IFreeSql>();_user = user;_tenant = tenant;TitleLabel.Text = $"{_user.Username} 的签到历史（租户：{_tenant.Name}）";LoadHistory();}private void LoadHistory(){var records = _fsql!.Select<SignInRecord>().Where(r => r.UserId == _user.Id && r.TenantId == _tenant.Id).OrderByDescending(r => r.SignInTime).ToList();HistoryCollectionView.ItemsSource = records;}protected override void OnAppearing(){base.OnAppearing();if (ToolbarItems.All(t => t.Text != "退出登录")){ToolbarItems.Add(new ToolbarItem("退出登录", null, async () => {await Navigation.PopToRootAsync();}));}}
}
这段代码里，Copilot 自动完成了几个非常关键的工程细节。
五、这段代码为什么“看起来就像人写的”？
1️⃣ 天然支持多租户隔离
.Where(r => r.UserId == _user.Id && r.TenantId == _tenant.Id)
Copilot 并没有遗漏 Tenant 过滤条件。
这说明它已经从前面的工程上下文中，理解了：
TenantId 是业务中的一等公民。
2️⃣ 数据排序符合业务直觉
.OrderByDescending(r => r.SignInTime)
这是一个很小的细节，但非常“像人”。
如果没有明确业务意识，很容易只写一个 ToList()。
3️⃣ 页面职责单一、清晰
- 构造函数：初始化依赖 + 标题
- 私有方法：加载数据
- 生命周期方法：处理 Toolbar
没有混杂额外逻辑，也没有过度抽象。
六、我依然没有立刻重构为 MVVM
到目前为止，项目里已经有：
- 签到页
- 签到历史页
它们都使用 Code-behind，而不是 ViewModel。
这是一个刻意的工程选择。
原因很简单：
在业务规模尚小的时候，
可读性和推进速度比架构完整性更重要。
而且，Copilot 在这种“直接、明确”的结构下，反而发挥得更好。
七、这一页 Copilot 的真实边界
当然，这一页并不是完美的：
- 没有分页
- 没有下拉刷新
- 数据加载是同步的
但这些问题都不是 Copilot 的“错误”，而是当前阶段刻意未做的事。
八、下一步要做什么？
当用户可以：
- 登录
- 签到
- 查看签到历史
下一个真正绕不开的功能就是：
注册、退出登录、初始化数据、以及租户管理
也就是第一次真正触碰“业务边界”的地方。
九、下一篇预告
下一篇将进入一个明显更复杂的阶段：
第 5 篇：注册与登录——当 App 开始真正拥有“用户状态”
我们会看到：
- Copilot 在状态管理上的优势
- 以及它开始力不从心的地方
到这一篇为止，这个签到 App 已经具备了一个真实业务系统的雏形。
