tango-app-ui-analyse-trax 3.9.2 → 3.9.3

package/src/lib/components/task-configure/task-configure.component.ts

@@ -0,0 +1,1603 @@
+import { Component, OnDestroy, OnInit, ViewChild, ElementRef, ChangeDetectorRef } from '@angular/core';
+import customParseFormat from 'dayjs/plugin/customParseFormat';
+import { TimePeriod } from 'ngx-daterangepicker-material/daterangepicker.component';
+import { BehaviorSubject, Subject, debounceTime, distinctUntilChanged, takeUntil } from "rxjs";
+import dayjs from 'dayjs';
+import utc from 'dayjs/plugin/utc';
+import { ActivatedRoute, Router } from '@angular/router';
+import { GlobalStateService, PageInfoService } from 'tango-app-ui-global';
+import { HeaderFilter, ITask, UserAssignDetails } from './task-configure.interface';
+import { TraxService } from '../../services/trax.service';
+import { FormArray, FormBuilder, FormControl } from '@angular/forms';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { TraxStoreComponent } from '../trax-store/trax-store.component';
+dayjs.extend(utc);
+import * as XLSX from 'xlsx';
+import { ToastService } from 'tango-app-ui-shared';
+import { TraxpopupComponent } from '../traxpopup/traxpopup.component';
+
+
+dayjs.extend(customParseFormat);
+@Component({
+  selector: 'lib-task-configure',
+  templateUrl: './task-configure.component.html',
+  styleUrl: './task-configure.component.scss'
+})
+export class TaskConfigureComponent implements OnInit, OnDestroy {
+  destroy$ = new Subject();
+  dayjs = dayjs
+  scheduleDate: any;
+  minDate: any = this.dayjs().format();
+  scheduleEndTime = new FormControl(this.getCurrentTime())
+  currentTaskId: string
+  headerData: HeaderFilter
+  taskDetails: ITask
+  approver = new FormControl()
+  priorityType = new FormControl('high')
+  allowedStoreLocation = new FormControl(false)
+  restrictAttendance = new FormControl(false)
+  approversList: { name: string, value: string }[]
+  assignTableApiState = new BehaviorSubject<'initial' | 'loading' | 'loaded'>('loading')
+  assignTableData: UserAssignDetails[] | null | undefined
+  itemsPerPage = 5
+  currentPage = 1
+  totalItems = 0
+  configData: any;
+  storeCoverage: boolean = true;
+  userCoverage: boolean = false;
+  reupload: boolean = false;
+  userData: any = [];
+  listofId: any;
+  excelUserData: any = [];
+  assignType: any;
+  initialLoading: boolean = true;
+  assignSingle: any; assignGroup: any;
+  singleAssign: any;
+  groupAssign:any;
+  paginationSizes = [5, 10, 20, 30]
+  pageSize = 5
+  searchInput = new FormControl('')
+  selectAllInput = new FormControl(false)
+  removedUsers = new Set()
+  added = []
+  removed = []
+  @ViewChild('file') fileInput!: ElementRef;
+  @ViewChild('file1') fileInput1!: ElementRef;
+  @ViewChild('bulkupload') bulkupload: any;
+  @ViewChild('afterValidation') afterValidation: any;
+  @ViewChild('confirmUser') confirmUser: any;
+
+  reminderRepeatSchedules: FormArray;
+  reminderRepeatScheduleOptions = [30, 45, 60, 75, 90]
+  
+
+  constructor(private route: ActivatedRoute, private pageInfo: PageInfoService,
+    private traxService: TraxService, private dialog: NgbModal, private toastService: ToastService, private router: Router, private cd: ChangeDetectorRef, private fb: FormBuilder) {
+    this.headerData = JSON.parse(localStorage.getItem('header-filters') as string)
+
+    this.searchInput.valueChanges.pipe(takeUntil(this.destroy$)).pipe(debounceTime(1000), distinctUntilChanged()).subscribe((val) => {
+      if (val === null || val === undefined) {
+        return
+      }
+    })
+
+    this.selectAllInput.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((val) => {
+      if (val === null || val === undefined) {
+        return
+      }
+      if (val) {
+        this.assignTableData?.forEach(val => val.checkFlag = true)
+        this.removedUsers.clear()
+      } else {
+        this.assignTableData?.forEach(val => { val.checkFlag = false, this.onUserAssignChange(val.checkFlag, val.id) })
+      }
+    })
+
+    this.reminderRepeatSchedules = this.fb.array([])
+
+  }
+
+  ngOnDestroy(): void {
+    this.destroy$.next(true);
+    this.destroy$.complete();
+  }
+
+  ngOnInit(): void {
+    this.scheduleDate = { startDate: this.dayjs().format('DD-MM-YYYY'), endDate: this.dayjs().format('DD-MM-YYYY') };
+    this.setPageData()
+    this.route.queryParams
+      .pipe(takeUntil(this.destroy$))
+      .subscribe((params) => {
+        if (params?.taskId) {
+          this.currentTaskId = params.taskId
+          this.getTask(this.currentTaskId)
+          this.getClientUser();
+          this.selectInitialTab();
+        }
+      });
+  }
+
+  setPageData() {
+    this.pageInfo.setTitle("Tasks");
+    this.pageInfo.setDescription("");
+    this.pageInfo.setBreadcrumbs([
+      { title: "Tango Trax", path: "/manage/trax/dashboard", isActive: false, isSeparator: false },
+      { title: "Tango Trax", path: "/manage/trax/dashboard", isActive: false, isSeparator: true }
+    ]);
+  }
+
+  getTask(id: string) {
+    this.traxService.getTaskconfig(id, this.headerData?.client!).pipe(takeUntil(this.destroy$)).subscribe({
+      next: (res: any) => {
+        if (res?.code === 200) {
+          this.configData = res?.data;
+          this.taskDetails = res.data.checkListDetails
+          this.taskDetails.assign = [];
+          // this.idList = this.configData.checkListDetails.assignedusers;
+          // this.listofId = this.configData.checkListDetails.assignedusers;
+          this.coverage = this.configData.checkListDetails.coverage;
+          this.selectRadio(this.coverage)
+          if (this.taskDetails?.scheduleDate) {
+            if (dayjs(this.taskDetails.scheduleDate).isBefore(dayjs())) {
+              this.minDate = this.dayjs(this.taskDetails.scheduleDate).format()
+            }
+            this.scheduleDate = { startDate: this.dayjs(this.taskDetails.scheduleDate).utc().format('DD-MM-YYYY'), endDate: this.dayjs(this.taskDetails.scheduleDate).utc().format('DD-MM-YYYY') };
+          }
+          if (!this.taskDetails?.removedUsers?.length) {
+            this.selectAllInput.setValue(true, { emitEvent: false })
+          }
+          if (this.taskDetails?.scheduleEndTime) {
+            this.scheduleEndTime.setValue(dayjs(this.taskDetails?.scheduleEndTime, 'hh:mm A').format('HH:mm'))
+          }
+
+          if (this.taskDetails?.approver?.length) {
+            this.approver.setValue(this.taskDetails?.approver)
+          }
+
+          if (this.taskDetails?.priorityType) {
+            this.priorityType.setValue(this.taskDetails?.priorityType)
+          }
+
+          if (this.taskDetails?.allowedStoreLocation === true || this.taskDetails?.allowedStoreLocation === false) {
+            this.allowedStoreLocation.setValue(this.taskDetails?.allowedStoreLocation)
+          }
+
+          if (this.taskDetails?.restrictAttendance === true || this.taskDetails?.restrictAttendance === false) {
+            this.restrictAttendance.setValue(this.taskDetails?.restrictAttendance)
+          }
+
+          if (this.taskDetails?.remainder?.length) {
+            this.reminderRepeatSchedules.clear()
+            this.taskDetails?.remainder.forEach((item) => {
+              this.reminderRepeatSchedules.push(this.fb.control(item))
+            })
+          }
+
+        }
+      }
+    })
+  }
+
+  selectedTab(value:any) {
+    this.tableArray = [];
+    this.assignTableData = [];
+    this.assignType = value;
+    this.currentPage = 1;
+    this.pageSize = 5;
+    this.searchInput.setValue('');
+    this.configData.checkListDetails.assign = [];
+    this.getassignDropdown();
+  }
+
+  selectInitialTab() {
+    this.storeCoverage ? this.assignType = 'store' : this.assignType = 'user'
+  }
+
+  getCurrentTime(): string {
+    // const now = new Date();
+    // const hours = now.getHours().toString().padStart(2, '0');
+    // const minutes = now.getMinutes().toString().padStart(2, '0');
+    // return `${hours}:${minutes}`;
+    return '23:59';
+  }
+
+  get dueDateFormatted(): string {
+    return this.dayjs(this.scheduleDate.startDate, 'DD-MM-YYYY')?.format('DD MMM YYYY');
+  }
+
+  get dueTimeFormatted(): string {
+    return dayjs(this.scheduleEndTime.value, 'HH:mm').format('h:mm A');
+  }
+
+  getClientUser() {
+    this.traxService.getClientUser(this.headerData.client).pipe(takeUntil(this.destroy$)).subscribe((res: any) => {
+      if (res && res.code == 200 && res.data.length) {
+        this.approversList = res.data.map((item: any) => { return { name: item.userName, value: item.email, role: item.role } });
+        if (!this.taskDetails?.approver?.length) {
+          let userInfo = JSON.parse(localStorage.getItem('user-info') || '{}');
+          if (userInfo?.userType == 'tango' || (userInfo?.userType == 'client' && userInfo?.role == 'user')) {
+            let userList = this.approversList.find((ele: any) => ele.role == 'superadmin');
+            if (userList) {
+              this.approver.setValue([{ name: userList.name, value: userList.value }])
+            }
+          }
+          else {
+            this.approver.setValue([this.approversList.find((ele: any) => ele.value == userInfo.email)])
+          }
+        }
+      }
+      else {
+        this.approversList = [];
+      }
+    });
+  }
+
+  onSubmit(action: 'save' | 'publish') {
+    const payload: any = {
+      scheduleDate: this.dayjs(this.scheduleDate.startDate, 'DD-MM-YYYY').format('YYYY-MM-DD'),
+      scheduleEndTime: this.dayjs(this.scheduleEndTime.value, 'HH:mm').format('hh:mm A'),
+      approver: this.approver.value ?? [],
+      priorityType: this.priorityType.value,
+      allowedStoreLocation: this.allowedStoreLocation.value,
+      restrictAttendance: this.restrictAttendance.value,
+      clientId: this.headerData?.client,
+      submitType: action,
+      _id: this.taskDetails?._id,
+      removedUsers: [...this.removedUsers],
+      remainder: this.reminderRepeatSchedules?.value || [],
+      ...(action === 'publish') ? { publish: true } : { publish: false },
+      assignedUsers: [...this.singleAssign, ...this.groupAssign],
+      storeCount : this.assignSingle?.length + this.groupAssign?.length,
+      coverage: this.coverage,
+      added:this.added,
+      removed:this.removed
+    }
+    if (action === 'publish') {
+      let popupcontent = {
+        displayprop: false,
+        imagesrc: `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#D1FADF"/><path d="M38 27.0818V28.0018C37.9988 30.1582 37.3005 32.2565 36.0093 33.9836C34.7182 35.7108 32.9033 36.9743 30.8354 37.5857C28.7674 38.1971 26.5573 38.1237 24.5345 37.3764C22.5117 36.6291 20.7847 35.2479 19.611 33.4389C18.4373 31.6299 17.8798 29.4899 18.0217 27.3381C18.1636 25.1864 18.9972 23.1381 20.3983 21.4989C21.7994 19.8596 23.6928 18.7172 25.7962 18.242C27.8996 17.7667 30.1003 17.9842 32.07 18.8618M38 20.0018L28 30.0118L25 27.0118" stroke="#039855" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#ECFDF3" stroke-width="8"/></svg>`,
+        title: `Are you sure you want to publish ${this.taskDetails?.checkListName} task?`,
+        content: `Publishing will make this task live, and changes will take effect immediately.`,
+        buttontype: 'confirm'
+      }
+      const dialogRef = this.dialog.open(TraxpopupComponent, { centered: true, size: 'md' });
+      dialogRef.componentInstance.data = popupcontent;
+      dialogRef.result.then((res) => {
+        if (res == 'confirm') {
+          this.traxService.configTask(payload).pipe(takeUntil(this.destroy$)).subscribe({
+            next: (res: any) => {
+              if (res.code === 200) {
+                if (action) {
+                  this.toastService.getSuccessToast(res?.data?.message || 'Configuration updated successfully')
+                  this.router.navigate(['manage/trax/checklist/managetask'])
+                }
+              }
+            },
+            error: (err: any) => {
+              this.toastService.getErrorToast(err?.error?.error?.message || 'Something went wrong')
+            }
+          })
+        }
+      });
+
+    } else if (action === 'save') {
+      const dialogRef = this.dialog.open(TraxpopupComponent, { centered: true, size: 'md' });
+      dialogRef.componentInstance.data = {
+        imagesrc: `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>`,
+        title: `Unsaved changes`,
+        content: `Do you want to save as draft?`,
+        buttontype: 'draft'
+      }
+      dialogRef.result.then((res) => {
+        if (res === 'confirm') {
+          this.traxService.configTask(payload).pipe(takeUntil(this.destroy$)).subscribe({
+            next: (res: any) => {
+              if (res.code === 200) {
+                if (action) {
+                  this.toastService.getSuccessToast(res?.data?.message || 'Configuration updated successfully')
+                  this.router.navigate(['manage/trax/checklist/managetask'])
+                }
+              }
+            },
+            error: (err: any) => {
+              this.toastService.getErrorToast(err?.error?.error?.message || 'Something went wrong')
+            }
+          })
+        }
+
+      });
+    }
+
+  }
+
+  detassignUpdate(action: 'save' | 'publish') {
+    const payload = {
+        "taskId": this.currentTaskId,
+        "assignedList": this.assignSingle || [],
+        "assignedGroup": this.assignGroup || [],
+        "clientId": this.headerData?.client,
+        "coverage": this.coverage
+    }
+
+    this.traxService.assigntaskUpdate(payload).pipe(takeUntil(this.destroy$)).subscribe({
+      next:(res:any)=> {
+        if (res && res?.code == 200) {
+          this.added = res?.data?.added;
+          this.removed = res?.data?.removed;
+             this.onSubmit(action)
+          }
+      },
+      error:(err:any)=> {
+        this.toastService.getErrorToast(err);
+      },
+    })
+
+  }
+
+  onApproveAdded(event: any) {
+    this.approver.setValue(event)
+  }
+
+  idList: any = [];
+
+  getInitialData(data: any,change?: any) {
+    let tempId = data.map((el:any) => el?.id)
+    let res = this.storeList.filter((el: any) => tempId.includes(el?._id));
+    res.forEach((element: any) => element.isSelected = true);
+    this.taskDetails.assign = res;
+    if (this.assignType === 'store' || this.assignType === 'user') {
+      this.assignTableApiState.next('loaded')
+      // this.userDetails(), 
+      // (this.assignType === 'store' && this.initialLoading) ? (this.initialLoading = false) : this.getTableData(change ? change : '');
+      this.idList = this.singleAssign;
+    } else {
+      this.idList = this.groupAssign;
+      this.userDetailsV2()
+    }
+  }
+  
+  getTableData(change?: any) {
+    let count = 0;
+    if (this.assignSingle?.length) {
+      if (this.taskDetails.assign.length != this.assignSingle.length) {
+        count++;
+      }
+      this.taskDetails.assign.forEach((assign:any) => {
+        let findList = this.assignSingle.filter((item: any) => item.storeId == assign.storeId);
+        if (findList.length) {
+          if (findList.length > 1) {
+            count++;
+          }
+          else {
+            if (assign.userEmail.toLowerCase() != findList[0].userEmail.toLowerCase() && this.coverage === 'store') {
+              assign.userEmail = findList[0].userEmail;
+              assign.userName = findList[0].userName;
+              count++;
+            } 
+          }
+        }
+      })
+      if (count) {
+        this.upload = change ? 'upload' : 'store';
+      }
+    }
+    // this.tableArray = this.assignSingle ? this.assignSingle : this.taskDetails.assign;
+    
+    change ? this.tableArray = this.assignSingle : [];
+
+    if (this.upload === 'store') {
+      let table = [...this.tableArray, ...this.taskDetails.assign];
+      
+      let uniqueTable = new Map();
+      
+      // Convert objects to JSON strings for full comparison
+      table.forEach((item: any) => {
+        item = {
+          storeName: item?.storeName,
+          storeId: item.storeId,
+          userEmail: item.userEmail.toLowerCase(),
+          userName: item.userName,
+          _id:item._id
+        }
+        let data = {
+          _id: item._id,
+          ...(this.storeCoverage)? { userEmail: item.userEmail.toLowerCase() ,storeName: item?.storeName}:{},
+        } 
+        let key = JSON.stringify(data); // Convert entire object to string as a key
+        if (!uniqueTable.has(data)) {
+          uniqueTable.set(key, item); // Store the object only if it's completely unique
+        }
+      });
+      this.assignSingle = Array.from(uniqueTable.values());
+      
+      this.tableArray = this.assignSingle;
+    } else if (this.upload === 'upload') {
+      this.tableArray = this.assignSingle;
+    } else {
+      this.tableArray = this.taskDetails.assign;
+      this.assignSingle = this.tableArray;
+    }
+    
+    // this.tableArray?.length ? this.assignTableApiState.next('loaded') : this.assignTableApiState.next('loading');
+    this.totalItems = this.tableArray.length;
+    if(this.totalItems < 5) {
+      this.paginationSizes = [this.totalItems];
+      this.pageSize = this.totalItems;
+    }
+    else {
+      this.paginationSizes = [5,10,15,20];
+      this.pageSize = 5;
+    }
+    this.assignTableApiState.next('loaded')
+    this.assignTableData = this.tableArray.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+  }
+  
+  coverage: any = 'store';
+
+  selectRadio(data: any) {
+    this.coverage = data;
+    this.currentPage = 1;
+    this.pageSize = 5;
+    this.searchInput.setValue('');
+    this.taskDetails.assign = [];
+    this.tableArray = [];
+    this.assignTableData = [];
+    if (data === 'store') {
+      this.storeCoverage = true;
+      this.userCoverage = false;
+    } else if (data === 'user') {
+      this.userCoverage = true;
+      this.storeCoverage = false;
+    }
+    this.selectInitialTab();
+    if (this.coverage === this.configData.checkListDetails.coverage) {
+      this.singleAssign = this.configData.checkListDetails.singleAssign;
+      this.groupAssign = this.configData.checkListDetails.groupAssign;
+      setTimeout(() => {
+        this.assignType ? this.userDetails() : '';
+      }, 3000);
+    } else {
+      this.singleAssign = []; this.groupAssign = []; this.assignSingle = [], this.assignGroup = []; this.assignTableApiState.next('loading');
+    }
+    this.getassignDropdown();
+  }
+
+  confirmUserpopup() {
+    const dialogRef = this.dialog.open(this.confirmUser, { centered: true, backdrop: 'static' })
+    dialogRef.closed.subscribe((res: any) => {
+      if (res === 'confirm') {
+        this.validateDetails('addUser')
+      }
+    })
+  }
+
+  storeList: any = [];
+  searchKey: any = [];
+
+  getassignDropdown(change?:any) {
+    let data = {
+      "clientId": this.headerData?.client,
+      "coverage": this.coverage,
+      "assignType": this.assignType
+    }
+    this.storeList = [];
+    this.traxService.getassignDropdown(data).subscribe((res: any) => {
+      if (res && res.code == 200 && res.data.data.length) {
+        this.storeList = res?.data?.data;
+        if (data?.coverage === 'store') {
+          this.searchKey = ['storeName', 'clusterName']
+        } else if (data?.coverage === 'user') {
+          this.searchKey = ['userName', 'teamName']
+        }
+        !change ? this.getInitialData((this.assignType === 'store' || this.assignType === 'user') ? this.singleAssign : this.groupAssign, change ? change : '') : '';
+        this.cd.detectChanges();
+      }
+      else {
+        this.storeList = [];
+      }
+    });
+  }
+
+  userDetailsV2(data?: any) {
+    const payload = {
+      "taskId": this.currentTaskId,
+      "idList": this.idList,
+      "coverage": this.coverage, //["cluster","store","user","teams"]
+      "clientId": this.headerData?.client,
+      "search": this.searchInput.value
+    }
+    this.assignTableApiState.next('loading')
+    this.tableArray = [];
+    this.assignTableData = [];
+    this.traxService.selecttaskChips(payload).pipe(takeUntil(this.destroy$)).subscribe({
+      next: (res: any) => {
+        if (res && res?.code === 200) {
+          this.assignTableApiState.next('loaded')
+          this.tableArray = res?.data?.uniqueArr; 
+          this.assignGroup = this.tableArray;
+          this.totalItems = res?.data?.count;
+          if (this.totalItems < 5) {
+            this.paginationSizes = [this.totalItems];
+            this.pageSize = this.totalItems;
+          }
+          else {
+            this.paginationSizes = [5, 10, 15, 20];
+            this.pageSize = 5;
+          }
+
+          this.assignTableData = this.tableArray.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+          // console.log('assignTableData?.length', this.assignTableData?.length)
+        }
+        else {
+          this.tableArray = [];
+          this.assignTableData = [];
+          this.assignTableApiState.next('loaded')
+          // this.showImage = true;
+          // this.tableLoading = true;
+        }
+        // this.storeCoverage ? this.getInitialData(res?.data?.storeList) : this.getInitialData(res?.data?.userList);
+      },
+      error: (err: any) => {
+        this.tableArray = [];
+          this.assignTableData = [];
+          this.assignTableApiState.next('loaded')
+        this.toastService.getErrorToast(err?.message)
+      },
+    })
+  }
+
+  userDetails() {
+    this.pageSize = 5;
+    this.assignTableApiState.next('loading')
+    let params = {
+      id: this.currentTaskId,
+      clientId: this.headerData?.client
+    }
+    this.traxService.gettaskUserDetailsV1(params).pipe(takeUntil(this.destroy$)).subscribe((res: any) => {
+      this.assignTableApiState.next('loaded')
+      let count = 0;
+      if (res == null) {
+        // this.showImage = true;
+        if (this.searchInput.value)
+        this.tableArray = [];
+        this.assignTableData = [];
+      }
+      if (res && res.code == 200) {
+        this.assignTableApiState.next('loaded')
+        if (this.storeCoverage) {
+          this.tableArray = res.data.userDetails.filter((el: any) => el?.clusterName == '' && el?.storeId != '');
+          this.assignGroup = res.data.userDetails.filter((el: any) => el?.clusterName !== '');
+        } else if (this.userCoverage) {
+          this.tableArray = res.data.userDetails.filter((el: any) => el?.teamName == '' && el?.userName != '');
+          this.assignGroup = res.data.userDetails.filter((el: any) => el?.teamName !== '');
+        }
+        this.assignSingle = this.tableArray;
+        this.totalItems = this.tableArray.length;
+        // this.totalItems = res.data.count;
+        if(this.totalItems < 5) {
+          this.paginationSizes = [this.totalItems];
+          this.pageSize = this.totalItems;
+        }
+        else {
+          this.paginationSizes = [5,10,15,20];
+          this.pageSize = 5;
+        }
+        this.assignTableData = this.tableArray.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+        this.assignTableData ? this.assignTableApiState.next('loaded') : this.assignTableApiState.next('loading')
+
+        // this.getInitialData();
+      }
+    })
+  }
+
+
+  sortColumn: any;
+  sortBy: any = -1;
+
+  sortData(value: any) {
+    this.sortColumn = value;
+    this.sortBy *= -1;
+    const sortBy = parseInt(this.sortBy, 10) === -1 ? -1 : 1;
+    this.tableArray.sort((a: any, b: any) => {
+      // if (a[this.sortColumn] == null || b[this.sortColumn] == null) return 0;
+      // if (typeof a[this.sortColumn] === 'string' && typeof b[this.sortColumn] === 'string') {
+        return sortBy * (a[this.sortColumn] || '').localeCompare(b[this.sortColumn] || '');
+      // }
+    });
+    
+    this.assignTableData = this.tableArray.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+  }
+
+  getAssignTable(): void {
+    this.assignTableApiState.next('loading')
+    const query: Record<string, any> = {
+      "clientId": this.headerData?.client,
+      "limit": this.pageSize,
+      "offset": this.currentPage > 0 ? this.currentPage - 1 : 0,
+      "search": this.searchInput.value,
+      "taskId": this.currentTaskId
+    }
+
+
+    this.traxService.getTaskUserDetails(query).pipe(takeUntil(this.destroy$)).subscribe({
+      next: (res: any) => {
+        this.assignTableApiState.next('loaded')
+        if (res?.data?.count) {
+          this.totalItems = res.data.count
+        } else {
+          this.totalItems = 0
+        }
+        if (res?.data?.users) {
+          this.assignTableData = res.data.users
+        } else {
+          this.assignTableData = []
+        }
+      },
+      error: (e) => {
+        this.assignTableApiState.next('loaded')
+
+      }
+    })
+  }
+
+  onPageSizeChange(pageSize: any) {
+    this.currentPage = 1;
+    this.itemsPerPage = pageSize;
+    this.pageSize = pageSize;
+    this.assignTableData = [];
+
+    if (this.searchInput.value) {
+      this.totalItems = this.searchTable.length;
+      if (this.totalItems < 5) {
+        this.paginationSizes = [this.totalItems];
+        this.pageSize = this.totalItems;
+      }
+      else {
+        this.paginationSizes = [5, 10, 15, 20];
+        // this.size = 5;
+      }
+      this.assignTableData = this.searchTable.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+      // this.assignTableData ? this.tableLoading = false : this.tableLoading = true;
+       
+    } else {
+      this.assignTableData = this.tableArray.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+      // this.assignTableData ? this.tableLoading = false : this.tableLoading = true;
+    }
+  }
+
+  onPageChange(pageOffset: any) {
+    this.currentPage = pageOffset
+    this.assignTableData = [];
+
+    if (this.searchInput.value) {
+      // this.searchTableData();
+      this.totalItems = this.searchTable.length;
+      if(this.totalItems < 5) {
+        this.paginationSizes = [this.totalItems];
+        this.pageSize = this.totalItems;
+      }
+      else {
+        this.paginationSizes = [5,10,15,20];
+        this.pageSize = 5;
+      }
+      this.assignTableData = this.tableArray.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+      // this.tableData ? this.tableLoading = false : this.tableLoading = true;
+    } else {
+      this.assignTableData = this.tableArray.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+    // this.tableData ? this.tableLoading = false : this.tableLoading = true;
+    }
+    // this.assignTableData ? this.tableLoading = false : this.tableLoading = true;
+    // this.getAssignTable()
+  }
+
+  searchTable: any;
+  searchTableData() {
+    this.assignTableData = [];
+    this.pageSize = 5;
+    this.currentPage = 1;
+    // this.tableLoading = true;
+    let searchField: any = ['storeName', 'userName', 'userEmail', 'clusterName', 'teamName'];
+    if (!this.searchInput.value) {
+      (this.assignType === 'store' || this.assignType === 'user') ? (this.singleAssign = this.idList,this.getTableData()) : (this.groupAssign = this.idList,this.userDetailsV2());
+    } else {  
+      const searchData = this.searchInput.value.toLowerCase();
+      const searchTerm = searchData.split(',').map((el: any) => el.trim());
+      this.searchTable = this.tableArray?.filter((item: any) =>
+        searchField.some((field: any) => searchTerm.some((term: any) => item[field]?.toLowerCase().includes(term))));
+      this.totalItems = this.searchTable.length;
+      if (this.totalItems < 5) {
+        this.paginationSizes = [this.totalItems];
+        this.pageSize = this.totalItems;
+      }
+      else {
+        this.paginationSizes = [5, 10, 15, 20];
+        this.pageSize = 5;
+      }
+      this.assignTableData = this.searchTable.slice((this.currentPage * this.pageSize) - this.pageSize, this.currentPage * this.pageSize);
+    }
+    this.assignTableData ? this.assignTableApiState.next('loaded') : this.assignTableApiState.next('loading');
+
+    // let params = {
+    //   offset: 0,
+    //   limit: this.size,
+    //   search: this.tableFilter,
+    //   id: this.checklistId,
+    //   clientId:this.clientId
+    // }
+    // if (this.tableFilter.length) {
+    //   this.SopService.getUserDetails(params).pipe(takeUntil(this.detach)).subscribe((res: any) => {
+    //     this.tableLoading = false;
+    //     if (res == null) {
+    //       this.showImage = true;
+    //       if (this.tableFilter.length)
+    //         this.showImage = false;
+    //       this.tableData = [];
+    //     }
+    //     if (res && res.code == 200) {
+    //       this.showImage = false;
+    //       this.tableData = res.data.users;
+    //       this.recordsCount = this.tableData.length;
+    //       this.recordsTotal = res.data.count;
+    //       let count = 0 ;
+    //       if(this.recordsTotal < 5) {
+    //         this.paginationSize = [this.recordsTotal]
+    //         this.size = this.recordsTotal;
+    //       }
+    //       else {
+    //         this.paginationSize = [5,10,15,20]
+    //         this.size = 5;
+    //       }
+    //       this.tableData.forEach((item:any) =>{
+    //         if(item.checkFlag && !this.configData.checkListDetails.assignedUsers.includes(item.id) && !this.removeUsers.includes(item.id))
+    //           this.configData.checkListDetails.assignedUsers.push(item.id);
+  
+    //         if (this.configData.checkListDetails.assignedUsers.includes(item.id)) {
+    //           count +=1;
+    //         }
+    //       })
+    //       if (count == this.recordsCount) {
+    //         this.selectAll = true;
+    //       }
+    //       else {
+    //         this.selectAll = false
+    //       }
+    //     }
+    //   })
+    // }
+    // else {
+    //   this.userDetails();
+    // }
+  }
+
+  dropDown: boolean = false;
+  openDropdown(event: any) {
+    this.dropDown = !this.dropDown;
+  }
+
+  bulkuploadModel() {
+    this.dropDown = false;
+    this.dialog.open(this.bulkupload, {
+      centered: true, backdrop: 'static'
+    })
+  }
+
+  excelError: any;
+
+  afterUplload(data?: any) {
+    this.excelError = data;
+    this.dialog.open(this.afterValidation, { centered: true, backdrop: 'static' })
+  }
+
+  onUserAssignChange(event: boolean, id: string) {
+    if (!event) {
+      this.removedUsers.add(id)
+    } else {
+      this.removedUsers.delete(id)
+    }
+  }
+
+  downloadTemplateV2() {
+    let excelData: any = [];
+      if (this.storeCoverage) {
+        if (this.tableArray == null || !this.tableArray?.length) {
+          if (this.assignType === 'store') {
+            excelData.push({
+              storeName: '',
+              userName: '',
+              userEmail: '',
+              userPhone: '',
+              city:''
+            }) 
+          } else {
+            excelData.push({
+              storeName: '',
+              userName: '',
+              userEmail: '',
+              clusterName: '',
+              userPhone: '',
+              city:''
+            })
+          }
+        }
+        if (this.tableArray && this.tableArray?.length) {
+          this.tableArray.forEach((item: any) => {
+            if (this.assignType === 'store') {
+              excelData.push({
+                storeName: item.storeName,
+                userName: item.userName,
+                userEmail: item.userEmail,
+                userPhone: item.userPhone,
+                city:item.city
+              })
+            } else {
+              excelData.push({
+                storeName: item.storeName,
+                userName: item.userName,
+                userEmail: item.userEmail,
+                clusterName: item.clusterName,
+                userPhone: item.userPhone,
+                city:item.city
+              })
+            }
+          })
+        }
+      } else if (this.userCoverage) {
+        if (this.tableArray == null || !this.tableArray?.length) {
+          if (this.assignType === 'user') {
+            excelData.push({
+              userName: '',
+              userEmail: '',
+              userPhone: '',
+            })
+          } else {
+            excelData.push({
+              userName: '',
+              userEmail: '',
+              teamName: '',
+              userPhone: '',
+            })
+          }
+        }
+        if (this.tableArray && this.tableArray?.length) {
+          this.tableArray.forEach((item: any) => {
+            if (this.assignType === 'user') {
+              excelData.push({
+                userName: item.userName,
+                userEmail: item.userEmail,
+                userPhone: item.userPhone,
+              })
+            } else {
+              excelData.push({
+                userName: item.userName,
+                userEmail: item.userEmail,
+                teamName: item.teamName,
+                userPhone: item.userPhone,
+              })
+            }
+          })
+        }
+      }
+      this.traxService.exportAsExcelFile(excelData, `CheckList_${this.assignType}_`);
+  }
+
+  downloadTemplate() {
+    let params = {
+      limit: 10000,
+      offset: 0,
+      taskId: this.currentTaskId,
+      search: this.searchInput.value,
+      clientId: this.headerData.client,
+    }
+    this.traxService.getTaskUserDetails(params).pipe(takeUntil(this.destroy$)).subscribe((res: any) => {
+      let excelData: any = [];
+      if (this.storeCoverage) {
+        if (res == null) {
+          excelData.push({
+            storeName: '',
+            clusterName: '',
+            userEmail: '',
+            userName: '',
+            userPhone: '',
+            city: ''
+          })
+        }
+        if (res && res.code == 200) {
+          res.data.users.forEach((item: any) => {
+            excelData.push({
+              storeName: item.storeName,
+              clusterName: item.clusterName,
+              userEmail: item.userEmail,
+              userName: item.userName,
+              userPhone: item.userPhone,
+              city: item.city
+            })
+          })
+        }
+      } else if (this.userCoverage) {
+        if (res == null) {
+          excelData.push({
+            // storeName: '',
+            teamName: '',
+            userEmail: '',
+            userName: '',
+            userPhone: '',
+            city:''
+          })
+        }
+        if (res && res?.code == 200) {
+          res?.data?.users.forEach((item: any) => {
+            excelData.push({
+              // storeName: item.storeName,
+              teamName: item.teamName,
+              userEmail: item.userEmail,
+              userName: item.userName,
+              userPhone: item.userPhone,
+              city:item.city
+            })
+          })
+        }
+      }
+      this.traxService.exportAsExcelFile(excelData, 'Task_Userlist_');
+    });
+  }
+
+  updateAssign(event: any) {
+    this.upload = '';
+    this.currentPage = 1;
+    // if (this.taskDetails) {
+      this.taskDetails.assign = event;
+      const assigneduser = event.map((el: any) => {
+        return {id: el?._id,type: el?.type}
+      })
+      // this.idList = event.map((el: any) => {
+      //   return el?._id
+    // })
+    this.idList = assigneduser;
+    this.searchInput.setValue('');
+    (this.assignType === 'store' || this.assignType === 'user') ? (this.singleAssign = this.idList,this.getTableData()) : (this.groupAssign = this.idList,this.userDetailsV2(event));
+  }
+ 
+  removedChip(event: any) {
+    this.tableArray = this.tableArray.filter((item:any) => !event.includes(item._id))
+    this.taskDetails.assign = this.taskDetails.assign.filter((item: any) => !event.includes(item._id))
+  }
+
+  tableArray: any = [];
+  excelData: any;
+  showUser: boolean = false;
+  showTeam: boolean = false;
+  showStore: boolean = false;
+  showCluster: boolean = false;
+
+  onFileUpload(event: any, reupload?: any) {
+      this.validatedStore = [];
+      this.validatedUser = [];
+      this.validatedCluster = [];
+      this.validatedTeam = [];
+      this.newUser = [];
+      this.inactiveStores = [];
+      this.showUser = false;
+      this.showTeam = false;
+      this.showStore = false;
+      this.showCluster = false;
+      this.showInactive = false;
+      this.currentPage = 1;
+      this.reupload = false;
+      this.upload = 'upload';
+      this.userData = this.excelUserData = [];
+      let data: any;
+      const target: DataTransfer = <DataTransfer>(event.target);
+      let isExcelFile = !!target.files[0].name.match(/(.xls|.xlsx)/);
+      let error: any = [];
+      let ValidationError: boolean = false;
+      if (isExcelFile) {
+        const reader: FileReader = new FileReader();
+        reader.readAsBinaryString(target.files[0]);
+        reader.onload = (e: any) => {
+          const bstr: string = e.target.result;
+          const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });
+          const wsname: string = wb.SheetNames[0];
+          const ws: XLSX.WorkSheet = wb.Sheets[wsname];
+          data = XLSX.utils.sheet_to_json(ws);
+          this.excelData = data;
+          if(!data.length || (data.some((item: any) => 'clusterName' in item || 'teamName' in item))) {
+            this.toastService.getErrorToast('Please Upload a Valid file.')
+            return;
+          }
+
+          const requiredKeys = this.storeCoverage ? ['storeName','userName', 'userEmail'] : ['userName', 'userEmail']; // Must always be present
+          const optionalKeys = this.storeCoverage ? ['userPhone', 'city'] : ['userPhone', 'city'];
+          
+          const isValid = data.some((item: any) => {
+            const keys = Object.keys(item);
+            const hasRequiredKeys = requiredKeys.every(key => keys.includes(key));
+            const allKeysAreAllowed = keys.every(key => 
+              requiredKeys.includes(key) || optionalKeys.includes(key)
+            );
+            return hasRequiredKeys && allKeysAreAllowed;
+          });
+
+          if (!isValid) {
+            this.toastService.getErrorToast('Please Upload a Valid file.');
+            return;
+          }
+  
+          data = data.filter((item:any) => {
+            return ((item?.storeName && item?.storeName.trim() != '' && item?.storeName.trim() != null) || (item?.userName && item?.userName.trim() != '' && item?.userName.trim() != null) || (item?.userEmail && item?.userEmail.trim() != '' && item?.userEmail.trim() != null))
+          })
+    
+          data.forEach((element: any, index: any) => {
+            if (element?.userEmail) {
+              element.userEmail = element?.userEmail.replace(/\s/g,'');
+            }
+            if (this.storeCoverage) {
+                if ((element.storeName && element.storeName.trim() == '') || element.storeName == null) {
+                  error.push(`Invalid StoreName - A${index+2}`)
+                }
+                if ((element.userName && element.userName.trim() == '') || element.userName == null) {
+                  error.push(`Invalid UserName - B${index+2}`)
+                }
+                if ((element.userEmail && element.userEmail.trim() == '') || element.userEmail == null) {
+                  error.push(`Invalid userEmail - C${index+2}`)
+                }
+                if (element?.userEmail && !element.userEmail.match(/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/)) {
+                  error.push(`Invalid userEmail - C${index+2}`)
+                }
+                if (element.clusterName) {
+                  if (element.clusterName.trim() == '' || element.clusterName == null) { error.push(`Invalid clusterName - D${index + 2}`) }
+                }
+  
+            } else if (this.userCoverage && !element?.storeName) {
+                if ((element.userName && element.userName.trim() == '') || element.userName == null) {
+                  error.push(`Invalid UserName - A${index+2}`)
+                }
+                if ((element.userEmail && element.userEmail.trim() == '') || element.userEmail == null) {
+                  error.push(`Invalid userEmail - B${index+2}`)
+                }
+                if (element?.userEmail && !element.userEmail.match(/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/)) {
+                  error.push(`Invalid userEmail - B${index+2}`)
+                } 
+                if (element.teamName) {
+                  if (element.teamName.trim() == '' || element.teamName == null) { error.push(`Invalid teamName - C${index + 2}`) }
+                }
+            } else {
+              this.toastService.getErrorToast('Please upload a valid file.')
+              ValidationError = true;
+            }
+            if (this.storeCoverage) {
+              if (this.assignType === 'store') {
+                this.userData.push({
+                  storeName: element?.storeName?.trim(),
+                  userName: element?.userName?.trim(),
+                  userEmail: element?.userEmail?.toLowerCase()?.trim(),
+                  userPhone: element?.userPhone,
+                  // checkFlag: element?.check ? element.check : false,
+                  city: element?.city,
+                  type:'store'
+                })
+              } else {
+                this.userData.push({
+                  storeName: element?.storeName?.trim(),
+                  userName: element?.userName?.trim(),
+                  userEmail: element?.userEmail?.toLowerCase()?.trim(),
+                  clusterName: element?.clusterName,
+                  userPhone: element?.userPhone,
+                  // checkFlag: element?.check ? element.check : false,
+                  city: element?.city,
+                  type:'cluster'
+                })
+              }
+            } else if (this.userCoverage) {
+              if (this.assignType === 'user') {
+                this.userData.push({
+                  userName: element?.userName?.trim(),
+                  userEmail: element?.userEmail?.toLowerCase()?.trim(),
+                  userPhone: element?.userPhone,
+                  // checkFlag: element?.check ? element.check : false,
+                  type:'user'
+                })
+              } else {
+                this.userData.push({
+                  userName: element?.userName?.trim(),
+                  userEmail: element?.userEmail?.toLowerCase()?.trim(),
+                  teamName: element?.teamName,
+                  userPhone: element?.userPhone,
+                  // checkFlag: element?.check ? element.check : false,
+                  type: 'teams'
+                })
+              }
+            }
+          })
+          
+          
+          if (error.length) {
+            this.dialog.dismissAll();
+            const popupcontent = {
+              displayprop: false,
+              imagesrc:  `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>`,
+              title: `Invalid details!`,
+              content: `Please provide correct and complete store information.`,
+              buttontype: 'error',
+              error:error
+            }
+            this.afterUplload(popupcontent)
+            return;
+          }
+          else {
+            !ValidationError ? this.afterUplload() : '';
+          }
+          if(this.fileInput) {
+            this.fileInput.nativeElement.value = '';
+          }
+          if(this.fileInput1) {
+            this.fileInput1.nativeElement.value = '';
+          }
+        };
+      }
+      else {
+        if(this.fileInput) {
+          this.fileInput.nativeElement.value = '';
+        }
+        if(this.fileInput1) {
+          this.fileInput1.nativeElement.value = '';
+        }
+        this.toastService.getErrorToast('Please Upload a Excel file.');
+      }
+    }
+  
+  upload: any = 'upload';
+  validatedStore: any = [];
+  validatedUser: any = [];
+  validatedCluster: any = [];
+  validatedTeam: any = [];
+  newUser: any = [];
+  inactiveStores: any = [];
+  showInactive: any= false ;
+
+  validateDetails(addUser?:any) {    
+      let params:any = {
+        taskId: this.currentTaskId,
+        // assignUsers: this.userData,
+        assignedUsers: this.userData,
+        clientId: this.headerData?.client,
+        coverage: this.coverage
+    }
+    addUser ? params.addUser = true : '';
+    this.traxService.taskvalidateUserv1(params).pipe(takeUntil(this.destroy$)).subscribe({
+      next: (res: any) => {
+        if (res && res?.code == 200) {
+          if (this.upload === 'store') {
+            this.tableArray.unshift(...res?.data?.data);
+            this.configData.checkListDetails.assign = this.tableArray;
+            let data = this.tableArray.map((el:any) => {
+              return { id: el?._id, type: el?.type }
+            })
+            this.idList = data;
+            this.singleAssign = this.idList;
+            this.getTableData();
+            this.assignType === 'user' ? this.getassignDropdown('change') : '';
+          } else {
+            this.tableArray = [];
+
+            this.assignTableApiState.next('loading')
+            this.tableArray = res?.data?.data;
+            this.assignSingle = res?.data?.data;
+            this.configData.checkListDetails.assign = this.tableArray;
+            let data = res?.data?.data.map((el:any) => {
+              return { id: el?._id, type: el?.type }
+            })
+            this.idList = data;
+            this.singleAssign = this.idList;
+            this.assignTableApiState.next('loaded')
+            this.getTableData();
+            this.assignType === 'user' ? this.getassignDropdown('change') : ''; 
+          }
+          this.dialog.dismissAll(); 
+        }
+      },
+      error: (err: any) => {
+        if (err?.error?.error && err?.error?.code == 400) {
+          let errorData = err?.error?.error;
+          this.excelData = errorData?.data;
+          this.userData = errorData?.data;
+          if (errorData.existEmail?.length) {
+            this.toastService.getErrorToast(`Already ${errorData.existEmail.toString()} assigned to another client`)
+          }else if (errorData.store?.length && !errorData.existEmail?.length) {
+            this.validatedStore = errorData?.store;
+            this.showStore = true;
+            this.afterUplload();
+          }else if (errorData.store?.length && errorData.existEmail?.length) {
+            !errorData?.inActiveStores?.length ? this.dialog.dismissAll() : '';
+            this.toastService.getErrorToast(`Already ${errorData.store.toString()} assigned to another client`)
+          }else if (errorData?.inActiveStores?.length) {
+            this.inactiveStores = errorData?.inActiveStores;
+            this.showInactive = true;
+            this.afterUplload();
+          }else if (errorData?.user?.length && !errorData?.existEmail?.length) {
+            this.validatedUser = errorData.user;
+            this.showUser = true;
+            if (this.upload === 'store') {
+              this.confirmUserpopup();
+            } else {
+              this.afterUplload();
+            }
+          }else if (errorData?.user?.length && errorData?.existEmail?.length) {
+            this.dialog.dismissAll();
+            this.toastService.getErrorToast(`Already ${errorData?.user.toString()} assigned to another client`)
+          }
+          if (errorData?.duplicates?.length) {
+            this.dialog.dismissAll();
+            this.toastService.getErrorToast(`${errorData?.duplicates?.toString()} - ${errorData?.message}`)
+          }
+        }
+      },
+    })
+  } 
+
+  Reupload() {
+    // this.dialog.dismissAll();
+    this.validatedStore = [];
+    this.validatedUser = [];
+    this.validatedCluster = [];
+    this.validatedTeam = [];
+    this.newUser = [];
+    this.inactiveStores = [];
+    this.showUser = false;
+    this.showTeam = false;
+    this.showStore = false;
+    this.showCluster = false;
+    this.showInactive = false;
+    if(this.fileInput) {
+      this.fileInput.nativeElement.value = '';
+    }
+    if(this.fileInput1) {
+      this.fileInput1.nativeElement.value = '';
+    }
+    let ele = document.getElementById('kt_account_team_size_select_2');
+    ele?.click();
+    this.cd.detectChanges();
+  }
+  
+  closeactivepopup() {
+    this.dialog.dismissAll();
+  }
+
+  // onFileUpload(event: any) {
+  //   //Empty sheet validation ---done
+  //   //empty field validation for storeName, userName, userEmail, city. I 
+  //   // validate user email
+  //   // Email unique for store
+  //   // Email unique for username
+  //   const target: DataTransfer = <DataTransfer>(event.target);
+  //   // let isExcelFile = !!target.files[0].name.match(/(.xls|.xlsx)/);
+
+  //   const reader: FileReader = new FileReader();
+  //   reader.readAsBinaryString(target.files[0]);
+  //   reader.onload = (e: any) => {
+  //     const bstr: string = e.target.result;
+  //     const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });
+  //     const wsname: string = wb.SheetNames[0];
+  //     const ws: XLSX.WorkSheet = wb.Sheets[wsname];
+
+  //     const jsonWithPosition: any[] = [];
+
+  //     const range = XLSX.utils.decode_range(ws['!ref'] || '');
+
+  //     const headers: string[] = [];
+  //     for (let C = range.s.c; C <= range.e.c; ++C) {
+  //       const cellAddress = XLSX.utils.encode_cell({ r: range.s.r, c: C });
+  //       const header = ws[cellAddress]?.v || `Column${C + 1}`;
+  //       headers.push(header);
+  //     }
+
+  //     for (let R = range.s.r + 1; R <= range.e.r; ++R) {
+  //       const rowData: any = { row: R + 1 };
+
+  //       for (let C = range.s.c; C <= range.e.c; ++C) {
+  //         const cellAddress = XLSX.utils.encode_cell({ r: R, c: C });
+  //         const cell = ws[cellAddress];
+  //         const header = headers[C - range.s.c];
+
+  //         rowData[header] = cell?.v || "";
+  //         rowData[`column_${header}`] = XLSX.utils.encode_col(C);
+  //       }
+
+  //       jsonWithPosition.push(rowData);
+  //     }
+
+
+  //     const filteredData = jsonWithPosition.filter(row => {
+  //       const keys = Object.keys(row).filter(key => !key.startsWith('column_') && key !== 'row');
+  //       return keys.some(key => row[key].trim() !== undefined && row[key].trim() !== null && row[key].trim() !== "");
+  //     });
+
+
+  //     if (!filteredData.length) {
+  //       return this.toastService.getErrorToast(`Please enter valid details`)
+  //     }
+
+  //     const emptyKeys: any[] = []
+  //     const invalidEmails: any[] = []
+
+  //     filteredData.forEach((row) => {
+  //       const keys = Object.keys(row).filter(key => !key.startsWith('column_') && key !== 'row')
+
+  //       keys.forEach((key) => {
+  //         if (key === 'userEmail') {
+  //           const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
+  //           const isValidMail = emailRegex.test(row['userEmail']);
+  //           if (!isValidMail) invalidEmails.push(row[`column_${key}`] + row.row)
+  //         }
+  //         if (!row[key] && (key === 'storeName' || key === 'userEmail' || key === 'userName')) emptyKeys.push(row[`column_${key}`] + row.row)
+  //       })
+  //     })
+
+  //     if (emptyKeys.length) {
+  //       return this.toastService.getErrorToast(`Please fill the cells ${emptyKeys.join(', ')}`)
+  //     }
+
+  //     if (invalidEmails.length) {
+  //       return this.toastService.getErrorToast(`Please enter valid emails at ${invalidEmails.join(', ')}`)
+  //     }
+
+
+  //     const groupedByEmail = filteredData.reduce((acc, item) => {
+  //       if (!acc[item.userEmail]) {
+  //         acc[item.userEmail] = [];
+  //       }
+  //       acc[item.userEmail].push(item.storeName);
+  //       return acc;
+  //     }, {} as Record<string, string[]>);
+
+  //     const uniqueResult = Object.entries(groupedByEmail).map(([email, storeNames]) => {
+  //       const uniqueStoreNames = new Set<string>(storeNames as string);
+  //       return {
+  //         userEmail: email,
+  //         isStoreNameUnique: uniqueStoreNames.size === (storeNames as Array<string>).length,
+  //         storeNames: Array.from(uniqueStoreNames),
+  //       };
+  //     });
+
+  //     const notUnique = uniqueResult.filter((item) => !item.isStoreNameUnique).map((item) => item.userEmail)
+
+  //     if (notUnique.length) {
+  //       return this.toastService.getErrorToast(`${notUnique.join(', ')} should be unique for store name`)
+  //     }
+
+  //     this.fileInput.nativeElement.value = ''
+  //     event.target.value = ''
+
+  //     const assignList = filteredData.map((data) => {
+  //       return {
+  //         storeName: data.storeName,
+  //         userEmail: data.userEmail,
+  //         userName: data.userName,
+  //         userPhone: data?.userPhone,
+  //         city: data?.city
+  //       }
+  //     })
+
+
+  //     const payload = {
+  //       id: this.currentTaskId,
+  //       uploadUser: true,
+  //       clientId: this.headerData.client,
+  //       assignedUsers: assignList
+  //     }
+
+  //     this.uploadAssigneesList(payload).subscribe({
+  //       next: (res: any) => {
+  //         if (res?.data?.validate) {
+  //           this.getAssignTable()
+  //         }
+  //         if (res?.data?.user?.length) {
+  //           const popupcontent = {
+  //             displayprop: false,
+  //             imagesrc: '<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>',
+  //             title: `Invite new users added in CSV`,
+  //             content: `This CSV contains new users. Invite users by sending mail to them`,
+  //             buttontype: 'Invite',
+  //             user: res.data.user
+  //           }
+  //           const dialogRef = this.dialog.open(TraxpopupComponent, {
+  //             centered: true, size: 'md'
+  //           });
+  //           dialogRef.componentInstance.data = popupcontent;
+  //           dialogRef.result.then((result) => {
+  //             if (result.message === 'confirm') {
+  //               const payload = {
+  //                 id: this.currentTaskId,
+  //                 uploadUser: true,
+  //                 clientId: this.headerData.client,
+  //                 assignedUsers: assignList
+  //               }
+  //               this.uploadAssigneesList(payload, { addUser: true }).pipe(takeUntil(this.destroy$)).subscribe({
+  //                 next: (res) => {
+  //                   this.getAssignTable()
+  //                 }
+  //               })
+  //             }
+
+  //           });
+  //         }
+  //         if (res?.data?.store?.length) {
+  //           function formatMessages(messages: any[]): string {
+  //             const groupedMessages: Record<string, string[]> = {};
+
+  //             messages.forEach(({ store, message }) => {
+  //               if (!groupedMessages[store]) {
+  //                 groupedMessages[store] = [];
+  //               }
+  //               groupedMessages[store].push(message);
+  //             });
+
+  //             const formattedMessages = Object.entries(groupedMessages).map(([store, msgs]) => {
+  //               return `${msgs.join(', ')} in ${store}`;
+  //             });
+
+  //             return formattedMessages.join(', ');
+  //           }
+  //           this.toastService.getErrorToast(formatMessages(res?.data?.store))
+  //         }
+  //       },
+  //       error: (err) => {
+  //         this.toastService.getErrorToast(err?.error?.error || 'Something went wrong')
+  //       }
+  //     })
+
+
+  //   }
+  // }
+
+  addStoreComponent() {
+    const dialogRef = this.dialog.open(TraxStoreComponent, {
+      centered: true, size: 'md'
+    });
+
+    dialogRef.componentInstance.data = {
+      checklistId: this.currentTaskId,
+      obj: {
+        checkListId: this.currentTaskId,
+        clientId: this.headerData.client,
+      },
+      coverage: this.coverage,
+    };
+
+    dialogRef.result.then((res) => {
+      if(res) {
+        this.userData = res;
+        this.upload = 'store';
+        this.validateDetails();
+      }
+    });
+
+    // dialogRef.result.then((res) => {
+    //   if (res) {
+    //     const payload = {
+    //       id: this.currentTaskId,
+    //       uploadUser: true,
+    //       clientId: this.headerData.client,
+    //       assignedUsers: res
+    //     }
+
+    //     this.uploadAssigneesList(payload, { delete: false }).pipe(takeUntil(this.destroy$)).subscribe({
+    //       next: (res1: any) => {
+    //         if (res1.code === 200) {
+    //           if (res1?.data?.user?.length) {
+    //             const popupcontent = {
+    //               displayprop: false,
+    //               imagesrc: '<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>',
+    //               title: `Invite new users added in CSV`,
+    //               content: `This CSV contains new users. Invite users by sending mail to them`,
+    //               buttontype: 'Invite',
+    //               user: res1.data.user
+    //             }
+    //             const dialogRef = this.dialog.open(TraxpopupComponent, {
+    //               centered: true, size: 'md'
+    //             });
+    //             dialogRef.componentInstance.data = popupcontent;
+    //             dialogRef.result.then((result) => {
+    //               if (result.message === 'confirm') {
+    //                 const payload = {
+    //                   id: this.currentTaskId,
+    //                   uploadUser: true,
+    //                   clientId: this.headerData.client,
+    //                   assignedUsers: res
+    //                 }
+    //                 this.uploadAssigneesList(payload, { delete: false, addUser: true }).pipe(takeUntil(this.destroy$)).subscribe({
+    //                   next: (res) => {
+    //                     this.getAssignTable()
+    //                   }
+    //                 })
+    //               }
+
+    //             });
+    //           } else {
+    //             this.getAssignTable()
+    //           }
+
+    //         }
+    //       },
+    //       error: (err) => {
+    //         this.toastService.getErrorToast(err.error.error)
+    //       }
+    //     })
+
+    //   }
+    // })
+  }
+
+  getStoreCounts(data: any) {
+    if (this.storeCoverage) {
+      const uniqueStoreNames = new Set(data.map((item:any) => item.storeName));
+      return uniqueStoreNames.size;
+    } else if (this.userCoverage) {
+      const uniqueUserNames = new Set(data.map((item:any) => item.userName));
+      return uniqueUserNames.size;
+    }
+  }
+
+  uploadAssigneesList(payload: any, extraArgs?: any) {
+    const reqPayload = {
+      ...payload,
+      ...extraArgs
+    }
+    return this.traxService.uploadTaskAssignees(reqPayload)
+  }
+
+  getFormControlFromArray(index: number): FormControl {
+    return this.reminderRepeatSchedules.at(index) as FormControl;
+  }
+
+  addMoreSchedules() {
+    const scheduleValue = this.reminderRepeatScheduleOptions.filter((val) => !this.reminderRepeatSchedules?.value.includes(val))
+    if (this.reminderRepeatSchedules.length < 3) {
+      this.reminderRepeatSchedules.push(this.fb.control(scheduleValue[0]))
+    }
+  }
+
+  disableScheduleOption(option: number) {
+    return this.reminderRepeatSchedules.value.includes(option)
+  }
+
+  enableReminder(event: any) {
+    if (event.target.checked) {
+      this.reminderRepeatSchedules.clear()
+      this.reminderRepeatSchedules.push(this.fb.control(this.reminderRepeatScheduleOptions[0]))
+    } else {
+      this.reminderRepeatSchedules.clear()
+    }
+  }
+
+  onDragLeave(event: DragEvent) {
+    event.preventDefault();
+    (event.target as HTMLElement).classList.remove('drag-over');
+  }
+
+  onDragOver(event: DragEvent) {
+    event.preventDefault();
+    event.stopPropagation();
+    // Add a visual effect to indicate drag is over the area
+    (event.target as HTMLElement).classList.add('drag-over');
+  }
+
+  onDrop(event: DragEvent) {
+    event.preventDefault();
+    (event.target as HTMLElement).classList.remove('drag-over');
+
+    if (event.dataTransfer?.files.length) {
+      const file = event.dataTransfer.files[0];
+      const fileInputElement = this.fileInput.nativeElement;
+
+      // Manually set the file to the input
+      const dataTransfer = new DataTransfer();
+      dataTransfer.items.add(file);
+      fileInputElement.files = dataTransfer.files;
+
+      // Trigger the change event manually
+      fileInputElement.dispatchEvent(new Event('change'));
+    }
+  }
+
+
+}