julian/superport_v2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

재고 상세 다이얼로그화 및 마스터 레이아웃 개선

Browse Source
This commit is contained in:
JiWoong Sul
2025-10-22 18:52:21 +09:00
parent a14133df52
commit 09c31b2503
20 changed files with 1187 additions and 923 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
lib/widgets/components/filter_bar.dart
View File

@@ -1,6 +1,8 @@
import 'package:flutter/material.dart';
import 'package:shadcn_ui/shadcn_ui.dart';
import 'responsive_section.dart';
/// 검색/필터 영역을 위한 공통 래퍼.
class FilterBar extends StatelessWidget {
const FilterBar({
@@ -38,31 +40,31 @@ class FilterBar extends StatelessWidget {
if (hasHeading)
Padding(
padding: const EdgeInsets.only(bottom: 20),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
if (leading != null) ...[
leading!,
const SizedBox(width: 12),
],
if (title != null && title!.isNotEmpty)
Text(title!, style: theme.textTheme.h3),
],
),
),
if (computedActions.isNotEmpty)
Wrap(
spacing: 8,
runSpacing: 8,
alignment: WrapAlignment.end,
children: computedActions,
),
],
child: ResponsiveStackedRow(
breakpoint: 560,
gap: 12,
leading: Row(
mainAxisSize: MainAxisSize.min,
children: [
if (leading != null) ...[
leading!,
const SizedBox(width: 12),
],
if (title != null && title!.isNotEmpty)
Flexible(child: Text(title!, style: theme.textTheme.h3)),
],
),
trailing: computedActions.isEmpty
? const SizedBox.shrink()
: Align(
alignment: Alignment.centerRight,
child: Wrap(
spacing: 8,
runSpacing: 8,
alignment: WrapAlignment.end,
children: computedActions,
),
),
),
),
Wrap(spacing: spacing, runSpacing: runSpacing, children: children),

63
lib/widgets/components/page_header.dart
View File

@@ -1,6 +1,8 @@
import 'package:flutter/material.dart';
import 'package:shadcn_ui/shadcn_ui.dart';
import 'responsive_section.dart';
/// 페이지 상단 타이틀/설명/액션을 일관되게 출력하는 헤더.
class PageHeader extends StatelessWidget {
const PageHeader({
@@ -22,27 +24,52 @@ class PageHeader extends StatelessWidget {
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (leading != null) ...[leading!, const SizedBox(width: 16)],
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(title, style: theme.textTheme.h2),
if (subtitle != null) ...[
const SizedBox(height: 6),
Text(subtitle!, style: theme.textTheme.muted),
final actionWidgets = actions ?? const <Widget>[];
final trailingSection = (actionWidgets.isEmpty && trailing == null)
? const SizedBox.shrink()
: Align(
alignment: Alignment.centerRight,
child: Column(
crossAxisAlignment: CrossAxisAlignment.end,
mainAxisSize: MainAxisSize.min,
children: [
if (actionWidgets.isNotEmpty)
Wrap(
spacing: 12,
runSpacing: 12,
alignment: WrapAlignment.end,
children: actionWidgets,
),
if (actionWidgets.isNotEmpty && trailing != null)
const SizedBox(height: 12),
if (trailing != null) trailing!,
],
],
),
);
return ResponsiveStackedRow(
breakpoint: 640,
gap: 12,
leading: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
if (leading != null) ...[leading!, const SizedBox(width: 16)],
Flexible(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(title, style: theme.textTheme.h2),
if (subtitle != null) ...[
const SizedBox(height: 6),
Text(subtitle!, style: theme.textTheme.muted),
],
],
),
),
),
if (actions != null && actions!.isNotEmpty) ...[
Wrap(spacing: 12, runSpacing: 12, children: actions!),
],
if (trailing != null) ...[const SizedBox(width: 16), trailing!],
],
),
trailing: trailingSection,
);
}
}

54
lib/widgets/components/responsive_section.dart Normal file
View File

@@ -0,0 +1,54 @@
import 'package:flutter/widgets.dart';
/// 카드 헤더/푸터 등에서 좌우 영역을 유연하게 배치하는 보조 위젯.
///
/// - 가용 폭이 [breakpoint] 미만이면 세로로 쌓아 overflow를 방지한다.
/// - 넉넉한 폭에서는 기본적으로 좌측은 확장, 우측은 필요한 만큼만 차지한다.
class ResponsiveStackedRow extends StatelessWidget {
const ResponsiveStackedRow({
super.key,
required this.leading,
required this.trailing,
this.breakpoint = 480,
this.gap = 12,
});
/// 좌측에 위치할 위젯.
final Widget leading;
/// 우측(또는 세로 스택 시 아래)에 배치할 위젯.
final Widget trailing;
/// 세로 스택 전환 기준 폭.
final double breakpoint;
/// 스택 전환 시 세로 간격.
final double gap;
@override
Widget build(BuildContext context) {
return LayoutBuilder(
builder: (context, constraints) {
final isCompact = constraints.maxWidth < breakpoint;
if (isCompact) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
leading,
SizedBox(height: gap),
trailing,
],
);
}
return Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(child: leading),
const SizedBox(width: 16),
Flexible(child: trailing),
],
);
},
);
}
}