update staff list, add pin editor and privilege editor

lib/pages/staff/staff_pin_editor.dart

@@ -0,0 +1,192 @@
+import 'package:fcs/domain/entities/user.dart';
+import 'package:fcs/helpers/theme.dart';
+import 'package:fcs/pages/widgets/local_app_bar.dart';
+import 'package:fcs/pages/widgets/progress.dart';
+import 'package:flutter/material.dart';
+import 'package:pin_input_text_field/pin_input_text_field.dart';
+
+import '../main/util.dart';
+import '../widgets/local_text.dart';
+
+class StaffPinEditor extends StatefulWidget {
+  final User staff;
+  const StaffPinEditor({required this.staff});
+  @override
+  _StaffPinEditorState createState() => _StaffPinEditorState();
+}
+
+class _StaffPinEditorState extends State<StaffPinEditor> {
+  bool _isLoading = false;
+  late User _staff;
+  bool _enablePinLogin = false;
+  String _newPin = "";
+  String _confirmPin = "";
+
+  @override
+  void initState() {
+    _staff = widget.staff;
+    _enablePinLogin = _staff.enablePinLogin;
+    _newPin = _staff.pinDigit ?? "";
+    _confirmPin = _staff.confirmPinDigit ?? "";
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final enablePinBox = Row(
+      children: [
+        Checkbox(
+          materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+          visualDensity: const VisualDensity(
+              horizontal: VisualDensity.minimumDensity,
+              vertical: VisualDensity.minimumDensity),
+          activeColor: primaryColor,
+          side: BorderSide(color: Colors.black38, width: 2),
+          value: _enablePinLogin,
+          onChanged: (value) {
+            setState(() {
+              _enablePinLogin = value ?? false;
+            });
+          },
+        ),
+        const SizedBox(width: 15),
+        LocalText(context, 'staff.enable_pin',
+            fontSize: 15, color: Colors.black)
+      ],
+    );
+
+    final newPinBox = Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        LocalText(context, 'staff.new_pin',
+            color: Colors.black54, fontSize: 15),
+        const SizedBox(height: 8),
+        PinInputTextField(
+            cursor: Cursor(
+                color: primaryColor, enabled: true, width: 2, height: 30),
+            pinLength: 6,
+            decoration: BoxLooseDecoration(
+                strokeColorBuilder:
+                    PinListenColorBuilder(primaryColor, Colors.grey.shade400)),
+            textInputAction: TextInputAction.done,
+            autoFocus: true,
+            onChanged: _newPinChange),
+      ],
+    );
+
+    final confirmPinBox = Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        LocalText(context, 'staff.confirm_pin',
+            color: Colors.black54, fontSize: 15),
+        const SizedBox(height: 8),
+        PinInputTextField(
+            pinLength: 6,
+             cursor: Cursor(
+                color: primaryColor, enabled: true, width: 2, height: 30),
+            decoration: BoxLooseDecoration(
+                strokeColorBuilder:
+                    PinListenColorBuilder(primaryColor, Colors.grey.shade400)),
+            textInputAction: TextInputAction.done,
+            autoFocus: false,
+            onChanged: _confirmPinChange),
+      ],
+    );
+
+    final saveButton = Padding(
+      padding: const EdgeInsets.symmetric(horizontal: 30),
+      child: fcsButton(
+        context,
+        getLocalString(context, 'btn.save'),
+        callack: _save,
+      ),
+    );
+
+    return LocalProgress(
+        inAsyncCall: _isLoading,
+        child: Scaffold(
+          appBar: LocalAppBar(
+              labelKey: "staff.pin.title",
+              backgroundColor: Colors.white,
+              labelColor: primaryColor,
+              arrowColor: primaryColor),
+          body: Padding(
+            padding: const EdgeInsets.only(left: 15.0, right: 15),
+            child: ListView(
+              children: <Widget>[
+                Column(
+                  children: [
+                    Text(_staff.name ?? "",
+                        style: TextStyle(color: Colors.black, fontSize: 18)),
+                    Text(_staff.fcsID ?? "",
+                        style: TextStyle(color: Colors.black, fontSize: 15)),
+                  ],
+                ),
+                const SizedBox(height: 20),
+                enablePinBox,
+                const SizedBox(height: 30),
+                newPinBox,
+                SizedBox(height: 30),
+                confirmPinBox,
+                SizedBox(height: 30),
+                saveButton,
+                SizedBox(height: 30)
+              ],
+            ),
+          ),
+        ));
+  }
+
+  _newPinChange(pin) {
+    setState(() {
+      this._newPin = pin;
+    });
+  }
+
+  _confirmPinChange(pin) {
+    setState(() {
+      this._confirmPin = pin;
+    });
+  }
+
+  _save() async {
+    if (_newPin == "") {
+      showMsgDialog(context, "Error", "Invalid new PIN");
+      return;
+    }
+
+    if (_newPin.length < 6) {
+      showMsgDialog(context, "Error", "New PIN must be 6 digits");
+      return;
+    }
+
+    if (_confirmPin == "") {
+      showMsgDialog(context, "Error", "Invalid confirm PIN");
+      return;
+    }
+
+    if (_confirmPin.length < 6) {
+      showMsgDialog(context, "Error", "Confirm PIN must be 6 digits");
+      return;
+    }
+
+    if (_confirmPin != _newPin) {
+      showMsgDialog(context, "Error", "Those pins didn’t match. Try again.");
+      return;
+    }
+
+    setState(() {
+      _isLoading = true;
+    });
+
+    try {
+      Navigator.pop(context, true);
+    } catch (e) {
+      showMsgDialog(context, "Error", e.toString());
+    } finally {
+      setState(() {
+        _isLoading = false;
+      });
+    }
+  }
+}