import { Component, EventEmitter, Input, Output } from '@angular/core';
import { cloneDeep } from 'lodash';
import { ASSETS } from '../../../constants/assets.constants';
import * as i0 from "@angular/core";
import * as i1 from "./assessment.service";
import * as i2 from "../../../workflow-services/auth.service";
import * as i3 from "@angular/common";
import * as i4 from "../../../ui-kit/tooltip/tooltip.directive";
import * as i5 from "../../../ui-kit/popover/popover.component";
import * as i6 from "../../../ui-kit/popover/popover.directive";
import * as i7 from "@angular/forms";
import * as i8 from "../../../ui-kit/no-data/no-data.component";
import * as i9 from "../../../ui-kit/formgroup/cs-radio/cs-radio.component";
import * as i10 from "../../../sharedComponents/assessment-preview/preview/preview.component";
import * as i11 from "../checkbox/checkbox.component";
import * as i12 from "../floating-bar/floating-bar.component";
import * as i13 from "./assessment-loader/assessment-loader.component";
import * as i14 from "./assessment-sub-loader/assessment-sub-loader.component";
import * as i15 from "./workflow-pagination/workflow-pagination.component";
export class AssessmentPickerComponent {
    set setSelected(value) {
        if (value && value?.length) {
            this.selectedAssessmentArr = [...value];
            //this.setCategoryAndAssessment();
            this.selectedAssessmentArr.forEach((ele, index) => {
                this.openedCategory.push(ele?.category_id);
                //   this.showSubList(index,ele?.category_id);
            });
        }
    }
    constructor(assessmentService, auth) {
        this.assessmentService = assessmentService;
        this.auth = auth;
        this.ASSETS = ASSETS;
        this.animation = false;
        this.subList = false;
        this.isEdit = false;
        this.openedCategory = [];
        this.assessmentPayload = {
            search_title: '',
            page_no: '1',
            state: 'ACTIVE',
            search_text: '',
            alphabet_filter: '',
        };
        this.dataPerPage = 0;
        this.assessmentCategory = {
            data: [],
            totalPage: 0,
            totalRecords: 0,
            start_value: 0,
            end_value: 0,
            currentPage: 0,
        };
        this.isLoader = false;
        this.isDeleted = false;
        this.searchAssessments = '';
        this.isPreview = false;
        this.selectedAssessmentData = [];
        this.onAssessmentSelect = new EventEmitter();
        this.cancelAssessment = new EventEmitter();
        this.selectedAssessmentArr = [];
        this.selectedAssessmentCategoriesIds = [];
        this.selectedAssessmentIds = [];
        this.selectedAssessment = [];
        this.dataPerPage = 30;
    }
    ngOnInit() {
        this.animation = true;
        this.getAssessmentCategoryList();
        setTimeout(() => {
            this.animation = false;
        }, 300);
    }
    onAssessmentSelected(event) {
        this.selectedData = event;
    }
    preview(evt) {
        this.assessmentService.getAssessmentQuestions(evt?.id).subscribe({
            next: (res) => {
                this.auth.previewPanel.next(true);
                this.isPreview = true;
                this.previewQuestionData = res;
            },
        });
    }
    previewBack() {
        this.isPreview = false;
        this.previewQuestionData = {};
        this.auth.previewPanel.next(false);
    }
    /**
     *
     * @param index : Accept index of elementPosition
     *
     */
    showSubList(index, id) {
        if (this.openedCategory.includes(id)) {
            this.openedCategory = this.openedCategory.filter((ele) => ele !== id);
        }
        else {
            this.openedCategory.push(id);
            this.getAssessmentList(id);
        }
        return this.openedCategory;
    }
    expandCategory(categoryId) {
        const index = this.assessmentCategory?.data?.findIndex((ele) => ele.id === categoryId);
        if (this.openedCategory.includes(categoryId) &&
            this.assessmentCategory.data[index].assessmentData) {
            this.openedCategory = this.openedCategory.filter((ele) => ele !== categoryId);
        }
        else {
            this.openedCategory.push(categoryId);
            this.getAssessmentList(categoryId);
        }
    }
    // TODO: Pagination
    /**
     *
     * @param event : page number that has been selected
     */
    onPageSelection(event) {
        this.openedCategory = [];
        this.assessmentPayload.page_no = event.toString();
        this.getAssessmentCategoryList();
    }
    // TODO: Search
    /**
     *
     * @param search : search text
     */
    onAssessmentSearch(search) {
        this.openedCategory = [];
        this.assessmentPayload.page_no = '1';
        this.assessmentPayload.search_title = search;
        this.assessmentPayload.search_text = search;
        this.getAssessmentCategoryList();
    }
    // TODO: Filter by alphabet
    /**
     *
     * @param event : Assessment category filter of Alphabet
     */
    onAlphabetSelected(event) {
        this.openedCategory = [];
        this.assessmentPayload.page_no = '1';
        this.assessmentPayload.alphabet_filter = event;
        this.assessmentPayload.search_text = '';
        this.getAssessmentCategoryList();
    }
    // TODO: Call API method
    getAssessmentCategoryList() {
        this.isLoader = true;
        this.assessmentService
            .getAssessmentCategory(this.assessmentPayload)
            .subscribe((res) => {
            this.assessmentCategory = res;
            if (this.selectedAssessmentArr?.length) {
                // this.selectedAssessmentArr =  [... new Set(this.selectedAssessmentArr)]
                this.selectedAssessmentArr.forEach((ele) => {
                    const index = res.data.findIndex((assessment) => assessment.id === ele.category_id);
                    this.expandCategory(ele.category_id);
                });
                // this.selectedAssessmentArr.forEach((ele:any,index:any) => {
                //   this.openedCategory.push(ele?.category_id);
                //   this.showSubList(index,ele?.category_id);
                // })
            }
            this.isLoader = false;
        });
    }
    // TODO: Call Sub data API method
    /**
     *
     * @param id : Assessment category id
     */
    getAssessmentList(id) {
        const payload = {
            search_title: '',
        };
        this.assessmentService
            .getAssessmentList(payload, id)
            .subscribe((res) => {
            const index = this.assessmentCategory?.data?.findIndex((ele) => ele.id === id);
            if (index > -1) {
                this.assessmentCategory.data[index].assessmentData = [
                    ...new Set(res),
                ];
            }
            if (this.selectedAssessmentArr?.length) {
                this.setCategoryAndAssessment();
                const index = this.selectedAssessmentArr.findIndex((ele) => ele.category_id === id);
                // if(index !== -1) {
                //   this.selectedAssessmentArr[index].assessmentIds  = this.selectedAssessmentArr[index].assessmentIds.map((ele: any) => {
                //     ele = res.find((data: any) => data.id === ele);
                //     return ele;
                //   });
                // }
            }
        });
    }
    /**
     * #### Description
     * Selects item or deselect a itme
     * @param evt
     * @param payload
     */
    selectAssessment(evt, payload, category) {
        if (evt?.target?.checked) {
            const index = this.selectedAssessmentArr.findIndex((ele) => ele.category_id === category.id);
            if (index > -1) {
                const currentCategoryAssessment = this.selectedAssessmentArr[index].assessmentIds;
                currentCategoryAssessment.push(payload);
                this.selectedAssessmentArr[index].assessmentIds = this.uniqueByProp(currentCategoryAssessment, 'id');
                this.selectedAssessmentArr = cloneDeep(this.selectedAssessmentArr);
                this.setCategoryAndAssessment();
            }
            else {
                this.selectedAssessmentArr.push({
                    category_id: category.id,
                    assessmentIds: [payload],
                });
                this.selectedAssessmentArr = cloneDeep(this.selectedAssessmentArr);
                this.setCategoryAndAssessment();
            }
        }
        else {
            const index = this.selectedAssessmentArr.findIndex((ele) => ele.category_id === category.id);
            if (index > -1) {
                this.selectedAssessmentArr[index].assessmentIds =
                    this.selectedAssessmentArr[index].assessmentIds.filter((assessment) => assessment.id !== payload.id);
                this.selectedAssessmentArr = cloneDeep(this.selectedAssessmentArr);
                this.setCategoryAndAssessment();
                if (this.selectedAssessmentArr[index].assessmentIds?.length === 0) {
                    this.selectedAssessmentArr.splice(index, 1);
                    this.selectedAssessmentArr = cloneDeep(this.selectedAssessmentArr);
                    this.setCategoryAndAssessment();
                }
            }
        }
    }
    setCategoryAndAssessment() {
        this.selectedAssessmentCategoriesIds = this.selectedAssessmentArr
            .filter((cat) => cat?.assessmentIds?.length > 0)
            ?.map((ele) => ele?.category_id)
            .flat();
        this.selectedAssessmentIds = this.selectedAssessmentArr
            .map((cat) => cat?.assessmentIds.map((ele) => ele?.id))
            .flat();
        this.selectedAssessment = this.selectedAssessmentArr
            .map((cat) => cat?.assessmentIds.map((ele) => ele))
            .flat();
    }
    // TODO: Display selected data in bottom floating bar with next enabled button having
    // TODO: Send data in payload of create Responsibility form
    save() {
        this.onAssessmentSelect.emit(this.selectedAssessmentArr);
    }
    close() {
        this.cancelAssessment.emit();
    }
    /**
     * #### Description
     *
     * Returns the unique array of object based on unique key
     * @param array
     * @param key
     * @returns
     */
    uniqueByProp(array, key) {
        return Array.from(array
            .reduce((acc, item) => (item && item[key] && acc.set(item[key], item), acc), new Map())
            .values());
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AssessmentPickerComponent, deps: [{ token: i1.AssessmentService }, { token: i2.AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AssessmentPickerComponent, selector: "assessment-picker", inputs: { isEdit: "isEdit", setSelected: ["selectedAssessment", "setSelected"], selectedAssessmentData: "selectedAssessmentData" }, outputs: { onAssessmentSelect: "onAssessmentSelect", cancelAssessment: "cancelAssessment" }, ngImport: i0, template: "<app-preview\n  *ngIf=\"isPreview\"\n  [questionData]=\"previewQuestionData\"\n  (previewBack)=\"previewBack()\"\n></app-preview>\n<div class=\"assessment-list\" [class.animate]=\"animation\">\n  <ng-container>\n    <div class=\"assessment-list-head\">\n      <button class=\"back-btn\">\n        <!-- <i class=\"icons\">&#xe91d;</i> -->\n      </button>\n      <h3 class=\"assessment-list-title\">Select Assessment(s)</h3>\n    </div>\n    <div class=\"assessment-list-body\">\n      <div class=\"search-block\">\n        <i class=\"icons\">&#xe90b;</i>\n        <input\n          type=\"text\"\n          [(ngModel)]=\"searchAssessments\"\n          (change)=\"onAssessmentSearch($event.target.value)\"\n          placeholder=\"Search Assessment Category\"\n        />\n      </div>\n      <pagination\n        [pageCount]=\"assessmentCategory?.totalPage\"\n        [total]=\"assessmentCategory?.totalRecords\"\n        [start]=\"assessmentCategory?.start_value\"\n        [end]=\"assessmentCategory?.end_value\"\n        [activeAlphabet]=\"''\"\n        (selectedAlphabet)=\"onAlphabetSelected($event)\"\n        (selectedPage)=\"onPageSelection($event)\"\n      ></pagination>\n      <div\n        *ngIf=\"assessmentCategory.data.length === 0 && !isLoader\"\n        class=\"assessment-list-part\"\n      >\n        <app-no-data\n          [noDataImage]=\"ASSETS.search_data\"\n          [noDataText]=\"'No Assessments Found.'\"\n        ></app-no-data>\n      </div>\n      <div\n        *ngIf=\"assessmentCategory.data.length || isLoader\"\n        class=\"assessment-list-part\"\n      >\n        <div\n          *ngIf=\"\n            isEdit && selectedAssessment?.assessmentDetails?.assessment_name\n          \"\n          class=\"assessment-list-selected\"\n        >\n          <div class=\"assessment-list-heading\">\n            Assessment already selected for this responsibility\n          </div>\n          <div class=\"assessment-list-item\">\n            <div class=\"table-row\">\n              <div class=\"table-column serial disabled\">\n                <app-cs-radio\n                  [disabled]=\"true\"\n                  class=\"disabled\"\n                  [checked]=\"true\"\n                  [readonly]=\"true\"\n                ></app-cs-radio>\n              </div>\n              <div class=\"table-column sub-name\">\n                <div class=\"name-inner\">\n                  <div\n                    class=\"value\"\n                    [appTooltip]=\"\n                      selectedAssessment?.assessmentDetails?.assessment_name\n                    \"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"false\"\n                  >\n                    {{ selectedAssessment?.assessmentDetails?.assessment_name }}\n                  </div>\n                  <div class=\"within-part\">\n                    <span class=\"within-box\">Within</span>\n                    <span\n                      class=\"value\"\n                      [appTooltip]=\"\n                        selectedAssessment?.category_details?.category_name +\n                        (selectedAssessment?.category_details?.parent_tree\n                          ? ' > ' +\n                            selectedAssessment?.category_details?.parent_tree\n                          : '')\n                      \"\n                      placement=\"bottom-left\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"false\"\n                      >{{\n                        selectedAssessment?.category_details?.category_name +\n                          (selectedAssessment?.category_details?.parent_tree\n                            ? \" > \" +\n                              selectedAssessment?.category_details?.parent_tree\n                            : \"\")\n                      }}</span\n                    >\n                  </div>\n                </div>\n              </div>\n              <div class=\"table-column question\">\n                <div class=\"label\">\n                  {{ selectedAssessment?.assessmentDetails?.questions }}\n                  {{\n                    selectedAssessment?.assessmentDetails?.questions > 1\n                      ? \"Questions\"\n                      : \"Question\"\n                  }}\n                </div>\n                <div class=\"buttons\">\n                  <button\n                    class=\"action-btn\"\n                    (click)=\"preview(selectedAssessment?.assessmentDetails)\"\n                  >\n                    <i class=\"icons\">&#xeae5;</i> Preview\n                  </button>\n                  <!-- <button class=\"action-btn\"><i class=\"icons\">&#xe90c;</i> Edit</button> -->\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"assessment-list-heading\">\n          Select an Assessment for this responsibility\n        </div>\n\n        <!--\n                     Assessment category list\n                     active class is used for highlighting opened element\n                -->\n        <ng-container *ngIf=\"!isLoader\">\n          <div\n            *ngFor=\"let data of assessmentCategory.data; let i = index\"\n            class=\"assessment-list-item\"\n            [class.active]=\"\n              openedCategory.includes(data?.id) ||\n              data.id === selectedAssessment?.category_id\n            \"\n          >\n            <div\n              class=\"table-row main-list\"\n              (click)=\"expandCategory(data?.id)\"\n              [class.disabled]=\"data?.assessmentcount < 1\"\n            >\n              <div class=\"table-column serial\">\n                <div\n                  [id]=\"'sr-no' + i\"\n                  class=\"sr-no\"\n                  [appTooltip]=\"i + 1\"\n                  placement=\"bottom\"\n                  delay=\"0\"\n                  type=\"black\"\n                  [tooltipMandatory]=\"true\"\n                >\n                  {{ dataPerPage * (assessmentPayload.page_no - 1) + (i + 1) }}\n                </div>\n              </div>\n              <div class=\"table-column name\">\n                <div class=\"name-inner\">\n                  <div\n                    class=\"value\"\n                    [appTooltip]=\"data.category_name\"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"false\"\n                  >\n                    {{ data?.category_name }}\n                  </div>\n                  <div class=\"within-part\" *ngIf=\"data?.parent_tree\">\n                    <span class=\"within-box\">Within</span>\n                    <span\n                      class=\"value\"\n                      [appTooltip]=\"data.parent_tree\"\n                      placement=\"bottom-left\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"false\"\n                      >{{ data?.parent_tree }}</span\n                    >\n                  </div>\n                </div>\n              </div>\n              <div class=\"table-column action\">\n                <button\n                  [id]=\"'arrow' + i\"\n                  class=\"arrow\"\n                  [class.disabled]=\"data?.assessmentcount < 1\"\n                  [disabled]=\"data?.assessmentcount < 1\"\n                >\n                  <i *ngIf=\"!openedCategory.includes(data?.id)\" class=\"icons\"\n                    >&#xe970;</i\n                  >\n                  <i *ngIf=\"openedCategory.includes(data?.id)\" class=\"icons\"\n                    >&#xe9e8;</i\n                  >\n                </button>\n              </div>\n            </div>\n\n            <!-- Assessment list start from here -->\n            <div *ngIf=\"openedCategory.includes(data?.id)\" class=\"sub-list\">\n              <ng-container *ngIf=\"data.assessmentData?.length > 0\">\n                <div\n                  class=\"table-row\"\n                  *ngFor=\"let assessment of data.assessmentData; let j = index\"\n                  [class.active]=\"selectedAssessmentIds.includes(assessment.id)\"\n                >\n                  <div class=\"table-column serial\">\n                    <div\n                      [id]=\"'sub-sr-no' + i + j\"\n                      class=\"sr-no active\"\n                      appTooltip=\"{{\n                        dataPerPage * (assessmentPayload.page_no - 1) + (i + 1)\n                      }}.{{ j + 1 }}\"\n                      placement=\"bottom\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"true\"\n                    >\n                      {{\n                        dataPerPage * (assessmentPayload.page_no - 1) + (i + 1)\n                      }}.{{ j + 1 }}\n                      <!-- <app-cs-radio name=\"assessment\" [value]=\"assessment.id\" [checked]=\"assessment?.id === selectedAssessment?.assessment_id && data?.id === selectedAssessment?.category_id\"\n                                            (checkedEvent)=\"setAssessment(data, assessment)\"></app-cs-radio> -->\n                      <!-- (change)=\"selectGroup($event,group)\" [disabled]=\"nonRemovableGroupIds?.includes(group?.group_id)\" [checked]=\"selectedGroupIds.includes(group?.group_id)\" -->\n\n                      <vui-checkbox\n                        [checked]=\"\n                          selectedAssessmentIds.includes(assessment.id)\n                        \"\n                        (change)=\"selectAssessment($event, assessment, data)\"\n                      ></vui-checkbox>\n                    </div>\n                  </div>\n                  <div class=\"table-column sub-name\">\n                    <div\n                      class=\"value\"\n                      [appTooltip]=\"\n                        'Mission and message, communications to external audiences'\n                      \"\n                      placement=\"bottom-left\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"false\"\n                    >\n                      {{ assessment?.assessment_name }}\n                    </div>\n                  </div>\n                  <div class=\"table-column question\">\n                    <div class=\"label\">\n                      {{ assessment?.questions }}\n                      {{ assessment?.questions > 1 ? \"Questions\" : \"Question\" }}\n                    </div>\n                    <div class=\"buttons\">\n                      <button class=\"action-btn\" (click)=\"preview(assessment)\">\n                        <i class=\"icons\">&#xeae5;</i> Preview\n                      </button>\n                      <!-- <button class=\"action-btn\"><i class=\"icons\">&#xe9ba;</i> Edit</button> -->\n                    </div>\n                  </div>\n                </div>\n              </ng-container>\n              <!-- Loader loading isLoader  -->\n              <assessment-sub-loader\n                *ngIf=\"!data.assessmentData?.length\"\n              ></assessment-sub-loader>\n              <!-- <app-line-loader *ngIf=\"!data.assessmentData?.length\" [loaderHeight]=\"'5'\"></app-line-loader> -->\n            </div>\n          </div>\n        </ng-container>\n        <!-- Loader loading isLoader  -->\n        <assessment-loader *ngIf=\"isLoader\"></assessment-loader>\n      </div>\n      <!-- No data image  -->\n      <app-no-data\n        *ngIf=\"!assessmentCategory.data.length && !isLoader\"\n        [noDataImage]=\"ASSETS.search_data\"\n        [noDataText]=\"'No Data to Display'\"\n      ></app-no-data>\n    </div>\n    <!--\n            bottom floating bar which includes cancel, next button\n            closing tab\n         -->\n\n    <vui-floating-bar (closeEvent)=\"save()\" (closeList)=\"close()\">\n      <div\n        class=\"counter\"\n        *ngIf=\"selectedAssessment?.length\"\n        appPopover\n        (click)=\"assessmentCount.popover()\"\n        placement=\"left\"\n      >\n        {{ selectedAssessment?.length }}\n      </div>\n      <div class=\"name\">\n        <span *ngIf=\"selectedAssessment?.length === 1\"\n          >Assessment selected</span\n        >\n        <span *ngIf=\"selectedAssessment?.length > 1\">Assessments selected</span>\n      </div>\n      <app-popover #assessmentCount [dontCloseonClick]=\"true\">\n        <div class=\"wf-action-list\">\n          <ul class=\"action-item\">\n            <li *ngFor=\"let element of selectedAssessment; let i = index\">\n              <div class=\"avatar-card\">\n                <span class=\"value\">\n                  <!-- <i class=\"icons\"\n                            (click)=\"selectAssessment({target:{checked:false}},element)\">&#xe90d;</i> -->\n                  {{ element?.assessment_name }}\n                </span>\n              </div>\n            </li>\n          </ul>\n        </div>\n      </app-popover>\n    </vui-floating-bar>\n  </ng-container>\n</div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";::ng-deep .assessment-list{background:#fff;border-top:3px solid #1E5DD3;position:fixed;inset:0 500px 0 0;z-index:1}::ng-deep .assessment-list.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both;z-index:-1}::ng-deep .assessment-list-head{background:#fbfbfb;height:42px;padding:0 18px;display:flex;align-items:center;border:1px solid #f1f1f1;border-right:none}::ng-deep .assessment-list-head button.back-btn{background:transparent;border-radius:0;border:0;color:#161b2f;font-size:16px;padding:0;margin:0 8px 0 0}::ng-deep .assessment-list-title{color:#161b2f;font-size:15px;font-weight:500;margin:0!important;padding:0;line-height:21px}::ng-deep .assessment-list-close{background:transparent;border:none;outline:none;cursor:pointer;color:#000;font-size:12px;display:inline-block;padding:0}::ng-deep .assessment-list-body{padding:24px 40px 24px 36px;height:calc(100vh - 112px)}::ng-deep .assessment-list-body .search-block{position:relative}::ng-deep .assessment-list-body .search-block input{height:44px;line-height:24px;padding:10px 15px 10px 40px;outline:none;border:1px solid #7475763f;border-radius:4px;width:100%;font-size:14px;color:#747576}::ng-deep .assessment-list-body .search-block input::placeholder{font-weight:400}::ng-deep .assessment-list-body .search-block input:focus{border-color:#1e5dd3}::ng-deep .assessment-list-body .search-block i{position:absolute;left:17px;font-size:12px;font-weight:400;top:17px;pointer-events:none;color:#f1f1f1}::ng-deep .assessment-list-body .assessment-list-part{height:calc(100vh - 228px);overflow:auto;padding:8px 12px 0 0;width:calc(100% + 12px)}::ng-deep .assessment-list-body .assessment-list-part::-webkit-scrollbar-track{background-color:#fff;position:absolute}::ng-deep .assessment-list-body .assessment-list-part::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .assessment-list-body .assessment-list-part::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-selected{margin-bottom:8px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-heading{color:#161b2f;font-size:12px;font-weight:600;margin-bottom:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item{border:1px solid #f1f1f1;border-radius:2px;margin-bottom:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .main-list{cursor:pointer}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item.active{border-color:#1e5dd3;box-shadow:0 3px 6px #4681ef26}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row{display:flex;align-items:center;justify-content:space-between}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row.disabled{pointer-events:none}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column{color:#747576;height:48px;position:relative;width:100%;display:flex;align-items:center;padding:0 4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial{width:32px;max-width:32px;justify-content:center}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial .sr-no{width:16px;background:#f8f8f8;writing-mode:vertical-lr;color:#747576;font-size:10px;font-weight:500;display:flex;height:100%;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial .sr-no vui-checkbox{position:absolute;top:8px;left:0;opacity:0;transition:all .2s ease-in-out}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial .sr-no vui-checkbox label.checkbox-item{position:unset}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.name{width:calc(100% - 64px);min-width:calc(100% - 64px)}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.name .name-inner{width:100%}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.name .name-inner .value{color:#161b2f;font-size:12px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;padding-right:20px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.action{width:32px;max-width:32px;justify-content:center}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.action button.arrow{background:transparent;border:none;border-radius:0;color:#747576;font-size:12px;padding:0;margin:0;display:flex;align-items:center;justify-content:center;height:100%;width:100%}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.action button.disabled{opacity:.5!important;pointer-events:none}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.sub-name{width:calc(100% - 232px);min-width:calc(100% - 232px)}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.sub-name .name-inner{width:100%}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.sub-name .value{color:#747576;font-size:12px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;padding-right:20px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question{width:200px;max-width:200px;justify-content:flex-end}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .label{background:#f1f1f1;border-radius:2px;color:#042e7d;font-size:9px;font-weight:600;text-transform:uppercase;padding-left:4px;padding-right:4px;line-height:12px;margin-right:8px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons{display:flex;width:0;overflow:hidden;transition:all .2s ease-in-out}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons button.action-btn{background:#fff;border:1px solid #f1f1f1;border-radius:2px;color:#1e5dd3;font-size:11px;font-weight:500;line-height:24px;text-transform:uppercase;padding:0 8px;display:flex;align-items:center;margin:0}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons button.action-btn i{margin-right:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons button.action-btn+button{margin-left:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row:hover .table-column.question .buttons{width:86px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row{border-top:1px solid #f1f1f1}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row:hover .table-column.serial .sr-no,::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row.active .table-column.serial .sr-no{color:#f8f8f8}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row:hover .table-column.serial .sr-no vui-checkbox,::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row.active .table-column.serial .sr-no vui-checkbox{opacity:1}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row .table-column{height:32px}::ng-deep .assessment-list-body ul{padding:0;margin:0}::ng-deep .assessment-list-body ul.assessment{max-height:calc(100vh - 240px);overflow:auto;padding:16px 12px 0 0;width:calc(100% + 12px)}::ng-deep .assessment-list-body ul.assessment::-webkit-scrollbar-track{background-color:#fff;position:absolute}::ng-deep .assessment-list-body ul.assessment::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .assessment-list-body ul.assessment::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .assessment-list-body ul.assessment li{padding:0 0 12px;list-style:none;display:flex;align-items:center;justify-content:space-between}::ng-deep .assessment-list-body ul.assessment li vui-checkbox{width:calc(100% - 260px)}::ng-deep .assessment-list-body ul.assessment li vui-checkbox .radio-item .value .name{font-size:12px;color:#161b2f;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .assessment-list-body ul.assessment li .right{display:flex;align-items:center}::ng-deep .assessment-list-body ul.assessment li .right .label{background:#f1f1f1;border-radius:2px;color:#042e7d;font-size:9px;font-weight:600;text-transform:uppercase;padding-left:4px;padding-right:4px;line-height:12px}::ng-deep .assessment-list-body ul.assessment li .right .buttons{display:flex;width:0;overflow:hidden;transition:all .2s ease-in-out}::ng-deep .assessment-list-body ul.assessment li .right .buttons button.action-btn{background:#fff;border:1px solid #f1f1f1;border-radius:2px;color:#1e5dd3;font-size:11px;font-weight:500;line-height:24px;text-transform:uppercase;padding:0 8px;margin-left:12px;display:flex;align-items:center}::ng-deep .assessment-list-body ul.assessment li .right .buttons button.action-btn i{margin-right:4px}::ng-deep .assessment-list-body ul.assessment li .right .buttons button.action-btn+button{margin-left:4px}::ng-deep .assessment-list-body ul.assessment li:hover .right .buttons{width:156px}.within-part{display:flex;align-items:center;padding-right:12px}.within-part .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:12px;color:#747576}.within-box{background:#f1f1f1;border-radius:2px;color:#042e7d;font-size:9px;font-weight:600;text-transform:uppercase;padding:0 4px;margin-right:8px;line-height:12px}@keyframes animate-right{0%{transform:translate(100%)}to{transform:translate(0)}}.wf-action-list{width:220px}.wf-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.wf-action-list ul.action-item{display:block}.wf-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.wf-action-list ul.action-item li button{color:#6e717e;text-align:left;text-decoration:none;cursor:pointer;background:transparent;font-size:12px;text-transform:capitalize;display:flex;width:100%;padding:7.5px 11px;border:none}.wf-action-list ul.action-item li button .file-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:calc(100% - 16px)}.wf-action-list ul.action-item li button i{font-size:16px;margin-right:10px;color:#1e5dd3}.wf-action-list ul.action-item li button:hover{background:#f3f3f3}.wf-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.wf-action-list ul.action-item li .avatar-card.within-con{display:block}.wf-action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;min-width:24px!important;overflow:hidden;background:#1e5dd3;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.wf-action-list ul.action-item li .avatar-card .avatar img{background:#fff;width:100%;height:100%}.wf-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.wf-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.wf-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#747576;cursor:pointer;margin-right:5px}.wf-action-list ul.action-item li .avatar-card.no-image{display:block}.wf-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.wf-action-list ul.action-item li .avatar-card i.delete-icon{color:#d93b41;cursor:pointer;font-size:14px}.wf-action-list ul.action-item li .chip-item{color:#1e5dd3;padding:10px;display:flex;align-items:center}.wf-action-list ul.action-item li .chip-item i{color:#747576;margin-left:7px;font-size:10px;cursor:pointer;display:inline-flex}.wf-action-list ul.action-item li .chip-item span{display:block;width:auto;width:calc(100% - 17px);font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wf-action-list ul.action-item li .chip-item span.chip-block{display:block;width:100%}.wf-action-list ul.action-item li .chip-item span.id{font-size:9px}.wf-action-list ul.action-item li .within{display:flex;align-items:center;justify-content:flex-start}.wf-action-list ul.action-item li .within .block{background:#f1f1f1;border-radius:2px;padding:0 2px;line-height:14px;font-size:9px;font-weight:500;color:#042e7d;margin-right:6px;display:block;text-transform:uppercase}.wf-action-list ul.action-item li .within .data{width:100%;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#747576;font-size:11px;font-weight:400;line-height:17px}.wf-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "component", type: i5.PopoverComponent, selector: "app-popover", inputs: ["dontCloseonClick"] }, { kind: "directive", type: i6.PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "placement"] }, { kind: "directive", type: i7.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: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i8.NoDataComponentUI, selector: "app-no-data", inputs: ["action", "secondaryAction", "noDataImage", "noDataText", "noDataButton", "secondaryButton", "noDataSecButton", "altText", "smallButton"], outputs: ["buttonAction", "secondaryActionButton"] }, { kind: "component", type: i9.CsRadioComponentUI, selector: "app-cs-radio", inputs: ["disabled", "readonly", "name", "checked", "value"], outputs: ["checkedEvent"] }, { kind: "component", type: i10.PreviewComponent, selector: "app-preview", inputs: ["questionData"], outputs: ["previewBack"] }, { kind: "component", type: i11.CheckboxComponent, selector: "vui-checkbox", inputs: ["disabled", "checked", "indeterminateEnabled"] }, { kind: "component", type: i12.VuiFloatingBarComponent, selector: "vui-floating-bar", inputs: ["selectedData", "groupSelected", "displayElementKey", "elementId", "singularText", "pluralText", "showNextButton", "showFrequencyText", "showWorkflow", "workflowText", "currentFrequency", "isDisabled", "workflowList", "selectedWorkflow", "workflowPlaceHolder", "mode", "nextDisabled", "nonRemovableUsersList", "removePosition"], outputs: ["closeEvent", "deleteEvent", "closeList", "workflowTypeChanged"] }, { kind: "component", type: i13.AssessmentLoaderComponent, selector: "assessment-loader" }, { kind: "component", type: i14.AssessmentSubLoaderComponent, selector: "assessment-sub-loader" }, { kind: "component", type: i15.Pagination, selector: "pagination", inputs: ["activeAlphabet", "pageCount", "start", "end", "total", "noFilter", "currentPage"], outputs: ["selectedPage", "selectedAlphabet"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AssessmentPickerComponent, decorators: [{
            type: Component,
            args: [{ selector: 'assessment-picker', template: "<app-preview\n  *ngIf=\"isPreview\"\n  [questionData]=\"previewQuestionData\"\n  (previewBack)=\"previewBack()\"\n></app-preview>\n<div class=\"assessment-list\" [class.animate]=\"animation\">\n  <ng-container>\n    <div class=\"assessment-list-head\">\n      <button class=\"back-btn\">\n        <!-- <i class=\"icons\">&#xe91d;</i> -->\n      </button>\n      <h3 class=\"assessment-list-title\">Select Assessment(s)</h3>\n    </div>\n    <div class=\"assessment-list-body\">\n      <div class=\"search-block\">\n        <i class=\"icons\">&#xe90b;</i>\n        <input\n          type=\"text\"\n          [(ngModel)]=\"searchAssessments\"\n          (change)=\"onAssessmentSearch($event.target.value)\"\n          placeholder=\"Search Assessment Category\"\n        />\n      </div>\n      <pagination\n        [pageCount]=\"assessmentCategory?.totalPage\"\n        [total]=\"assessmentCategory?.totalRecords\"\n        [start]=\"assessmentCategory?.start_value\"\n        [end]=\"assessmentCategory?.end_value\"\n        [activeAlphabet]=\"''\"\n        (selectedAlphabet)=\"onAlphabetSelected($event)\"\n        (selectedPage)=\"onPageSelection($event)\"\n      ></pagination>\n      <div\n        *ngIf=\"assessmentCategory.data.length === 0 && !isLoader\"\n        class=\"assessment-list-part\"\n      >\n        <app-no-data\n          [noDataImage]=\"ASSETS.search_data\"\n          [noDataText]=\"'No Assessments Found.'\"\n        ></app-no-data>\n      </div>\n      <div\n        *ngIf=\"assessmentCategory.data.length || isLoader\"\n        class=\"assessment-list-part\"\n      >\n        <div\n          *ngIf=\"\n            isEdit && selectedAssessment?.assessmentDetails?.assessment_name\n          \"\n          class=\"assessment-list-selected\"\n        >\n          <div class=\"assessment-list-heading\">\n            Assessment already selected for this responsibility\n          </div>\n          <div class=\"assessment-list-item\">\n            <div class=\"table-row\">\n              <div class=\"table-column serial disabled\">\n                <app-cs-radio\n                  [disabled]=\"true\"\n                  class=\"disabled\"\n                  [checked]=\"true\"\n                  [readonly]=\"true\"\n                ></app-cs-radio>\n              </div>\n              <div class=\"table-column sub-name\">\n                <div class=\"name-inner\">\n                  <div\n                    class=\"value\"\n                    [appTooltip]=\"\n                      selectedAssessment?.assessmentDetails?.assessment_name\n                    \"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"false\"\n                  >\n                    {{ selectedAssessment?.assessmentDetails?.assessment_name }}\n                  </div>\n                  <div class=\"within-part\">\n                    <span class=\"within-box\">Within</span>\n                    <span\n                      class=\"value\"\n                      [appTooltip]=\"\n                        selectedAssessment?.category_details?.category_name +\n                        (selectedAssessment?.category_details?.parent_tree\n                          ? ' > ' +\n                            selectedAssessment?.category_details?.parent_tree\n                          : '')\n                      \"\n                      placement=\"bottom-left\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"false\"\n                      >{{\n                        selectedAssessment?.category_details?.category_name +\n                          (selectedAssessment?.category_details?.parent_tree\n                            ? \" > \" +\n                              selectedAssessment?.category_details?.parent_tree\n                            : \"\")\n                      }}</span\n                    >\n                  </div>\n                </div>\n              </div>\n              <div class=\"table-column question\">\n                <div class=\"label\">\n                  {{ selectedAssessment?.assessmentDetails?.questions }}\n                  {{\n                    selectedAssessment?.assessmentDetails?.questions > 1\n                      ? \"Questions\"\n                      : \"Question\"\n                  }}\n                </div>\n                <div class=\"buttons\">\n                  <button\n                    class=\"action-btn\"\n                    (click)=\"preview(selectedAssessment?.assessmentDetails)\"\n                  >\n                    <i class=\"icons\">&#xeae5;</i> Preview\n                  </button>\n                  <!-- <button class=\"action-btn\"><i class=\"icons\">&#xe90c;</i> Edit</button> -->\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"assessment-list-heading\">\n          Select an Assessment for this responsibility\n        </div>\n\n        <!--\n                     Assessment category list\n                     active class is used for highlighting opened element\n                -->\n        <ng-container *ngIf=\"!isLoader\">\n          <div\n            *ngFor=\"let data of assessmentCategory.data; let i = index\"\n            class=\"assessment-list-item\"\n            [class.active]=\"\n              openedCategory.includes(data?.id) ||\n              data.id === selectedAssessment?.category_id\n            \"\n          >\n            <div\n              class=\"table-row main-list\"\n              (click)=\"expandCategory(data?.id)\"\n              [class.disabled]=\"data?.assessmentcount < 1\"\n            >\n              <div class=\"table-column serial\">\n                <div\n                  [id]=\"'sr-no' + i\"\n                  class=\"sr-no\"\n                  [appTooltip]=\"i + 1\"\n                  placement=\"bottom\"\n                  delay=\"0\"\n                  type=\"black\"\n                  [tooltipMandatory]=\"true\"\n                >\n                  {{ dataPerPage * (assessmentPayload.page_no - 1) + (i + 1) }}\n                </div>\n              </div>\n              <div class=\"table-column name\">\n                <div class=\"name-inner\">\n                  <div\n                    class=\"value\"\n                    [appTooltip]=\"data.category_name\"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"false\"\n                  >\n                    {{ data?.category_name }}\n                  </div>\n                  <div class=\"within-part\" *ngIf=\"data?.parent_tree\">\n                    <span class=\"within-box\">Within</span>\n                    <span\n                      class=\"value\"\n                      [appTooltip]=\"data.parent_tree\"\n                      placement=\"bottom-left\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"false\"\n                      >{{ data?.parent_tree }}</span\n                    >\n                  </div>\n                </div>\n              </div>\n              <div class=\"table-column action\">\n                <button\n                  [id]=\"'arrow' + i\"\n                  class=\"arrow\"\n                  [class.disabled]=\"data?.assessmentcount < 1\"\n                  [disabled]=\"data?.assessmentcount < 1\"\n                >\n                  <i *ngIf=\"!openedCategory.includes(data?.id)\" class=\"icons\"\n                    >&#xe970;</i\n                  >\n                  <i *ngIf=\"openedCategory.includes(data?.id)\" class=\"icons\"\n                    >&#xe9e8;</i\n                  >\n                </button>\n              </div>\n            </div>\n\n            <!-- Assessment list start from here -->\n            <div *ngIf=\"openedCategory.includes(data?.id)\" class=\"sub-list\">\n              <ng-container *ngIf=\"data.assessmentData?.length > 0\">\n                <div\n                  class=\"table-row\"\n                  *ngFor=\"let assessment of data.assessmentData; let j = index\"\n                  [class.active]=\"selectedAssessmentIds.includes(assessment.id)\"\n                >\n                  <div class=\"table-column serial\">\n                    <div\n                      [id]=\"'sub-sr-no' + i + j\"\n                      class=\"sr-no active\"\n                      appTooltip=\"{{\n                        dataPerPage * (assessmentPayload.page_no - 1) + (i + 1)\n                      }}.{{ j + 1 }}\"\n                      placement=\"bottom\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"true\"\n                    >\n                      {{\n                        dataPerPage * (assessmentPayload.page_no - 1) + (i + 1)\n                      }}.{{ j + 1 }}\n                      <!-- <app-cs-radio name=\"assessment\" [value]=\"assessment.id\" [checked]=\"assessment?.id === selectedAssessment?.assessment_id && data?.id === selectedAssessment?.category_id\"\n                                            (checkedEvent)=\"setAssessment(data, assessment)\"></app-cs-radio> -->\n                      <!-- (change)=\"selectGroup($event,group)\" [disabled]=\"nonRemovableGroupIds?.includes(group?.group_id)\" [checked]=\"selectedGroupIds.includes(group?.group_id)\" -->\n\n                      <vui-checkbox\n                        [checked]=\"\n                          selectedAssessmentIds.includes(assessment.id)\n                        \"\n                        (change)=\"selectAssessment($event, assessment, data)\"\n                      ></vui-checkbox>\n                    </div>\n                  </div>\n                  <div class=\"table-column sub-name\">\n                    <div\n                      class=\"value\"\n                      [appTooltip]=\"\n                        'Mission and message, communications to external audiences'\n                      \"\n                      placement=\"bottom-left\"\n                      delay=\"0\"\n                      type=\"black\"\n                      [tooltipMandatory]=\"false\"\n                    >\n                      {{ assessment?.assessment_name }}\n                    </div>\n                  </div>\n                  <div class=\"table-column question\">\n                    <div class=\"label\">\n                      {{ assessment?.questions }}\n                      {{ assessment?.questions > 1 ? \"Questions\" : \"Question\" }}\n                    </div>\n                    <div class=\"buttons\">\n                      <button class=\"action-btn\" (click)=\"preview(assessment)\">\n                        <i class=\"icons\">&#xeae5;</i> Preview\n                      </button>\n                      <!-- <button class=\"action-btn\"><i class=\"icons\">&#xe9ba;</i> Edit</button> -->\n                    </div>\n                  </div>\n                </div>\n              </ng-container>\n              <!-- Loader loading isLoader  -->\n              <assessment-sub-loader\n                *ngIf=\"!data.assessmentData?.length\"\n              ></assessment-sub-loader>\n              <!-- <app-line-loader *ngIf=\"!data.assessmentData?.length\" [loaderHeight]=\"'5'\"></app-line-loader> -->\n            </div>\n          </div>\n        </ng-container>\n        <!-- Loader loading isLoader  -->\n        <assessment-loader *ngIf=\"isLoader\"></assessment-loader>\n      </div>\n      <!-- No data image  -->\n      <app-no-data\n        *ngIf=\"!assessmentCategory.data.length && !isLoader\"\n        [noDataImage]=\"ASSETS.search_data\"\n        [noDataText]=\"'No Data to Display'\"\n      ></app-no-data>\n    </div>\n    <!--\n            bottom floating bar which includes cancel, next button\n            closing tab\n         -->\n\n    <vui-floating-bar (closeEvent)=\"save()\" (closeList)=\"close()\">\n      <div\n        class=\"counter\"\n        *ngIf=\"selectedAssessment?.length\"\n        appPopover\n        (click)=\"assessmentCount.popover()\"\n        placement=\"left\"\n      >\n        {{ selectedAssessment?.length }}\n      </div>\n      <div class=\"name\">\n        <span *ngIf=\"selectedAssessment?.length === 1\"\n          >Assessment selected</span\n        >\n        <span *ngIf=\"selectedAssessment?.length > 1\">Assessments selected</span>\n      </div>\n      <app-popover #assessmentCount [dontCloseonClick]=\"true\">\n        <div class=\"wf-action-list\">\n          <ul class=\"action-item\">\n            <li *ngFor=\"let element of selectedAssessment; let i = index\">\n              <div class=\"avatar-card\">\n                <span class=\"value\">\n                  <!-- <i class=\"icons\"\n                            (click)=\"selectAssessment({target:{checked:false}},element)\">&#xe90d;</i> -->\n                  {{ element?.assessment_name }}\n                </span>\n              </div>\n            </li>\n          </ul>\n        </div>\n      </app-popover>\n    </vui-floating-bar>\n  </ng-container>\n</div>\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";::ng-deep .assessment-list{background:#fff;border-top:3px solid #1E5DD3;position:fixed;inset:0 500px 0 0;z-index:1}::ng-deep .assessment-list.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both;z-index:-1}::ng-deep .assessment-list-head{background:#fbfbfb;height:42px;padding:0 18px;display:flex;align-items:center;border:1px solid #f1f1f1;border-right:none}::ng-deep .assessment-list-head button.back-btn{background:transparent;border-radius:0;border:0;color:#161b2f;font-size:16px;padding:0;margin:0 8px 0 0}::ng-deep .assessment-list-title{color:#161b2f;font-size:15px;font-weight:500;margin:0!important;padding:0;line-height:21px}::ng-deep .assessment-list-close{background:transparent;border:none;outline:none;cursor:pointer;color:#000;font-size:12px;display:inline-block;padding:0}::ng-deep .assessment-list-body{padding:24px 40px 24px 36px;height:calc(100vh - 112px)}::ng-deep .assessment-list-body .search-block{position:relative}::ng-deep .assessment-list-body .search-block input{height:44px;line-height:24px;padding:10px 15px 10px 40px;outline:none;border:1px solid #7475763f;border-radius:4px;width:100%;font-size:14px;color:#747576}::ng-deep .assessment-list-body .search-block input::placeholder{font-weight:400}::ng-deep .assessment-list-body .search-block input:focus{border-color:#1e5dd3}::ng-deep .assessment-list-body .search-block i{position:absolute;left:17px;font-size:12px;font-weight:400;top:17px;pointer-events:none;color:#f1f1f1}::ng-deep .assessment-list-body .assessment-list-part{height:calc(100vh - 228px);overflow:auto;padding:8px 12px 0 0;width:calc(100% + 12px)}::ng-deep .assessment-list-body .assessment-list-part::-webkit-scrollbar-track{background-color:#fff;position:absolute}::ng-deep .assessment-list-body .assessment-list-part::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .assessment-list-body .assessment-list-part::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-selected{margin-bottom:8px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-heading{color:#161b2f;font-size:12px;font-weight:600;margin-bottom:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item{border:1px solid #f1f1f1;border-radius:2px;margin-bottom:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .main-list{cursor:pointer}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item.active{border-color:#1e5dd3;box-shadow:0 3px 6px #4681ef26}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row{display:flex;align-items:center;justify-content:space-between}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row.disabled{pointer-events:none}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column{color:#747576;height:48px;position:relative;width:100%;display:flex;align-items:center;padding:0 4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial{width:32px;max-width:32px;justify-content:center}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial .sr-no{width:16px;background:#f8f8f8;writing-mode:vertical-lr;color:#747576;font-size:10px;font-weight:500;display:flex;height:100%;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial .sr-no vui-checkbox{position:absolute;top:8px;left:0;opacity:0;transition:all .2s ease-in-out}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.serial .sr-no vui-checkbox label.checkbox-item{position:unset}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.name{width:calc(100% - 64px);min-width:calc(100% - 64px)}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.name .name-inner{width:100%}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.name .name-inner .value{color:#161b2f;font-size:12px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;padding-right:20px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.action{width:32px;max-width:32px;justify-content:center}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.action button.arrow{background:transparent;border:none;border-radius:0;color:#747576;font-size:12px;padding:0;margin:0;display:flex;align-items:center;justify-content:center;height:100%;width:100%}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.action button.disabled{opacity:.5!important;pointer-events:none}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.sub-name{width:calc(100% - 232px);min-width:calc(100% - 232px)}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.sub-name .name-inner{width:100%}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.sub-name .value{color:#747576;font-size:12px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;padding-right:20px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question{width:200px;max-width:200px;justify-content:flex-end}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .label{background:#f1f1f1;border-radius:2px;color:#042e7d;font-size:9px;font-weight:600;text-transform:uppercase;padding-left:4px;padding-right:4px;line-height:12px;margin-right:8px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons{display:flex;width:0;overflow:hidden;transition:all .2s ease-in-out}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons button.action-btn{background:#fff;border:1px solid #f1f1f1;border-radius:2px;color:#1e5dd3;font-size:11px;font-weight:500;line-height:24px;text-transform:uppercase;padding:0 8px;display:flex;align-items:center;margin:0}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons button.action-btn i{margin-right:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row .table-column.question .buttons button.action-btn+button{margin-left:4px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .table-row:hover .table-column.question .buttons{width:86px}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row{border-top:1px solid #f1f1f1}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row:hover .table-column.serial .sr-no,::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row.active .table-column.serial .sr-no{color:#f8f8f8}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row:hover .table-column.serial .sr-no vui-checkbox,::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row.active .table-column.serial .sr-no vui-checkbox{opacity:1}::ng-deep .assessment-list-body .assessment-list-part .assessment-list-item .sub-list .table-row .table-column{height:32px}::ng-deep .assessment-list-body ul{padding:0;margin:0}::ng-deep .assessment-list-body ul.assessment{max-height:calc(100vh - 240px);overflow:auto;padding:16px 12px 0 0;width:calc(100% + 12px)}::ng-deep .assessment-list-body ul.assessment::-webkit-scrollbar-track{background-color:#fff;position:absolute}::ng-deep .assessment-list-body ul.assessment::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .assessment-list-body ul.assessment::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .assessment-list-body ul.assessment li{padding:0 0 12px;list-style:none;display:flex;align-items:center;justify-content:space-between}::ng-deep .assessment-list-body ul.assessment li vui-checkbox{width:calc(100% - 260px)}::ng-deep .assessment-list-body ul.assessment li vui-checkbox .radio-item .value .name{font-size:12px;color:#161b2f;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .assessment-list-body ul.assessment li .right{display:flex;align-items:center}::ng-deep .assessment-list-body ul.assessment li .right .label{background:#f1f1f1;border-radius:2px;color:#042e7d;font-size:9px;font-weight:600;text-transform:uppercase;padding-left:4px;padding-right:4px;line-height:12px}::ng-deep .assessment-list-body ul.assessment li .right .buttons{display:flex;width:0;overflow:hidden;transition:all .2s ease-in-out}::ng-deep .assessment-list-body ul.assessment li .right .buttons button.action-btn{background:#fff;border:1px solid #f1f1f1;border-radius:2px;color:#1e5dd3;font-size:11px;font-weight:500;line-height:24px;text-transform:uppercase;padding:0 8px;margin-left:12px;display:flex;align-items:center}::ng-deep .assessment-list-body ul.assessment li .right .buttons button.action-btn i{margin-right:4px}::ng-deep .assessment-list-body ul.assessment li .right .buttons button.action-btn+button{margin-left:4px}::ng-deep .assessment-list-body ul.assessment li:hover .right .buttons{width:156px}.within-part{display:flex;align-items:center;padding-right:12px}.within-part .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:12px;color:#747576}.within-box{background:#f1f1f1;border-radius:2px;color:#042e7d;font-size:9px;font-weight:600;text-transform:uppercase;padding:0 4px;margin-right:8px;line-height:12px}@keyframes animate-right{0%{transform:translate(100%)}to{transform:translate(0)}}.wf-action-list{width:220px}.wf-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.wf-action-list ul.action-item{display:block}.wf-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.wf-action-list ul.action-item li button{color:#6e717e;text-align:left;text-decoration:none;cursor:pointer;background:transparent;font-size:12px;text-transform:capitalize;display:flex;width:100%;padding:7.5px 11px;border:none}.wf-action-list ul.action-item li button .file-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;width:calc(100% - 16px)}.wf-action-list ul.action-item li button i{font-size:16px;margin-right:10px;color:#1e5dd3}.wf-action-list ul.action-item li button:hover{background:#f3f3f3}.wf-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.wf-action-list ul.action-item li .avatar-card.within-con{display:block}.wf-action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;min-width:24px!important;overflow:hidden;background:#1e5dd3;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.wf-action-list ul.action-item li .avatar-card .avatar img{background:#fff;width:100%;height:100%}.wf-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.wf-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.wf-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#747576;cursor:pointer;margin-right:5px}.wf-action-list ul.action-item li .avatar-card.no-image{display:block}.wf-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.wf-action-list ul.action-item li .avatar-card i.delete-icon{color:#d93b41;cursor:pointer;font-size:14px}.wf-action-list ul.action-item li .chip-item{color:#1e5dd3;padding:10px;display:flex;align-items:center}.wf-action-list ul.action-item li .chip-item i{color:#747576;margin-left:7px;font-size:10px;cursor:pointer;display:inline-flex}.wf-action-list ul.action-item li .chip-item span{display:block;width:auto;width:calc(100% - 17px);font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wf-action-list ul.action-item li .chip-item span.chip-block{display:block;width:100%}.wf-action-list ul.action-item li .chip-item span.id{font-size:9px}.wf-action-list ul.action-item li .within{display:flex;align-items:center;justify-content:flex-start}.wf-action-list ul.action-item li .within .block{background:#f1f1f1;border-radius:2px;padding:0 2px;line-height:14px;font-size:9px;font-weight:500;color:#042e7d;margin-right:6px;display:block;text-transform:uppercase}.wf-action-list ul.action-item li .within .data{width:100%;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#747576;font-size:11px;font-weight:400;line-height:17px}.wf-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.AssessmentService }, { type: i2.AuthService }]; }, propDecorators: { isEdit: [{
                type: Input
            }], setSelected: [{
                type: Input,
                args: ['selectedAssessment']
            }], selectedAssessmentData: [{
                type: Input
            }], onAssessmentSelect: [{
                type: Output
            }], cancelAssessment: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 