upadted with select enployee sheet

lib/model/dailyTaskPlanning/assign_task_bottom_sheet .dart

@@ -15,10 +15,8 @@ import 'package:marco/helpers/widgets/tenant/organization_selector.dart';
 import 'package:marco/helpers/widgets/tenant/service_selector.dart';
 import 'package:marco/model/attendance/organization_per_project_list_model.dart';
 import 'package:marco/model/tenant/tenant_services_model.dart';
-
-// Added imports for employee selection
 import 'package:marco/model/employees/employee_model.dart';
-import 'package:marco/model/employees/multiple_select_bottomsheet.dart';
+import 'package:marco/model/employees/multiple_select_role_bottomsheet.dart';
 
 class AssignTaskBottomSheet extends StatefulWidget {
   final String workLocation;
@@ -89,8 +87,10 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
       serviceId: selectedService?.id,
       organizationId: selectedOrganization?.id,
     );
-    await controller.fetchTaskData(selectedProjectId,
+    await controller.fetchTaskData(
-        serviceId: selectedService?.id);
+      selectedProjectId,
+      serviceId: selectedService?.id,
+    );
   }
 
   @override
@@ -147,13 +147,10 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
         _infoRow(Icons.location_on, "Work Location",
             "${widget.buildingName} > ${widget.floorName} > ${widget.workAreaName} > ${widget.activityName}"),
         const Divider(),
-
-        // Pending Task Info
         _infoRow(
             Icons.pending_actions, "Pending Task", "${widget.pendingTask}"),
         const Divider(),
 
-        // Role Selector (kept as-is)
         GestureDetector(
           onTap: _onRoleMenuPressed,
           child: Row(children: [
@@ -165,12 +162,7 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
 
         MySpacing.height(8),
 
-        // -------------------------------
+        /// TEAM SELECT BOX
-        // Employee selector (REPLACED)
-        // -------------------------------
-        // We show a button-like container (with border) that opens the reusable
-        // EmployeeSelectionBottomSheet. Selected employees are reflected using
-        // existing controller.uploadingStates & controller.selectedEmployees.
         GestureDetector(
           onTap: _openEmployeeSelectionSheet,
           child: Container(
@@ -183,17 +175,24 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
   children: [
     const Icon(Icons.group, color: Colors.black54),
     const SizedBox(width: 10),
+
+    // Expanded name area
     Expanded(
       child: Obx(() {
         final count = controller.selectedEmployees.length;
         if (count == 0) {
-                      return MyText("Select team members",
+          return MyText(
-                          color: Colors.grey.shade700);
+            "Select team members",
+            color: Colors.grey.shade700,
+            maxLines: 1,
+            overflow: TextOverflow.ellipsis,
+          );
         }
-                    // show summary text when there are selected employees
+
         final names = controller.selectedEmployees
             .map((e) => e.name)
             .join(", ");
+
         return Text(
           names,
           maxLines: 2,
@@ -202,15 +201,15 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
         );
       }),
     ),
-                const SizedBox(width: 8),
+
     const Icon(Icons.arrow_drop_down, color: Colors.grey),
   ],
-            ),
+)
-          ),
-        ),
-        MySpacing.height(8),
 
-        // Selected Employees Chips (keeps existing behavior)
+          ),
+        ),
+
+        MySpacing.height(8),
         _buildSelectedEmployees(),
         MySpacing.height(8),
 
@@ -262,13 +261,13 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
         ),
       ],
     ).then((value) {
-      if (value != null)
+      if (value != null) {
-        controller.onRoleSelected(value == 'all' ? null : value);
+        selectedRoleId = value == 'all' ? null : value;
+        controller.onRoleSelected(selectedRoleId);
+      }
     });
   }
 
