결재 단계 목록 화면과 테스트 도입
This commit is contained in:
@@ -1,12 +1,17 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:get_it/get_it.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:lucide_icons_flutter/lucide_icons.dart' as lucide;
|
||||
import 'package:shadcn_ui/shadcn_ui.dart';
|
||||
|
||||
import '../../../../../core/config/environment.dart';
|
||||
import '../../../../../core/constants/app_sections.dart';
|
||||
import '../../../../../widgets/app_layout.dart';
|
||||
import '../../../../../widgets/components/coming_soon_card.dart';
|
||||
import '../../../../../widgets/components/filter_bar.dart';
|
||||
import '../../../../../widgets/spec_page.dart';
|
||||
import '../controllers/approval_step_controller.dart';
|
||||
import '../../domain/entities/approval_step_record.dart';
|
||||
import '../../domain/repositories/approval_step_repository.dart';
|
||||
|
||||
class ApprovalStepPage extends StatelessWidget {
|
||||
const ApprovalStepPage({super.key});
|
||||
@@ -65,28 +70,441 @@ class ApprovalStepPage extends StatelessWidget {
|
||||
);
|
||||
}
|
||||
|
||||
return AppLayout(
|
||||
title: '결재 단계 관리',
|
||||
subtitle: '결재 순서를 정의하고 승인자를 배정할 수 있도록 준비 중입니다.',
|
||||
breadcrumbs: const [
|
||||
AppBreadcrumbItem(label: '대시보드', path: dashboardRoutePath),
|
||||
AppBreadcrumbItem(label: '결재', path: '/approvals/steps'),
|
||||
AppBreadcrumbItem(label: '결재 단계'),
|
||||
],
|
||||
actions: [
|
||||
ShadButton(
|
||||
onPressed: null,
|
||||
leading: const Icon(LucideIcons.plus, size: 16),
|
||||
child: const Text('단계 추가'),
|
||||
),
|
||||
],
|
||||
toolbar: FilterBar(
|
||||
children: const [Text('필터 구성은 결재 단계 API 확정 후 제공될 예정입니다.')],
|
||||
),
|
||||
child: const ComingSoonCard(
|
||||
title: '결재 단계 화면 구현 준비 중',
|
||||
description: '결재 단계 CRUD와 템플릿 연동 요구사항을 정리하는 중입니다.',
|
||||
items: ['결재 요청별 단계 조회 및 정렬', '승인자 지정과 단계 상태 변경', '템플릿에서 단계 일괄 불러오기'],
|
||||
return const _ApprovalStepEnabledPage();
|
||||
}
|
||||
}
|
||||
|
||||
class _ApprovalStepEnabledPage extends StatefulWidget {
|
||||
const _ApprovalStepEnabledPage();
|
||||
|
||||
@override
|
||||
State<_ApprovalStepEnabledPage> createState() =>
|
||||
_ApprovalStepEnabledPageState();
|
||||
}
|
||||
|
||||
class _ApprovalStepEnabledPageState extends State<_ApprovalStepEnabledPage> {
|
||||
late final ApprovalStepController _controller;
|
||||
final TextEditingController _searchController = TextEditingController();
|
||||
final FocusNode _searchFocus = FocusNode();
|
||||
final DateFormat _dateFormat = DateFormat('yyyy-MM-dd HH:mm');
|
||||
String? _lastError;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_controller = ApprovalStepController(
|
||||
repository: GetIt.I<ApprovalStepRepository>(),
|
||||
)..addListener(_handleControllerUpdate);
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) async {
|
||||
await _controller.fetch();
|
||||
});
|
||||
}
|
||||
|
||||
void _handleControllerUpdate() {
|
||||
final error = _controller.errorMessage;
|
||||
if (error != null && error != _lastError && mounted) {
|
||||
_lastError = error;
|
||||
ScaffoldMessenger.of(
|
||||
context,
|
||||
).showSnackBar(SnackBar(content: Text(error)));
|
||||
_controller.clearError();
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_controller.removeListener(_handleControllerUpdate);
|
||||
_controller.dispose();
|
||||
_searchController.dispose();
|
||||
_searchFocus.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = ShadTheme.of(context);
|
||||
|
||||
return AnimatedBuilder(
|
||||
animation: _controller,
|
||||
builder: (context, _) {
|
||||
final result = _controller.result;
|
||||
final records = result?.items ?? const <ApprovalStepRecord>[];
|
||||
final totalCount = result?.total ?? 0;
|
||||
final currentPage = result?.page ?? 1;
|
||||
final pageSize = result?.pageSize ?? records.length;
|
||||
final totalPages = pageSize == 0
|
||||
? 1
|
||||
: (totalCount / pageSize).ceil().clamp(1, 9999);
|
||||
final hasNext = result == null
|
||||
? false
|
||||
: (result.page * result.pageSize) < result.total;
|
||||
final statusOptions = _buildStatusOptions(records);
|
||||
final selectedStatus = _controller.statusId ?? -1;
|
||||
|
||||
return AppLayout(
|
||||
title: '결재 단계 관리',
|
||||
subtitle: '결재 요청별 단계 현황을 조회하고 상세 정보를 확인합니다.',
|
||||
breadcrumbs: const [
|
||||
AppBreadcrumbItem(label: '대시보드', path: dashboardRoutePath),
|
||||
AppBreadcrumbItem(label: '결재', path: '/approvals/steps'),
|
||||
AppBreadcrumbItem(label: '결재 단계'),
|
||||
],
|
||||
actions: [
|
||||
Tooltip(
|
||||
message: '결재 단계 생성은 정책 정리 후 제공됩니다.',
|
||||
child: ShadButton(
|
||||
onPressed: null,
|
||||
leading: const Icon(lucide.LucideIcons.plus, size: 16),
|
||||
child: const Text('단계 추가'),
|
||||
),
|
||||
),
|
||||
],
|
||||
toolbar: FilterBar(
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 260,
|
||||
child: ShadInput(
|
||||
controller: _searchController,
|
||||
focusNode: _searchFocus,
|
||||
placeholder: const Text('결재번호, 승인자 검색'),
|
||||
leading: const Icon(lucide.LucideIcons.search, size: 16),
|
||||
onSubmitted: (_) => _applyFilters(),
|
||||
),
|
||||
),
|
||||
if (statusOptions.length > 1)
|
||||
SizedBox(
|
||||
width: 200,
|
||||
child: ShadSelect<int>(
|
||||
key: ValueKey(selectedStatus),
|
||||
initialValue: selectedStatus,
|
||||
onChanged: (value) {
|
||||
_controller.updateStatusId(value == -1 ? null : value);
|
||||
},
|
||||
selectedOptionBuilder: (context, value) {
|
||||
final option = statusOptions.firstWhere(
|
||||
(element) => element.id == value,
|
||||
orElse: () => _StatusOption(id: -1, name: '전체'),
|
||||
);
|
||||
return Text(option.name);
|
||||
},
|
||||
options: statusOptions
|
||||
.map(
|
||||
(opt) => ShadOption<int>(
|
||||
value: opt.id,
|
||||
child: Text(opt.name),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
),
|
||||
),
|
||||
ShadButton.outline(
|
||||
onPressed: _controller.isLoading ? null : _applyFilters,
|
||||
child: const Text('검색 적용'),
|
||||
),
|
||||
ShadButton.ghost(
|
||||
onPressed:
|
||||
!_controller.isLoading && _controller.hasActiveFilters
|
||||
? _resetFilters
|
||||
: null,
|
||||
child: const Text('필터 초기화'),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: ShadCard(
|
||||
child: _controller.isLoading
|
||||
? const Padding(
|
||||
padding: EdgeInsets.all(48),
|
||||
child: Center(child: CircularProgressIndicator()),
|
||||
)
|
||||
: records.isEmpty
|
||||
? Padding(
|
||||
padding: const EdgeInsets.all(32),
|
||||
child: Text(
|
||||
'조회된 결재 단계가 없습니다.',
|
||||
style: theme.textTheme.muted,
|
||||
),
|
||||
)
|
||||
: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
SizedBox(
|
||||
height: 480,
|
||||
child: ShadTable.list(
|
||||
header:
|
||||
[
|
||||
'ID',
|
||||
'결재번호',
|
||||
'단계순서',
|
||||
'승인자',
|
||||
'상태',
|
||||
'배정일시',
|
||||
'결정일시',
|
||||
'동작',
|
||||
]
|
||||
.map(
|
||||
(label) => ShadTableCell.header(
|
||||
child: Text(label),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
columnSpanExtent: (index) {
|
||||
switch (index) {
|
||||
case 1:
|
||||
return const FixedTableSpanExtent(160);
|
||||
case 2:
|
||||
return const FixedTableSpanExtent(100);
|
||||
case 3:
|
||||
return const FixedTableSpanExtent(150);
|
||||
case 4:
|
||||
return const FixedTableSpanExtent(120);
|
||||
case 5:
|
||||
case 6:
|
||||
return const FixedTableSpanExtent(160);
|
||||
case 7:
|
||||
return const FixedTableSpanExtent(110);
|
||||
default:
|
||||
return const FixedTableSpanExtent(90);
|
||||
}
|
||||
},
|
||||
children: records.map((record) {
|
||||
final step = record.step;
|
||||
return [
|
||||
ShadTableCell(
|
||||
child: Text(step.id?.toString() ?? '-'),
|
||||
),
|
||||
ShadTableCell(child: Text(record.approvalNo)),
|
||||
ShadTableCell(child: Text('${step.stepOrder}')),
|
||||
ShadTableCell(child: Text(step.approver.name)),
|
||||
ShadTableCell(
|
||||
child: ShadBadge(child: Text(step.status.name)),
|
||||
),
|
||||
ShadTableCell(
|
||||
child: Text(_formatDate(step.assignedAt)),
|
||||
),
|
||||
ShadTableCell(
|
||||
child: Text(
|
||||
step.decidedAt == null
|
||||
? '-'
|
||||
: _formatDate(step.decidedAt!),
|
||||
),
|
||||
),
|
||||
ShadTableCell(
|
||||
child: Align(
|
||||
alignment: Alignment.centerRight,
|
||||
child: ShadButton.outline(
|
||||
size: ShadButtonSize.sm,
|
||||
onPressed: step.id == null
|
||||
? null
|
||||
: () => _openDetail(record),
|
||||
child: const Text('상세'),
|
||||
),
|
||||
),
|
||||
),
|
||||
];
|
||||
}).toList(),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text('총 $totalCount건', style: theme.textTheme.small),
|
||||
Row(
|
||||
children: [
|
||||
ShadButton.outline(
|
||||
size: ShadButtonSize.sm,
|
||||
onPressed:
|
||||
_controller.isLoading || currentPage <= 1
|
||||
? null
|
||||
: () => _controller.fetch(
|
||||
page: currentPage - 1,
|
||||
),
|
||||
child: const Text('이전'),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
ShadButton.outline(
|
||||
size: ShadButtonSize.sm,
|
||||
onPressed: _controller.isLoading || !hasNext
|
||||
? null
|
||||
: () => _controller.fetch(
|
||||
page: currentPage + 1,
|
||||
),
|
||||
child: const Text('다음'),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
'페이지 $currentPage / $totalPages',
|
||||
style: theme.textTheme.small,
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
List<_StatusOption> _buildStatusOptions(List<ApprovalStepRecord> records) {
|
||||
final options = <_StatusOption>{};
|
||||
options.add(const _StatusOption(id: -1, name: '전체'));
|
||||
for (final record in records) {
|
||||
final status = record.step.status;
|
||||
if (status.id != null) {
|
||||
options.add(_StatusOption(id: status.id!, name: status.name));
|
||||
}
|
||||
}
|
||||
return options.toList()..sort((a, b) => a.id.compareTo(b.id));
|
||||
}
|
||||
|
||||
Future<void> _applyFilters() async {
|
||||
_controller.updateQuery(_searchController.text.trim());
|
||||
await _controller.fetch(page: 1);
|
||||
}
|
||||
|
||||
Future<void> _resetFilters() async {
|
||||
_searchController.clear();
|
||||
_controller.resetFilters();
|
||||
await _controller.fetch(page: 1);
|
||||
_searchFocus.requestFocus();
|
||||
}
|
||||
|
||||
Future<void> _openDetail(ApprovalStepRecord record) async {
|
||||
final stepId = record.step.id;
|
||||
if (stepId == null) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(content: Text('단계 식별자가 없어 상세 정보를 볼 수 없습니다.')),
|
||||
);
|
||||
return;
|
||||
}
|
||||
showDialog<void>(
|
||||
context: context,
|
||||
barrierDismissible: false,
|
||||
builder: (_) => const Center(child: CircularProgressIndicator()),
|
||||
);
|
||||
final detail = await _controller.fetchDetail(stepId);
|
||||
if (!mounted) return;
|
||||
Navigator.of(context, rootNavigator: true).pop();
|
||||
if (detail == null) return;
|
||||
await showDialog<void>(
|
||||
context: context,
|
||||
builder: (dialogContext) {
|
||||
final step = detail.step;
|
||||
final theme = ShadTheme.of(dialogContext);
|
||||
return Dialog(
|
||||
insetPadding: const EdgeInsets.all(24),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: ShadCard(
|
||||
title: Text('결재 단계 상세', style: theme.textTheme.h3),
|
||||
description: Text(
|
||||
'결재번호 ${detail.approvalNo}',
|
||||
style: theme.textTheme.muted,
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_DetailRow(label: '단계 순서', value: '${step.stepOrder}'),
|
||||
_DetailRow(label: '승인자', value: step.approver.name),
|
||||
_DetailRow(label: '상태', value: step.status.name),
|
||||
_DetailRow(
|
||||
label: '배정일시',
|
||||
value: _formatDate(step.assignedAt),
|
||||
),
|
||||
_DetailRow(
|
||||
label: '결정일시',
|
||||
value: step.decidedAt == null
|
||||
? '-'
|
||||
: _formatDate(step.decidedAt!),
|
||||
),
|
||||
_DetailRow(label: '템플릿', value: detail.templateName ?? '-'),
|
||||
_DetailRow(
|
||||
label: '트랜잭션번호',
|
||||
value: detail.transactionNo ?? '-',
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
'비고',
|
||||
style: theme.textTheme.small.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
ShadTextarea(
|
||||
initialValue: step.note ?? '',
|
||||
readOnly: true,
|
||||
minHeight: 80,
|
||||
maxHeight: 200,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
footer: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.end,
|
||||
children: [
|
||||
ShadButton.ghost(
|
||||
onPressed: () => Navigator.of(dialogContext).pop(),
|
||||
child: const Text('닫기'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
String _formatDate(DateTime date) {
|
||||
return _dateFormat.format(date.toLocal());
|
||||
}
|
||||
}
|
||||
|
||||
class _StatusOption {
|
||||
const _StatusOption({required this.id, required this.name});
|
||||
|
||||
final int id;
|
||||
final String name;
|
||||
|
||||
@override
|
||||
bool operator ==(Object other) {
|
||||
return other is _StatusOption && other.id == id;
|
||||
}
|
||||
|
||||
@override
|
||||
int get hashCode => id.hashCode;
|
||||
}
|
||||
|
||||
class _DetailRow extends StatelessWidget {
|
||||
const _DetailRow({required this.label, required this.value});
|
||||
|
||||
final String label;
|
||||
final String value;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = ShadTheme.of(context);
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(vertical: 4),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 120,
|
||||
child: Text(
|
||||
label,
|
||||
style: theme.textTheme.small.copyWith(
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
),
|
||||
),
|
||||
Expanded(child: Text(value, style: theme.textTheme.small)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user