feat(mobile): UI-01 album cards, photo grid and full viewer

Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
浅念
2026-09-21 15:55:44 +08:00
parent c94b9e5e58
commit f6929ae18f
17 changed files with 2750 additions and 702 deletions
+6
View File
@@ -442,10 +442,15 @@ class ApiClient {
/// operationId `listAlbumPhotos`
/// (GET /albums/{albumId}/photos,管理列表,全状态可见)。
///
/// [scope](UI-01):缺省/null=服务端默认 all(仅 owner/admin,协作者
/// 403 AUTH_FORBIDDEN);[AlbumPhotoScope.own]=仅自己上传(任何有效成员,
/// 服务端过滤)。页面层据此做「all 403 → own」自适应回退。
Future<CursorPage<AdminPhoto>> listAlbumPhotos(
String albumId, {
PhotoVisibility? visibility,
String? categoryId,
AlbumPhotoScope? scope,
String? cursor,
int? limit,
}) =>
@@ -457,6 +462,7 @@ class ApiClient {
extraQuery: {
if (visibility != null) 'visibility': visibility.wire,
'categoryId': ?categoryId,
if (scope != null) 'scope': scope.wire,
},
);
@@ -257,6 +257,7 @@ class Album extends AlbumSummary {
required super.createdAt,
required super.updatedAt,
required super.statsSyncedAt,
super.cover,
});
factory Album.fromJson(Map<String, dynamic> json) => Album(
@@ -265,6 +266,9 @@ class Album extends AlbumSummary {
(dynamic e) => Category.fromJson(e as Map<String, dynamic>),
)
.toList(),
cover: json['cover'] == null
? null
: SignedUrl.fromJson(json['cover'] as Map<String, dynamic>),
id: json['id'] as String,
publicToken: json['publicToken'] as String,
ownerId: json['ownerId'] as String,
+18 -1
View File
@@ -177,5 +177,22 @@
"uploadAction": "Upload",
"uploadEnqueuedCount": "Added {count} photo(s) to the upload queue",
"@uploadEnqueuedCount": { "placeholders": { "count": { "type": "int" } } },
"uploadPickNone": "No photos selected"
"uploadPickNone": "No photos selected",
"albumManagePhotos": "Manage photos",
"albumTakeFirstPhoto": "Take the first photo",
"albumUploadDisabledHint": "Uploads are off for this album. New photos cannot be added right now",
"albumRecentPhotos": "Recent uploads",
"photoFilterAll": "All",
"photoFilterFailed": "Failed",
"photosScopeOwnHint": "Collaborator view: only photos you uploaded are shown",
"photosEmptyFiltered": "No photos match this filter",
"photoHide": "Hide",
"photoUnhide": "Unhide",
"photoDeleteConfirmTitle": "Delete this photo?",
"photoDeleteConfirmBody": "The cloud photo will be deleted. This cannot be undone.",
"photoHiddenToast": "Hidden",
"photoUnhiddenToast": "Unhidden",
"photoDeletedToast": "Deleted",
"photoReload": "Reload",
"photoPreviewUnavailable": "Image unavailable"
}
+102
View File
@@ -1129,6 +1129,108 @@ abstract class AppLocalizations {
/// In zh, this message translates to:
/// **'未选择照片'**
String get uploadPickNone;
/// No description provided for @albumManagePhotos.
///
/// In zh, this message translates to:
/// **'管理照片'**
String get albumManagePhotos;
/// No description provided for @albumTakeFirstPhoto.
///
/// In zh, this message translates to:
/// **'拍摄第一张照片'**
String get albumTakeFirstPhoto;
/// No description provided for @albumUploadDisabledHint.
///
/// In zh, this message translates to:
/// **'相册已关闭上传,暂不能新增照片'**
String get albumUploadDisabledHint;
/// No description provided for @albumRecentPhotos.
///
/// In zh, this message translates to:
/// **'最近上传'**
String get albumRecentPhotos;
/// No description provided for @photoFilterAll.
///
/// In zh, this message translates to:
/// **'全部'**
String get photoFilterAll;
/// No description provided for @photoFilterFailed.
///
/// In zh, this message translates to:
/// **'失败'**
String get photoFilterFailed;
/// No description provided for @photosScopeOwnHint.
///
/// In zh, this message translates to:
/// **'协作者视图:仅显示你上传的照片'**
String get photosScopeOwnHint;
/// No description provided for @photosEmptyFiltered.
///
/// In zh, this message translates to:
/// **'当前筛选下暂无照片'**
String get photosEmptyFiltered;
/// No description provided for @photoHide.
///
/// In zh, this message translates to:
/// **'隐藏'**
String get photoHide;
/// No description provided for @photoUnhide.
///
/// In zh, this message translates to:
/// **'恢复显示'**
String get photoUnhide;
/// No description provided for @photoDeleteConfirmTitle.
///
/// In zh, this message translates to:
/// **'删除这张照片?'**
String get photoDeleteConfirmTitle;
/// No description provided for @photoDeleteConfirmBody.
///
/// In zh, this message translates to:
/// **'云端照片将被删除,删除后不可恢复。'**
String get photoDeleteConfirmBody;
/// No description provided for @photoHiddenToast.
///
/// In zh, this message translates to:
/// **'已隐藏'**
String get photoHiddenToast;
/// No description provided for @photoUnhiddenToast.
///
/// In zh, this message translates to:
/// **'已恢复显示'**
String get photoUnhiddenToast;
/// No description provided for @photoDeletedToast.
///
/// In zh, this message translates to:
/// **'已删除'**
String get photoDeletedToast;
/// No description provided for @photoReload.
///
/// In zh, this message translates to:
/// **'重新加载'**
String get photoReload;
/// No description provided for @photoPreviewUnavailable.
///
/// In zh, this message translates to:
/// **'图片暂不可用'**
String get photoPreviewUnavailable;
}
class _AppLocalizationsDelegate
@@ -551,4 +551,58 @@ class AppLocalizationsEn extends AppLocalizations {
@override
String get uploadPickNone => 'No photos selected';
@override
String get albumManagePhotos => 'Manage photos';
@override
String get albumTakeFirstPhoto => 'Take the first photo';
@override
String get albumUploadDisabledHint =>
'Uploads are off for this album. New photos cannot be added right now';
@override
String get albumRecentPhotos => 'Recent uploads';
@override
String get photoFilterAll => 'All';
@override
String get photoFilterFailed => 'Failed';
@override
String get photosScopeOwnHint =>
'Collaborator view: only photos you uploaded are shown';
@override
String get photosEmptyFiltered => 'No photos match this filter';
@override
String get photoHide => 'Hide';
@override
String get photoUnhide => 'Unhide';
@override
String get photoDeleteConfirmTitle => 'Delete this photo?';
@override
String get photoDeleteConfirmBody =>
'The cloud photo will be deleted. This cannot be undone.';
@override
String get photoHiddenToast => 'Hidden';
@override
String get photoUnhiddenToast => 'Unhidden';
@override
String get photoDeletedToast => 'Deleted';
@override
String get photoReload => 'Reload';
@override
String get photoPreviewUnavailable => 'Image unavailable';
}
@@ -535,4 +535,55 @@ class AppLocalizationsZh extends AppLocalizations {
@override
String get uploadPickNone => '未选择照片';
@override
String get albumManagePhotos => '管理照片';
@override
String get albumTakeFirstPhoto => '拍摄第一张照片';
@override
String get albumUploadDisabledHint => '相册已关闭上传,暂不能新增照片';
@override
String get albumRecentPhotos => '最近上传';
@override
String get photoFilterAll => '全部';
@override
String get photoFilterFailed => '失败';
@override
String get photosScopeOwnHint => '协作者视图:仅显示你上传的照片';
@override
String get photosEmptyFiltered => '当前筛选下暂无照片';
@override
String get photoHide => '隐藏';
@override
String get photoUnhide => '恢复显示';
@override
String get photoDeleteConfirmTitle => '删除这张照片?';
@override
String get photoDeleteConfirmBody => '云端照片将被删除,删除后不可恢复。';
@override
String get photoHiddenToast => '已隐藏';
@override
String get photoUnhiddenToast => '已恢复显示';
@override
String get photoDeletedToast => '已删除';
@override
String get photoReload => '重新加载';
@override
String get photoPreviewUnavailable => '图片暂不可用';
}
+18 -1
View File
@@ -177,5 +177,22 @@
"uploadAction": "上传",
"uploadEnqueuedCount": "已加入 {count} 张上传队列",
"@uploadEnqueuedCount": { "placeholders": { "count": { "type": "int" } } },
"uploadPickNone": "未选择照片"
"uploadPickNone": "未选择照片",
"albumManagePhotos": "管理照片",
"albumTakeFirstPhoto": "拍摄第一张照片",
"albumUploadDisabledHint": "相册已关闭上传,暂不能新增照片",
"albumRecentPhotos": "最近上传",
"photoFilterAll": "全部",
"photoFilterFailed": "失败",
"photosScopeOwnHint": "协作者视图:仅显示你上传的照片",
"photosEmptyFiltered": "当前筛选下暂无照片",
"photoHide": "隐藏",
"photoUnhide": "恢复显示",
"photoDeleteConfirmTitle": "删除这张照片?",
"photoDeleteConfirmBody": "云端照片将被删除,删除后不可恢复。",
"photoHiddenToast": "已隐藏",
"photoUnhiddenToast": "已恢复显示",
"photoDeletedToast": "已删除",
"photoReload": "重新加载",
"photoPreviewUnavailable": "图片暂不可用"
}
+441 -291
View File
@@ -1,7 +1,11 @@
/// 相册详情页(P3 计划 Task 4):信息区(标题/时间/时区/令牌/开关标签)
/// + 动作行(编辑、成员管理、分类管理=滚动定位、分享二维码、照片管理
/// 占位)+ 分类管理区(列表 + 新增/编辑对话框 + 删除确认)。
/// 编辑与分类变更后刷新本地详情并同步全局相册列表。
/// 相册详情页(UI-01 §4.2 重构):紧凑封面与活动信息 → 公开/上传状态 →
/// 照片入口(最近上传预览条 / 拍摄第一张照片引导)→ 次级管理入口(编辑/
/// 成员/分类/分享,ListTile 次强调)+ 分类管理区;底部固定「拍摄上传
/// (主)/ 从相册选择(次)」,避让安全区,上传关闭时说明原因并禁用。
///
/// 数据范围:照片预览按 scope 自适应(all 403 → own)推导管理者身份——
/// 创建者/管理员见管理入口;协作者仅见被授权内容(照片入口为自己的
/// 上传)。编辑与分类变更后刷新本地详情并同步全局相册列表。
library;
import 'package:flutter/material.dart';
@@ -14,15 +18,23 @@ import '../core/error_l10n.dart';
import '../features/albums/album_format.dart';
import '../features/albums/models.dart';
import '../features/albums/providers.dart';
import '../features/photos/models.dart';
import '../features/uploads/enqueue.dart';
import '../l10n/app_localizations.dart';
import '../ui/components/photo_thumbnail.dart';
import '../ui/components/section_header.dart';
import '../ui/components/state_badge.dart';
import '../ui/tokens.dart';
import 'album_form_page.dart';
import 'album_members_page.dart';
import 'album_photos_page.dart';
import 'capture_page.dart';
import 'share_qr_dialog.dart';
/// 相册详情([albumId] 路由参数;进入后 GET /albums/{id})。
/// 详情页照片预览条取数上限(方案 §4.2「3-5 张缩略图」)。
const int _kPreviewStripLimit = 5;
/// 相册详情([albumId] 路由参数;进入后 GET /albums/{id} + 照片预览)。
class AlbumDetailPage extends ConsumerStatefulWidget {
const AlbumDetailPage({required this.albumId, super.key});
@@ -40,6 +52,14 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
bool _loading = true;
String? _errorCode;
/// 最近上传预览条(协作者为「自己上传」,服务端过滤)。
List<AdminPhoto> _recentPhotos = const <AdminPhoto>[];
bool _photosLoading = true;
/// 管理者(owner/admin):scope=all 照片请求成功推导;403 → 协作者。
/// 预览请求非 403 失败时保守按管理者展示(服务端仍逐请求裁决)。
bool _isManager = true;
@override
void initState() {
super.initState();
@@ -61,12 +81,12 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
final album = await ref.read(apiClientProvider).getAlbum(
widget.albumId,
);
if (mounted) {
setState(() {
_album = album;
_loading = false;
});
}
if (!mounted) return;
setState(() {
_album = album;
_loading = false;
});
await _loadPhotoPreview();
} on AppException catch (e) {
if (mounted) {
setState(() {
@@ -84,6 +104,63 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
}
}
/// 照片入口预览:先按 all(owner/admin);403 回退 own(协作者仅自己
/// 上传)。非 403 失败不阻塞详情页(入口退化为「管理照片」按钮)。
Future<void> _loadPhotoPreview() async {
final album = _album;
if (album == null) return;
final api = ref.read(apiClientProvider);
try {
final page = await api.listAlbumPhotos(
album.id,
scope: AlbumPhotoScope.all,
limit: _kPreviewStripLimit,
);
if (!mounted) return;
setState(() {
_recentPhotos = page.items;
_photosLoading = false;
_isManager = true;
});
} on AppException catch (e) {
if (!mounted) return;
if (e.code != ErrorCodes.authForbidden) {
setState(() {
_recentPhotos = const <AdminPhoto>[];
_photosLoading = false;
});
return;
}
try {
final ownPage = await api.listAlbumPhotos(
album.id,
scope: AlbumPhotoScope.own,
limit: _kPreviewStripLimit,
);
if (!mounted) return;
setState(() {
_recentPhotos = ownPage.items;
_photosLoading = false;
_isManager = false;
});
} on AppException {
if (!mounted) return;
setState(() {
_recentPhotos = const <AdminPhoto>[];
_photosLoading = false;
_isManager = false;
});
}
} on Object {
if (mounted) {
setState(() {
_recentPhotos = const <AdminPhoto>[];
_photosLoading = false;
});
}
}
}
/// 编辑成功后:详情重载 + 全局列表同步。
Future<void> _openEdit() async {
final album = _album;
@@ -118,6 +195,8 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
builder: (_) => AlbumPhotosPage(album: album),
),
);
// 管理页内可能发生隐藏/删除,回来后刷新预览条。
await _loadPhotoPreview();
}
void _shareQr() {
@@ -129,7 +208,7 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
);
}
// ── 上传入口(Task 9 FAB:拍照上传 / 从相册选择) ──────────────────────
// ── 上传入口(底部固定栏:拍摄上传主按钮 / 从相册选择次按钮) ─────────
/// 当前登录账号(TaskStore 隔离键;详情页处于登录壳内,null 视为异常)。
Future<String?> _currentAccountId() async {
@@ -137,36 +216,6 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
return session?.account;
}
Future<void> _openUploadSheet() {
final l10n = AppLocalizations.of(context);
return showModalBottomSheet<void>(
context: context,
builder: (sheetContext) => SafeArea(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ListTile(
leading: const Icon(Icons.photo_camera_outlined),
title: Text(l10n.uploadActionCapture),
onTap: () {
Navigator.of(sheetContext).pop();
_openCapture();
},
),
ListTile(
leading: const Icon(Icons.photo_library_outlined),
title: Text(l10n.uploadActionPick),
onTap: () {
Navigator.of(sheetContext).pop();
_pickFromGallery();
},
),
],
),
),
);
}
/// 拍照上传:进入连拍页(目标相册 + 分类选定一次)。
Future<void> _openCapture() async {
final album = _album;
@@ -180,7 +229,7 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
target: CaptureTarget(
accountId: account,
albumId: album.id,
albumTitle: _titleOf(album),
albumTitle: albumDisplayTitle(album, AppLocalizations.of(context).localeName),
categories: album.categories,
),
),
@@ -272,17 +321,14 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final album = _album;
final title = album == null ? l10n.albumDetail : _titleOf(album);
final title = album == null ? l10n.albumDetail : albumDisplayTitle(album, l10n.localeName);
return Scaffold(
appBar: AppBar(title: Text(title)),
// 上传入口(Task 9):拍照上传(连拍页)/ 从相册选择(多选入队)。
floatingActionButton: album == null
? null
: FloatingActionButton.extended(
onPressed: _openUploadSheet,
icon: const Icon(Icons.photo_camera_outlined),
label: Text(l10n.uploadAction),
),
bottomNavigationBar: album == null ? null : _UploadBar(
uploadEnabled: album.uploadEnabled,
onCapture: _openCapture,
onPick: _pickFromGallery,
),
body: _loading
? const Center(child: CircularProgressIndicator())
: album == null
@@ -292,21 +338,32 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
)
: SingleChildScrollView(
controller: _scrollController,
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_InfoCard(album: album),
const SizedBox(height: 16),
_ActionsRow(
onEdit: _openEdit,
onMembers: _openMembers,
onCategories: _scrollToCategories,
onShareQr: _shareQr,
onPhotos: _openPhotos,
),
const SizedBox(height: 16),
padding: const EdgeInsets.all(kSpace16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
_CompactHeader(album: album),
const SizedBox(height: kSpace16),
_StatusSection(album: album),
const SizedBox(height: kSpace16),
_PhotoEntrySection(
album: album,
photos: _recentPhotos,
loading: _photosLoading,
isManager: _isManager,
onOpenPhotos: _openPhotos,
onTakeFirst: _openCapture,
),
const SizedBox(height: kSpace16),
_SecondaryActions(
showManage: _isManager,
onEdit: _openEdit,
onMembers: _openMembers,
onCategories: _scrollToCategories,
onShareQr: _shareQr,
),
if (_isManager) ...[
const SizedBox(height: kSpace16),
_CategoriesSection(
key: _categoriesKey,
album: album,
@@ -314,20 +371,328 @@ class _AlbumDetailPageState extends ConsumerState<AlbumDetailPage> {
onEdit: (c) => _openCategoryDialog(c),
onDelete: _deleteCategory,
),
const SizedBox(height: 32),
],
),
const SizedBox(height: kSpace32),
],
),
),
);
}
}
static String _titleOf(Album album) {
for (final t in album.translations) {
if (t.locale == album.defaultLocale) return t.title;
}
if (album.translations.isNotEmpty) return album.translations.first.title;
return album.id;
/// 紧凑头部:封面缩略图(16:9,最高 200)+ 标题 + 时间/场地单行。
class _CompactHeader extends StatelessWidget {
const _CompactHeader({required this.album});
final Album album;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final theme = Theme.of(context);
final venue = albumDisplayVenue(album, l10n.localeName);
final start =
formatAlbumDateTime(album.startAt, album.timezone, l10n.localeName);
final end = album.endAt == null
? l10n.notSet
: formatAlbumDateTime(album.endAt!, album.timezone, l10n.localeName);
final meta = venue == null
? '$start ~ $end (${album.timezone})'
: '$start ~ $end (${album.timezone}) · $venue';
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
LayoutBuilder(
builder: (context, constraints) {
// 16:9 封面,最高 200(超出按高度封顶,宽度同步收窄)。
final height = constraints.maxWidth * 9 / 16;
final capped = height > 200.0;
final h = capped ? 200.0 : height;
final w = capped ? h * 16 / 9 : constraints.maxWidth;
return Center(
child: ClipRRect(
borderRadius: BorderRadius.circular(kRadiusCard),
child: SizedBox(
width: w,
height: h,
child: PhotoThumbnail(
url: album.cover?.url,
aspectRatio: w / h,
),
),
),
);
},
),
const SizedBox(height: kSpace12),
Text(
albumDisplayTitle(album, l10n.localeName),
style: theme.textTheme.titleLarge,
),
const SizedBox(height: kSpace4),
Text(
meta,
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
),
),
],
);
}
}
/// 状态区:公开 / 上传分别显示(关闭不等于不公开)。
class _StatusSection extends StatelessWidget {
const _StatusSection({required this.album});
final Album album;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
return Row(
children: [
StateBadge(
variant: album.publicEnabled ? BadgeVariant.info : BadgeVariant.neutral,
label: album.publicEnabled ? l10n.tagPublic : l10n.albumPublicOff,
),
const SizedBox(width: kSpace8),
StateBadge(
variant:
album.uploadEnabled ? BadgeVariant.success : BadgeVariant.neutral,
label: album.uploadEnabled ? l10n.albumUploadsOn : l10n.albumUploadsOff,
),
if (album.status == AlbumStatus.offline) ...[
const SizedBox(width: kSpace8),
StateBadge(variant: BadgeVariant.error, label: l10n.albumStatusOffline),
],
],
);
}
}
/// 照片入口:有照片 → 预览条(≤5 张)+「管理照片」;无照片 →「拍摄第
/// 一张照片」引导(上传关闭时禁用,由底部栏说明原因)。
class _PhotoEntrySection extends StatelessWidget {
const _PhotoEntrySection({
required this.album,
required this.photos,
required this.loading,
required this.isManager,
required this.onOpenPhotos,
required this.onTakeFirst,
});
final Album album;
final List<AdminPhoto> photos;
final bool loading;
final bool isManager;
final VoidCallback onOpenPhotos;
final VoidCallback onTakeFirst;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
SectionHeader(
title: l10n.albumPhotos,
trailing: TextButton(
onPressed: onOpenPhotos,
child: Text(l10n.albumManagePhotos),
),
),
const SizedBox(height: kSpace8),
if (loading)
const SizedBox(
height: 96,
child: Center(
child: SizedBox(
height: 24,
width: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
),
)
else if (photos.isNotEmpty)
SizedBox(
height: 96,
child: ListView.separated(
scrollDirection: Axis.horizontal,
itemCount: photos.length,
separatorBuilder: (_, _) => const SizedBox(width: kSpace8),
itemBuilder: (context, index) {
final photo = photos[index];
return SizedBox(
width: 96,
height: 96,
child: PhotoThumbnail(
url: photo.preview?.thumb.url,
aspectRatio: 1,
),
);
},
),
)
else
Row(
children: [
Icon(
Icons.photo_camera_outlined,
size: 20,
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
const SizedBox(width: kSpace8),
Expanded(
child: Text(
l10n.albumPhotosEmpty,
style: Theme.of(context).textTheme.bodySmall,
),
),
const SizedBox(width: kSpace8),
FilledButton.tonalIcon(
onPressed: album.uploadEnabled ? onTakeFirst : null,
icon: const Icon(Icons.photo_camera_outlined),
label: Text(l10n.albumTakeFirstPhoto),
),
],
),
],
);
}
}
/// 次级管理入口(ListTile 次强调,不再与主操作同级):编辑 / 成员 / 分类
/// (滚动定位)/ 分享二维码。管理类入口仅创建者/管理员可见;分享对全体
/// 成员开放(publicToken 本身对成员可见)。
class _SecondaryActions extends StatelessWidget {
const _SecondaryActions({
required this.showManage,
required this.onEdit,
required this.onMembers,
required this.onCategories,
required this.onShareQr,
});
final bool showManage;
final VoidCallback onEdit;
final VoidCallback onMembers;
final VoidCallback onCategories;
final VoidCallback onShareQr;
@override
Widget build(BuildContext context) {
return Card(
margin: EdgeInsets.zero,
clipBehavior: Clip.antiAlias,
child: Column(
children: [
if (showManage) ...[
ListTile(
leading: const Icon(Icons.edit_outlined),
title: Text(AppLocalizations.of(context).actionEdit),
onTap: onEdit,
),
ListTile(
leading: const Icon(Icons.group_outlined),
title: Text(AppLocalizations.of(context).albumMembers),
onTap: onMembers,
),
ListTile(
leading: const Icon(Icons.category_outlined),
title: Text(AppLocalizations.of(context).albumCategories),
onTap: onCategories,
),
],
ListTile(
leading: const Icon(Icons.qr_code_2),
title: Text(AppLocalizations.of(context).shareQrTitle),
onTap: onShareQr,
),
],
),
);
}
}
/// 底部固定上传栏:拍摄上传(主)+ 从相册选择(次),避让安全区;上传
/// 关闭时给出原因说明并禁用两个入口。
class _UploadBar extends StatelessWidget {
const _UploadBar({
required this.uploadEnabled,
required this.onCapture,
required this.onPick,
});
final bool uploadEnabled;
final VoidCallback onCapture;
final VoidCallback onPick;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final theme = Theme.of(context);
return SafeArea(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
if (!uploadEnabled)
Padding(
padding: const EdgeInsets.fromLTRB(
kSpace16,
kSpace8,
kSpace16,
0,
),
child: Row(
children: [
Icon(
Icons.info_outline,
size: 16,
color: theme.colorScheme.onSurfaceVariant,
),
const SizedBox(width: kSpace4),
Expanded(
child: Text(
l10n.albumUploadDisabledHint,
style: theme.textTheme.bodySmall,
),
),
],
),
),
Padding(
padding: const EdgeInsets.fromLTRB(
kSpace16,
kSpace8,
kSpace16,
kSpace12,
),
child: Row(
children: [
Expanded(
child: FilledButton.icon(
onPressed: uploadEnabled ? onCapture : null,
icon: const Icon(Icons.photo_camera_outlined),
label: Text(l10n.uploadActionCapture),
),
),
const SizedBox(width: kSpace12),
Expanded(
child: OutlinedButton.icon(
onPressed: uploadEnabled ? onPick : null,
icon: const Icon(Icons.photo_library_outlined),
label: Text(l10n.uploadActionPick),
),
),
],
),
),
],
),
);
}
}
@@ -360,191 +725,6 @@ class _ErrorRetryView extends StatelessWidget {
}
}
/// 信息卡:标题 + 状态、默认语言内容(描述/场地/地址)、时区时间区间、
/// 公开令牌、四开关标签。
class _InfoCard extends StatelessWidget {
const _InfoCard({required this.album});
final Album album;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final theme = Theme.of(context);
final translation = album.translations
.where((t) => t.locale == album.defaultLocale)
.firstOrNull;
final start =
formatAlbumDateTime(album.startAt, album.timezone, l10n.localeName);
final end = album.endAt == null
? l10n.notSet
: formatAlbumDateTime(album.endAt!, album.timezone, l10n.localeName);
return Card(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Expanded(
child: Text(
translation?.title ?? album.id,
style: theme.textTheme.titleLarge
?.copyWith(fontWeight: FontWeight.w600),
),
),
const SizedBox(width: 8),
_AlbumStatusBadge(status: album.status),
],
),
if ((translation?.description ?? '').trim().isNotEmpty) ...[
const SizedBox(height: 8),
Text(translation!.description!),
],
if ((translation?.venue ?? '').trim().isNotEmpty) ...[
const SizedBox(height: 8),
Row(
children: [
const Icon(Icons.place_outlined, size: 16),
const SizedBox(width: 4),
Expanded(child: Text(translation!.venue!)),
],
),
],
if ((translation?.address ?? '').trim().isNotEmpty) ...[
const SizedBox(height: 4),
Row(
children: [
const Icon(Icons.signpost_outlined, size: 16),
const SizedBox(width: 4),
Expanded(child: Text(translation!.address!)),
],
),
],
const SizedBox(height: 12),
Row(
children: [
const Icon(Icons.schedule, size: 16),
const SizedBox(width: 4),
Expanded(child: Text('$start ~ $end (${album.timezone})')),
],
),
const SizedBox(height: 4),
Row(
children: [
const Icon(Icons.link, size: 16),
const SizedBox(width: 4),
Expanded(
child: Text(
album.publicToken,
style: theme.textTheme.bodySmall?.copyWith(
fontFeatures: const [FontFeature.tabularFigures()],
),
),
),
],
),
const SizedBox(height: 12),
Wrap(
spacing: 6,
runSpacing: 4,
children: [
_switchTag(context, l10n.tagUpload, album.uploadEnabled),
_switchTag(context, l10n.tagPublic, album.publicEnabled),
_switchTag(
context,
l10n.tagDownload,
album.downloadEnabled,
),
_switchTag(
context,
l10n.tagOriginal,
album.originalDownloadEnabled,
),
],
),
],
),
),
);
}
Widget _switchTag(BuildContext context, String label, bool on) {
final theme = Theme.of(context);
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
decoration: BoxDecoration(
color: on
? theme.colorScheme.primaryContainer
: theme.colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(999),
),
child: Text(
label,
style: theme.textTheme.labelSmall?.copyWith(
color: on
? theme.colorScheme.onPrimaryContainer
: theme.colorScheme.onSurfaceVariant,
),
),
);
}
}
/// 动作行:编辑 / 成员管理 / 分类管理(滚动定位) / 分享二维码 / 照片管理。
class _ActionsRow extends StatelessWidget {
const _ActionsRow({
required this.onEdit,
required this.onMembers,
required this.onCategories,
required this.onShareQr,
required this.onPhotos,
});
final VoidCallback onEdit;
final VoidCallback onMembers;
final VoidCallback onCategories;
final VoidCallback onShareQr;
final VoidCallback onPhotos;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
return Wrap(
spacing: 8,
runSpacing: 8,
children: [
FilledButton.tonalIcon(
onPressed: onEdit,
icon: const Icon(Icons.edit_outlined),
label: Text(l10n.actionEdit),
),
FilledButton.tonalIcon(
onPressed: onMembers,
icon: const Icon(Icons.group_outlined),
label: Text(l10n.albumMembers),
),
FilledButton.tonalIcon(
onPressed: onCategories,
icon: const Icon(Icons.category_outlined),
label: Text(l10n.albumCategories),
),
FilledButton.tonalIcon(
onPressed: onShareQr,
icon: const Icon(Icons.qr_code_2),
label: Text(l10n.shareQrTitle),
),
FilledButton.tonalIcon(
onPressed: onPhotos,
icon: const Icon(Icons.photo_outlined),
label: Text(l10n.albumPhotos),
),
],
);
}
}
/// 分类管理区:列表(点击编辑、尾随删除)+ 新增入口。
class _CategoriesSection extends StatelessWidget {
const _CategoriesSection({
@@ -594,6 +774,7 @@ class _CategoriesSection extends StatelessWidget {
)
else
Card(
margin: EdgeInsets.zero,
child: Column(
children: [
for (final (i, category) in album.categories.indexed) ...[
@@ -633,37 +814,6 @@ class _CategoriesSection extends StatelessWidget {
}
}
/// 状态徽标(详情信息卡用)。
class _AlbumStatusBadge extends StatelessWidget {
const _AlbumStatusBadge({required this.status});
final AlbumStatus status;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final theme = Theme.of(context);
final active = status == AlbumStatus.active;
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
decoration: BoxDecoration(
color: active
? theme.colorScheme.secondaryContainer
: theme.colorScheme.errorContainer,
borderRadius: BorderRadius.circular(999),
),
child: Text(
active ? l10n.albumStatusActive : l10n.albumStatusOffline,
style: theme.textTheme.labelSmall?.copyWith(
color: active
? theme.colorScheme.onSecondaryContainer
: theme.colorScheme.onErrorContainer,
),
),
);
}
}
/// 分类新增/编辑对话框:排序序号 + 中文名 + 英文名(至少一个必填)。
///
/// 成功 pop(true);校验失败就地提示;API 失败 SnackBar(对话框保持)。
@@ -0,0 +1,446 @@
/// 照片大图查看器(UI-01 §4.3):已加载照片间左右切换、临近边缘加载
/// 更多、contain 完整展示;底部信息栏(上传者 / 相册时区时间 / 尺寸大
/// 小,photoId 放诊断区域);隐藏/恢复/删除单张操作(权限校验 + 删除
/// 确认「云端照片将被删除」);签名 URL 过期受控刷新一次。
///
/// 关闭后回到原网格位置(网格页状态与 ScrollController 在路由下保留)。
/// 恢复发布仅 owner/admin([PhotoGridController.isManager]);隐藏/删除
/// 为「管理者或自己上传」(服务端最终裁决,403 以 SnackBar 呈现)。
library;
import 'dart:math' as math;
import 'package:flutter/material.dart';
import '../core/app_exception.dart';
import '../core/error_l10n.dart';
import '../features/albums/album_format.dart';
import '../features/albums/models.dart';
import '../features/photos/models.dart';
import '../l10n/app_localizations.dart';
import '../ui/components/state_badge.dart';
import '../ui/tokens.dart';
import 'album_photos_page.dart';
/// 大图查看器(网格页 push 进入,共享 [controller] 的已加载条目)。
class AlbumPhotoViewerPage extends StatefulWidget {
const AlbumPhotoViewerPage({
required this.controller,
required this.album,
required this.initialIndex,
super.key,
});
final PhotoGridController controller;
final Album album;
/// 初始照片(controller.items 内的下标)。
final int initialIndex;
@override
State<AlbumPhotoViewerPage> createState() => _AlbumPhotoViewerPageState();
}
class _AlbumPhotoViewerPageState extends State<AlbumPhotoViewerPage> {
late final PageController _pageController;
late int _index;
@override
void initState() {
super.initState();
_index = widget.initialIndex.clamp(0, math.max(widget.controller.items.length - 1, 0));
_pageController = PageController(initialPage: _index);
}
@override
void dispose() {
_pageController.dispose();
super.dispose();
}
void _onPageChanged(int page) {
setState(() => _index = page);
final controller = widget.controller;
// 临近已加载末尾 → 预取下一页(loadMore 自带并发/末页守卫)。
if (page >= controller.items.length - 3 &&
controller.hasMore &&
!controller.loadingMore &&
!controller.loading) {
controller.loadMore();
}
}
bool _isOwnUpload(AdminPhoto photo) =>
widget.controller.selfAccount != null &&
photo.uploader.account == widget.controller.selfAccount;
/// 隐藏(published→hidden):管理者或自己上传。
bool _canHide(AdminPhoto photo) =>
photo.visibility == PhotoVisibility.published &&
(widget.controller.isManager || _isOwnUpload(photo));
/// 恢复显示(hidden→published):仅管理者(服务端同口径)。
bool _canUnhide(AdminPhoto photo) =>
photo.visibility == PhotoVisibility.hidden && widget.controller.isManager;
/// 删除:管理者或自己上传(未删除态)。
bool _canDelete(AdminPhoto photo) =>
photo.visibility != PhotoVisibility.deleted &&
(widget.controller.isManager || _isOwnUpload(photo));
Future<void> _hide(AdminPhoto photo) async {
final l10n = AppLocalizations.of(context);
final messenger = ScaffoldMessenger.of(context);
try {
await widget.controller.hidePhoto(photo);
messenger.showSnackBar(SnackBar(content: Text(l10n.photoHiddenToast)));
} on AppException catch (e) {
messenger.showSnackBar(
SnackBar(content: Text(l10n.messageForError(e))),
);
} on Object {
messenger.showSnackBar(SnackBar(content: Text(l10n.errorGeneric)));
}
}
Future<void> _unhide(AdminPhoto photo) async {
final l10n = AppLocalizations.of(context);
final messenger = ScaffoldMessenger.of(context);
try {
await widget.controller.unhidePhoto(photo);
messenger.showSnackBar(SnackBar(content: Text(l10n.photoUnhiddenToast)));
} on AppException catch (e) {
messenger.showSnackBar(
SnackBar(content: Text(l10n.messageForError(e))),
);
} on Object {
messenger.showSnackBar(SnackBar(content: Text(l10n.errorGeneric)));
}
}
Future<void> _delete(AdminPhoto photo) async {
final l10n = AppLocalizations.of(context);
// 删除确认:明确影响云端照片(与本机任务记录清理区分)。
final confirmed = await showDialog<bool>(
context: context,
builder: (_) => AlertDialog(
title: Text(l10n.photoDeleteConfirmTitle),
content: Text(l10n.photoDeleteConfirmBody),
actions: [
TextButton(
onPressed: () => Navigator.of(context).pop(false),
child: Text(l10n.cancel),
),
FilledButton(
onPressed: () => Navigator.of(context).pop(true),
child: Text(l10n.delete),
),
],
),
);
if (confirmed != true || !mounted) return;
final messenger = ScaffoldMessenger.of(context);
try {
await widget.controller.deletePhoto(photo);
widget.controller.removeById(photo.photoId);
if (!mounted) return;
messenger.showSnackBar(SnackBar(content: Text(l10n.photoDeletedToast)));
// 当前照片已删除且列表为空 → 回网格;否则夹取到有效页。
if (widget.controller.items.isEmpty) {
Navigator.of(context).pop();
} else {
setState(() {
_index = _index.clamp(0, widget.controller.items.length - 1);
});
}
} on AppException catch (e) {
messenger.showSnackBar(
SnackBar(content: Text(l10n.messageForError(e))),
);
} on Object {
messenger.showSnackBar(SnackBar(content: Text(l10n.errorGeneric)));
}
}
@override
Widget build(BuildContext context) {
// 整个 Scaffold(含信息栏)随 controller 重建:隐藏/恢复/刷新合并
// 后操作行与状态需同步更新(仅重建 body 会留下过期的操作入口)。
return AnimatedBuilder(
animation: widget.controller,
builder: (context, _) {
final items = widget.controller.items;
return Scaffold(
backgroundColor: Colors.black,
body: items.isEmpty
? const _ViewerShell(child: SizedBox.shrink())
: _ViewerShell(
child: PageView.builder(
controller: _pageController,
itemCount: items.length,
onPageChanged: _onPageChanged,
itemBuilder: (context, page) => _ViewerPhotoCell(
photo: items[page],
album: widget.album,
controller: widget.controller,
),
),
),
bottomNavigationBar: _infoBar(context),
);
},
);
}
/// 底部信息栏:上传者 / 时区时间 / 尺寸大小 + 操作行 + photoId 诊断区。
Widget _infoBar(BuildContext context) {
final l10n = AppLocalizations.of(context);
final items = widget.controller.items;
if (items.isEmpty) return const SizedBox.shrink();
final photo = items[_index.clamp(0, items.length - 1)];
final dims = (photo.width != null && photo.height != null)
? '${photo.width}×${photo.height}'
: null;
final size = _formatBytes(photo.bytes);
final meta = <String>[
formatAlbumDateTime(
photo.uploadedAt,
widget.album.timezone,
l10n.localeName,
),
?dims,
?size,
].join(' · ');
return SafeArea(
top: false,
child: Container(
color: Colors.black.withValues(alpha: 0.72),
padding: const EdgeInsets.symmetric(
horizontal: kSpace16,
vertical: kSpace8,
),
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Text(
photo.uploader.displayName.isEmpty
? photo.uploader.account
: photo.uploader.displayName,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: Theme.of(context).textTheme.titleSmall?.copyWith(
color: Colors.white,
),
),
const SizedBox(height: kSpace4),
Text(meta, style: const TextStyle(color: Colors.white70)),
const SizedBox(height: kSpace4),
// 诊断区域:照片 ID(不与主信息争夺层级)。
Text(
photo.photoId,
maxLines: 1,
overflow: TextOverflow.ellipsis,
style: Theme.of(
context,
).textTheme.labelSmall?.copyWith(color: Colors.white38),
),
Wrap(
spacing: kSpace16,
children: [
if (_canHide(photo))
TextButton.icon(
onPressed: () => _hide(photo),
icon: const Icon(Icons.visibility_off_outlined),
label: Text(l10n.photoHide),
style: TextButton.styleFrom(
foregroundColor: Colors.white,
),
),
if (_canUnhide(photo))
TextButton.icon(
onPressed: () => _unhide(photo),
icon: const Icon(Icons.visibility_outlined),
label: Text(l10n.photoUnhide),
style: TextButton.styleFrom(
foregroundColor: Colors.white,
),
),
if (_canDelete(photo))
TextButton.icon(
onPressed: () => _delete(photo),
icon: const Icon(Icons.delete_outline),
label: Text(l10n.delete),
style: TextButton.styleFrom(
foregroundColor: Colors.white,
),
),
],
),
],
),
),
);
}
static String? _formatBytes(int bytes) {
if (bytes <= 0) return null;
if (bytes < 1024 * 1024) return '${(bytes / 1024).round()} KB';
return '${(bytes / (1024 * 1024)).toStringAsFixed(1)} MB';
}
}
/// 查看器壳层:关闭按钮(安全区避让)+ 内容。
class _ViewerShell extends StatelessWidget {
const _ViewerShell({required this.child});
final Widget child;
@override
Widget build(BuildContext context) {
return Stack(
children: [
Positioned.fill(child: child),
SafeArea(
child: Align(
alignment: Alignment.topLeft,
child: IconButton(
tooltip: MaterialLocalizations.of(context).closeButtonTooltip,
onPressed: () => Navigator.of(context).pop(),
// 44×44 有效触控区(图标本身 24)。
icon: const Icon(Icons.close, color: Colors.white),
style: IconButton.styleFrom(
backgroundColor: Colors.black45,
foregroundColor: Colors.white,
),
),
),
),
],
);
}
}
/// 单张大图:contain 展示;签名 URL 失败 → 一次受控刷新;无预览(处理
/// 中/已删除/无权)显示状态说明。
class _ViewerPhotoCell extends StatelessWidget {
const _ViewerPhotoCell({
required this.photo,
required this.album,
required this.controller,
});
final AdminPhoto photo;
final Album album;
final PhotoGridController controller;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final url = photo.preview?.browse.url;
if (url == null) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.image_not_supported_outlined, size: 48, color: Colors.white38),
const SizedBox(height: kSpace12),
StateBadge(
variant: _stateBadgeVariant(photo),
label: _stateBadgeLabel(l10n, photo),
),
const SizedBox(height: kSpace8),
Text(
l10n.photoPreviewUnavailable,
style: const TextStyle(color: Colors.white54),
),
],
),
);
}
return _ViewerImage(
imageUrl: url,
photoId: photo.photoId,
controller: controller,
);
}
static BadgeVariant _stateBadgeVariant(AdminPhoto photo) {
if (photo.visibility == PhotoVisibility.deleted ||
photo.processingState == PhotoProcessingState.processingFailed) {
return BadgeVariant.error;
}
return BadgeVariant.warning;
}
static String _stateBadgeLabel(AppLocalizations l10n, AdminPhoto photo) {
if (photo.visibility == PhotoVisibility.deleted) {
return l10n.visibilityDeleted;
}
if (photo.processingState == PhotoProcessingState.processingFailed) {
return l10n.procProcessingFailed;
}
return l10n.procProcessing;
}
}
/// 大图 Image.network:失败时自动按原页参数刷新一次签名 URL;仍失败显示
/// 占位(不再重试,见 [PhotoGridController.refreshPreview])。
class _ViewerImage extends StatefulWidget {
const _ViewerImage({
required this.imageUrl,
required this.photoId,
required this.controller,
});
final String imageUrl;
final String photoId;
final PhotoGridController controller;
@override
State<_ViewerImage> createState() => _ViewerImageState();
}
class _ViewerImageState extends State<_ViewerImage> {
bool _autoRefreshScheduled = false;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
return Image.network(
widget.imageUrl,
fit: BoxFit.contain,
gaplessPlayback: true,
loadingBuilder: (context, child, progress) =>
progress == null ? child : const Center(
child: CircularProgressIndicator(strokeWidth: 2),
),
errorBuilder: (_, _, _) {
// 失败 → 一次受控刷新(新签名 URL 触发重建重载)。
if (!_autoRefreshScheduled && widget.controller.canRefresh(widget.photoId)) {
_autoRefreshScheduled = true;
WidgetsBinding.instance.addPostFrameCallback((_) {
widget.controller.refreshPreview(widget.photoId);
});
}
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(
Icons.broken_image_outlined,
size: 48,
color: Colors.white38,
),
const SizedBox(height: kSpace8),
Text(
l10n.photoPreviewUnavailable,
style: const TextStyle(color: Colors.white54),
),
],
),
);
},
);
}
}
+624 -260
View File
@@ -1,7 +1,19 @@
/// 照片管理占位页(P3 计划 Task 4):基础管理列表(可见性/处理状态
/// 标签 + 游标加载更多);完整筛选与操作由 Task 9 队列 UI 替换。
/// 照片管理页(UI-01 §4.3 重写):三列缩略图网格(极窄两列、平板按最小
/// 格宽扩列)+ 状态角标(处理中/失败/隐藏/删除)+ 筛选 chips + 游标分页
/// + 点开大图查看器。
///
/// 数据范围(scope):先按 all 请求(owner/admin);协作者 403
/// AUTH_FORBIDDEN 时自适应回退 own(服务端过滤,仅自己上传)——isManager
/// 由此推导,供查看器操作权限(恢复发布仅管理者)使用。缩略图取条目
/// preview.thumb;签名 URL 失效经 [PhotoGridController.refreshPreview]
/// 受控重取所在页一次(不无限重试)。
///
/// Processing/Failed 筛选为已加载页的本地过滤(服务端无对应查询参数),
/// 结果不足时自动补页(上限内),不声称全量。
library;
import 'dart:math' as math;
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
@@ -9,12 +21,397 @@ import '../core/api_client.dart';
import '../core/app_exception.dart';
import '../core/error_codes.dart';
import '../core/error_l10n.dart';
import '../features/albums/album_format.dart';
import '../core/models/cursor_page.dart';
import '../core/session_store.dart';
import '../features/albums/models.dart';
import '../features/photos/models.dart';
import '../l10n/app_localizations.dart';
import '../ui/components/empty_state.dart';
import '../ui/components/error_state.dart';
import '../ui/components/photo_thumbnail.dart';
import '../ui/components/state_badge.dart';
import '../ui/tokens.dart';
import 'album_photo_viewer_page.dart';
/// 照片管理占位(从详情页携带 [album] 进入,时间按相册时区展示)。
/// 网格筛选(All / Published / Hidden 走服务端 visibility;Processing /
/// Failed 为已加载条目的本地过滤)。
enum PhotoGridFilter {
all('all'),
published('published'),
hidden('hidden'),
processing('processing'),
failed('failed');
const PhotoGridFilter(this.wire);
final String wire;
/// 本地过滤(服务端无 processingState 查询参数)。
bool get isLocal => this == PhotoGridFilter.processing ||
this == PhotoGridFilter.failed;
}
/// 一页数据的请求规格(刷新签名 URL 时按原参数重取该页)。
@immutable
class _PageSpec {
const _PageSpec({
required this.cursor,
required this.visibility,
required this.scope,
required this.startIndex,
required this.count,
});
final String? cursor;
final PhotoVisibility? visibility;
final AlbumPhotoScope scope;
final int startIndex;
final int count;
}
/// 照片网格状态机(页面与查看器共享;ChangeNotifier 驱动两处重建)。
///
/// 职责:scope 自适应(all 403 → own)、游标分页、筛选切换、单张可见性
/// 变更后的条目合并、签名 URL 一次性刷新。所有变更经 [notifyListeners]
/// 通知;dispose 后静默丢弃(页面退出后迟到的响应不触发断言)。
class PhotoGridController extends ChangeNotifier {
PhotoGridController({
required ApiClient api,
required Future<Session?> Function() readSession,
required this.albumId,
this.pageSize = 20,
}) // 私有字段不能作 initializing formal(外部调用方无法传私有名),
// 参数名保持公开语义,忽略该风格提示。
// ignore: prefer_initializing_formals
: _api = api,
// ignore: prefer_initializing_formals
_readSession = readSession;
final ApiClient _api;
final Future<Session?> Function() _readSession;
final String albumId;
final int pageSize;
List<AdminPhoto> _items = const <AdminPhoto>[];
String? _nextCursor;
bool _hasMore = false;
bool _loading = false;
bool _loadingMore = false;
bool _loadMoreFailed = false;
String? _errorCode;
AlbumPhotoScope _scope = AlbumPhotoScope.all;
bool _scopeResolved = false;
PhotoGridFilter _filter = PhotoGridFilter.all;
final List<_PageSpec> _pages = <_PageSpec>[];
final Set<String> _refreshed = <String>{};
String? _selfAccount;
bool _disposed = false;
/// 已加载条目(全量,含本地筛选被排除的)。
List<AdminPhoto> get items => _items;
/// 当前筛选下应显示的条目。
List<AdminPhoto> get visibleItems => switch (_filter) {
PhotoGridFilter.processing => _items
.where((p) => p.processingState != PhotoProcessingState.ready)
.toList(growable: false),
PhotoGridFilter.failed => _items
.where((p) => p.processingState == PhotoProcessingState.processingFailed)
.toList(growable: false),
_ => _items,
};
bool get hasMore => _hasMore;
bool get loading => _loading;
bool get loadingMore => _loadingMore;
bool get loadMoreFailed => _loadMoreFailed;
String? get errorCode => _errorCode;
PhotoGridFilter get filter => _filter;
AlbumPhotoScope get scope => _scope;
/// scope=all 且已完成自适应判定 → 当前用户是 owner/admin(恢复发布等
/// 管理操作可用;判定依据为服务端 all 列表的 403 语义)。
bool get isManager => _scopeResolved && _scope == AlbumPhotoScope.all;
/// 当前登录账号(「自己上传」判定;读取失败为 null,按非本人处理)。
String? get selfAccount => _selfAccount;
/// 该照片是否仍可发起一次签名 URL 刷新(每张仅一次,不无限重试)。
bool canRefresh(String photoId) => !_refreshed.contains(photoId);
@override
void dispose() {
_disposed = true;
super.dispose();
}
void _notify() {
if (!_disposed) notifyListeners();
}
/// 读取当前登录账号(viewer 权限判定用;失败为 null,按非本人处理)。
Future<void> loadSelfAccount() async {
try {
_selfAccount = (await _readSession())?.account;
} on Object {
_selfAccount = null;
}
}
/// 首次加载(scope 自适应:all 403 → own 重试一次);已判定后等同
/// [reload](按已判定 scope 重取第一页)。
Future<void> resolveAndLoad() async {
if (_scopeResolved) return _reloadFirstPage();
_loading = true;
_errorCode = null;
_loadMoreFailed = false;
_notify();
final failure = await _tryFirstPage(AlbumPhotoScope.all);
if (failure == null) {
_scopeResolved = true;
_loading = false;
_notify();
return;
}
if (failure.code != ErrorCodes.authForbidden) {
_errorCode = failure.code;
_loading = false;
_notify();
return;
}
// 协作者:all → 403,回退 own(服务端过滤仅自己上传)。
_scope = AlbumPhotoScope.own;
final ownFailure = await _tryFirstPage(AlbumPhotoScope.own);
_scopeResolved = true;
_errorCode = ownFailure?.code;
_loading = false;
_notify();
}
/// 按已判定 scope 重置到第一页(下拉刷新/筛选切换)。
Future<void> _reloadFirstPage() async {
_loading = true;
_errorCode = null;
_loadMoreFailed = false;
_notify();
final failure = await _tryFirstPage(_scope);
_errorCode = failure?.code;
_loading = false;
_notify();
}
/// 取第一页;成功返回 null,失败返回异常。
Future<AppException?> _tryFirstPage(AlbumPhotoScope scope) async {
try {
final page = await _fetch(
scope: scope,
visibility: _serverVisibilityFor(_filter),
cursor: null,
limit: pageSize,
);
_items = page.items;
_nextCursor = page.nextCursor;
_hasMore = page.hasMore;
_loadMoreFailed = false;
_refreshed.clear();
_pages
..clear()
..add(
_PageSpec(
cursor: null,
visibility: _serverVisibilityFor(_filter),
scope: scope,
startIndex: 0,
count: page.items.length,
),
);
return null;
} on AppException catch (e) {
return e;
} on Object {
return const AppException(
code: ErrorCodes.internalError,
message: '照片列表加载失败',
);
}
}
/// 重置到第一页(下拉刷新/筛选切换;scope 判定结果保持不变)。
Future<void> reload() => _reloadFirstPage();
/// 游标加载下一页(加载中/无更多时为空操作;失败保留已加载条目)。
Future<void> loadMore() async {
if (_loading || _loadingMore || !_hasMore) return;
_loadingMore = true;
_loadMoreFailed = false;
_notify();
try {
final cursor = _nextCursor;
final page = await _fetch(
scope: _scope,
visibility: _serverVisibilityFor(_filter),
cursor: cursor,
limit: pageSize,
);
_pages.add(
_PageSpec(
cursor: cursor,
visibility: _serverVisibilityFor(_filter),
scope: _scope,
startIndex: _items.length,
count: page.items.length,
),
);
_items = <AdminPhoto>[..._items, ...page.items];
_nextCursor = page.nextCursor;
_hasMore = page.hasMore;
_loadingMore = false;
_notify();
} on AppException {
_loadingMore = false;
_loadMoreFailed = true;
_notify();
} on Object {
_loadingMore = false;
_loadMoreFailed = true;
_notify();
}
}
/// 切换筛选:服务端筛选(all/published/hidden)重载第一页;本地筛选
/// (processing/failed)仅重算可见集。
Future<void> setFilter(PhotoGridFilter filter) async {
if (filter == _filter) return;
_filter = filter;
if (!filter.isLocal) {
await reload();
} else {
_notify();
}
}
/// 签名 URL 失效受控刷新:按原请求规格重取该照片所在页,按 photoId
/// 合并新 preview;每张照片仅一次(成功与否均不再重试)。
Future<bool> refreshPreview(String photoId) async {
if (_refreshed.contains(photoId)) return false;
final index = _items.indexWhere((p) => p.photoId == photoId);
if (index < 0) return false;
final spec = _pageForIndex(index);
if (spec == null) return false;
_refreshed.add(photoId);
try {
final page = await _fetch(
scope: spec.scope,
visibility: spec.visibility,
cursor: spec.cursor,
limit: pageSize,
);
var updated = false;
final byId = <String, AdminPhoto>{
for (final item in page.items) item.photoId: item,
};
_items = <AdminPhoto>[
for (final item in _items) byId[item.photoId] ?? item,
];
updated = byId.containsKey(photoId);
_notify();
return updated;
} on AppException {
return false;
} on Object {
return false;
}
}
/// 单张可见性变更后合并回列表(保留原 uploader/preview;隐藏不回收
/// 已签发的预览——管理者仍可看)。
void applyRecord(PhotoRecord record) {
_items = <AdminPhoto>[
for (final item in _items)
if (item.photoId == record.photoId) _withRecord(item, record) else item,
];
_notify();
}
/// 删除成功后移除条目(页边界不再重算:后续 refreshPreview 按近似页
/// 重取,photoId 未命中时按失败处理,安全降级)。
void removeById(String photoId) {
_items = _items.where((p) => p.photoId != photoId).toList(growable: false);
_notify();
}
/// 隐藏(published → hidden;协作者仅限自己上传,服务端裁决)。
Future<void> hidePhoto(AdminPhoto photo) async {
final record = await _api.updatePhotoVisibility(
photo.photoId,
PhotoVisibility.hidden,
);
applyRecord(record);
}
/// 恢复显示(hidden → published;仅 owner/admin,服务端裁决)。
Future<void> unhidePhoto(AdminPhoto photo) async {
final record = await _api.updatePhotoVisibility(
photo.photoId,
PhotoVisibility.published,
);
applyRecord(record);
}
/// 删除(软删除,云端照片将被移除;权限同隐藏)。
Future<void> deletePhoto(AdminPhoto photo) =>
_api.deletePhoto(photo.photoId);
AdminPhoto _withRecord(AdminPhoto src, PhotoRecord rec) => AdminPhoto(
uploader: src.uploader,
preview: src.preview,
photoId: rec.photoId,
albumId: rec.albumId,
categoryId: rec.categoryId,
uploaderId: rec.uploaderId,
visibility: rec.visibility,
processingState: rec.processingState,
bytes: rec.bytes,
width: rec.width,
height: rec.height,
shotAt: rec.shotAt,
uploadedAt: rec.uploadedAt,
publishedAt: rec.publishedAt,
likeCount: rec.likeCount,
);
/// 覆盖 [index] 的页规格(删除导致边界漂移时按近似页处理)。
_PageSpec? _pageForIndex(int index) {
for (final spec in _pages) {
if (index >= spec.startIndex && index < spec.startIndex + spec.count) {
return spec;
}
}
return _pages.isEmpty ? null : _pages.first;
}
static PhotoVisibility? _serverVisibilityFor(PhotoGridFilter filter) =>
switch (filter) {
PhotoGridFilter.published => PhotoVisibility.published,
PhotoGridFilter.hidden => PhotoVisibility.hidden,
_ => null,
};
Future<CursorPage<AdminPhoto>> _fetch({
required AlbumPhotoScope scope,
String? cursor,
PhotoVisibility? visibility,
int? limit,
}) => _api.listAlbumPhotos(
albumId,
scope: scope,
visibility: visibility,
cursor: cursor,
limit: limit,
);
}
/// 照片管理网格页(从详情页携带 [album] 进入,时间按相册时区展示)。
class AlbumPhotosPage extends ConsumerStatefulWidget {
const AlbumPhotosPage({required this.album, super.key});
@@ -25,297 +422,264 @@ class AlbumPhotosPage extends ConsumerStatefulWidget {
}
class _AlbumPhotosPageState extends ConsumerState<AlbumPhotosPage> {
static const int _pageSize = 20;
List<AdminPhoto> _items = const <AdminPhoto>[];
String? _nextCursor;
bool _hasMore = false;
bool _loading = true;
bool _loadingMore = false;
String? _errorCode;
PhotoGridController? _controller;
final ScrollController _scrollController = ScrollController();
@override
void initState() {
super.initState();
_reload();
final controller = PhotoGridController(
api: ref.read(apiClientProvider),
readSession: ref.read(sessionStoreProvider).read,
albumId: widget.album.id,
);
_controller = controller;
controller
..loadSelfAccount()
..resolveAndLoad();
}
Future<void> _reload() async {
setState(() {
_loading = true;
_errorCode = null;
});
try {
final page = await ref.read(apiClientProvider).listAlbumPhotos(
widget.album.id,
limit: _pageSize,
);
if (mounted) {
setState(() {
_items = page.items;
_nextCursor = page.nextCursor;
_hasMore = page.hasMore;
_loading = false;
});
}
} on AppException catch (e) {
if (mounted) {
setState(() {
_errorCode = e.code;
_loading = false;
});
}
} on Object {
if (mounted) {
setState(() {
_errorCode = ErrorCodes.internalError;
_loading = false;
});
}
}
@override
void dispose() {
_controller?.dispose();
_scrollController.dispose();
super.dispose();
}
Future<void> _loadMore() async {
if (_loading || _loadingMore || !_hasMore) return;
setState(() => _loadingMore = true);
try {
final page = await ref.read(apiClientProvider).listAlbumPhotos(
widget.album.id,
cursor: _nextCursor,
limit: _pageSize,
);
if (mounted) {
setState(() {
_items = <AdminPhoto>[..._items, ...page.items];
_nextCursor = page.nextCursor;
_hasMore = page.hasMore;
_loadingMore = false;
});
}
} on AppException {
if (mounted) {
setState(() => _loadingMore = false);
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(
AppLocalizations.of(context).messageForErrorCode(
ErrorCodes.networkError,
),
),
),
);
}
} on Object {
if (mounted) {
setState(() => _loadingMore = false);
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(AppLocalizations.of(context).errorGeneric),
),
);
}
Future<void> _openViewer(int loadedIndex) async {
final controller = _controller;
if (controller == null) return;
await Navigator.of(context).push(
MaterialPageRoute<void>(
fullscreenDialog: true,
builder: (_) => AlbumPhotoViewerPage(
controller: controller,
album: widget.album,
initialIndex: loadedIndex,
),
),
);
}
@override
Widget build(BuildContext context) {
final controller = _controller;
if (controller == null) {
return const Scaffold(body: Center(child: CircularProgressIndicator()));
}
return Scaffold(
appBar: AppBar(title: Text(AppLocalizations.of(context).albumPhotos)),
body: AnimatedBuilder(
animation: controller,
builder: (context, _) => _AlbumPhotosBody(
controller: controller,
album: widget.album,
scrollController: _scrollController,
onOpenViewer: _openViewer,
),
),
);
}
}
/// 网格主体:筛选 chips +(协作者 own 范围提示)+ 网格/空态/错误态。
class _AlbumPhotosBody extends StatelessWidget {
const _AlbumPhotosBody({
required this.controller,
required this.album,
required this.scrollController,
required this.onOpenViewer,
});
final PhotoGridController controller;
final Album album;
final ScrollController scrollController;
final void Function(int loadedIndex) onOpenViewer;
/// 本地筛选自动补页上限(防 0 匹配时无限翻页;超过后显示空筛选态)。
static const int _localFilterAutoLoadCap = 100;
/// 网格列数(方案 §4.3):极窄(<360)两列;默认三列;平板按
/// width/150 向下取整扩列(不小于 3)。
static int columnCount(double width) {
if (width < 360) return 2;
return math.max(3, width ~/ 150);
}
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final theme = Theme.of(context);
return Scaffold(
appBar: AppBar(title: Text(l10n.albumPhotos)),
body: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
// Task 9 占位横幅:完整筛选/操作届时替换本页。
Card(
margin: const EdgeInsets.fromLTRB(12, 12, 12, 0),
child: Padding(
padding: const EdgeInsets.all(12),
child: Row(
children: [
Icon(
Icons.construction_outlined,
size: 18,
color: theme.colorScheme.onSurfaceVariant,
if (controller.loading) {
return const Center(child: CircularProgressIndicator());
}
if (controller.items.isEmpty && controller.errorCode != null) {
return ErrorState(
message: l10n.messageForErrorCode(controller.errorCode!),
onRetry: controller.reload,
);
}
final visible = controller.visibleItems;
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
SingleChildScrollView(
scrollDirection: Axis.horizontal,
padding: const EdgeInsets.symmetric(horizontal: kSpace16),
child: Row(
children: [
for (final filter in PhotoGridFilter.values)
Padding(
padding: const EdgeInsets.only(right: kSpace8),
child: FilterChip(
label: Text(_filterLabel(l10n, filter)),
selected: controller.filter == filter,
onSelected: (_) => controller.setFilter(filter),
),
const SizedBox(width: 8),
Expanded(
child: Text(
l10n.photosTask9Placeholder,
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onSurfaceVariant,
),
),
),
],
),
),
],
),
),
if (!controller.isManager)
Padding(
padding: const EdgeInsets.fromLTRB(
kSpace16,
kSpace8,
kSpace16,
kSpace4,
),
child: Text(
l10n.photosScopeOwnHint,
style: Theme.of(context).textTheme.bodySmall,
),
),
Expanded(
child: _loading
? const Center(child: CircularProgressIndicator())
: _items.isEmpty && _errorCode != null
? Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.cloud_off, size: 48),
const SizedBox(height: 12),
Text(l10n.messageForErrorCode(_errorCode!)),
const SizedBox(height: 12),
FilledButton.icon(
onPressed: _reload,
icon: const Icon(Icons.refresh),
label: Text(l10n.retry),
),
],
),
)
: ListView.builder(
itemCount: _items.length +
(_items.isEmpty || _hasMore || _loadingMore ? 1 : 0),
itemBuilder: (context, index) {
if (_items.isEmpty) {
return Padding(
padding: const EdgeInsets.all(32),
child: Text(
l10n.albumPhotosEmpty,
textAlign: TextAlign.center,
style: theme.textTheme.bodySmall,
),
);
}
if (index >= _items.length) {
return const Padding(
padding: EdgeInsets.symmetric(vertical: 16),
child: Center(
child: SizedBox(
height: 24,
width: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
),
);
}
if (index >= _items.length - 3 &&
_hasMore &&
!_loadingMore) {
WidgetsBinding.instance.addPostFrameCallback(
(_) => _loadMore(),
);
}
return _photoTile(l10n, theme, _items[index]);
},
),
),
],
),
Expanded(child: _gridOrEmpty(context, l10n, visible)),
],
);
}
Widget _photoTile(
Widget _gridOrEmpty(
BuildContext context,
AppLocalizations l10n,
ThemeData theme,
AdminPhoto photo,
List<AdminPhoto> visible,
) {
return ListTile(
leading: Container(
width: 44,
height: 44,
decoration: BoxDecoration(
color: theme.colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(8),
),
child: const Icon(Icons.image_outlined),
),
title: Text(
'${photo.photoId.substring(0, 8)} · ${(photo.bytes / 1024).round()} KB',
style: theme.textTheme.bodyMedium?.copyWith(
fontFeatures: const [FontFeature.tabularFigures()],
),
),
subtitle: Text(
formatAlbumDateTime(
photo.uploadedAt,
widget.album.timezone,
l10n.localeName,
),
),
trailing: Wrap(
spacing: 6,
runSpacing: 4,
crossAxisAlignment: WrapCrossAlignment.center,
children: [
_PhotoTag(
label: _visibilityLabel(l10n, photo.visibility),
highlight: photo.visibility == PhotoVisibility.published,
if (visible.isEmpty) {
final filtered = controller.filter != PhotoGridFilter.all;
return EmptyState(
icon: Icons.photo_outlined,
title: filtered ? l10n.photosEmptyFiltered : l10n.albumPhotosEmpty,
);
}
return LayoutBuilder(
builder: (context, constraints) {
final columns = columnCount(constraints.maxWidth);
return RefreshIndicator(
onRefresh: controller.reload,
child: GridView.builder(
controller: scrollController,
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.all(kSpace4),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: columns,
mainAxisSpacing: kSpace4,
crossAxisSpacing: kSpace4,
),
itemCount: visible.length + (controller.hasMore ? 1 : 0),
itemBuilder: (context, index) {
if (index >= visible.length) {
return const Center(
child: SizedBox(
height: 24,
width: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
);
}
_maybeLoadMore(index, visible.length);
final photo = visible[index];
final loadedIndex = controller.items.indexOf(photo);
return _PhotoGridTile(
photo: photo,
onTap: () => onOpenViewer(loadedIndex),
);
},
),
_PhotoTag(
label: _processingLabel(l10n, photo.processingState),
highlight: photo.processingState == PhotoProcessingState.ready,
),
],
),
);
},
);
}
static String _visibilityLabel(AppLocalizations l10n, PhotoVisibility v) {
switch (v) {
case PhotoVisibility.published:
return l10n.visibilityPublished;
case PhotoVisibility.unpublished:
return l10n.visibilityUnpublished;
case PhotoVisibility.hidden:
return l10n.visibilityHidden;
case PhotoVisibility.deleted:
return l10n.visibilityDeleted;
/// 接近末尾预取下一页;本地筛选可见数不足时自动补页(有上限)。
void _maybeLoadMore(int index, int visibleCount) {
final nearEnd = index >= visibleCount - 6;
final localStarved = controller.filter.isLocal &&
visibleCount < 9 &&
controller.items.length < _localFilterAutoLoadCap;
if ((nearEnd || localStarved) &&
controller.hasMore &&
!controller.loadingMore &&
!controller.loading) {
WidgetsBinding.instance.addPostFrameCallback((_) => controller.loadMore());
}
}
static String _processingLabel(
AppLocalizations l10n,
PhotoProcessingState s,
) {
switch (s) {
case PhotoProcessingState.pendingUpload:
return l10n.procPendingUpload;
case PhotoProcessingState.uploaded:
return l10n.procUploaded;
case PhotoProcessingState.processing:
return l10n.procProcessing;
case PhotoProcessingState.ready:
return l10n.procReady;
case PhotoProcessingState.processingFailed:
return l10n.procProcessingFailed;
}
}
static String _filterLabel(AppLocalizations l10n, PhotoGridFilter filter) =>
switch (filter) {
PhotoGridFilter.all => l10n.photoFilterAll,
PhotoGridFilter.published => l10n.visibilityPublished,
PhotoGridFilter.hidden => l10n.visibilityHidden,
PhotoGridFilter.processing => l10n.procProcessing,
PhotoGridFilter.failed => l10n.photoFilterFailed,
};
}
/// 照片标签(可见性/处理状态)。
class _PhotoTag extends StatelessWidget {
const _PhotoTag({required this.label, required this.highlight});
/// 网格瓦片:1:1 缩略图(cover 裁切)+ 左上角状态角标。
class _PhotoGridTile extends StatelessWidget {
const _PhotoGridTile({required this.photo, required this.onTap});
final String label;
final bool highlight;
final AdminPhoto photo;
final VoidCallback onTap;
/// 角标裁决(优先级:删除 > 失败 > 隐藏 > 处理中;就绪且公开无角标)。
static (String, BadgeVariant)? _badge(AppLocalizations l10n, AdminPhoto p) {
if (p.visibility == PhotoVisibility.deleted) {
return (l10n.visibilityDeleted, BadgeVariant.neutral);
}
if (p.processingState == PhotoProcessingState.processingFailed) {
return (l10n.procProcessingFailed, BadgeVariant.error);
}
if (p.visibility == PhotoVisibility.hidden) {
return (l10n.visibilityHidden, BadgeVariant.neutral);
}
if (p.processingState != PhotoProcessingState.ready) {
return (l10n.procProcessing, BadgeVariant.warning);
}
return null;
}
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
return Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
decoration: BoxDecoration(
color: highlight
? theme.colorScheme.secondaryContainer
: theme.colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(999),
),
child: Text(
label,
style: theme.textTheme.labelSmall?.copyWith(
color: highlight
? theme.colorScheme.onSecondaryContainer
: theme.colorScheme.onSurfaceVariant,
),
final l10n = AppLocalizations.of(context);
final badge = _badge(l10n, photo);
return InkWell(
onTap: onTap,
child: Stack(
fit: StackFit.expand,
children: [
PhotoThumbnail(
url: photo.preview?.thumb.url,
aspectRatio: 1,
),
if (badge != null)
Positioned(
top: kSpace4,
left: kSpace4,
child: StateBadge(
variant: badge.$2,
label: badge.$1,
compact: true,
),
),
],
),
);
}
+79 -47
View File
@@ -1,8 +1,9 @@
/// 相册列表页签:游标加载更多、下拉刷新、封面卡片(UI-01 §4.1 样板)。
/// 相册列表页签:游标加载更多、下拉刷新、封面卡片(UI-01 §4.1)。
///
/// 卡片顺序:封面(16:9,无封面中性占位)→ 标题(≤2 行,语言回退链)→
/// 时间/场地单行 → 公开/上传状态徽章(图标+文案,不只靠颜色)。完整列表
/// 交互(平板两列、错误重试等)随后续任务迭代。
/// 时间/场地单行 → 公开/上传状态徽章(图标+文案,不只靠颜色)。手机单列;
/// 可用宽度 > 600 双列(行内卡片等高,不挤压英文标题)。publicToken 与
/// 四开关堆叠不在主卡片(完整配置在详情设置)。
library;
import 'package:flutter/material.dart';
@@ -21,11 +22,15 @@ import '../ui/tokens.dart';
import 'album_detail_page.dart';
import 'album_form_page.dart';
/// 双列布局的可用宽度阈值(方案 §4.1「平板按可用宽度使用两列」)。
const double kAlbumTwoColumnMinWidth = 600;
/// 首页「相册」页签。
class AlbumsTab extends ConsumerWidget {
const AlbumsTab({super.key});
Future<void> _openCreate(BuildContext context, WidgetRef ref) async {
/// 打开创建表单;成功后刷新列表(空态 CTA 与 FAB 共用)。
static Future<void> openCreate(BuildContext context, WidgetRef ref) async {
final changed = await Navigator.of(context).push<bool>(
MaterialPageRoute<bool>(builder: (_) => const AlbumFormPage()),
);
@@ -41,7 +46,7 @@ class AlbumsTab extends ConsumerWidget {
return Scaffold(
appBar: AppBar(title: Text(l10n.albums)),
floatingActionButton: FloatingActionButton.extended(
onPressed: () => _openCreate(context, ref),
onPressed: () => openCreate(context, ref),
icon: const Icon(Icons.add),
label: Text(l10n.albumCreate),
),
@@ -51,6 +56,10 @@ class AlbumsTab extends ConsumerWidget {
}
/// 列表主体:按状态分发 加载/错误/空/列表(含加载更多页脚)。
///
/// 空态带「新建相册」入口;错误态带重试。列表按可用宽度切换单/双列,
/// 行结构 [ListView.builder](行 = 1-2 张卡片),保证下拉刷新与游标
/// 加载更多行为与旧版一致。
class AlbumListBody extends ConsumerWidget {
const AlbumListBody({required this.state, super.key});
@@ -74,49 +83,75 @@ class AlbumListBody extends ConsumerWidget {
return EmptyState(
icon: Icons.photo_library_outlined,
title: l10n.albumsEmpty,
actionLabel: l10n.albumCreate,
onAction: () => AlbumsTab.openCreate(context, ref),
);
}
final hasFooter = state.hasMore || state.loadMoreFailed;
return RefreshIndicator(
onRefresh: notifier.refresh,
child: ListView.builder(
physics: const AlwaysScrollableScrollPhysics(),
itemCount: state.items.length + (hasFooter ? 1 : 0),
itemBuilder: (context, index) {
if (index >= state.items.length) {
if (state.loadMoreFailed) {
return ListTile(
contentPadding: const EdgeInsets.symmetric(
horizontal: kSpace16,
return LayoutBuilder(
builder: (context, constraints) {
final twoColumns = constraints.maxWidth > kAlbumTwoColumnMinWidth;
final rowCount = (state.items.length / (twoColumns ? 2 : 1)).ceil();
final hasFooter = state.hasMore || state.loadMoreFailed;
return RefreshIndicator(
onRefresh: notifier.refresh,
child: ListView.builder(
physics: const AlwaysScrollableScrollPhysics(),
padding: const EdgeInsets.fromLTRB(
kSpace16,
kSpace8,
kSpace16,
kSpace32,
),
itemCount: rowCount + (hasFooter ? 1 : 0),
itemBuilder: (context, index) {
if (index >= rowCount) {
if (state.loadMoreFailed) {
return ListTile(
contentPadding: EdgeInsets.zero,
leading: const Icon(Icons.error_outline),
title: Text(l10n.loadMoreFailed),
onTap: notifier.loadMore,
);
}
return const Padding(
padding: EdgeInsets.symmetric(vertical: kSpace16),
child: Center(
child: SizedBox(
height: 24,
width: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
),
);
}
// 接近底部时预取下一页(loadMore 自带并发/末页守卫)。
if (index >= rowCount - 2 && state.hasMore && !state.loadingMore) {
WidgetsBinding.instance.addPostFrameCallback(
(_) => notifier.loadMore(),
);
}
if (!twoColumns) {
return AlbumCard(album: state.items[index]);
}
final first = index * 2;
final hasSecond = first + 1 < state.items.length;
return IntrinsicHeight(
child: Row(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Expanded(child: AlbumCard(album: state.items[first])),
if (hasSecond) ...[
const SizedBox(width: kSpace12),
Expanded(child: AlbumCard(album: state.items[first + 1])),
],
],
),
leading: const Icon(Icons.error_outline),
title: Text(l10n.loadMoreFailed),
onTap: notifier.loadMore,
);
}
return const Padding(
padding: EdgeInsets.symmetric(vertical: kSpace16),
child: Center(
child: SizedBox(
height: 24,
width: 24,
child: CircularProgressIndicator(strokeWidth: 2),
),
),
);
}
// 接近底部时预取下一页(loadMore 自带并发/末页守卫)。
if (index >= state.items.length - 3 &&
state.hasMore &&
!state.loadingMore) {
WidgetsBinding.instance.addPostFrameCallback(
(_) => notifier.loadMore(),
);
}
return AlbumCard(album: state.items[index]);
},
),
},
),
);
},
);
}
}
@@ -140,10 +175,7 @@ class AlbumCard extends StatelessWidget {
? _timeRange(l10n)
: '${_timeRange(l10n)} · $venue';
return Card(
margin: const EdgeInsets.symmetric(
horizontal: kSpace16,
vertical: kSpace8,
),
margin: const EdgeInsets.symmetric(vertical: kSpace8),
clipBehavior: Clip.antiAlias,
child: InkWell(
onTap: () => Navigator.of(context).push(
@@ -389,11 +389,13 @@ void main() {
'alb-1',
visibility: PhotoVisibility.hidden,
categoryId: 'cat-9',
scope: AlbumPhotoScope.own,
);
final query = adapter.requests.single.query;
expect(query, containsPair('visibility', 'hidden'));
expect(query, containsPair('categoryId', 'cat-9'));
expect(query, containsPair('scope', 'own'));
expect(query.containsKey('cursor'), isFalse);
expect(query.containsKey('limit'), isFalse);
});
+21 -3
View File
@@ -262,6 +262,9 @@ Map<String, dynamic> adminPhotoJson({
String visibility = 'published',
String processingState = 'ready',
int bytes = 123456,
String uploaderAccount = 'staff02',
String uploaderName = 'Staff Two',
Map<String, dynamic>? preview,
}) => <String, dynamic>{
'photoId': photoId,
'albumId': albumId,
@@ -278,10 +281,25 @@ Map<String, dynamic> adminPhotoJson({
'likeCount': 0,
'uploader': <String, dynamic>{
'userId': 'u-2',
'account': 'staff02',
'displayName': 'Staff Two',
'account': uploaderAccount,
'displayName': uploaderName,
},
'preview': preview,
};
/// 契约 `PhotoPreview` 响应体(thumb/browse 签名 URL)。
Map<String, dynamic> photoPreviewJson({
String thumbUrl = 'http://test.local/thumb.jpg',
String browseUrl = 'http://test.local/browse.jpg',
}) => <String, dynamic>{
'thumb': {
'url': thumbUrl,
'expiresAt': '2026-09-22T00:00:00Z',
},
'browse': {
'url': browseUrl,
'expiresAt': '2026-09-22T00:00:00Z',
},
'preview': null,
};
/// 契约游标分页响应体(hasMore 与 nextCursor 成对)。
@@ -1,7 +1,11 @@
/// 相册详情页 widget 测试(P3 计划 Task 4)。
/// 相册详情页 widget 测试(UI-01 §4.2 重构后)。
///
/// 覆盖:详情信息区(标题/状态/时间时区/令牌/开关标签)与动作行;
/// 分类管理三流(新增对话框载荷、名称空校验拦截、编辑 PATCH、删除确认)。
/// 覆盖:紧凑头部(封面占位 + 标题 + 时区时间场地行)→ 状态徽章 →
/// 照片入口(最近上传预览条 + 管理照片 / 空态「拍摄第一张照片」)→ 次级
/// 管理入口(ListTile)→ 底部固定上传栏(拍摄上传主 / 从相册选择次,上
/// 传关闭时禁用并说明);协作者(scope all 403 → own)隐藏管理入口;分类
/// 管理三流(新增载荷、空名校验、编辑 PATCH、删除确认);底部栏直达连拍
/// 页与多选入队。
library;
import 'dart:io';
@@ -12,6 +16,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:photo_live/core/api_client.dart';
import 'package:photo_live/core/error_codes.dart';
import 'package:photo_live/core/notification_permission.dart';
import 'package:photo_live/core/session_store.dart';
import 'package:photo_live/features/uploads/enqueue.dart';
@@ -40,16 +45,27 @@ void main() {
];
});
/// 路由:GET 详情(反映可变分类表)/ 分类 CRUD;其余路径直接抛错。
/// 路由:GET 详情(反映可变分类表)/ GET 照片预览(scope 自适应;默认
/// 管理者空列表)/ 分类 CRUD;其余路径直接抛错。
FakeAdapter detailAdapter({
List<Map<String, dynamic>>? photos,
bool collaborator = false,
(int, Object?)? Function(String method, String path)? onCategoryMutation,
}) =>
FakeAdapter((o) {
if (o.path == '/v1/albums/alb-1' && o.method == 'GET') {
return (200, albumJson(categories: categories));
}
if (o.path == '/v1/albums/alb-1/photos' && o.method == 'GET') {
final scope = o.uri.queryParameters['scope'];
if (collaborator && scope == 'all') {
return (403, errorBody(ErrorCodes.authForbidden));
}
return (200, cursorPageBody(photos ?? <Map<String, dynamic>>[]));
}
if (o.path == '/v1/albums/alb-1/categories' && o.method == 'POST') {
return onCategoryMutation?.call('POST', o.path) ?? (201, categoryJson(id: 'cat-new'));
return onCategoryMutation?.call('POST', o.path) ??
(201, categoryJson(id: 'cat-new'));
}
if (o.path.startsWith('/v1/categories/') && o.method == 'PATCH') {
return onCategoryMutation?.call('PATCH', o.path) ??
@@ -70,11 +86,9 @@ void main() {
Future<void> pumpDetail(WidgetTester tester, ApiClient client) async {
await tester.pumpWidget(
ProviderScope(
// Task 9 起详情页有上传 FAB(触达 sessionAccountProvider),
// 真实平台通道在测试环境挂起,必须注入替身。
overrides: [
...pageTestOverrides(session: store, client: client),
],
// 详情页触达 sessionStoreProvider(上传入口账号),真实平台通道
// 在测试环境挂起,必须注入替身。
overrides: [...pageTestOverrides(session: store, client: client)],
child: MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
@@ -85,31 +99,165 @@ void main() {
await tester.pumpAndSettle();
}
testWidgets('加载详情 → 信息区 + 动作行 + 分类列表', (tester) async {
final adapter = detailAdapter();
/// 新布局下分类区在折叠线以下:先滚动到位再交互。
Future<void> reveal(WidgetTester tester, Finder finder) async {
await tester.ensureVisible(finder);
await tester.pumpAndSettle();
}
testWidgets('布局结构:头部 → 状态 → 照片入口 → 次级操作 → 底部上传栏',
(tester) async {
final adapter = detailAdapter(
photos: List<Map<String, dynamic>>.generate(
3,
(i) => adminPhotoJson(
photoId: 'ph-${(i + 1).toString().padLeft(2, '0')}',
preview: photoPreviewJson(),
),
),
);
await pumpDetail(tester, clientOf(adapter));
// 信息区(标题同时出现在 AppBar 与信息卡)。
expect(find.text('开幕晚宴'), findsNWidgets(2));
expect(find.text('Active'), findsOneWidget);
// 紧凑头部:封面占位(无 cover → 中性占位,非转圈)+ 标题 + 单行
// 时间/场地(相册时区墙钟 + 场地语言回退)。
final body = find.byType(SingleChildScrollView);
expect(
find.text('2026/9/18 14:30 ~ Not set (Asia/Shanghai)'),
find.descendant(of: body, matching: find.text('Opening Gala')),
findsOneWidget,
);
expect(find.text('sharetoken000000000001'), findsOneWidget);
expect(find.text('大宴会厅'), findsOneWidget);
// 「Upload」出现两次:开关标签 chip + Task 9 上传 FAB 文案。
expect(find.text('Upload'), findsNWidgets(2));
expect(find.text('Original'), findsOneWidget);
// 动作行(5 项)。
expect(find.text('Edit'), findsOneWidget);
expect(find.text('Members'), findsOneWidget);
// 「Categories」同时出现在动作按钮与分区标题。
expect(find.text('Categories'), findsNWidgets(2));
expect(find.text('Share QR code'), findsOneWidget);
expect(find.text('Photos'), findsOneWidget);
// 分类条目(zh · en 名称连接)。
expect(find.text('仪式 · Ceremony'), findsOneWidget);
expect(
find.text('2026/9/18 14:30 ~ Not set (Asia/Shanghai) · 大宴会厅'),
findsOneWidget,
);
expect(find.byIcon(Icons.image_outlined), findsOneWidget);
// 预览条缩略图(签名 URL 测试环境失败 → 替代图,不破图)。
expect(find.byIcon(Icons.broken_image_outlined), findsNWidgets(3));
// 状态区:公开/上传徽章(关闭不等于不公开,分别呈现)。
expect(find.text('Public'), findsOneWidget);
expect(find.text('Uploads on'), findsOneWidget);
expect(find.text('Download'), findsNothing);
expect(find.text('Original'), findsNothing);
expect(find.text('sharetoken000000000001'), findsNothing);
// 照片入口:分区标题 + 「管理照片」入口 + 3 张预览缩略图。
expect(find.text('Manage photos'), findsOneWidget);
// 次级操作(ListTile,不再与主操作同级)。
expect(find.widgetWithText(ListTile, 'Edit'), findsOneWidget);
expect(find.widgetWithText(ListTile, 'Members'), findsOneWidget);
expect(find.widgetWithText(ListTile, 'Categories'), findsOneWidget);
expect(find.widgetWithText(ListTile, 'Share QR code'), findsOneWidget);
// 底部固定上传栏:拍摄上传(主)+ 从相册选择(次)。
final capture = find.widgetWithText(FilledButton, 'Capture and upload');
final pick = find.widgetWithText(OutlinedButton, 'Pick from gallery');
expect(capture, findsOneWidget);
expect(pick, findsOneWidget);
// 垂直顺序:标题 → 徽章 → 管理照片 → 底部栏(次级操作在 body 列内,
// 其在树中先于 bottomNavigationBar,几何位置随滚动变化不作断言)。
final titleTop = tester
.getRect(find.descendant(of: body, matching: find.text('Opening Gala')))
.top;
final badgeTop = tester.getRect(find.text('Public')).top;
final manageTop = tester.getRect(find.text('Manage photos')).top;
final captureTop = tester.getRect(capture).top;
expect(titleTop, lessThan(badgeTop));
expect(badgeTop, lessThan(manageTop));
expect(manageTop, lessThan(captureTop));
});
testWidgets('无照片:空态引导「拍摄第一张照片」(上传开启时可用)',
(tester) async {
await pumpDetail(tester, clientOf(detailAdapter()));
expect(find.text('No photos yet'), findsOneWidget);
final cta = find.widgetWithText(FilledButton, 'Take the first photo');
expect(cta, findsOneWidget);
expect(
tester.widget<FilledButton>(cta).onPressed,
isNotNull,
reason: '上传开启时引导可用',
);
});
testWidgets('上传关闭:底部栏说明原因并禁用双入口 + 引导禁用', (tester) async {
final adapter = FakeAdapter((o) {
if (o.path == '/v1/albums/alb-1' && o.method == 'GET') {
return (200, albumJson(categories: categories, uploadEnabled: false));
}
if (o.path == '/v1/albums/alb-1/photos' && o.method == 'GET') {
return (200, cursorPageBody(<Map<String, dynamic>>[]));
}
throw StateError('unexpected ${o.method} ${o.path}');
});
await pumpDetail(tester, clientOf(adapter));
expect(
find.text(
'Uploads are off for this album. New photos cannot be added right now',
),
findsOneWidget,
);
expect(
tester
.widget<FilledButton>(
find.widgetWithText(FilledButton, 'Capture and upload'),
)
.onPressed,
isNull,
);
expect(
tester
.widget<OutlinedButton>(
find.widgetWithText(OutlinedButton, 'Pick from gallery'),
)
.onPressed,
isNull,
);
expect(
tester
.widget<FilledButton>(
find.widgetWithText(FilledButton, 'Take the first photo'),
)
.onPressed,
isNull,
reason: '空态引导与底部栏同一开关',
);
});
testWidgets('协作者(all 403 → own):隐藏管理入口,仅见自己上传预览',
(tester) async {
final adapter = detailAdapter(
photos: <Map<String, dynamic>>[
adminPhotoJson(
photoId: 'ph-own-1',
uploaderAccount: 'staff02',
preview: photoPreviewJson(),
),
],
collaborator: true,
);
await pumpDetail(tester, clientOf(adapter));
// scope 自适应:all(403)→ own(200)。
final photoRequests = adapter.requests
.where((r) => r.path == '/v1/albums/alb-1/photos')
.toList();
expect(photoRequests, hasLength(2));
expect(photoRequests.first.uri.queryParameters['scope'], 'all');
expect(photoRequests.last.uri.queryParameters['scope'], 'own');
// 管理入口仅创建者/管理员可见;分享对全体成员开放。
expect(find.widgetWithText(ListTile, 'Edit'), findsNothing);
expect(find.widgetWithText(ListTile, 'Members'), findsNothing);
expect(find.text('Categories'), findsNothing, reason: '含分区一并隐藏');
expect(find.widgetWithText(ListTile, 'Share QR code'), findsOneWidget);
expect(find.byIcon(Icons.add_circle_outline), findsNothing);
// 预览条退化为自己的上传(1 张;头部封面占位另 1 张)。
expect(find.byIcon(Icons.broken_image_outlined), findsOneWidget);
});
testWidgets('新增分类:填名称与排序 → POST 载荷 → 列表刷新', (tester) async {
@@ -136,7 +284,8 @@ void main() {
);
await pumpDetail(tester, clientOf(adapter));
await tester.tap(find.byIcon(Icons.add_circle_outline));
await reveal(tester, find.byIcon(Icons.add_circle_outline));
await tester.tap(find.byIcon(Icons.add_circle_outline).hitTestable());
await tester.pumpAndSettle();
await tester.enterText(
@@ -176,7 +325,8 @@ void main() {
await pumpDetail(tester, clientOf(adapter));
final requestsBefore = adapter.requests.length;
await tester.tap(find.byIcon(Icons.add_circle_outline));
await reveal(tester, find.byIcon(Icons.add_circle_outline));
await tester.tap(find.byIcon(Icons.add_circle_outline).hitTestable());
await tester.pumpAndSettle();
await tester.tap(find.text('Save'));
@@ -213,7 +363,8 @@ void main() {
);
await pumpDetail(tester, clientOf(adapter));
await tester.tap(find.text('仪式 · Ceremony'));
await reveal(tester, find.text('仪式 · Ceremony'));
await tester.tap(find.text('仪式 · Ceremony').hitTestable());
await tester.pumpAndSettle();
// 预填检查。
@@ -260,7 +411,8 @@ void main() {
);
await pumpDetail(tester, clientOf(adapter));
await tester.tap(find.byIcon(Icons.delete_outline));
await reveal(tester, find.byIcon(Icons.delete_outline));
await tester.tap(find.byIcon(Icons.delete_outline).hitTestable());
await tester.pumpAndSettle();
expect(
@@ -272,7 +424,8 @@ void main() {
await tester.pumpAndSettle();
expect(find.text('仪式 · Ceremony'), findsOneWidget);
await tester.tap(find.byIcon(Icons.delete_outline));
await reveal(tester, find.byIcon(Icons.delete_outline));
await tester.tap(find.byIcon(Icons.delete_outline).hitTestable());
await tester.pumpAndSettle();
await tester.tap(find.widgetWithText(FilledButton, 'Delete'));
await tester.pumpAndSettle();
@@ -287,7 +440,7 @@ void main() {
expect(find.text('No categories yet. Tap + to add one'), findsOneWidget);
});
group('上传入口 FAB(Task 9)', () {
group('底部固定上传栏(原 Task 9 FAB 流迁移)', () {
late Directory tmp;
late List<String> galleryPaths;
late TaskStore taskStore;
@@ -344,47 +497,33 @@ void main() {
await tester.pumpAndSettle();
}
testWidgets('FAB → 底部弹层双入口(拍照上传 / 从相册选择)', (tester) async {
testWidgets('「拍摄上传」→ 直达连拍页(目标相册带出)', (tester) async {
await pumpDetailForUpload(tester);
await tester.tap(find.byType(FloatingActionButton));
await tester.pumpAndSettle();
expect(find.text('Capture and upload'), findsOneWidget);
expect(find.text('Pick from gallery'), findsOneWidget);
});
testWidgets('拍照上传 → 进入连拍页(目标相册带出)', (tester) async {
await pumpDetailForUpload(tester);
await tester.tap(find.byType(FloatingActionButton));
await tester.pumpAndSettle();
await tester.tap(find.text('Capture and upload'));
await tester.pumpAndSettle();
expect(find.byType(CapturePage), findsOneWidget);
// 连拍页常驻信息层显示目标相册名(与详情标题同源:默认 zh 主标题)。
// 连拍页常驻信息层显示目标相册名(与详情标题同源:界面语言回退)。
expect(
find.descendant(
of: find.byType(CapturePage),
matching: find.text('开幕晚宴'),
matching: find.text('Opening Gala'),
),
findsOneWidget,
);
});
testWidgets('从相册选择 → 多选入队 + 入队数提示', (tester) async {
testWidgets('「从相册选择」→ 多选入队 + 入队数提示', (tester) async {
final pick1 = File('${tmp.path}/pick1.jpg')..writeAsBytesSync(kJpgBytes);
final pick2 = File('${tmp.path}/pick2.jpg')..writeAsBytesSync(kJpgBytes);
galleryPaths.addAll([pick1.path, pick2.path]);
await pumpDetailForUpload(tester);
await tester.tap(find.byType(FloatingActionButton));
await tester.pumpAndSettle();
// 入队链路含真实文件 IO:真实事件循环内触发行内动作。
final tile = find.widgetWithText(ListTile, 'Pick from gallery');
final button = find.widgetWithText(OutlinedButton, 'Pick from gallery');
await tester.runAsync(() async {
(tile.evaluate().single.widget as ListTile).onTap!();
(button.evaluate().single.widget as OutlinedButton).onPressed!();
await Future<void>.delayed(const Duration(milliseconds: 300));
});
await tester.pumpAndSettle();
@@ -0,0 +1,356 @@
/// 照片大图查看器 widget 测试(UI-01 §4.3)。
///
/// 覆盖:信息栏(上传者/相册时区时间/尺寸大小 + ID 诊断区)、左右切换、
/// 权限(管理者隐藏/恢复/删除;协作者自己上传可隐藏删除、不可恢复)、
/// 删除确认(云端照片将被删除)、关闭返回网格原位置、签名 URL 失败一次
/// 受控刷新、临近末尾加载更多。
library;
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:photo_live/core/api_client.dart';
import 'package:photo_live/core/error_codes.dart';
import 'package:photo_live/core/session_store.dart';
import 'package:photo_live/features/albums/models.dart';
import 'package:photo_live/l10n/app_localizations.dart';
import 'package:photo_live/pages/album_photos_page.dart';
import 'package:photo_live/pages/album_photo_viewer_page.dart';
import 'package:photo_live/ui/components/photo_thumbnail.dart';
import '../helpers/fakes.dart';
void main() {
late FakeSessionStore store;
setUp(() {
store = FakeSessionStore();
});
ApiClient clientOf(FakeAdapter adapter) => ApiClient(
sessionStore: store,
dio: Dio(BaseOptions(baseUrl: 'http://test.local'))
..httpClientAdapter = adapter,
);
/// 网格 + 可选打开查看器;返回打开前的网格 Scrollable 像素偏移。
Future<double> pumpGridAndOpen(
WidgetTester tester,
ApiClient client, {
int tile = 0,
}) async {
await tester.pumpWidget(
ProviderScope(
overrides: [...pageTestOverrides(session: store, client: client)],
child: MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
home: AlbumPhotosPage(album: Album.fromJson(albumJson())),
),
),
);
await tester.pumpAndSettle();
final gridScrollable = find.descendant(
of: find.byType(GridView),
matching: find.byType(Scrollable),
);
final before = tester
.state<ScrollableState>(gridScrollable)
.position
.pixels;
await tester.tap(find.byType(PhotoThumbnail).at(tile));
await tester.pumpAndSettle();
return before;
}
testWidgets('信息栏:上传者 / 相册时区时间 / 尺寸大小 + ID 诊断区', (tester) async {
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-info-1', preview: photoPreviewJson()),
]),
);
});
await pumpGridAndOpen(tester, clientOf(adapter));
expect(find.byType(AlbumPhotoViewerPage), findsOneWidget);
expect(find.text('Staff Two'), findsOneWidget);
// uploadedAt 07:00Z → 相册时区上海 15:00;尺寸 + 大小。
expect(find.text('2026/9/18 15:00 · 4000×3000 · 121 KB'), findsOneWidget);
// ID 放诊断区域(弱化呈现)。
expect(find.text('ph-info-1'), findsOneWidget);
});
testWidgets('左右切换已加载照片 + 临近末尾加载更多', (tester) async {
final page1 = List<Map<String, dynamic>>.generate(
20,
(i) => adminPhotoJson(
photoId: 'ph-v${(i + 1).toString().padLeft(2, '0')}',
uploaderName: 'Uploader ${i + 1}',
preview: photoPreviewJson(),
),
);
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
final cursor = o.uri.queryParameters['cursor'];
if (cursor == null) {
return (200, cursorPageBody(page1, nextCursor: 'vc1'));
}
if (cursor == 'vc1') {
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-vpage2', preview: photoPreviewJson()),
]),
);
}
throw StateError('unexpected cursor $cursor');
});
await pumpGridAndOpen(tester, clientOf(adapter));
// 初始第一张。
expect(find.text('Uploader 1'), findsOneWidget);
// 左右切换:到第二张。
await tester.drag(find.byType(PageView), const Offset(-700, 0));
await tester.pumpAndSettle();
expect(find.text('Uploader 2'), findsOneWidget);
// 连续滑到接近已加载末尾(page >= length-3 触发加载更多)。
for (var i = 0; i < 20; i++) {
await tester.drag(find.byType(PageView), const Offset(-700, 0));
await tester.pumpAndSettle();
}
expect(
adapter.requests.any((r) => r.uri.queryParameters['cursor'] == 'vc1'),
isTrue,
reason: '临近末尾按游标加载第二页',
);
});
testWidgets('管理者:已发布照片可隐藏/删除;隐藏照片可恢复', (tester) async {
final adapter = FakeAdapter((o) {
if (o.path == '/v1/albums/alb-1/photos') {
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-pub', preview: photoPreviewJson()),
adminPhotoJson(
photoId: 'ph-hid',
visibility: 'hidden',
preview: photoPreviewJson(),
),
]),
);
}
if (o.method == 'PATCH' && o.path == '/v1/photos/ph-pub') {
return (
200,
adminPhotoJson(photoId: 'ph-pub', visibility: 'hidden'),
);
}
throw StateError('unexpected ${o.method} ${o.path}');
});
final client = clientOf(adapter);
await pumpGridAndOpen(tester, client);
// 已发布:隐藏 + 删除(管理者,scope=all 成功)。
expect(find.text('Hide'), findsOneWidget);
expect(find.text('Delete'), findsOneWidget);
expect(find.text('Unhide'), findsNothing);
// 切到第二张(隐藏照片):恢复显示(仅管理者)+ 删除。
await tester.drag(find.byType(PageView), const Offset(-700, 0));
await tester.pumpAndSettle();
expect(find.text('Unhide'), findsOneWidget);
expect(find.text('Hide'), findsNothing);
// 隐藏操作:PATCH visibility=hidden → 按钮翻转为恢复显示。
await tester.drag(find.byType(PageView), const Offset(700, 0));
await tester.pumpAndSettle();
await tester.tap(find.text('Hide'));
await tester.pumpAndSettle();
final patch = adapter.requests.singleWhere(
(r) => r.method == 'PATCH' && r.path == '/v1/photos/ph-pub',
);
expect(patch.body, <String, dynamic>{'visibility': 'hidden'});
expect(find.text('Unhide'), findsOneWidget, reason: '隐藏后可恢复');
expect(find.text('Hide'), findsNothing, reason: '已隐藏态不再显示隐藏入口');
});
testWidgets('协作者(scope=own):自己上传可隐藏/删除,不可恢复', (tester) async {
store.session = Session(
token: 'tok-1',
expiresAt: DateTime.utc(2099, 1, 1),
account: 'staff02',
);
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
final scope = o.uri.queryParameters['scope'];
if (scope == 'all') return (403, errorBody(ErrorCodes.authForbidden));
if (scope == 'own') {
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(
photoId: 'ph-own-hidden',
visibility: 'hidden',
uploaderAccount: 'staff02',
preview: null,
),
]),
);
}
throw StateError('unexpected scope $scope');
});
await pumpGridAndOpen(tester, clientOf(adapter));
// 自己上传的隐藏照片:恢复发布仅创建者/管理员 → 不显示恢复入口。
expect(find.text('Unhide'), findsNothing);
expect(find.text('Delete'), findsOneWidget, reason: '自己上传可删除');
// 无预览(隐藏对协作者不签发)→ 状态说明 + 图片暂不可用。
expect(find.text('Image unavailable'), findsOneWidget);
expect(find.text('ph-own-hidden'), findsOneWidget);
});
testWidgets('删除:确认「云端照片」→ DELETE → 条目移除', (tester) async {
final adapter = FakeAdapter((o) {
if (o.path == '/v1/albums/alb-1/photos') {
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-del', preview: photoPreviewJson()),
]),
);
}
if (o.method == 'DELETE' && o.path == '/v1/photos/ph-del') {
return (204, null);
}
throw StateError('unexpected ${o.method} ${o.path}');
});
await pumpGridAndOpen(tester, clientOf(adapter));
await tester.tap(find.text('Delete'));
await tester.pumpAndSettle();
// 确认弹窗:明确影响云端照片。
expect(find.text('Delete this photo?'), findsOneWidget);
expect(
find.text('The cloud photo will be deleted. This cannot be undone.'),
findsOneWidget,
);
// 取消不删。
await tester.tap(find.text('Cancel'));
await tester.pumpAndSettle();
expect(
adapter.requests.any((r) => r.method == 'DELETE'),
isFalse,
reason: '取消不触发删除',
);
await tester.tap(find.text('Delete'));
await tester.pumpAndSettle();
await tester.tap(find.widgetWithText(FilledButton, 'Delete'));
await tester.pumpAndSettle();
expect(
adapter.requests.any(
(r) => r.method == 'DELETE' && r.path == '/v1/photos/ph-del',
),
isTrue,
);
// 唯一照片删除后 → 查看器退回网格(空态)。
expect(find.byType(AlbumPhotoViewerPage), findsNothing);
expect(find.text('No photos yet'), findsOneWidget);
});
testWidgets('关闭返回网格原滚动位置', (tester) async {
// 默认测试画布 800 宽 → 5 列;24 条 ≈ 5 行,超出视口可滚动。
final items = List<Map<String, dynamic>>.generate(
24,
(i) => adminPhotoJson(
photoId: 'ph-s${(i + 1).toString().padLeft(2, '0')}',
preview: photoPreviewJson(),
),
);
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
return (200, cursorPageBody(items));
});
await tester.pumpWidget(
ProviderScope(
overrides: [...pageTestOverrides(session: store, client: clientOf(adapter))],
child: MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
home: AlbumPhotosPage(album: Album.fromJson(albumJson())),
),
),
);
await tester.pumpAndSettle();
// 先滚动网格(离开顶部)。
final gridScrollable = find.descendant(
of: find.byType(GridView),
matching: find.byType(Scrollable),
);
await tester.drag(gridScrollable, const Offset(0, -600));
await tester.pumpAndSettle();
final scrolled = tester
.state<ScrollableState>(gridScrollable)
.position
.pixels;
expect(scrolled, greaterThan(0));
// 打开当前视口内可见的一张(滚动后树序首项可能在缓存区/被遮挡)→
// 关闭 → 偏移保持。
await tester.tap(find.byType(PhotoThumbnail).hitTestable().first);
await tester.pumpAndSettle();
expect(find.byType(AlbumPhotoViewerPage), findsOneWidget);
await tester.tap(find.byIcon(Icons.close));
await tester.pumpAndSettle();
expect(
tester.state<ScrollableState>(gridScrollable).position.pixels,
scrolled,
reason: '关闭大图后网格回到原滚动位置',
);
});
testWidgets('签名 URL 失败 → 一次受控刷新(不无限重试)', (tester) async {
var listCalls = 0;
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
listCalls++;
// 刷新后返回新签名 URL(测试环境网络仍失败 → 验证不再重试)。
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(
photoId: 'ph-url',
preview: photoPreviewJson(
browseUrl: 'http://test.local/browse-v$listCalls.jpg',
),
),
]),
);
});
await pumpGridAndOpen(tester, clientOf(adapter));
// 初次列表 + 失败后自动刷新一次 = 2 次;再等待后不再增加。
await tester.pumpAndSettle(const Duration(seconds: 1));
expect(listCalls, 2, reason: '签名 URL 失败仅重取一次');
expect(find.text('Image unavailable'), findsOneWidget);
});
}
@@ -1,7 +1,8 @@
/// 照片管理占位页 widget 测试(P3 计划 Task 4)。
/// 照片管理网格 widget 测试(UI-01 §4.3)。
///
/// 覆盖:Task 9 占位横幅、基础列表(可见性/处理状态标签、时区时间)、
/// 游标加载更多。完整交互由 Task 9 替换。
/// 覆盖:网格列数(极窄 2 / 默认 3 / 宽屏 5)、状态角标(处理中/失败/
/// 隐藏/删除)、scope 自适应(all 403 → own + 协作者提示)、游标加载第二
/// 页、筛选 chips(服务端 visibility 重载 / 本地 processing 过滤)、空态。
library;
import 'package:dio/dio.dart';
@@ -9,9 +10,13 @@ import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:photo_live/core/api_client.dart';
import 'package:photo_live/core/error_codes.dart';
import 'package:photo_live/features/albums/models.dart';
import 'package:photo_live/l10n/app_localizations.dart';
import 'package:photo_live/pages/album_photos_page.dart';
import 'package:photo_live/pages/album_photo_viewer_page.dart';
import 'package:photo_live/ui/components/photo_thumbnail.dart';
import 'package:photo_live/ui/components/state_badge.dart';
import '../helpers/fakes.dart';
@@ -31,7 +36,7 @@ void main() {
Future<void> pumpPhotos(WidgetTester tester, ApiClient client) async {
await tester.pumpWidget(
ProviderScope(
overrides: [apiClientProvider.overrideWith((ref) => client)],
overrides: [...pageTestOverrides(session: store, client: client)],
child: MaterialApp(
localizationsDelegates: AppLocalizations.localizationsDelegates,
supportedLocales: AppLocalizations.supportedLocales,
@@ -42,18 +47,134 @@ void main() {
await tester.pumpAndSettle();
}
testWidgets('占位横幅 + 列表标签 + 游标加载第二页', (tester) async {
void setSurface(WidgetTester tester, Size size) {
tester.view.physicalSize = size;
tester.view.devicePixelRatio = 1.0;
}
testWidgets('网格列数:350→2 / 390→3 / 800→5(平板按格宽扩列)', (tester) async {
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
// 非空列表(空态不渲染 GridView,无法断言 delegate)。
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-c1', preview: photoPreviewJson()),
adminPhotoJson(photoId: 'ph-c2', preview: photoPreviewJson()),
]),
);
});
final client = clientOf(adapter);
setSurface(tester, const Size(350, 800));
await pumpPhotos(tester, client);
expect(_columnCount(tester), 2, reason: '极窄屏两列');
setSurface(tester, const Size(390, 844));
await pumpPhotos(tester, client);
expect(_columnCount(tester), 3, reason: '默认三列');
setSurface(tester, const Size(800, 600));
await pumpPhotos(tester, client);
expect(_columnCount(tester), 5, reason: '800/150 向下取整 5 列');
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('缩略图 + 状态角标(处理中/失败/隐藏;就绪公开无角标)', (tester) async {
setSurface(tester, const Size(390, 844));
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-ready', preview: photoPreviewJson()),
adminPhotoJson(
photoId: 'ph-processing',
processingState: 'processing',
visibility: 'unpublished',
),
adminPhotoJson(
photoId: 'ph-failed',
processingState: 'processing_failed',
visibility: 'unpublished',
),
adminPhotoJson(photoId: 'ph-hidden', visibility: 'hidden'),
]),
);
});
await pumpPhotos(tester, clientOf(adapter));
// 缩略图来自 preview.thumb(测试环境网络失败 → 替代图占位,不破图)。
expect(find.byType(PhotoThumbnail), findsNWidgets(4));
expect(find.byIcon(Icons.broken_image_outlined), findsOneWidget);
// 角标:处理中/失败/隐藏(图标 + 文案,不只靠颜色;文案限定在角标
// 组件内——筛选 chips 有同名标签)。
Finder badgeText(String label) => find.descendant(
of: find.byType(StateBadge),
matching: find.text(label),
);
expect(badgeText('Processing'), findsOneWidget);
expect(badgeText('Processing failed'), findsOneWidget);
expect(badgeText('Hidden'), findsOneWidget);
expect(find.byIcon(Icons.hourglass_top), findsOneWidget);
expect(find.byIcon(Icons.error_outline), findsOneWidget);
expect(find.byIcon(Icons.remove_circle_outline), findsOneWidget);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('scope 自适应:all 403 → own 重试 + 协作者提示', (tester) async {
setSurface(tester, const Size(390, 844));
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
final scope = o.uri.queryParameters['scope'];
if (scope == 'all') return (403, errorBody(ErrorCodes.authForbidden));
if (scope == 'own') {
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-own-1'),
]),
);
}
throw StateError('unexpected scope $scope');
});
await pumpPhotos(tester, clientOf(adapter));
// 两次请求:all(403)→ own(200,服务端过滤自己上传)。
expect(adapter.requests, hasLength(2));
expect(adapter.requests.first.uri.queryParameters['scope'], 'all');
expect(adapter.requests.last.uri.queryParameters['scope'], 'own');
// 协作者范围提示可见。
expect(
find.text('Collaborator view: only photos you uploaded are shown'),
findsOneWidget,
);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('游标加载第二页(携带 cursor)', (tester) async {
setSurface(tester, const Size(390, 844));
final page1 = List<Map<String, dynamic>>.generate(
20,
(i) => adminPhotoJson(
photoId: 'ph-${(i + 1).toString().padLeft(8, '0')}',
visibility: i % 2 == 0 ? 'published' : 'unpublished',
processingState: i % 2 == 0 ? 'ready' : 'processing',
preview: photoPreviewJson(),
),
);
final page2 = <Map<String, dynamic>>[
// 区分度高的 ID:第二页条目渲染后可按标题前缀断言。
adminPhotoJson(photoId: 'page2item'),
adminPhotoJson(photoId: 'ph-page2item', preview: photoPreviewJson()),
];
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
@@ -66,29 +187,143 @@ void main() {
if (cursor == 'pc1') return (200, cursorPageBody(page2));
throw StateError('unexpected cursor $cursor');
});
await pumpPhotos(tester, clientOf(adapter));
// Task 9 占位横幅。
expect(
find.textContaining('the full experience ships in Task 9'),
findsOneWidget,
);
// 标签与条目(ListView 懒构建,只断言在渲染的可见条目)。
expect(find.text('Published'), findsWidgets);
expect(find.text('Unpublished'), findsWidgets);
expect(find.text('Ready'), findsWidgets);
expect(find.text('Processing'), findsWidgets);
expect(find.text('2026/9/18 15:00'), findsWidgets, reason: '相册时区展示');
// 滚动加载第二页。
await tester.drag(find.byType(ListView), const Offset(0, -4000));
await tester.drag(find.byType(GridView), const Offset(0, -4000));
await tester.pumpAndSettle();
expect(
adapter.requests.last.uri.queryParameters['cursor'],
'pc1',
);
// 第二页条目渲染(标题展示 photoId 前 8 位)。
expect(find.textContaining('page2ite'), findsOneWidget);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('筛选 chips:Published 走服务端 visibility 重载', (tester) async {
setSurface(tester, const Size(390, 844));
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-1', preview: photoPreviewJson()),
]),
);
});
await pumpPhotos(tester, clientOf(adapter));
await tester.tap(find.widgetWithText(FilterChip, 'Published'));
await tester.pumpAndSettle();
expect(
adapter.requests.last.uri.queryParameters['visibility'],
'published',
reason: 'Published 筛选下发服务端 visibility 参数',
);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('本地筛选:Processing 只显示未就绪条目(不发新请求)', (tester) async {
setSurface(tester, const Size(390, 844));
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-ready', preview: photoPreviewJson()),
adminPhotoJson(
photoId: 'ph-busy',
processingState: 'processing',
visibility: 'unpublished',
),
]),
);
});
await pumpPhotos(tester, clientOf(adapter));
final requestsBefore = adapter.requests.length;
// 瓦片角标文案与 chip 同名(「Processing」),按组件类型锁定 chip;
// 390 宽下 Processing/Failed 在横向滚动区外,先滚动到位。
final processingChip = find.widgetWithText(FilterChip, 'Processing');
await tester.ensureVisible(processingChip);
await tester.pumpAndSettle();
await tester.tap(processingChip);
await tester.pumpAndSettle();
// 本地过滤:无新请求,仅剩处理中条目(含其角标)。
expect(adapter.requests, hasLength(requestsBefore));
expect(
find.descendant(of: find.byType(StateBadge), matching: find.text('Processing')),
findsOneWidget,
);
expect(find.byType(PhotoThumbnail), findsOneWidget);
// 本地筛选无匹配 → 空筛选态。
final failedChip = find.widgetWithText(FilterChip, 'Failed');
await tester.ensureVisible(failedChip);
await tester.pumpAndSettle();
await tester.tap(failedChip);
await tester.pumpAndSettle();
expect(find.text('No photos match this filter'), findsOneWidget);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('空列表 → 空态;点击瓦片进入大图查看器', (tester) async {
setSurface(tester, const Size(390, 844));
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
return (200, cursorPageBody(<Map<String, dynamic>>[]));
});
await pumpPhotos(tester, clientOf(adapter));
expect(find.text('No photos yet'), findsOneWidget);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('点击瓦片 → 大图查看器(关闭返回网格)', (tester) async {
setSurface(tester, const Size(390, 844));
final adapter = FakeAdapter((o) {
if (o.path != '/v1/albums/alb-1/photos') {
throw StateError('unexpected ${o.method} ${o.path}');
}
return (
200,
cursorPageBody(<Map<String, dynamic>>[
adminPhotoJson(photoId: 'ph-1', preview: photoPreviewJson()),
]),
);
});
await pumpPhotos(tester, clientOf(adapter));
await tester.tap(find.byType(PhotoThumbnail).first);
await tester.pumpAndSettle();
expect(find.byType(AlbumPhotoViewerPage), findsOneWidget);
await tester.tap(find.byIcon(Icons.close));
await tester.pumpAndSettle();
expect(find.byType(AlbumPhotoViewerPage), findsNothing);
expect(find.byType(AlbumPhotosPage), findsOneWidget);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
}
/// 网格列数(GridView delegate 断言用)。
int _columnCount(WidgetTester tester) =>
(tester.widget<GridView>(find.byType(GridView)).gridDelegate
as SliverGridDelegateWithFixedCrossAxisCount)
.crossAxisCount;
+73 -18
View File
@@ -1,8 +1,9 @@
/// 相册列表页签 widget 测试(P3 Task 4;UI-01 Task 3 起覆盖封面卡片样板)。
/// 相册列表页签 widget 测试(P3 Task 4;UI-01 Task 3/4 覆盖封面卡片与
/// 响应式列表)。
///
/// 覆盖:封面卡片样板(封面占位/标题回退/时间场地行/公开与上传徽章/
/// 令牌与四开关移除)、关闭状态徽章、封面加载失败替代图、游标加载更多
/// (第二页携带 cursor)、空态文案、首屏错误 + 重试恢复。
/// 覆盖:封面卡片(封面占位/标题回退/时间场地行/公开与上传徽章/令牌与
/// 四开关移除)、关闭状态徽章、封面加载失败替代图、响应式单/双列、空态
/// CTA、游标加载更多(第二页携带 cursor)、首屏错误 + 重试恢复。
library;
import 'package:dio/dio.dart';
@@ -14,6 +15,7 @@ import 'package:photo_live/core/error_codes.dart';
import 'package:photo_live/features/albums/providers.dart';
import 'package:photo_live/l10n/app_localizations.dart';
import 'package:photo_live/pages/albums_tab.dart';
import 'package:photo_live/pages/album_form_page.dart';
import 'package:photo_live/ui/components/photo_thumbnail.dart';
import '../helpers/fakes.dart';
@@ -45,6 +47,12 @@ void main() {
await tester.pumpAndSettle();
}
/// 固定逻辑宽度(dp=1)。
void setSurface(WidgetTester tester, Size size) {
tester.view.physicalSize = size;
tester.view.devicePixelRatio = 1.0;
}
testWidgets('封面卡片样板:封面占位 + 标题回退 + 时间场地 + 公开/上传徽章', (tester) async {
final adapter = FakeAdapter(
(o) => o.path == '/v1/albums'
@@ -101,6 +109,67 @@ void main() {
expect(find.byIcon(Icons.image_outlined), findsNothing);
});
testWidgets('响应式列数:390 宽单列 / 900 宽双列', (tester) async {
final adapter = FakeAdapter(
(o) => o.path == '/v1/albums'
? (
200,
cursorPageBody([
albumJson(id: 'alb-1'),
albumJson(id: 'alb-2'),
]),
)
: throw StateError('unexpected ${o.path}'),
);
final client = clientOf(adapter);
// 手机宽度(390):单列,两卡片同宽同行不可见。
setSurface(tester, const Size(390, 844));
await pumpTab(tester, client);
final card1 = tester.getRect(find.byType(PhotoThumbnail).first);
final card2 = tester.getRect(find.byType(PhotoThumbnail).last);
expect(card1.width, closeTo(390 - 32, 0.5), reason: '单列占满(左右 16)');
expect(
card1.right == card2.right && card1.left == card2.left,
isTrue,
reason: '两卡片同列(垂直排布)',
);
// 平板宽度(900):双列并排。
setSurface(tester, const Size(900, 1200));
await pumpTab(tester, client);
final wide1 = tester.getRect(find.byType(PhotoThumbnail).first);
final wide2 = tester.getRect(find.byType(PhotoThumbnail).last);
expect(wide1.width, closeTo((900 - 32 - 12) / 2, 0.5), reason: '双列均分');
expect(
wide2.left > wide1.right,
isTrue,
reason: '第二张在第一张右侧(双列)',
);
tester.view.resetPhysicalSize();
tester.view.resetDevicePixelRatio();
});
testWidgets('空列表 → 空态文案 + 「新建相册」CTA 进入表单', (tester) async {
final adapter = FakeAdapter(
(o) => o.path == '/v1/albums'
? (200, cursorPageBody(<Map<String, dynamic>>[]))
: throw StateError('unexpected ${o.path}'),
);
await pumpTab(tester, clientOf(adapter));
expect(
find.text('No albums yet. Tap "Create album" to get started'),
findsOneWidget,
);
// 空态 CTA(次强调按钮)→ 创建表单。
expect(find.byType(AlbumFormPage), findsNothing);
await tester.tap(find.widgetWithText(FilledButton, 'Create album'));
await tester.pumpAndSettle();
expect(find.byType(AlbumFormPage), findsOneWidget);
});
testWidgets('滚动接近底部 → 游标加载第二页(携带 cursor)', (tester) async {
final page1 = List<Map<String, dynamic>>.generate(
20,
@@ -146,20 +215,6 @@ void main() {
);
});
testWidgets('空列表 → 空态文案', (tester) async {
final adapter = FakeAdapter(
(o) => o.path == '/v1/albums'
? (200, cursorPageBody(<Map<String, dynamic>>[]))
: throw StateError('unexpected ${o.path}'),
);
await pumpTab(tester, clientOf(adapter));
expect(
find.text('No albums yet. Tap "Create album" to get started'),
findsOneWidget,
);
});
testWidgets('首屏错误 → 错误视图,重试后恢复', (tester) async {
var failFirst = true;
final adapter = FakeAdapter((o) {