Frontend first draft

frontend/pweb/lib/pages/report/table/badge.dart

@@ -0,0 +1,55 @@
+import 'package:flutter/material.dart';
+
+import 'package:badges/badges.dart' as badges;
+
+import 'package:pshared/models/payment/status.dart';
+
+
+class OperationStatusBadge extends StatelessWidget {
+  final OperationStatus status;
+
+  const OperationStatusBadge({super.key, required this.status});
+
+  Color _badgeColor(BuildContext context) {
+    final scheme = Theme.of(context).colorScheme;
+    switch (status) {
+      case OperationStatus.processing:
+        return scheme.primary;
+      case OperationStatus.success:
+        return scheme.secondary;
+      case OperationStatus.error:
+        return scheme.error;
+    }
+  }
+
+  Color _textColor(Color background) {
+    // computeLuminance returns 0 for black, 1 for white
+    return background.computeLuminance() > 0.5 ? Colors.black : Colors.white;
+  }  
+
+  @override
+  Widget build(BuildContext context) {
+    final label = status.localized(context);
+    final bg = _badgeColor(context);
+    final fg = _textColor(bg);
+
+    return badges.Badge(
+      badgeStyle: badges.BadgeStyle(
+        shape: badges.BadgeShape.square,
+        badgeColor: bg,
+        borderRadius: BorderRadius.circular(12),      // fully rounded
+        padding: const EdgeInsets.symmetric(
+          horizontal: 6, vertical: 2                     // tighter padding
+        ),
+      ),
+      badgeContent: Text(
+        label.toUpperCase(),                           // or keep sentence case
+        style: TextStyle(
+          color: fg,
+          fontSize: 11,                                 // smaller text
+          fontWeight: FontWeight.w500,                  // medium weight
+        ),
+      ),
+    );
+  }
+}