feat(client): 出入库列表按原型重建（KPI/详情抽屉/详细搜索/工具栏/选中复制/窗口尺寸）

- 列表重建：KPI 卡、状态+时间列、操作改眼睛开右侧详情抽屉、重置右置 - 详情抽屉(order_detail_drawer) 100% 还原原型 + SelectionArea 可选中复制 - 详细搜索弹窗：ComboSearchField/滚轮日期、字段重构、白底盒子按钮 - 工具栏：搜索框×清除+占位精简、供应商/客户下拉取全部、状态菜单收窄 - 加载不白屏(半透明遮罩)、输入框与下拉等高、windows/macOS 默认窗口尺寸调大 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-02 08:48:01 +08:00
parent 998bbab546
commit a3a722689e
42 changed files with 3689 additions and 1961 deletions
@@ -0,0 +1,33 @@
+/// 出/入库 KPI 汇总（本月 + 上月同期供环比 + 待审核）。
+/// 对应后端 `GET /stock-in/summary`、`/stock-out/summary`。
+class StockSummary {
+  final int monthCount;
+  final double monthAmount;
+  final int pendingCount;
+  final int lastMonthCount;
+  final double lastMonthAmount;
+
+  const StockSummary({
+    this.monthCount = 0,
+    this.monthAmount = 0,
+    this.pendingCount = 0,
+    this.lastMonthCount = 0,
+    this.lastMonthAmount = 0,
+  });
+
+  factory StockSummary.fromJson(Map<String, dynamic> j) => StockSummary(
+        monthCount: (j['month_count'] as num?)?.toInt() ?? 0,
+        monthAmount: (j['month_amount'] as num?)?.toDouble() ?? 0,
+        pendingCount: (j['pending_count'] as num?)?.toInt() ?? 0,
+        lastMonthCount: (j['last_month_count'] as num?)?.toInt() ?? 0,
+        lastMonthAmount: (j['last_month_amount'] as num?)?.toDouble() ?? 0,
+      );
+
+  /// 笔数环比（%）；上月为 0 时返回 null（无从比较）。
+  double? get countDeltaPct =>
+      lastMonthCount == 0 ? null : (monthCount - lastMonthCount) / lastMonthCount * 100;
+
+  /// 金额环比（%）；上月为 0 时返回 null。
+  double? get amountDeltaPct =>
+      lastMonthAmount == 0 ? null : (monthAmount - lastMonthAmount) / lastMonthAmount * 100;
+}
@@ -23,14 +23,23 @@ final customerListProvider =
  () => PartnerListNotifier(type: 'customer'),
 );

