import { Component, Input } from '@angular/core';
import { FormControl } from '@angular/forms';
import dayjs from 'dayjs';
import { Subject, takeUntil } from "rxjs";
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
import * as i2 from "../../../services/trax.service";
import * as i3 from "tango-app-ui-global";
import * as i4 from "@angular/router";
import * as i5 from "tango-app-ui-shared";
import * as i6 from "@ng-bootstrap/ng-bootstrap";
import * as i7 from "@angular/common";
import * as i8 from "ngx-daterangepicker-material";
export class TaskinfoEditComponent {
    fb;
    traxService;
    pageInfo;
    route;
    gs;
    toastService;
    activeModal;
    destroy$ = new Subject();
    openTime = '';
    form;
    checklistselectControl;
    checklistDropdown = [
        { _id: 'High', checkListName: 'High' },
        { _id: 'Medium', checkListName: 'Medium' },
        { _id: 'Low', checkListName: 'Low' },
    ];
    headerData;
    currentTaskId;
    dayjs = dayjs;
    scheduleDate;
    minDate = this.dayjs().format();
    scheduleEndTime = new FormControl(this.getCurrentTime());
    taskDetails;
    selectAllInput = new FormControl(false);
    // removedUsers = new Set()
    approversList;
    approver = new FormControl();
    priorityType = new FormControl('high');
    allowedStoreLocation = new FormControl(false);
    restrictAttendance = new FormControl(false);
    removedUsers = new Set();
    editRequestData;
    constructor(fb, traxService, pageInfo, route, gs, toastService, activeModal) {
        this.fb = fb;
        this.traxService = traxService;
        this.pageInfo = pageInfo;
        this.route = route;
        this.gs = gs;
        this.toastService = toastService;
        this.activeModal = activeModal;
        this.selectAllInput.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((val) => {
            if (val === null || val === undefined) {
                return;
            }
            if (val) {
                this.removedUsers.clear();
            }
            else {
                this.removedUsers.forEach((id) => {
                    this.onUserAssignChange(false, id);
                });
            }
        });
    }
    ngOnDestroy() {
        this.destroy$.next(true);
        this.destroy$.complete();
    }
    ngOnInit() {
        this.scheduleDate = { startDate: this.dayjs().format('DD-MM-YYYY'), endDate: this.dayjs().format('DD-MM-YYYY') };
        this.setPageData();
        this.currentTaskId = this.editRequestData.sourceCheckList_id;
        this.gs.dataRangeValue
            .pipe(takeUntil(this.destroy$))
            .subscribe((data) => {
            if (data?.client) {
                this.headerData = data;
                if (this.currentTaskId) {
                    this.getClientUser();
                    this.getTask(this.currentTaskId);
                }
            }
        });
    }
    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) {
        this.traxService.getTaskconfig(id, this.headerData?.client).pipe(takeUntil(this.destroy$)).subscribe({
            next: (res) => {
                if (res?.code === 200) {
                    this.taskDetails = res.data.checkListDetails;
                    if (this.taskDetails?.scheduleDate) {
                        if (this.dayjs.utc(this.editRequestData?.date).isBefore(dayjs())) {
                            this.minDate = this.dayjs(this.dayjs.utc(this.editRequestData?.date).format('YYYY-MM-DD')).format();
                        }
                        // this.minDate = this.dayjs(this.taskDetails.scheduleDate)
                        this.scheduleDate = { startDate: this.dayjs.utc(this.editRequestData.date).format('DD-MM-YYYY'), endDate: this.dayjs.utc(this.editRequestData.date).format('DD-MM-YYYY') };
                    }
                    if (!this.taskDetails?.removedUsers?.length) {
                        this.selectAllInput.setValue(true, { emitEvent: false });
                    }
                    if (this.taskDetails?.scheduleEndTime) {
                        this.scheduleEndTime.setValue(dayjs.utc(this.editRequestData?.date).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);
                    }
                }
            }
        });
    }
    getCurrentTime() {
        const now = new Date();
        const hours = now.getHours().toString().padStart(2, '0');
        const minutes = now.getMinutes().toString().padStart(2, '0');
        return `${hours}:${minutes}`;
    }
    get dueDateFormatted() {
        return this.dayjs(this.scheduleDate.startDate, 'DD-MM-YYYY')?.format('DD MMM YYYY');
    }
    get dueTimeFormatted() {
        return dayjs(this.scheduleEndTime.value, 'HH:mm').format('h:mm A');
    }
    onUserAssignChange(event, id) {
        if (!event) {
            this.removedUsers.add(id);
        }
        else {
            this.removedUsers.delete(id);
        }
    }
    onApproveAdded(event) {
        this.approver.setValue(event);
    }
    getClientUser() {
        this.traxService.getClientUser(this.headerData.client).pipe(takeUntil(this.destroy$)).subscribe((res) => {
            if (res && res.code == 200) {
                this.approversList = res.data.map((item) => { return { name: item.userName, value: item.email }; });
            }
            else {
                this.approversList = [];
            }
        });
    }
    onSubmit() {
        const payload = {
            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.editRequestData.allowedStoreLocation,
            restrictAttendance: this.editRequestData.restrictAttendance,
            taskId: this.currentTaskId,
            userEmail: this.editRequestData.userEmail,
            storeName: this.editRequestData.storeName,
            store_id: this.editRequestData.store_id,
            previousEndDate: this.editRequestData.date
        };
        this.traxService.getTaskUpdate(payload).pipe(takeUntil(this.destroy$)).subscribe({
            next: (res) => {
                if (res) {
                    if (res.code === 200) {
                        this.toastService.getSuccessToast(res?.data?.message || 'Task Reiniated successfully');
                        this.activeModal.close();
                    }
                }
                else {
                    this.toastService.getErrorToast('Invalid TaskId');
                }
            },
            error: (err) => {
                console.error('Error:', err);
                this.toastService.getErrorToast('Failed to update the task. Please try again.');
            }
        });
    }
    closePopupAndReloadData() {
        this.activeModal.close();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TaskinfoEditComponent, deps: [{ token: i1.FormBuilder }, { token: i2.TraxService }, { token: i3.PageInfoService }, { token: i4.ActivatedRoute }, { token: i3.GlobalStateService }, { token: i5.ToastService }, { token: i6.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TaskinfoEditComponent, selector: "lib-taskinfo-edit", inputs: { editRequestData: "editRequestData" }, ngImport: i0, template: "<div class=\"p-6 editscroll\">\r\n    <span class=\"my-2\"><svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n            <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n            <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n            <path\r\n                d=\"M33 19.0001C33.2626 18.7374 33.5744 18.5291 33.9176 18.3869C34.2608 18.2448 34.6286 18.1716 35 18.1716C35.3714 18.1716 35.7392 18.2448 36.0824 18.3869C36.4256 18.5291 36.7374 18.7374 37 19.0001C37.2626 19.2627 37.471 19.5745 37.6131 19.9177C37.7553 20.2608 37.8284 20.6286 37.8284 21.0001C37.8284 21.3715 37.7553 21.7393 37.6131 22.0825C37.471 22.4256 37.2626 22.7374 37 23.0001L23.5 36.5001L18 38.0001L19.5 32.5001L33 19.0001Z\"\r\n                stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <div class=\"col-md-12 \">\r\n        <div class=\"row my-5\">\r\n            <div class=\"col-md-4\">\r\n                <div class=\"tasktitle mb-4\">\r\n                    Task Title :\r\n                </div>\r\n                <div class=\"tasktitle\">\r\n                    Description :\r\n                </div>\r\n            </div>\r\n            <div class=\"col-md-8\">\r\n                <div class=\"tasksub mb-4\">\r\n                    {{taskDetails?.checkListName || \"--\"}}\r\n                </div>\r\n                <div class=\"tasksub\">\r\n                    {{taskDetails?.checkListDescription || \"--\"}}\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"storetext my-4\">\r\n            {{editRequestData?.storeName || \"--\"}} Configuration\r\n        </div>\r\n\r\n        <div class=\"row\">\r\n            <div class=\"col-6 mb-5\">\r\n                <div class=\"date-picker\">\r\n                    <label for=\"datepick\" class=\"form-label\">Due date</label>\r\n                    <div style=\"position: relative;\">\r\n                        <svg style=\"position: absolute; top: 12px; left:12px;\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                            width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <path\r\n                                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                            </path>\r\n                        </svg>\r\n                        <input id=\"datepick\" class=\"fx-date-range form-control ps-14\" type=\"text\" ngxDaterangepickerMd\r\n                            [singleDatePicker]=\"true\" [minDate]=\"minDate\" [drops]=\"'down'\" [opens]=\"'right'\"\r\n                            [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\"\r\n                            autocomplete=\"off\" [(ngModel)]=\"scheduleDate\" [autoApply]=\"false\"\r\n                            [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n                            name=\"daterange\" [readonly]=\"true\" />\r\n                    </div>\r\n\r\n                </div>\r\n\r\n            </div>\r\n            <div class=\"col-6 mb-5\">\r\n                <label for=\"timePick\" class=\"form-label\">Due time</label>\r\n                <input [formControl]=\"scheduleEndTime\" type=\"time\" class=\"form-control\" id=\"timePick\"\r\n                    placeholder=\"name@example.com\">\r\n            </div>\r\n            <div class=\"col-6 mb-5\">\r\n                <label class=\"form-label\">Approver</label>\r\n                <div  class=\"position-relative\">\r\n                    <div  class=\"dropdown-close\">\r\n                        <div  class=\"w-100\">\r\n                            <div \r\n                                class=\"outer-container d-flex align-items-center position-relative w-100\">\r\n                                <div  class=\"input-container form-control\"><span *ngFor=\"let approver of approver.value\"\r\n                                         class=\"chip ng-star-inserted\"><span\r\n                                             class=\"me-3\">{{approver.name}}</span><span\r\n                                            ><svg \r\n                                                xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n                                                viewBox=\"0 0 12 12\" fill=\"none\">\r\n                                                <path  d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\"\r\n                                                    stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                                                </path>\r\n                                            </svg></span></span><!----><!----><input \r\n                                        type=\"text\" id=\"searchInput\"\r\n                                        class=\"form-control dropdown-input ng-untouched ng-pristine ng-valid\"\r\n                                        style=\"min-height: 44px; cursor: not-allowed;\" readonly></div>\r\n                            </div>\r\n                        </div><!---->\r\n                    </div>\r\n                </div>\r\n                <!-- <lib-chip-dropdown [data]=\"approversList\" [selectedData]=\"approver.value\"\r\n                    (selectedList)=\"onApproveAdded($event)\"></lib-chip-dropdown> -->\r\n            </div>\r\n            <div class=\"col-6 mb-5\">\r\n                <label for=\"priority\" class=\"form-label\">Priority</label>\r\n                <input type=\"text\" [formControl]=\"priorityType\" class=\"form-control mt-1\" style=\"cursor: not-allowed;\" readonly>\r\n                <!-- <select [formControl]=\"priorityType\" id=\"priority\" class=\"form-select mb-5\">\r\n                    <option value=\"high\">High</option>\r\n                    <option value=\"medium\">Medium</option>\r\n                    <option value=\"medium\">Low</option>\r\n                </select> -->\r\n            </div>\r\n        </div>\r\n        <div class=\"col-12 mb-5\">\r\n            <div class=\"toggle-card\" [ngClass]=\"editRequestData.allowedStoreLocation ? 'selected' : ''\">\r\n                <div class=\"form-check form-switch me-4\">\r\n                    <input [(ngModel)]=\"editRequestData.allowedStoreLocation\" [ngModelOptions]=\"{standalone: true}\" class=\"form-check-input\" type=\"checkbox\" role=\"switch\" [checked]=\"editRequestData.allowedStoreLocation\">\r\n                </div>\r\n                <div>\r\n                    <div class=\"header\">Geo fencing</div>\r\n                    <div class=\"desc\">By enabling, the checklist can be filled by the user only when inside the\r\n                        store.</div>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n\r\n        <div class=\"col-12 mb-5\">\r\n            <div class=\"toggle-card \" [ngClass]=\"editRequestData.restrictAttendance ? 'selected' : ''\">\r\n                <div class=\"form-check form-switch me-4\">\r\n                    <input [(ngModel)]=\"editRequestData.restrictAttendance\" [ngModelOptions]=\"{standalone: true}\" class=\"form-check-input\" type=\"checkbox\" role=\"switch\" [checked]=\"editRequestData.restrictAttendance\">\r\n                </div>\r\n                <div>\r\n                    <div class=\"header\">Restrict attendance</div>\r\n                    <div class=\"desc\">By enabling, user can't be able to clockout without completing the task.\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"row mt-8\">\r\n            <div class=\"col-md-6\">\r\n                <button (click)=\"closePopupAndReloadData()\" type=\"button\"\r\n                    class=\"btn-outline btn align-items-end text-nowrap invheader w-100\"><span></span>\r\n                    Cancel </button>\r\n            </div>\r\n            <div class=\"col-md-6\">\r\n                <a (click)=\"onSubmit()\" type=\"button\" tabindex=\"0\"\r\n                    class=\"btn btn-primary ms-2 rounded-3 text-nowrap w-100 ng-star-inserted\"><span\r\n                        class=\"ms-2 text-white\">Update</span></a>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n\r\n</div>", styles: [".tasktitle{color:var(--Gray-500, #667085);font-size:18px;font-style:normal;font-weight:600;line-height:28px}.tasksub{color:var(--Gray-700, #344054);font-size:16px;font-style:normal;font-weight:500;line-height:24px}.storetext{color:var(--Gray-900, #101828);font-size:18px;font-style:normal;font-weight:600;line-height:28px}.btn-primary{line-height:18px!important}.editscroll{max-height:800px;overflow-y:scroll}:host::ng-deep .date-picker .md-drppicker .btn{line-height:10px!important}:host::ng-deep .date-picker .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .date-picker .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .date-picker .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .date-picker .md-drppicker td.active,:host::ng-deep .date-picker .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .date-picker .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .date-picker .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .date-picker .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep .date-picker table th,:host::ng-deep .date-picker table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .date-picker .md-drppicker td.available.prev,:host::ng-deep .date-picker .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .date-picker .md-drppicker td.available.next,:host::ng-deep .date-picker .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .date-picker table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .date-picker .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .date-picker .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .date-picker .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.outer-container{position:relative}.outer-container .form-control{padding-top:0;padding-bottom:0}.outer-container .input-container{border:1px solid black;height:100%;width:100%;display:flex;flex-wrap:wrap;border:1px solid #D0D5DD}.outer-container .input-container input{all:unset;flex:1;min-width:50px}.outer-container .input-container .chip{margin:10px 0 10px 10px;padding:3px 10px;border-radius:16px;background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .chip .initials{color:var(--Primary-600, #00A3FF);font-size:12px;font-weight:500;line-height:18px}.outer-container .input-container .chip:nth-child(1){margin-left:0}.toggle-card{padding:16px;display:flex;align-items:center;border-radius:8px;border:1px solid #EAECF0;background:#fff}.toggle-card .header{color:#344054;font-size:16px;font-weight:500;line-height:24px}.toggle-card .desc{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.toggle-card.selected{border:1px solid #6BCAFF}.toggle-card.selected .header{color:#008edf}.toggle-card.selected .desc{color:#00a3ff}.cstm-blu-btn{padding:8px 14px;border-radius:8px;border:1px solid #EAF8FF;background:#eaf8ff;box-shadow:0 1px 2px #1018280d;color:#009bf3;font-size:14px;font-weight:600;line-height:20px;cursor:pointer;display:flex;align-items:center}\n"], dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i8.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TaskinfoEditComponent, decorators: [{
            type: Component,
            args: [{ selector: 'lib-taskinfo-edit', template: "<div class=\"p-6 editscroll\">\r\n    <span class=\"my-2\"><svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n            <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n            <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n            <path\r\n                d=\"M33 19.0001C33.2626 18.7374 33.5744 18.5291 33.9176 18.3869C34.2608 18.2448 34.6286 18.1716 35 18.1716C35.3714 18.1716 35.7392 18.2448 36.0824 18.3869C36.4256 18.5291 36.7374 18.7374 37 19.0001C37.2626 19.2627 37.471 19.5745 37.6131 19.9177C37.7553 20.2608 37.8284 20.6286 37.8284 21.0001C37.8284 21.3715 37.7553 21.7393 37.6131 22.0825C37.471 22.4256 37.2626 22.7374 37 23.0001L23.5 36.5001L18 38.0001L19.5 32.5001L33 19.0001Z\"\r\n                stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <div class=\"col-md-12 \">\r\n        <div class=\"row my-5\">\r\n            <div class=\"col-md-4\">\r\n                <div class=\"tasktitle mb-4\">\r\n                    Task Title :\r\n                </div>\r\n                <div class=\"tasktitle\">\r\n                    Description :\r\n                </div>\r\n            </div>\r\n            <div class=\"col-md-8\">\r\n                <div class=\"tasksub mb-4\">\r\n                    {{taskDetails?.checkListName || \"--\"}}\r\n                </div>\r\n                <div class=\"tasksub\">\r\n                    {{taskDetails?.checkListDescription || \"--\"}}\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"storetext my-4\">\r\n            {{editRequestData?.storeName || \"--\"}} Configuration\r\n        </div>\r\n\r\n        <div class=\"row\">\r\n            <div class=\"col-6 mb-5\">\r\n                <div class=\"date-picker\">\r\n                    <label for=\"datepick\" class=\"form-label\">Due date</label>\r\n                    <div style=\"position: relative;\">\r\n                        <svg style=\"position: absolute; top: 12px; left:12px;\" xmlns=\"http://www.w3.org/2000/svg\"\r\n                            width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                            <path\r\n                                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                            </path>\r\n                        </svg>\r\n                        <input id=\"datepick\" class=\"fx-date-range form-control ps-14\" type=\"text\" ngxDaterangepickerMd\r\n                            [singleDatePicker]=\"true\" [minDate]=\"minDate\" [drops]=\"'down'\" [opens]=\"'right'\"\r\n                            [alwaysShowCalendars]=\"false\" [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\"\r\n                            autocomplete=\"off\" [(ngModel)]=\"scheduleDate\" [autoApply]=\"false\"\r\n                            [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n                            name=\"daterange\" [readonly]=\"true\" />\r\n                    </div>\r\n\r\n                </div>\r\n\r\n            </div>\r\n            <div class=\"col-6 mb-5\">\r\n                <label for=\"timePick\" class=\"form-label\">Due time</label>\r\n                <input [formControl]=\"scheduleEndTime\" type=\"time\" class=\"form-control\" id=\"timePick\"\r\n                    placeholder=\"name@example.com\">\r\n            </div>\r\n            <div class=\"col-6 mb-5\">\r\n                <label class=\"form-label\">Approver</label>\r\n                <div  class=\"position-relative\">\r\n                    <div  class=\"dropdown-close\">\r\n                        <div  class=\"w-100\">\r\n                            <div \r\n                                class=\"outer-container d-flex align-items-center position-relative w-100\">\r\n                                <div  class=\"input-container form-control\"><span *ngFor=\"let approver of approver.value\"\r\n                                         class=\"chip ng-star-inserted\"><span\r\n                                             class=\"me-3\">{{approver.name}}</span><span\r\n                                            ><svg \r\n                                                xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\"\r\n                                                viewBox=\"0 0 12 12\" fill=\"none\">\r\n                                                <path  d=\"M9 3L3 9M3 3L9 9\" stroke=\"#667085\"\r\n                                                    stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                                                </path>\r\n                                            </svg></span></span><!----><!----><input \r\n                                        type=\"text\" id=\"searchInput\"\r\n                                        class=\"form-control dropdown-input ng-untouched ng-pristine ng-valid\"\r\n                                        style=\"min-height: 44px; cursor: not-allowed;\" readonly></div>\r\n                            </div>\r\n                        </div><!---->\r\n                    </div>\r\n                </div>\r\n                <!-- <lib-chip-dropdown [data]=\"approversList\" [selectedData]=\"approver.value\"\r\n                    (selectedList)=\"onApproveAdded($event)\"></lib-chip-dropdown> -->\r\n            </div>\r\n            <div class=\"col-6 mb-5\">\r\n                <label for=\"priority\" class=\"form-label\">Priority</label>\r\n                <input type=\"text\" [formControl]=\"priorityType\" class=\"form-control mt-1\" style=\"cursor: not-allowed;\" readonly>\r\n                <!-- <select [formControl]=\"priorityType\" id=\"priority\" class=\"form-select mb-5\">\r\n                    <option value=\"high\">High</option>\r\n                    <option value=\"medium\">Medium</option>\r\n                    <option value=\"medium\">Low</option>\r\n                </select> -->\r\n            </div>\r\n        </div>\r\n        <div class=\"col-12 mb-5\">\r\n            <div class=\"toggle-card\" [ngClass]=\"editRequestData.allowedStoreLocation ? 'selected' : ''\">\r\n                <div class=\"form-check form-switch me-4\">\r\n                    <input [(ngModel)]=\"editRequestData.allowedStoreLocation\" [ngModelOptions]=\"{standalone: true}\" class=\"form-check-input\" type=\"checkbox\" role=\"switch\" [checked]=\"editRequestData.allowedStoreLocation\">\r\n                </div>\r\n                <div>\r\n                    <div class=\"header\">Geo fencing</div>\r\n                    <div class=\"desc\">By enabling, the checklist can be filled by the user only when inside the\r\n                        store.</div>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n\r\n        <div class=\"col-12 mb-5\">\r\n            <div class=\"toggle-card \" [ngClass]=\"editRequestData.restrictAttendance ? 'selected' : ''\">\r\n                <div class=\"form-check form-switch me-4\">\r\n                    <input [(ngModel)]=\"editRequestData.restrictAttendance\" [ngModelOptions]=\"{standalone: true}\" class=\"form-check-input\" type=\"checkbox\" role=\"switch\" [checked]=\"editRequestData.restrictAttendance\">\r\n                </div>\r\n                <div>\r\n                    <div class=\"header\">Restrict attendance</div>\r\n                    <div class=\"desc\">By enabling, user can't be able to clockout without completing the task.\r\n                    </div>\r\n                </div>\r\n            </div>\r\n\r\n        </div>\r\n        <div class=\"row mt-8\">\r\n            <div class=\"col-md-6\">\r\n                <button (click)=\"closePopupAndReloadData()\" type=\"button\"\r\n                    class=\"btn-outline btn align-items-end text-nowrap invheader w-100\"><span></span>\r\n                    Cancel </button>\r\n            </div>\r\n            <div class=\"col-md-6\">\r\n                <a (click)=\"onSubmit()\" type=\"button\" tabindex=\"0\"\r\n                    class=\"btn btn-primary ms-2 rounded-3 text-nowrap w-100 ng-star-inserted\"><span\r\n                        class=\"ms-2 text-white\">Update</span></a>\r\n            </div>\r\n        </div>\r\n\r\n    </div>\r\n\r\n</div>", styles: [".tasktitle{color:var(--Gray-500, #667085);font-size:18px;font-style:normal;font-weight:600;line-height:28px}.tasksub{color:var(--Gray-700, #344054);font-size:16px;font-style:normal;font-weight:500;line-height:24px}.storetext{color:var(--Gray-900, #101828);font-size:18px;font-style:normal;font-weight:600;line-height:28px}.btn-primary{line-height:18px!important}.editscroll{max-height:800px;overflow-y:scroll}:host::ng-deep .date-picker .md-drppicker .btn{line-height:10px!important}:host::ng-deep .date-picker .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.show-ranges.shown{top:65px!important}:host::ng-deep .date-picker .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;right:-475px!important;left:unset!important;height:400px!important}:host::ng-deep .date-picker .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .date-picker .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .date-picker .md-drppicker td.active,:host::ng-deep .date-picker .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .date-picker .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .date-picker .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .date-picker .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep .date-picker table th,:host::ng-deep .date-picker table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .date-picker .md-drppicker td.available.prev,:host::ng-deep .date-picker .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .date-picker .md-drppicker td.available.next,:host::ng-deep .date-picker .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .date-picker table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .date-picker .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}:host::ng-deep .date-picker .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .date-picker .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}.outer-container{position:relative}.outer-container .form-control{padding-top:0;padding-bottom:0}.outer-container .input-container{border:1px solid black;height:100%;width:100%;display:flex;flex-wrap:wrap;border:1px solid #D0D5DD}.outer-container .input-container input{all:unset;flex:1;min-width:50px}.outer-container .input-container .chip{margin:10px 0 10px 10px;padding:3px 10px;border-radius:16px;background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .chip .initials{color:var(--Primary-600, #00A3FF);font-size:12px;font-weight:500;line-height:18px}.outer-container .input-container .chip:nth-child(1){margin-left:0}.toggle-card{padding:16px;display:flex;align-items:center;border-radius:8px;border:1px solid #EAECF0;background:#fff}.toggle-card .header{color:#344054;font-size:16px;font-weight:500;line-height:24px}.toggle-card .desc{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.toggle-card.selected{border:1px solid #6BCAFF}.toggle-card.selected .header{color:#008edf}.toggle-card.selected .desc{color:#00a3ff}.cstm-blu-btn{padding:8px 14px;border-radius:8px;border:1px solid #EAF8FF;background:#eaf8ff;box-shadow:0 1px 2px #1018280d;color:#009bf3;font-size:14px;font-weight:600;line-height:20px;cursor:pointer;display:flex;align-items:center}\n"] }]
        }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i2.TraxService }, { type: i3.PageInfoService }, { type: i4.ActivatedRoute }, { type: i3.GlobalStateService }, { type: i5.ToastService }, { type: i6.NgbActiveModal }], propDecorators: { editRequestData: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64, 