-  // Removed old inline employee list; selection handled by bottom sheet.
-
   Widget _buildSelectedEmployees() {
     return Obx(() {
       if (controller.selectedEmployees.isEmpty) return Container();
@@ -314,7 +313,9 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
           maxLines: maxLines,
           decoration: InputDecoration(
             hintText: hintText,
-            border: OutlineInputBorder(borderRadius: BorderRadius.circular(6)),
+            border: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(6),
+            ),
             contentPadding:
                 const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
           ),
@@ -342,11 +343,16 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
               text: TextSpan(
                 children: [
                   WidgetSpan(
-                    child: MyText.titleMedium("$title: ",
+                    child: MyText.titleMedium(
-                        fontWeight: 600, color: Colors.black),
+                      "$title: ",
+                      fontWeight: 600,
+                      color: Colors.black,
+                    ),
                   ),
                   TextSpan(
-                      text: value, style: const TextStyle(color: Colors.black)),
+                    text: value,
+                    style: const TextStyle(color: Colors.black),
+                  ),
                 ],
               ),
             ),
@@ -357,46 +363,42 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
   }
 
   Future<void> _openEmployeeSelectionSheet() async {
-    // Open the existing EmployeeSelectionBottomSheet
     final result = await showModalBottomSheet<List<EmployeeModel>>(
       context: context,
       isScrollControlled: true,
       shape: const RoundedRectangleBorder(
         borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
       ),
-      builder: (context) => EmployeeSelectionBottomSheet(
+      builder: (context) {
+        return DraggableScrollableSheet(
+          expand: false,
+          initialChildSize: 0.85,
+          minChildSize: 0.6,
+          maxChildSize: 1.0,
+          builder: (_, scrollController) {
+            return Container(
+              decoration: const BoxDecoration(
+                color: Colors.white,
+                borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
+              ),
+
+              child: MultipleSelectRoleBottomSheet(
+                projectId: selectedProjectId!,
+                organizationId: selectedOrganization?.id,
+                serviceId: selectedService?.id,
+                roleId: selectedRoleId,
                 initiallySelected: controller.selectedEmployees.toList(),
-        multipleSelection: true,
+                scrollController: scrollController,
-        title: 'Select Team Members',
               ),
             );
+          },
+        );
+      },
+    );
 
-    if (result == null) return;
+    if (result != null) {
-
-    // Merge returned employees into controller.uploadingStates & controller.selectedEmployees
-    // 1) Reset all uploadingStates to false, then set true for selected
-    controller.uploadingStates.forEach((key, rx) {
-      rx.value = false;
-    });
-
-    for (final emp in result) {
-      final idStr = emp.id.toString();
-      if (controller.uploadingStates.containsKey(idStr)) {
-        controller.uploadingStates[idStr]?.value = true;
-      } else {
-        // if uploadingStates doesn't have the id yet, add it (safe fallback)
-        controller.uploadingStates[idStr] = RxBool(true);
-      }
-    }
-
-    // 2) Update selectedEmployees list in controller
       controller.selectedEmployees.assignAll(result);
-
-    // 3) Call controller helper (keeps existing behavior)
-    try {
       controller.updateSelectedEmployees();
-    } catch (_) {
-      // If controller does not implement updateSelectedEmployees, ignore.
     }
   }
 
@@ -407,7 +409,8 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
       showAppSnackbar(
         title: "Team Required",
         message: "Please select at least one team member",
-          type: SnackbarType.error);
+        type: SnackbarType.error,
+      );
       return;
     }
 
@@ -416,7 +419,8 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
       showAppSnackbar(
         title: "Invalid Input",
         message: "Please enter a valid target number",
-          type: SnackbarType.error);
+        type: SnackbarType.error,
+      );
       return;
     }
 
@@ -434,7 +438,8 @@ class _AssignTaskBottomSheetState extends State<AssignTaskBottomSheet> {
       showAppSnackbar(
         title: "Description Required",
         message: "Please enter a description",
-          type: SnackbarType.error);
+        type: SnackbarType.error,
+      );
       return;
     }
 

lib/model/employees/multiple_select_bottomsheet.dart

@@ -159,6 +159,26 @@ class _EmployeeSelectionBottomSheetState
               final emp = results[index];
               final isSelected = _selectedEmployees.contains(emp);
 