+/// 工具栏/详细搜索的往来单位下拉专用：不分 supplier/customer、一次取全部。
+/// 说明：历史 partner 的 type 多为默认 'supplier'（customer 常为空），
+/// 按 type 过滤会漏项甚至空列表；下拉按「全部往来单位」呈现最稳。
+final allPartnersProvider =
+    AsyncNotifierProvider<PartnerListNotifier, PageResult<Partner>>(
+  () => PartnerListNotifier(type: null, pageSize: 1000),
+);
+
 class PartnerListNotifier extends AsyncNotifier<PageResult<Partner>> {
  final String? type;
  int _page = 1;
-  int _pageSize = AppConstants.defaultPageSize;
+  int _pageSize;
  String _keyword = '';
  PageResult<Partner>? _cache;

-  PartnerListNotifier({this.type});
+  PartnerListNotifier({this.type, int pageSize = AppConstants.defaultPageSize})
+      : _pageSize = pageSize;

  @override
  Future<PageResult<Partner>> build() async {
@@ -6,6 +6,7 @@ import '../core/auth/auth_state.dart';
 import '../core/config/app_constants.dart';
 import '../core/models/page_result.dart';
 import '../models/stock_in.dart';
+import '../models/stock_summary.dart';
 import '../repositories/stock_in_repository.dart';
 import 'connectivity_provider.dart';
 import 'inventory_provider.dart';
@@ -19,6 +20,13 @@ final stockInListProvider =
  StockInListNotifier.new,
 );

+/// 入库 KPI 汇总（换店/网络恢复自动刷新）。
+final stockInSummaryProvider = FutureProvider.autoDispose<StockSummary>((ref) {
+  ref.watch(authStateProvider.select((s) => s.user?.shopId));
+  ref.watch(networkRecoveryCountProvider);
+  return ref.read(stockInRepositoryProvider).summary();
+});
+
 class StockInListNotifier extends AsyncNotifier<PageResult<StockInOrder>> {
  int _page = 1;
  int _pageSize = AppConstants.defaultPageSize;
@@ -26,6 +34,7 @@ class StockInListNotifier extends AsyncNotifier<PageResult<StockInOrder>> {
  String? _startDate;
  String? _endDate;
  String _keyword = '';
+  Map<String, String> _detail = const {};
  PageResult<StockInOrder>? _cache;
  Timer? _searchDebounce;

@@ -50,11 +59,21 @@ class StockInListNotifier extends AsyncNotifier<PageResult<StockInOrder>> {
          startDate: _startDate,
          endDate: _endDate,
          keyword: _keyword.isEmpty ? null : _keyword,
+          detail: _detail.isEmpty ? null : _detail,
          page: _page,
          pageSize: _pageSize,
        );
  }

+  Map<String, String> get currentDetail => _detail;
+
+  /// 详细搜索多字段（order_no/partner_id/series/spec/category_id/... → 后端组合 AND）。
+  void setDetail(Map<String, String> detail) {
+    _detail = detail;
+    _page = 1;
+    reload();
+  }
+
  void setPage(int page) {
    _page = page;
    reload();
@@ -98,7 +117,9 @@ class StockInListNotifier extends AsyncNotifier<PageResult<StockInOrder>> {
  }

  void reload() {
-    state = const AsyncValue.loading();
+    // 保留上一次数据（isReloading）→ 屏幕可继续渲染旧内容 + 叠加半透明进度，不白屏。
+    state = const AsyncValue<PageResult<StockInOrder>>.loading()
+        .copyWithPrevious(state);
    _fetch().then((result) {
      _cache = result;
      state = AsyncValue.data(result);
@@ -6,6 +6,7 @@ import '../core/auth/auth_state.dart';
 import '../core/config/app_constants.dart';
 import '../core/models/page_result.dart';
 import '../models/stock_out.dart';
+import '../models/stock_summary.dart';
 import '../repositories/stock_out_repository.dart';
 import 'connectivity_provider.dart';
 import 'inventory_provider.dart';
@@ -19,6 +20,13 @@ final stockOutListProvider =
  StockOutListNotifier.new,
 );

+/// 出库 KPI 汇总（换店/网络恢复自动刷新）。
+final stockOutSummaryProvider = FutureProvider.autoDispose<StockSummary>((ref) {
+  ref.watch(authStateProvider.select((s) => s.user?.shopId));
+  ref.watch(networkRecoveryCountProvider);
+  return ref.read(stockOutRepositoryProvider).summary();
+});
+
 class StockOutListNotifier extends AsyncNotifier<PageResult<StockOutOrder>> {
  int _page = 1;
  int _pageSize = AppConstants.defaultPageSize;
@@ -27,6 +35,7 @@ class StockOutListNotifier extends AsyncNotifier<PageResult<StockOutOrder>> {
  String? _endDate;
  String _keyword = '';
  String _productCode = '';
+  Map<String, String> _detail = const {};
  PageResult<StockOutOrder>? _cache;
  Timer? _searchDebounce;

@@ -52,6 +61,7 @@ class StockOutListNotifier extends AsyncNotifier<PageResult<StockOutOrder>> {
          endDate: _endDate,
          keyword: _keyword.isEmpty ? null : _keyword,
          productCode: _productCode.isEmpty ? null : _productCode,
+          detail: _detail.isEmpty ? null : _detail,
          page: _page,
          pageSize: _pageSize,
        );
@@ -106,8 +116,19 @@ class StockOutListNotifier extends AsyncNotifier<PageResult<StockOutOrder>> {
    reload();
  }

+  Map<String, String> get currentDetail => _detail;
+
+  /// 详细搜索多字段（order_no/partner_id/series/spec/category_id/... → 后端组合 AND）。
+  void setDetail(Map<String, String> detail) {
+    _detail = detail;
+    _page = 1;
+    reload();
+  }
+
  void reload() {
-    state = const AsyncValue.loading();
+    // 保留上一次数据（isReloading）→ 屏幕可继续渲染旧内容 + 叠加半透明进度，不白屏。
+    state = const AsyncValue<PageResult<StockOutOrder>>.loading()
+        .copyWithPrevious(state);
    _fetch().then((result) {
      _cache = result;
      state = AsyncValue.data(result);
@@ -156,4 +177,10 @@ class StockOutListNotifier extends AsyncNotifier<PageResult<StockOutOrder>> {
    reload();
    ref.invalidate(inventoryListProvider);
  }
+
+  /// 确认售价（先出后定价）：items 为 [{item_id, sale_price}]。
+  Future<void> confirmSale(int id, List<Map<String, dynamic>> items) async {
+    await ref.read(stockOutRepositoryProvider).confirmSale(id, items);
+    reload();
+  }
 }
@@ -3,6 +3,7 @@ import '../core/api/api_client.dart';
 import '../core/exceptions.dart';
 import '../core/models/page_result.dart';
 import '../models/stock_in.dart';
+import '../models/stock_summary.dart';

 class StockInRepository {
  final ApiClient _client;
@@ -14,6 +15,7 @@ class StockInRepository {
    String? startDate,
    String? endDate,
    String? keyword,
+    Map<String, String>? detail,
    int page = 1,
    int pageSize = 20,
  }) async {
@@ -25,6 +27,7 @@ class StockInRepository {
        if (startDate != null) 'start_date': startDate,
        if (endDate != null) 'end_date': endDate,
        if (keyword != null && keyword.isNotEmpty) 'keyword': keyword,
+        if (detail != null) ...detail, // 详细搜索多字段
      };
      final resp = await _client.get('/stock-in/orders', params: params);
      return PageResult.fromJson(
@@ -39,6 +42,19 @@ class StockInRepository {
    }
  }

+  /// 入库 KPI 汇总（本月笔数/金额 + 上月同期 + 待审核）。
+  Future<StockSummary> summary() async {
+    try {
+      final resp = await _client.get('/stock-in/summary');
+      return StockSummary.fromJson(resp.data as Map<String, dynamic>);
+    } on DioException catch (e) {
+      throw AppException(
+        e.response?.data?['error'] as String? ?? '获取入库汇总失败',
+        statusCode: e.response?.statusCode,
+      );
+    }
+  }
+
  Future<StockInOrder> get(int id) async {
    try {
      final resp = await _client.get('/stock-in/orders/$id');
@@ -3,6 +3,7 @@ import '../core/api/api_client.dart';
 import '../core/exceptions.dart';
 import '../core/models/page_result.dart';
 import '../models/stock_out.dart';
+import '../models/stock_summary.dart';

 class StockOutRepository {
  final ApiClient _client;
@@ -15,6 +16,7 @@ class StockOutRepository {
    String? endDate,
    String? keyword,
    String? productCode,
+    Map<String, String>? detail,
    int page = 1,
    int pageSize = 20,
  }) async {
@@ -28,6 +30,7 @@ class StockOutRepository {
        if (keyword != null && keyword.isNotEmpty) 'keyword': keyword,
        if (productCode != null && productCode.isNotEmpty)
          'product_code': productCode,
+        if (detail != null) ...detail, // 详细搜索多字段
      };
      final resp = await _client.get('/stock-out/orders', params: params);
      return PageResult.fromJson(
@@ -42,6 +45,32 @@ class StockOutRepository {
    }
  }

+  /// 出库 KPI 汇总（本月笔数/金额 + 上月同期 + 待审核）。
+  Future<StockSummary> summary() async {
+    try {
+      final resp = await _client.get('/stock-out/summary');
+      return StockSummary.fromJson(resp.data as Map<String, dynamic>);
+    } on DioException catch (e) {
+      throw AppException(
+        e.response?.data?['error'] as String? ?? '获取出库汇总失败',
+        statusCode: e.response?.statusCode,
+      );
+    }
+  }
+
+  /// 确认售价（先出后定价）：items 为 [{item_id, sale_price}]。
+  Future<void> confirmSale(int id, List<Map<String, dynamic>> items) async {
+    try {
+      await _client.post('/stock-out/orders/$id/confirm-sale',
+          data: {'items': items});
+    } on DioException catch (e) {
+      throw AppException(
+        e.response?.data?['error'] as String? ?? '确认售价失败',
+        statusCode: e.response?.statusCode,
+      );
+    }
+  }
+
  Future<StockOutOrder> get(int id) async {
    try {
      final resp = await _client.get('/stock-out/orders/$id');
@@ -0,0 +1,290 @@
+import 'package:flutter/material.dart';
+
+import '../core/theme/context_tokens.dart';
+import '../core/theme/app_dims.g.dart';
+import 'searchable_option_field.dart' show OptionItem;
+
+/// 搜索下拉框（对齐原型 .combo + .combo-pop）：
+/// 触发器（带框 input 样式 + caret/清除）+ 锚定在下方的弹层
+/// （顶部搜索框 + 名称/编码两列 + 选中蓝勾 + 底部「共 N 条结果」）。
+///
+/// 与 SearchableOptionField（居中 AlertDialog）不同——这是**锚定弹层**，
+/// 用于列表工具栏「供应商/客户」等就地筛选。
+class ComboSearchField extends StatefulWidget {
+  final List<OptionItem> options;
+  final int? selectedId;
+  final String hint;
+  final ValueChanged<int?> onChanged;
+  /// 固定宽度；传 null 则填满父约束（用于弹窗内 Expanded 布局）。
+  final double? width;
+  /// 触发器高度（工具栏 34，表单/弹窗 38，对齐原型 .combo）。
+  final double height;
+  /// 触发器填充色；null=透明（工具栏用，透出底色）。弹窗内传 surface 保持不透明一致。
+  final Color? fillColor;
+
+  const ComboSearchField({
+    super.key,
+    required this.options,
+    required this.selectedId,
+    required this.hint,
+    required this.onChanged,
+    this.width,
+    this.height = 34,
+    this.fillColor,
+  });
+
+  @override
+  State<ComboSearchField> createState() => _ComboSearchFieldState();
+}
+
+class _ComboSearchFieldState extends State<ComboSearchField> {
+  final _link = LayerLink();
+  OverlayEntry? _entry;
+
+  OptionItem? get _selected {
+    for (final o in widget.options) {
+      if (o.id == widget.selectedId) return o;
+    }
+    return null;
+  }
+
+  @override
+  void dispose() {
+    _remove();
+    super.dispose();
+  }
+
+  void _remove() {
+    _entry?.remove();
+    _entry = null;
+  }
+
+  void _open() {
+    if (_entry != null) return;
+    _entry = OverlayEntry(builder: (_) => _buildPopup());
+    Overlay.of(context).insert(_entry!);
+  }
+
+  void _pick(int? id) {
+    widget.onChanged(id);
+    _remove();
+  }
+
+  Widget _buildPopup() {
+    final t = context.tokens;
+    return Stack(
+      children: [
+        // 外部点击关闭
+        Positioned.fill(
+          child: GestureDetector(
+            behavior: HitTestBehavior.translucent,
+            onTap: _remove,
+          ),
+        ),
+        CompositedTransformFollower(
+          link: _link,
+          showWhenUnlinked: false,
+          targetAnchor: Alignment.bottomLeft,
+          followerAnchor: Alignment.topLeft,
+          offset: const Offset(0, 6),
+          child: Align(
+            alignment: Alignment.topLeft,
+            child: Material(
+              elevation: 8,
+              borderRadius: BorderRadius.circular(AppDims.rMd),
+              color: t.surface,
+              child: ConstrainedBox(
+                constraints: BoxConstraints(
+                    minWidth: (widget.width == null || widget.width! < 240)
+                        ? 240
+                        : widget.width!,
+                    maxWidth: 320),
+                child: _ComboPop(
+                  options: widget.options,
+                  selectedId: widget.selectedId,
+                  hint: widget.hint,
+                  onPick: _pick,
+                ),
+              ),
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    final sel = _selected;
+    return CompositedTransformTarget(
+      link: _link,
+      child: SizedBox(
+        width: widget.width, // null → 由父约束决定（Expanded 内填满）
+        height: widget.height,
+        child: InkWell(
+          borderRadius: BorderRadius.circular(AppDims.rMd),
+          onTap: _open,
+          child: Container(
+            padding: const EdgeInsets.symmetric(horizontal: 11),
+            decoration: BoxDecoration(
+              color: widget.fillColor,
+              border: Border.all(color: t.border),
+              borderRadius: BorderRadius.circular(AppDims.rMd),
+            ),
+            child: Row(
+              children: [
+                Expanded(
+                  child: Text(
+                    sel?.name ?? widget.hint,
+                    overflow: TextOverflow.ellipsis,
+                    style: TextStyle(
+                      fontSize: AppDims.fsBody,
+                      color: sel == null ? t.faint : t.text,
+                    ),
+                  ),
+                ),
+                if (sel != null)
+                  GestureDetector(
+                    onTap: () => _pick(null),
+                    child: Icon(Icons.close, size: 14, color: t.muted),
+                  )
+                else
+                  Icon(Icons.keyboard_arrow_down, size: 16, color: t.faint),
+              ],
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+/// 弹层内容：搜索框 + 列表（名称 + 编码 + 选中勾）+ 底部计数。
+class _ComboPop extends StatefulWidget {
+  final List<OptionItem> options;
+  final int? selectedId;
+  final String hint;
+  final ValueChanged<int?> onPick;
+  const _ComboPop({
+    required this.options,
+    required this.selectedId,
+    required this.hint,
+    required this.onPick,
+  });
+
+  @override
+  State<_ComboPop> createState() => _ComboPopState();
+}
+
+class _ComboPopState extends State<_ComboPop> {
+  String _kw = '';
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    final q = _kw.trim().toLowerCase();
+    final hits = q.isEmpty
+        ? widget.options
+        : widget.options.where((o) => o.matches(_kw)).toList();
+    return Column(
+      mainAxisSize: MainAxisSize.min,
+      children: [
+        // 顶部搜索框
+        Container(
+          padding: const EdgeInsets.symmetric(horizontal: 11, vertical: 9),
+          decoration: BoxDecoration(
+            border: Border(bottom: BorderSide(color: t.borderSubtle)),
+          ),
+          child: Row(
+            children: [
+              Icon(Icons.search, size: 14, color: t.faint),
+              const SizedBox(width: 8),
+              Expanded(
+                child: TextField(
+                  autofocus: true,
+                  style: TextStyle(fontSize: AppDims.fsBody, color: t.text),
+                  decoration: InputDecoration(
+                    isCollapsed: true,
+                    border: InputBorder.none,
+                    hintText: '搜索${widget.hint}…',
+                    hintStyle:
+                        TextStyle(fontSize: AppDims.fsBody, color: t.faint),
+                  ),
+                  onChanged: (v) => setState(() => _kw = v),
+                ),
+              ),
+            ],
+          ),
+        ),
+        // 列表
+        ConstrainedBox(
+          constraints: const BoxConstraints(maxHeight: 264),
+          child: hits.isEmpty
+              ? Padding(
+                  padding: const EdgeInsets.all(20),
+                  child: Text('无匹配结果',
+                      style: TextStyle(fontSize: AppDims.fsSm, color: t.muted)))
+              : ListView.builder(
+                  padding: const EdgeInsets.all(5),
+                  shrinkWrap: true,
+                  itemCount: hits.length,
+                  itemBuilder: (_, i) {
+                    final o = hits[i];
+                    final sel = o.id == widget.selectedId;
+                    return InkWell(
+                      borderRadius: BorderRadius.circular(AppDims.rSm),
+                      onTap: () => widget.onPick(o.id),
+                      child: Container(
+                        padding: const EdgeInsets.symmetric(
+                            horizontal: 10, vertical: 8),
+                        child: Row(
+                          children: [
+                            Expanded(
+                              child: Text(o.name,
+                                  overflow: TextOverflow.ellipsis,
+                                  style: TextStyle(
+                                      fontSize: AppDims.fsBody,
+                                      color: sel ? t.primary : t.text,
+                                      fontWeight: sel
+                                          ? FontWeight.w600
+                                          : FontWeight.w400)),
+                            ),
+                            if (o.code != null && o.code!.isNotEmpty) ...[
+                              const SizedBox(width: 12),
+                              Text(o.code!,
+                                  style: TextStyle(
+                                      fontSize: AppDims.fsXs,
+                                      fontFamily: 'monospace',
+                                      color: t.faint)),
+                            ],
+                            if (sel) ...[
+                              const SizedBox(width: 8),
+                              Icon(Icons.check, size: 15, color: t.primary),
+                            ],
+                          ],
+                        ),
+                      ),
+                    );
+                  },
+                ),
+        ),
+        // 底部计数
+        Container(
+          width: double.infinity,
+          padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 7),
+          decoration: BoxDecoration(
+            color: t.bg,
+            border: Border(top: BorderSide(color: t.borderSubtle)),
+          ),
+          child: Text(
+            q.isEmpty
+                ? '共 ${widget.options.length} 条结果'
+                : '匹配 ${hits.length} 条 · 共 ${widget.options.length} 条',
+            style: TextStyle(fontSize: AppDims.fsXs, color: t.muted),
+          ),
+        ),
+      ],
+    );
+  }
+}
@@ -119,7 +119,13 @@ class DsChip extends StatelessWidget {
  final String label;
  final String? value; // 选中值（.cv）；非空即 on 态
  final VoidCallback? onTap;
-  const DsChip({super.key, required this.label, this.value, this.onTap});
+  final VoidCallback? onClear; // 选中态下点 × 单独清除该筛选（不触发展开菜单）
+  const DsChip(
+      {super.key,
+      required this.label,
+      this.value,
+      this.onTap,
+      this.onClear});

  @override
  Widget build(BuildContext context) {
@@ -150,7 +156,15 @@ class DsChip extends StatelessWidget {
                      fontWeight: FontWeight.w600)),
            ],
            const SizedBox(width: 7),
-            Icon(Icons.keyboard_arrow_down, size: 14, color: t.faint),
+            // 选中且提供 onClear → 展示可点 ×（清该筛选）；否则展示下拉箭头。
+            if (on && onClear != null)
+              GestureDetector(
+                behavior: HitTestBehavior.opaque,
+                onTap: onClear,
+                child: Icon(Icons.close, size: 14, color: t.muted),
+              )
+            else
+              Icon(Icons.keyboard_arrow_down, size: 14, color: t.faint),
          ],
        ),
      ),
@@ -207,9 +221,54 @@ class DsSearchBox extends StatelessWidget {
                ),
              ),
            ),
+            // 有输入时显示 × 清除（清空并触发一次空关键词搜索）。
+            if (controller != null)
+              ValueListenableBuilder<TextEditingValue>(
+                valueListenable: controller!,
+                builder: (context, value, _) {
+                  if (value.text.isEmpty) return const SizedBox.shrink();
+                  return GestureDetector(
+                    behavior: HitTestBehavior.opaque,
+                    onTap: () {
+                      controller!.clear();
+                      onChanged?.call('');
+                      onSubmitted?.call('');
+                    },
+                    child: Padding(
+                      padding: const EdgeInsets.only(left: 6),
+                      child: Icon(Icons.close, size: 14, color: t.muted),
+                    ),
+                  );
+                },
+              ),
          ],
        ),
      ),
    );
  }
 }
+
+/// 加载遮罩（reload 时叠在旧内容之上）：轻微半透明底 + 屏幕中心进度圈。
+/// 搜索/筛选刷新时用它替代整屏白屏（见列表屏 skipLoadingOnReload）。
+class DsLoadingScrim extends StatelessWidget {
+  const DsLoadingScrim({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    return GestureDetector(
+      behavior: HitTestBehavior.opaque, // 加载期间拦截点击，避免误触
+      onTap: () {},
+      child: ColoredBox(
+        color: t.bg.withValues(alpha: 0.55),
+        child: Center(
+          child: SizedBox(
+            width: 34,
+            height: 34,
+            child: CircularProgressIndicator(strokeWidth: 3, color: t.primary),
+          ),
+        ),
+      ),
+    );
+  }
+}
@@ -79,6 +79,8 @@ class _DsTableState extends State<DsTable> {
      ),
      clipBehavior: Clip.antiAlias,
      child: Column(
+        // 整宽拉伸：toolbar/表格/分页都填满卡片宽度（否则 toolbar 按内容宽居中→左侧留白）。
+        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          if (widget.toolbar != null) ...[
            Padding(
@@ -0,0 +1,350 @@
+import 'dart:math' as math;
+
+import 'package:flutter/material.dart';
+
+import '../core/theme/context_tokens.dart';
+import '../core/theme/app_dims.g.dart';
+
+/// 右侧滑入抽屉呈现（对齐原型 .drawer / .drawer-mask）。
+/// useRootNavigator:false → 只覆盖内容区（分支 Navigator），不盖侧栏/顶栏。
+Future<T?> showOrderDetailDrawer<T>(
+  BuildContext context, {
+  required WidgetBuilder builder,
+}) {
+  return showGeneralDialog<T>(
+    context: context,
+    useRootNavigator: false,
+    barrierDismissible: true,
+    barrierLabel: '关闭',
+    barrierColor: Colors.black.withValues(alpha: 0.32), // .drawer-mask scrim
+    transitionDuration: const Duration(milliseconds: 250),
+    pageBuilder: (ctx, _, __) {
+      final w = math.min(600.0, MediaQuery.of(ctx).size.width * 0.94);
+      return Align(
+        alignment: Alignment.centerRight,
+        child: Material(
+          color: ctx.tokens.surface,
+          elevation: 16,
+          // 抽屉在 app_shell 的全局 SelectionArea 之外（独立 overlay）→ 自带一层，文字可选中复制。
+          child: SelectionArea(
+            child: SizedBox(
+                width: w, height: double.infinity, child: builder(ctx)),
+          ),
+        ),
+      );
+    },
+    transitionBuilder: (ctx, anim, _, child) => SlideTransition(
+      position: Tween<Offset>(begin: const Offset(1, 0), end: Offset.zero)
+          .animate(CurvedAnimation(parent: anim, curve: Curves.easeOutCubic)),
+      child: child,
+    ),
+  );
+}
+
+/// 抽屉明细行（对齐原型 .lines .lr，5 列：商品·编码 / 系列·规格 / 数量 / 单价 / 金额）。
+class OrderLine {
+  final String name;
+  final String code;
+  final String series;
+  final String spec;
+  final String qty;
+  final String price; // 已算好文案（或「待定价」）
+  final String amount;
+  final bool pending; // 单价<=0：单价/金额显示待定价样式
+  const OrderLine({
+    required this.name,
+    required this.code,
+    required this.series,
+    required this.spec,
+    required this.qty,
+    required this.price,
+    required this.amount,
+    this.pending = false,
+  });
+}
+
+/// 抽屉底部操作分组（对齐原型 .dact-group：标签 + 一排按钮）。
+class DrawerActionGroup {
+  final String label;
+  final List<Widget> buttons;
+  const DrawerActionGroup(this.label, this.buttons);
+}
+
+/// 详情抽屉骨架（对齐原型 openDetail 布局）：
+/// 头(单号+X) / 信息行(.drow) / 明细标题 / 明细表(.lines) / 合计(.ltotal) / 操作组(.dactions)。
+class OrderDetailDrawer extends StatelessWidget {
+  final String title;
+  final List<({String label, Widget value})> infoRows;
+  final String linesLabel; // 入库明细 / 出库明细
+  final List<OrderLine> lines;
+  final String totalText; // 合计金额（已格式化）
+  final List<DrawerActionGroup> actionGroups;
+
+  const OrderDetailDrawer({
+    super.key,
+    required this.title,
+    required this.infoRows,
+    required this.linesLabel,
+    required this.lines,
+    required this.totalText,
+    required this.actionGroups,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.stretch,
+      children: [
+        // ── 头：单号 + 关闭 ──（.drawer-head）
+        Container(
+          padding: const EdgeInsets.fromLTRB(20, 18, 16, 18),
+          decoration:
+              BoxDecoration(border: Border(bottom: BorderSide(color: t.border))),
+          child: Row(
+            children: [
+              Expanded(
+                child: Text(title,
+                    style: TextStyle(
+                        fontSize: AppDims.fsH2,
+                        fontWeight: FontWeight.w700,
+                        color: t.heading)),
+              ),
+              IconButton(
+                icon: Icon(Icons.close, size: 22, color: t.muted),
+                splashRadius: 20,
+                onPressed: () => Navigator.of(context).pop(),
+              ),
+            ],
+          ),
+        ),
+        Expanded(
+          child: SingleChildScrollView(
+            padding: const EdgeInsets.fromLTRB(20, 18, 20, 20),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.stretch,
+              children: [
+                // ── 信息行（.drow）──
+                for (final r in infoRows) _DrawerRow(label: r.label, value: r.value),
+                // ── 明细标题 ──
+                Padding(
+                  padding: const EdgeInsets.fromLTRB(0, 16, 0, 8),
+                  child: Text(linesLabel,
+                      style: TextStyle(fontSize: AppDims.fsSm, color: t.muted)),
+                ),
+                _LinesTable(lines: lines),
+                // ── 合计（.ltotal）──
+                Padding(
+                  padding: const EdgeInsets.fromLTRB(4, 8, 4, 0),
+                  child: Row(
+                    mainAxisAlignment: MainAxisAlignment.end,
+                    children: [
+                      Text('合计金额 ',
+                          style: TextStyle(
+                              fontSize: AppDims.fsBody, color: t.muted)),
+                      const SizedBox(width: 6),
+                      Text(totalText,
+                          style: TextStyle(
+                              fontSize: 18,
+                              fontFamily: 'monospace',
+                              fontWeight: FontWeight.w700,
+                              color: t.accent)),
+                    ],
+                  ),
+                ),
+                // ── 操作组（.dactions）──
+                if (actionGroups.isNotEmpty) const SizedBox(height: 18),
+                for (var i = 0; i < actionGroups.length; i++) ...[
+                  if (i > 0) const SizedBox(height: 14),
+                  _ActionGroup(group: actionGroups[i]),
+                ],
+              ],
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+}
+
+class _DrawerRow extends StatelessWidget {
+  final String label;
+  final Widget value;
+  const _DrawerRow({required this.label, required this.value});
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    return Container(
+      padding: const EdgeInsets.symmetric(vertical: 11),
+      decoration: BoxDecoration(
+          border: Border(bottom: BorderSide(color: t.borderSubtle))),
+      child: Row(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(label,
+              style: TextStyle(fontSize: AppDims.fsBody, color: t.muted)),
+          const Spacer(),
+          DefaultTextStyle(
+            style: TextStyle(
+                fontSize: AppDims.fsBody,
+                fontWeight: FontWeight.w600,
+                color: t.text),
+            child: value,
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+class _LinesTable extends StatelessWidget {
+  final List<OrderLine> lines;
+  const _LinesTable({required this.lines});
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    return Container(
+      decoration: BoxDecoration(
+        border: Border.all(color: t.border),
+        borderRadius: BorderRadius.circular(AppDims.rMd),
+      ),
+      child: Column(
+        children: [
+          // 表头
+          Container(
+            padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 9),
+            decoration: BoxDecoration(
+              color: t.thBg,
+              borderRadius: const BorderRadius.vertical(top: Radius.circular(6)),
+            ),
+            child: _lineRow(
+              context,
+              c1: Text('商品 · 编码',
+                  style: _hStyle(t), overflow: TextOverflow.ellipsis),
+              c2: Text('系列 / 规格', style: _hStyle(t)),
+              c3: Text('数量', textAlign: TextAlign.right, style: _hStyle(t)),
+              c4: Text('单价', textAlign: TextAlign.right, style: _hStyle(t)),
+              c5: Text('金额', textAlign: TextAlign.right, style: _hStyle(t)),
+            ),
+          ),
+          for (var i = 0; i < lines.length; i++)
+            Container(
+              padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 9),
+              decoration: BoxDecoration(
+                border: i == 0
+                    ? null
+                    : Border(top: BorderSide(color: t.borderSubtle)),
+              ),
+              child: _lineRow(
+                context,
+                c1: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Text(lines[i].name,
+                        style: TextStyle(
+                            fontSize: AppDims.fsBody,
+                            fontWeight: FontWeight.w600,
+                            color: t.text)),
+                    Text(lines[i].code,
+                        style: TextStyle(
+                            fontSize: AppDims.fsXs,
+                            fontFamily: 'monospace',
+                            color: t.faint)),
+                  ],
+                ),
+                c2: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Text(lines[i].series,
+                        style:
+                            TextStyle(fontSize: AppDims.fsSm, color: t.text)),
+                    Text(lines[i].spec,
+                        style:
+                            TextStyle(fontSize: AppDims.fsXs, color: t.muted)),
+                  ],
+                ),
+                c3: Text(lines[i].qty,
+                    textAlign: TextAlign.right,
+                    style: const TextStyle(fontFamily: 'monospace')),
+                c4: _priceCell(context, lines[i].price, lines[i].pending),
+                c5: _priceCell(context, lines[i].amount, lines[i].pending,
+                    accent: true),
+              ),
+            ),
+        ],
+      ),
+    );
+  }
+
+  TextStyle _hStyle(dynamic t) => TextStyle(
+      fontSize: AppDims.fsSm, color: t.muted, fontWeight: FontWeight.w600);
+
+  Widget _priceCell(BuildContext context, String text, bool pending,
+      {bool accent = false}) {
+    final t = context.tokens;
+    if (pending) {
+      return Text(text,
+          textAlign: TextAlign.right,
+          style: TextStyle(
+              fontSize: AppDims.fsXs,
+              color: t.warn,
+              fontWeight: FontWeight.w600));
+    }
+    return Text(text,
+        textAlign: TextAlign.right,
+        style: TextStyle(
+            fontFamily: 'monospace',
+            fontWeight: accent ? FontWeight.w700 : FontWeight.w400,
+            color: accent ? t.text : t.text));
+  }
+
+  // 5 列布局（对齐原型 grid 1fr 124 40 64 78）。
+  Widget _lineRow(BuildContext context,
+      {required Widget c1,
+      required Widget c2,
+      required Widget c3,
+      required Widget c4,
+      required Widget c5}) {
+    return Row(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Expanded(child: c1),
+        const SizedBox(width: 8),
+        SizedBox(width: 96, child: c2),
+        const SizedBox(width: 8),
+        SizedBox(width: 34, child: c3),
+        const SizedBox(width: 8),
+        SizedBox(width: 60, child: c4),
+        const SizedBox(width: 8),
+        SizedBox(width: 72, child: c5),
+      ],
+    );
+  }
+}
+
+class _ActionGroup extends StatelessWidget {
+  final DrawerActionGroup group;
+  const _ActionGroup({required this.group});
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        Text(group.label,
+            style: TextStyle(
+                fontSize: AppDims.fsXs,
+                color: t.muted,
+                fontWeight: FontWeight.w600,
+                letterSpacing: 0.4)),
+        const SizedBox(height: 8),
+        Wrap(spacing: 10, runSpacing: 10, children: group.buttons),
+      ],
+    );
+  }
+}
@@ -39,6 +39,10 @@ class SearchableOptionField extends StatelessWidget {
  final bool isRequired;
  final bool isDense;

+  /// 带框样式（OutlineInputBorder）；默认 false 沿用主题下划线。
+  /// 详细搜索等「表单里与文本框并列」的场景传 true，视觉统一为带框。
+  final bool bordered;
+
  /// 可选：搜索无匹配时「新增到基础数据」。回调收到当前关键字（用户可在确认框里改），
  /// 创建成功返回新选项 id（自动选中），失败/取消返回 null。为空则不显示新增入口。
  final Future<int?> Function(String keyword)? onCreate;
@@ -55,6 +59,7 @@ class SearchableOptionField extends StatelessWidget {
    required this.onChanged,
    this.isRequired = false,
    this.isDense = true,
+    this.bordered = false,
    this.onCreate,
    this.onSearch,
  });
@@ -96,6 +101,7 @@ class SearchableOptionField extends StatelessWidget {
          child: InputDecorator(
            decoration: InputDecoration(
              isDense: isDense,
+              border: bordered ? const OutlineInputBorder() : null,
              errorText: state.errorText,
              suffixIcon: selected
                  ? GestureDetector(
@@ -0,0 +1,133 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+import '../core/theme/context_tokens.dart';
+import '../core/theme/app_dims.g.dart';
+import '../core/responsive/responsive.dart';
+import '../core/utils/dialog_util.dart';
+
+/// 年/月/日 滚轮日期选择器（对齐原型 .wheel-pop）。选中返回 DateTime，取消返回 null。
+/// 「今天」快速跳到今天；「确定」确认。范围选择由调用方调两次（起/止）拼成。
+Future<DateTime?> showWheelDatePicker(
+  BuildContext context, {
+  DateTime? initial,
+  String title = '选择日期',
+}) {
+  return showAppDialog<DateTime>(
+    context: context,
+    builder: (_) => _WheelDateDialog(initial: initial ?? DateTime.now(), title: title),
+  );
+}
+
+class _WheelDateDialog extends StatefulWidget {
+  final DateTime initial;
+  final String title;
+  const _WheelDateDialog({required this.initial, required this.title});
+
+  @override
+  State<_WheelDateDialog> createState() => _WheelDateDialogState();
+}
+
+class _WheelDateDialogState extends State<_WheelDateDialog> {
+  late DateTime _value;
+
+  @override
+  void initState() {
+    super.initState();
+    _value = DateTime(widget.initial.year, widget.initial.month, widget.initial.day);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final t = context.tokens;
+    return Dialog(
+      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(AppDims.rXl)),
+      child: SizedBox(
+        width: context.dialogWidth(320),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Padding(
+              padding: const EdgeInsets.fromLTRB(16, 14, 16, 4),
+              child: Row(
+                children: [
+                  Text(widget.title,
+                      style: TextStyle(
+                          fontSize: AppDims.fsTitle,
+                          fontWeight: FontWeight.w600,
+                          color: t.heading)),
+                ],
+              ),
+            ),
+            // 三列滚轮（年/月/日），中间高亮行由 CupertinoDatePicker 提供。
+            SizedBox(
+              height: 200,
+              child: CupertinoTheme(
+                data: CupertinoThemeData(
+                  textTheme: CupertinoTextThemeData(
+                    dateTimePickerTextStyle: TextStyle(fontSize: 18, color: t.text),
+                  ),
+                ),
+                child: CupertinoDatePicker(
+                  mode: CupertinoDatePickerMode.date,
+                  initialDateTime: _value,
+                  minimumYear: 2015,
+                  maximumYear: 2035,
+                  onDateTimeChanged: (d) =>
+                      _value = DateTime(d.year, d.month, d.day),
+                ),
+              ),
+            ),
+            const Divider(height: 1),
+            Padding(
+              padding: const EdgeInsets.fromLTRB(12, 8, 12, 10),
+              child: Row(
+                children: [
+                  TextButton(
+                    onPressed: () {
+                      final now = DateTime.now();
+                      setState(() => _value = DateTime(now.year, now.month, now.day));
+                    },
+                    child: Text('今天', style: TextStyle(color: t.muted)),
+                  ),
+                  const Spacer(),
+                  TextButton(
+                    onPressed: () => Navigator.of(context).pop(),
+                    child: Text('取消', style: TextStyle(color: t.muted)),
+                  ),
+                  const SizedBox(width: 4),
+                  ElevatedButton(
+                    onPressed: () => Navigator.of(context).pop(_value),
+                    style: ElevatedButton.styleFrom(
+                      backgroundColor: t.primary,
+                      foregroundColor: t.onPrimary,
+                      elevation: 0,
+                    ),
+                    child: const Text('确定'),
+                  ),
+                ],
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+/// 范围选择：先选起始日、再选结束日；任一取消则返回 null。
+Future<DateTimeRange?> showWheelDateRange(
+  BuildContext context, {
+  DateTimeRange? initial,
+}) async {
+  final start = await showWheelDatePicker(context,
+      initial: initial?.start, title: '起始日期');
+  if (start == null || !context.mounted) return null;
+  final end = await showWheelDatePicker(context,
+      initial: initial?.end ?? start, title: '结束日期');
+  if (end == null) return null;
+  // 保证 start <= end
+  return end.isBefore(start)
+      ? DateTimeRange(start: end, end: start)
+      : DateTimeRange(start: start, end: end);
+}