Files
worker/lib/features/auth/presentation/widgets/role_dropdown.dart
Phuoc Nguyen 49a41d24eb update theme
2025-12-02 15:20:54 +07:00

119 lines
3.6 KiB
Dart

/// Role Dropdown Widget
///
/// Dropdown for selecting user role during registration.
library;
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:worker/core/constants/ui_constants.dart';
import 'package:worker/core/theme/colors.dart';
/// Role Dropdown
///
/// A custom dropdown widget for selecting user role.
/// Roles:
/// - dealer: Đại lý hệ thống
/// - worker: Kiến trúc sư/ Thầu thợ
/// - broker: Khách lẻ
/// - other: Khác
///
/// Usage:
/// ```dart
/// RoleDropdown(
/// value: selectedRole,
/// onChanged: (value) {
/// setState(() {
/// selectedRole = value;
/// });
/// },
/// validator: (value) {
/// if (value == null || value.isEmpty) {
/// return 'Vui lòng chọn vai trò';
/// }
/// return null;
/// },
/// )
/// ```
class RoleDropdown extends StatelessWidget {
/// Creates a role dropdown
const RoleDropdown({
super.key,
required this.value,
required this.onChanged,
this.validator,
});
/// Selected role value
final String? value;
/// Callback when role changes
final void Function(String?) onChanged;
/// Form field validator
final String? Function(String?)? validator;
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
return DropdownButtonFormField<String>(
initialValue: value,
decoration: InputDecoration(
hintText: 'Chọn vai trò của bạn',
hintStyle: TextStyle(
fontSize: InputFieldSpecs.hintFontSize,
color: colorScheme.onSurfaceVariant,
),
prefixIcon: Icon(
FontAwesomeIcons.briefcase,
color: colorScheme.primary,
size: AppIconSize.md,
),
filled: true,
fillColor: colorScheme.surface,
contentPadding: InputFieldSpecs.contentPadding,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(InputFieldSpecs.borderRadius),
borderSide: BorderSide(color: colorScheme.surfaceContainerHighest, width: 1.0),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(InputFieldSpecs.borderRadius),
borderSide: BorderSide(color: colorScheme.surfaceContainerHighest, width: 1.0),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(InputFieldSpecs.borderRadius),
borderSide: BorderSide(
color: colorScheme.primary,
width: 2.0,
),
),
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(InputFieldSpecs.borderRadius),
borderSide: const BorderSide(color: AppColors.danger, width: 1.0),
),
focusedErrorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(InputFieldSpecs.borderRadius),
borderSide: const BorderSide(color: AppColors.danger, width: 2.0),
),
),
items: const [
DropdownMenuItem(value: 'dealer', child: Text('Đại lý hệ thống')),
DropdownMenuItem(
value: 'worker',
child: Text('Kiến trúc sư/ Thầu thợ'),
),
DropdownMenuItem(value: 'broker', child: Text('Khách lẻ')),
DropdownMenuItem(value: 'other', child: Text('Khác')),
],
onChanged: onChanged,
validator: validator,
icon: FaIcon(FontAwesomeIcons.chevronDown, color: colorScheme.onSurfaceVariant, size: 16),
dropdownColor: colorScheme.surface,
style: TextStyle(
fontSize: InputFieldSpecs.fontSize,
color: colorScheme.onSurface,
),
);
}
}