+              Widget trailingWidget;
+
+              if (widget.multipleSelection) {
+                // Multiple selection → normal checkbox
+                trailingWidget = Checkbox(
+                  value: isSelected,
+                  onChanged: (_) => _toggleEmployee(emp),
+                  fillColor: MaterialStateProperty.resolveWith<Color>(
+                    (states) => states.contains(MaterialState.selected)
+                        ? Colors.blueAccent
+                        : Colors.white,
+                  ),
+                );
+              } else {
+                // Single selection → check circle
+                trailingWidget = isSelected
+                    ? const Icon(Icons.check_circle, color: Colors.blueAccent)
+                    : const Icon(Icons.circle_outlined, color: Colors.grey);
+              }
+
               return ListTile(
                 leading: CircleAvatar(
                   backgroundColor: Colors.blueAccent,
@@ -170,15 +190,7 @@ class _EmployeeSelectionBottomSheetState
                 ),
                 title: Text('${emp.firstName} ${emp.lastName}'),
                 subtitle: Text(emp.email),
-                trailing: Checkbox(
+                trailing: trailingWidget,
-                  value: isSelected,
-                  onChanged: (_) => _toggleEmployee(emp),
-                  fillColor: MaterialStateProperty.resolveWith<Color>(
-                    (states) => states.contains(MaterialState.selected)
-                        ? Colors.blueAccent
-                        : Colors.white,
-                  ),
-                ),
                 onTap: () => _toggleEmployee(emp),
                 contentPadding:
                     const EdgeInsets.symmetric(horizontal: 0, vertical: 4),

lib/model/employees/multiple_select_role_bottomsheet.dart

@@ -34,6 +34,251 @@ class MultipleSelectRoleBottomSheet extends StatefulWidget {
       _MultipleSelectRoleBottomSheetState();
 }
 
+class _MultipleSelectRoleBottomSheetState
+    extends State<MultipleSelectRoleBottomSheet> {
+  final RxList<EmployeeModel> _employees = <EmployeeModel>[].obs;
+  final RxList<EmployeeModel> _filtered = <EmployeeModel>[].obs;
+  final RxBool _isLoading = true.obs;
+
+  late RxList<EmployeeModel> _selected;
+  final TextEditingController _searchController = TextEditingController();
+
+  late DailyTaskPlanningController controller;
+
+  @override
+  void initState() {
+    super.initState();
+    _selected = widget.initiallySelected.obs;
+    controller = Get.find<DailyTaskPlanningController>();
+    _fetchEmployeesFiltered();
+  }
+
+  Future<void> _fetchEmployeesFiltered() async {
+    _isLoading.value = true;
+    try {
+      List<EmployeeModel> employees = controller.employees.toList();
+
+      if (widget.roleId != null && widget.roleId!.isNotEmpty) {
+        employees = employees
+            .where((emp) => emp.jobRoleID == widget.roleId)
+            .toList();
+      }
+
+      // Selected first
+      employees.sort((a, b) {
+        final aSel = _selected.any((e) => e.id == a.id) ? 0 : 1;
+        final bSel = _selected.any((e) => e.id == b.id) ? 0 : 1;
+        return aSel != bSel
+            ? aSel.compareTo(bSel)
+            : a.name.toLowerCase().compareTo(b.name.toLowerCase());
+      });
+
+      _employees.assignAll(employees);
+      _filtered.assignAll(employees);
+    } catch (e) {
+      print("Error fetching employees: $e");
+    } finally {
+      _isLoading.value = false;
+    }
+  }
+
+  void _onSearch(String text) {
+    if (text.isEmpty) {
+      _filtered.assignAll(_employees);
+    } else {
+      _filtered.assignAll(
+        _employees.where((e) =>
+            e.name.toLowerCase().contains(text.toLowerCase()) ||
+            e.designation.toLowerCase().contains(text.toLowerCase())),
+      );
+    }
+
+    // Selected on top
+    _filtered.sort((a, b) {
+      final aSel = _selected.any((e) => e.id == a.id) ? 0 : 1;
+      final bSel = _selected.any((e) => e.id == b.id) ? 0 : 1;
+      return aSel != bSel
+          ? aSel.compareTo(bSel)
+          : a.name.toLowerCase().compareTo(b.name.toLowerCase());
+    });
+  }
+
+  void _onTap(EmployeeModel emp) {
+    if (widget.multipleSelection) {
+      if (_selected.any((e) => e.id == emp.id)) {
+        _selected.removeWhere((e) => e.id == emp.id);
+      } else {
+        _selected.add(emp);
+      }
+    } else {
+      _selected.assignAll([emp]);
+      Get.back(result: _selected);
+    }
+
+    _onSearch(_searchController.text.trim());
+  }
+
+  bool _isSelected(EmployeeModel emp) {
+    return _selected.any((e) => e.id == emp.id);
+  }
+
+  Widget _searchBar() => Padding(
+        padding: const EdgeInsets.symmetric(vertical: 8),
+        child: TextField(
+          controller: _searchController,
+          onChanged: _onSearch,
+          decoration: InputDecoration(
+            hintText: 'Search employees...',
+            filled: true,
+            fillColor: Colors.grey.shade100,
+            prefixIcon: const Icon(Icons.search, color: Colors.grey),
+            suffixIcon: _searchController.text.isNotEmpty
+                ? IconButton(
+                    icon: const Icon(Icons.close, color: Colors.grey),
+                    onPressed: () {
+                      _searchController.clear();
+                      _onSearch('');
+                    },
+                  )
+                : null,
+            contentPadding:
+                const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
+            border: OutlineInputBorder(
+              borderRadius: BorderRadius.circular(30),
+              borderSide: BorderSide.none,
+            ),
+          ),
+        ),
+      );
+
+  /// ⭐ NEW — Chips showing selected employees
+  Widget _selectedChips() {
+    return Obx(() {
+      if (_selected.isEmpty) return const SizedBox();
+
+      return Wrap(
+        spacing: 8,
+        runSpacing: 8,
+        children: _selected.map((emp) {
+          return Chip(
+            label: Text(emp.name),
+            deleteIcon: const Icon(Icons.close),
+            onDeleted: () {
+              _selected.remove(emp);
+              _onSearch(_searchController.text.trim());
+            },
+            backgroundColor: Colors.blue.shade50,
+          );
+        }).toList(),
+      );
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return BaseBottomSheet(
+      title: widget.title,
+      onCancel: () => Get.back(),
+      onSubmit: () => Get.back(result: _selected),
+      child: SizedBox(
+        height: MediaQuery.of(context).size.height * 0.55,
+        child: Column(
+          children: [
+            _searchBar(),
+
+            /// ⭐ Chips shown right below search bar
+            Padding(
+              padding: const EdgeInsets.symmetric(horizontal: 8),
+              child: _selectedChips(),
+            ),
+
+            const SizedBox(height: 6),
+
+            Expanded(
+              child: Obx(() {
+                if (_isLoading.value) {
+                  return SkeletonLoaders.employeeSkeletonCard();
+                }
+
+                if (_filtered.isEmpty) {
+                  return const Center(child: Text("No employees found"));
+                }
+
+                return ListView.builder(
+                  controller: widget.scrollController,
+                  padding: const EdgeInsets.only(bottom: 20),
+                  itemCount: _filtered.length,
+                  itemBuilder: (_, index) {
+                    final emp = _filtered[index];
+                    final isSelected = _isSelected(emp);
+
+                    return ListTile(
+                      onTap: () => _onTap(emp),
+                      leading: CircleAvatar(
+                        backgroundColor: Colors.blueAccent,
+                        child: Text(
+                          emp.name.isNotEmpty ? emp.name[0].toUpperCase() : "?",
+                          style: const TextStyle(color: Colors.white),
+                        ),
+                      ),
+                      title: Text(emp.name),
+                      subtitle: Text(emp.designation),
+                      trailing: Checkbox(
+                        value: isSelected,
+                        onChanged: (_) => _onTap(emp),
+                      ),
+                      contentPadding: const EdgeInsets.symmetric(
+                        horizontal: 4,
+                        vertical: 6,
+                      ),
+                    );
+                  },
+                );
+              }),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+import 'package:marco/helpers/utils/base_bottom_sheet.dart';
+import 'package:marco/helpers/widgets/my_custom_skeleton.dart';
+import 'package:marco/model/employees/employee_model.dart';
+import 'package:marco/controller/task_Planning/daily_task_Planning_controller.dart';
+
+class MultipleSelectRoleBottomSheet extends StatefulWidget {
+  final String title;
+  final bool multipleSelection;
+
+  final String projectId;
+  final String? serviceId;
+  final String? organizationId;
+  final String? roleId;
+  final ScrollController? scrollController;
+
+  final List<EmployeeModel> initiallySelected;
+
+  const MultipleSelectRoleBottomSheet({
+    super.key,
+    this.title = "Select Employees",
+    this.multipleSelection = true,
+    required this.projectId,
+    this.serviceId,
+    this.organizationId,
+    this.roleId,
+    this.initiallySelected = const [],
+    this.scrollController,
+  });
+
+  @override
+  State<MultipleSelectRoleBottomSheet> createState() =>
+      _MultipleSelectRoleBottomSheetState();
+}
+
 class _MultipleSelectRoleBottomSheetState
     extends State<MultipleSelectRoleBottomSheet> {
   final RxList<EmployeeModel> _employees = <EmployeeModel>[].obs;

lib/model/finance/add_payment_request_bottom_sheet.dart

@@ -261,7 +261,7 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
                             ? null
                             : "Enter valid amount"),
                     _gap(),
-                    _buildPayeeAutocompleteField(),
+                    _buildPayeeField(),
                     _gap(),
                     _buildDropdown(
                       "Currency",
@@ -420,67 +420,27 @@ class _PaymentRequestBottomSheetState extends State<_PaymentRequestBottomSheet>
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        SectionTitle(
+        const SectionTitle(
-            icon: Icons.person_outline, title: "Payee", requiredField: true),
+          icon: Icons.person_outline,
-        const SizedBox(height: 6),
+          title: "Payee",
-        Autocomplete<String>(
+          requiredField: true,
-          optionsBuilder: (textEditingValue) {
-            final query = textEditingValue.text.toLowerCase();
-            return query.isEmpty
-                ? const Iterable<String>.empty()
-                : controller.payees
-                    .where((p) => p.toLowerCase().contains(query));
-          },
-          displayStringForOption: (option) => option,
-          fieldViewBuilder:
-              (context, fieldController, focusNode, onFieldSubmitted) {
-            WidgetsBinding.instance.addPostFrameCallback((_) {
-              if (fieldController.text != controller.selectedPayee.value) {
-                fieldController.text = controller.selectedPayee.value;
-                fieldController.selection = TextSelection.fromPosition(
-                    TextPosition(offset: fieldController.text.length));
-              }
-            });
-
-            return TextFormField(
-              controller: fieldController,
-              focusNode: focusNode,
-              decoration: InputDecoration(
-                hintText: "Type or select payee",
-                filled: true,
-                fillColor: Colors.grey.shade100,
-                contentPadding:
-                    const EdgeInsets.symmetric(horizontal: 12, vertical: 14),
-                border: OutlineInputBorder(
-                  borderRadius: BorderRadius.circular(8),
-                  borderSide: BorderSide(color: Colors.grey.shade300),
-                ),
-              ),
-              validator: (v) =>
-                  v == null || v.trim().isEmpty ? "Please enter payee" : null,
-              onChanged: (val) => controller.selectedPayee.value = val,
-            );
-          },
-          onSelected: (selection) => controller.selectedPayee.value = selection,
-          optionsViewBuilder: (context, onSelected, options) => Material(
-            color: Colors.white,
-            elevation: 4,
-            borderRadius: BorderRadius.circular(8),
-            child: ConstrainedBox(
-              constraints: const BoxConstraints(maxHeight: 200, minWidth: 300),
-              child: ListView.builder(
-                padding: EdgeInsets.zero,
-                itemCount: options.length,
-                itemBuilder: (_, index) => InkWell(
-                  onTap: () => onSelected(options.elementAt(index)),
-                  child: Container(
-                    padding: const EdgeInsets.symmetric(
-                        vertical: 10, horizontal: 12),
-                    child: Text(options.elementAt(index),
-                        style: const TextStyle(fontSize: 14)),
-                  ),
         ),
+        MySpacing.height(6),
+        GestureDetector(
+          onTap: _showPayeeSelector,
+          child: TileContainer(
+            child: Row(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: [
+                Expanded(
+                  child: Obx(() => Text(
+                        controller.selectedPayee.value?.name ?? "Select Payee",
+                        style: const TextStyle(fontSize: 15),
+                        overflow: TextOverflow.ellipsis,
+                      )),
                 ),
+                const Icon(Icons.arrow_drop_down, size: 22),
+              ],
             ),
           ),
         ),