fix: Add country selection and phone number validation in employee form #38
@ -22,6 +22,42 @@ class AddEmployeeController extends MyController {
|
||||
Gender? selectedGender;
|
||||
List<Map<String, dynamic>> roles = [];
|
||||
String? selectedRoleId;
|
||||
final List<Map<String, String>> countries = [
|
||||
{"code": "+91", "name": "India"},
|
||||
{"code": "+1", "name": "USA"},
|
||||
{"code": "+971", "name": "UAE"},
|
||||
{"code": "+44", "name": "UK"},
|
||||
{"code": "+81", "name": "Japan"},
|
||||
{"code": "+61", "name": "Australia"},
|
||||
{"code": "+49", "name": "Germany"},
|
||||
{"code": "+33", "name": "France"},
|
||||
{"code": "+86", "name": "China"},
|
||||
];
|
||||
|
||||
final Map<String, int> minDigitsPerCountry = {
|
||||
"+91": 10,
|
||||
"+1": 10,
|
||||
"+971": 9,
|
||||
"+44": 10,
|
||||
"+81": 10,
|
||||
"+61": 9,
|
||||
"+49": 10,
|
||||
"+33": 9,
|
||||
"+86": 11,
|
||||
};
|
||||
|
||||
final Map<String, int> maxDigitsPerCountry = {
|
||||
"+91": 10,
|
||||
"+1": 10,
|
||||
"+971": 9,
|
||||
"+44": 11,
|
||||
"+81": 10,
|
||||
"+61": 9,
|
||||
"+49": 11,
|
||||
"+33": 9,
|
||||
"+86": 11,
|
||||
};
|
||||
String selectedCountryCode = "+91";
|
||||
|
||||
@override
|
||||
void onInit() {
|
||||
|
@ -100,13 +100,128 @@ class _AddEmployeeBottomSheetState extends State<AddEmployeeBottomSheet>
|
||||
|
||||
_buildLabel("Phone Number"),
|
||||
MySpacing.height(8),
|
||||
_buildTextField(
|
||||
hint: "eg: +91 9876543210",
|
||||
controller: controller.basicValidator
|
||||
.getController('phone_number')!,
|
||||
validator: controller.basicValidator
|
||||
.getValidation('phone_number'),
|
||||
keyboardType: TextInputType.phone,
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 12, vertical: 14),
|
||||
decoration: BoxDecoration(
|
||||
border:
|
||||
Border.all(color: Colors.grey.shade300),
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: PopupMenuButton<Map<String, String>>(
|
||||
onSelected: (country) {
|
||||
setState(() {
|
||||
controller.selectedCountryCode =
|
||||
country['code']!;
|
||||
});
|
||||
},
|
||||
itemBuilder: (context) => [
|
||||
PopupMenuItem(
|
||||
enabled: false,
|
||||
padding: EdgeInsets.zero,
|
||||
child: Container(
|
||||
padding: EdgeInsets.zero,
|
||||
height: 200,
|
||||
width: 100,
|
||||
decoration: BoxDecoration(
|
||||
color: Theme.of(context)
|
||||
.colorScheme
|
||||
.surface,
|
||||
borderRadius:
|
||||
BorderRadius.circular(8),
|
||||
),
|
||||
child: Scrollbar(
|
||||
child: ListView(
|
||||
padding: EdgeInsets.zero,
|
||||
children: controller.countries
|
||||
.map((country) {
|
||||
return ListTile(
|
||||
title: Text(
|
||||
"${country['name']} (${country['code']})",
|
||||
style: TextStyle(
|
||||
color: Theme.of(context)
|
||||
.colorScheme
|
||||
.onSurface,
|
||||
),
|
||||
),
|
||||
onTap: () => Navigator.pop(
|
||||
context, country),
|
||||
hoverColor: Theme.of(context)
|
||||
.colorScheme
|
||||
.primary
|
||||
.withOpacity(0.1),
|
||||
contentPadding:
|
||||
const EdgeInsets.symmetric(
|
||||
horizontal: 12),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text(controller.selectedCountryCode),
|
||||
const Icon(Icons.arrow_drop_down),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
children: [
|
||||
TextFormField(
|
||||
controller: controller.basicValidator
|
||||
.getController('phone_number'),
|
||||
validator: (value) {
|
||||
if (value == null ||
|
||||
value.trim().isEmpty) {
|
||||
return "Phone number is required";
|
||||
}
|
||||
|
||||
final digitsOnly = value.trim();
|
||||
final minLength =
|
||||
controller.minDigitsPerCountry[
|
||||
controller
|
||||
.selectedCountryCode] ??
|
||||
7;
|
||||
final maxLength =
|
||||
controller.maxDigitsPerCountry[
|
||||
controller
|
||||
.selectedCountryCode] ??
|
||||
15;
|
||||
|
||||
if (!RegExp(r'^[0-9]+$')
|
||||
.hasMatch(digitsOnly)) {
|
||||
return "Phone number must contain digits only";
|
||||
}
|
||||
|
||||
if (digitsOnly.length < minLength ||
|
||||
digitsOnly.length > maxLength) {
|
||||
return "Number Must be between $minLength and $maxLength";
|
||||
}
|
||||
|
||||
return null;
|
||||
},
|
||||
keyboardType: TextInputType.phone,
|
||||
decoration:
|
||||
_inputDecoration("eg: 9876543210"),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
MySpacing.height(24),
|
||||
|
||||
@ -182,11 +297,15 @@ class _AddEmployeeBottomSheetState extends State<AddEmployeeBottomSheet>
|
||||
}
|
||||
employeeController
|
||||
.update(['employee_screen_controller']);
|
||||
|
||||
// Optionally clear form
|
||||
controller.basicValidator.getController("first_name")?.clear();
|
||||
controller.basicValidator.getController("last_name")?.clear();
|
||||
controller.basicValidator.getController("phone_number")?.clear();
|
||||
controller.basicValidator
|
||||
.getController("first_name")
|
||||
?.clear();
|
||||
controller.basicValidator
|
||||
.getController("last_name")
|
||||
?.clear();
|
||||
controller.basicValidator
|
||||
.getController("phone_number")
|
||||
?.clear();
|
||||
|
||||
controller.selectedGender = null;
|
||||
controller.selectedRoleId = null;
|
||||
|
Loading…
x
Reference in New Issue
Block a user