import { Component, EventEmitter, Input, Output, Optional, } from '@angular/core';
import { cloneDeep } from 'lodash-es';
import * as i0 from "@angular/core";
import * as i1 from "../../../workflow-services/responsibility.service";
import * as i2 from "../../../configurations";
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 "../../v-loader/loader-inline/loader-inline.component";
import * as i8 from "../../pipes/filterPipe";
import * as i9 from "../../pipes/within-data.pipe";
export class ParentTableComponent {
    constructor(responsibilityService, config) {
        this.responsibilityService = responsibilityService;
        this.tableList = [];
        this.search = '';
        this.closeParent = new EventEmitter();
        this.expandCategory = new EventEmitter();
        this.entrustFramework = new EventEmitter();
        this.parentViewData = [];
        this.libraryReport = [];
        this.entities = [];
        this.loader = false;
        this.searchText = '';
        this.picUrl = '';
        this.env = config?.envConfig;
        this.picUrl = this.env.s3Url + this.env.s3Bucket + this.env.profile;
    }
    ngOnChanges() {
        this.searchText = this.search;
    }
    ngOnInit() {
        this.parentViewData = [...new Set(this.tableList)];
    }
    getCategoryDetailsById(id) {
        if (!id || id == null) {
            this.tableList = [...new Set(this.parentViewData)];
            return;
        }
        this.loader = true;
        this.search = '';
        this.responsibilityService.getCategoryDetailsById(id).subscribe((res) => {
            this.expandCategory.emit(cloneDeep(res[0]));
            this.currentCategory = cloneDeep(res[0]);
            this.libraryReport = cloneDeep(res[0].libraryReport);
            this.entities = cloneDeep(res[0].all_entities_name);
            this.tableList = cloneDeep(res).slice(1);
            this.currentEntity = undefined;
            this.loader = false;
        }, (err) => {
            console.error(err);
            this.loader = false;
        });
    }
    entrustFrameworkDetails(report) {
        this.entrustFramework.emit(report);
    }
    entity_open(data) {
        this.loader = true;
        this.responsibilityService
            .getRCDetailsOfFramework(data._id, this.currentCategory._id)
            .subscribe((res) => {
            this.expandCategory.emit(cloneDeep(res[0]));
            this.currentEntity = cloneDeep(res[0].all_entities_name[0].rc_name);
            this.libraryReport = cloneDeep(res[0].libraryReport);
            this.entities = cloneDeep(res[0].all_entities_name);
            this.entities = this.entities.filter((rc) => rc._id !== data._id);
            this.tableList = cloneDeep(res).slice(1);
            this.loader = false;
        }, (err) => {
            console.error(err);
            this.loader = false;
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ParentTableComponent, deps: [{ token: i1.ResponsibilityService }, { token: i2.Configurations, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ParentTableComponent, selector: "app-parent-table", inputs: { tableList: "tableList", search: "search" }, outputs: { closeParent: "closeParent", expandCategory: "expandCategory", entrustFramework: "entrustFramework" }, usesOnChanges: true, ngImport: i0, template: "<!-- <p>parent-table works!</p> -->\n<table class=\"framework-table\">\n    <thead>\n        <tr>\n            <th class=\"sl-number\">#</th>\n            <th>Name</th>\n            <th>Total</th>\n            <th>Assigned</th>\n            <th>UnAssigned</th>\n            <th></th>\n        </tr>\n    </thead>\n    <tbody>\n        <tr *ngFor=\"let report of libraryReport | filter: search\" class=\"library\">\n            <td class=\"sl-number icon\">\n                <span></span>\n            </td>\n            <td class=\"name\">\n                <div class=\"vx-d-flex vx-align-center\">\n                    <div *ngIf=\"report?.is_assigned\" class=\"vx-avatar-group\">\n                        <div *ngIf=\"report?.assigned_by_pic != '' || report?.assigned_by_short != ''\" class=\"vx-avatar md\" #entrustedBy appTooltip=\"Entrusted by: {{report?.assigned_by_name}}\"\n                            placement=\"bottom-left\" delay=\"0\" [tooltipMandatory]=\"true\"> \n                            <img [src]=\"report.assigned_by_pic\" alt=\"\" *ngIf=\"report?.assigned_by_pic\">\n                            <span class=\"green\" *ngIf=\"!report?.assigned_by_pic\">{{report?.assigned_by_short}}</span> \n                        </div>\n                        <div *ngIf=\"report?.employee_name != ''\" class=\"vx-avatar md\" #entrustedTo appTooltip=\"Entrusted to: {{report?.employee_name}}\"\n                            placement=\"bottom-left\" delay=\"0\" [tooltipMandatory]=\"true\">\n                            <img *ngIf=\"report?.employee_pic\" [src]=\"report.employee_pic\" alt=\"\">\n                            <span class=\"green\" *ngIf=\"!report?.employee_pic\">\n                                {{report?.employee_short}}\n                            </span>\n                        </div>\n                        <div *ngIf=\"report?.employee_name === '' && report?.multipleAssigneeArr?.length > 0\" class=\"vx-avatar md\">\n                            <span class=\"green\" appPopover (click)=\"multipleUsers.popover()\" placement=\"left\">+{{report?.multipleAssigneeArr?.length}}</span>\n                        </div>\n                        \n                    </div>\n                    <span class=\"title\" appTooltip=\"{{report.report_name}}\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\"> <span class=\"id\">{{ report?.is_assigned == 1 ? '[ ' + report?.cid + '] ' : ' ' }}</span>{{report.report_name}}</span>\n                </div>\n                <app-popover #multipleUsers>\n                    <div class=\"wf-action-list\">\n                        <ul class=\"action-item\">\n                            <li>\n                                <div class=\"avatar-card\" *ngFor=\" let assignee of report?.multipleAssigneeArr\">\n                                    <div class=\"avatar\" >\n                                        <span *ngIf=\"assignee?.profile_pic === ''\">{{assignee?.member_short_name}}</span>\n                                        <img *ngIf=\"assignee?.profile_pic !== ''\" [src]=\"assignee.employee_pic\" alt=\"\">\n                                    </div>\n                                    \n                                    <span class=\"value\">{{assignee?.member_name}}</span>\n                                </div>\n                            </li>\n                        </ul>\n                    </div>\n                </app-popover>\n            </td>\n            <td class=\"total\"></td>\n            <td class=\"assigned\"></td>\n            <td class=\"unassigned\">\n                <button type=\"button\" [disabled]=\"report?.is_assigned == 1 && currentCategory?.visibility == 2\" (click)=\"entrustFrameworkDetails(report)\" class=\"entrust\">Entrust</button>\n            </td>\n            <td class=\"action\">\n            </td>\n        </tr>\n        <tr *ngFor=\"let entity of entities  | filter: search\" class=\"library\">\n            <td class=\"sl-number icon\">\n                <i class=\"icons\">&#xe99f;</i>\n            </td>\n            <td class=\"name\" appTooltip=\"{{entity?.rc_name}} <br><span class='within-row'><span class='within'>WITHIN</span><span class='within-value'>{{entity?.parent_rc}}</span></span>\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\n                <span class=\"title\">{{entity?.rc_name}}</span>\n                <span class=\"within-row\" *ngIf=\"entity?.parent_rc?.length > 0\">\n                    <span class=\"within\">WITHIN</span>\n                    <span class=\"text\" *ngFor=\"let parent of entity?.parent_rc;let rc = index\">\n                        <ng-container *ngIf=\"rc>0\"> > </ng-container> {{parent}}\n                    </span>\n                </span>\n            </td>\n            <td class=\"total\">\n                <span class=\"text\">{{entity?.total_control}}</span>\n            </td>\n            <td class=\"assigned\">\n                <span class=\"text\">{{ entity?.mapped_control }}</span>\n                <span class=\"text\">{{ entity?.total_control == 0 ? 0 : ((entity?.mapped_control / entity?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"unassigned\">\n\n                <span class=\"text\">{{  entity?.total_control - entity?.mapped_control }}</span>\n                <span class=\"text\">{{ entity?.total_control == 0 ? 0 : (100 - (entity?.mapped_control / entity?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"action\">\n                <button type=\"button\"\n                    [disabled]=\"(entity?.all_entities_name?.length == 0 && entity?.libraryReport?.length == 0) || entity?.total_control < 1\"\n                    (click)=\"entity_open(entity)\"><i class=\"icons\">&#xe910;</i></button>\n            </td>\n        </tr>\n\n        <tr *ngFor=\"let data of tableList  | filter: search; let i = index\">\n            <td class=\"serial-number\">\n                <span>{{i+1}}</span>\n            </td>\n            <td class=\"name\" appTooltip=\"{{data?.item_name}} {{data|withinData}}\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\n                <span class=\"title\">{{data?.item_name}}</span>\n                <span class=\"within-row\" *ngIf=\"data?.parent_items_name\">\n                    <span class=\"within\">WITHIN</span>\n                    <span class=\"text\">{{data?.parent_items_name}}</span>\n                </span>\n                <!-- <span>{{data?.item_name}}</span>\n                <span *ngIf=\"data?.parent_items_name\">WITHIN {{data.parent_items_name}}</span> -->\n            </td>\n            <td class=\"total\">\n                <span class=\"text\">{{data?.total_control}}</span>\n            </td>\n            <td class=\"assigned\">\n                <span class=\"text\">{{ data?.mapped_control }}</span>\n                <span class=\"text\">{{ data?.total_control == 0 ? 0 : ((data?.mapped_control / data?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"unassigned\">\n                <span class=\"text\">{{data?.total_control - data?.mapped_control }}</span>\n                <span class=\"text\">{{ +data?.total_control == 0 ? 0 : (100 - (data?.mapped_control / data?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"action\">\n                <button type=\"button\"\n                    [disabled]=\"(data?.all_entities_name?.length < 1 && data?.libraryReport?.length < 1) && (data?.total_control < 1)\"\n                    (click)=\"getCategoryDetailsById(data?._id)\"><i class=\"icons\">&#xe910;</i></button>\n            </td>\n        </tr>\n    </tbody>\n</table>\n<app-loader-inline *ngIf=\"loader\"></app-loader-inline>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/avatars/avatars.css\";table.framework-table{width:100%;border-collapse:separate;border-spacing:0 4px}table.framework-table tr{border:none;table-layout:auto}table.framework-table thead{position:sticky;top:4px;z-index:1}table.framework-table thead:before{content:\"\";position:absolute;height:16px;background:#fff;top:-4px;right:-3px;left:0}table.framework-table thead tr th{font-size:10px;font-weight:500;line-height:16px;color:#747576;text-transform:uppercase;padding:4px;text-align:left;background:#fff;position:relative}table.framework-table thead tr th.sl-number{text-align:center}table.framework-table tbody tr td{padding:4px;border-top:1px solid #F1F1F1;border-bottom:1px solid #F1F1F1;text-align:left}table.framework-table tbody tr td span{text-align:center}table.framework-table tbody tr td.serial-number{width:28px;min-width:28px;max-width:28px;padding-left:8px;position:relative}table.framework-table tbody tr td.serial-number span{display:inline-flex;writing-mode:vertical-lr;align-items:center;justify-content:center;color:#747576;font-size:10px;background:#f8f8f8;position:absolute;top:0;bottom:0;left:4px}table.framework-table tbody tr td:first-child{border-left:1px solid #F1F1F1;border-radius:4px 0 0 4px}table.framework-table tbody tr td:last-child{border-right:1px solid #F1F1F1;border-radius:0 4px 4px 0}table.framework-table tbody tr td.name{width:calc(100% - 300px)}table.framework-table tbody tr td.name span.text,table.framework-table tbody tr td.name span.value{color:#161b2f;font-weight:400;font-size:13px;line-height:20px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}table.framework-table tbody tr td.name span.title{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#161b2f;font-weight:400;font-size:12px;line-height:18px;margin-left:0!important;text-align:left;max-width:400px}@media screen and (max-width: 1400px){table.framework-table tbody tr td.name span.title{max-width:350px}}table.framework-table tbody tr td.name span.title span.id{font-weight:500;font-size:10px}table.framework-table tbody tr td.name span.within-row{display:flex;width:400px;align-items:center;padding-bottom:0}@media screen and (max-width: 1400px){table.framework-table tbody tr td.name span.within-row{width:350px}}table.framework-table tbody tr td.name span.within-row span.within{font-size:9px;line-height:12px;background:#f1f1f1;border-radius:2px;color:#033187;text-transform:uppercase;padding:0 2px;margin-right:4px;height:12px;position:relative;letter-spacing:.4px;font-weight:500;margin-left:0}table.framework-table tbody tr td.name span.within-row span.text{color:#747576;font-weight:400;line-height:16px;font-size:12px;display:block;max-width:400px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}table.framework-table tbody tr td.name .vx-avatar-group+span.title{margin-left:8px!important}table.framework-table tbody tr td.total{width:70px;min-width:70px}table.framework-table tbody tr td.total span{border:1px solid #F1F1F1;line-height:16px;color:#161b2f;font-size:10px;padding:0 5px;display:inline-block;min-width:28px;border-radius:2px;margin:6px 0}table.framework-table tbody tr td.assigned{width:100px;max-width:100px;min-width:100px}table.framework-table tbody tr td.assigned span{border:1px solid #F1F1F1;line-height:16px;font-size:10px;padding:0 5px;display:inline-block;min-width:28px;border-radius:2px 0 0 2px}table.framework-table tbody tr td.assigned span+span{border-radius:0 2px 2px 0;border-left:none;color:#161b2f}table.framework-table tbody tr td.assigned span:first-child{color:#34aa44}table.framework-table tbody tr td.unassigned{width:100px;max-width:100px}table.framework-table tbody tr td.unassigned span{border:1px solid #F1F1F1;line-height:16px;font-size:10px;padding:0 5px;display:inline-block;min-width:28px;border-radius:2px 0 0 2px}table.framework-table tbody tr td.unassigned span+span{border-radius:0 2px 2px 0;border-left:none;color:#161b2f}table.framework-table tbody tr td.unassigned span:first-child{color:#f2bf19}table.framework-table tbody tr td.unassigned button.entrust{border:none;background:transparent!important;cursor:pointer;outline:none;font-size:11px;line-height:15px;border:1px solid #F1F1F1;border-radius:2px;padding:0 4px;text-transform:uppercase;font-weight:500;color:#1e5dd3}table.framework-table tbody tr td.unassigned button.entrust:disabled{filter:grayscale(1);cursor:not-allowed}table.framework-table tbody tr td.action{width:80px;min-width:80px;text-align:right}table.framework-table tbody tr td.action button{border:none;background:transparent!important;cursor:pointer;outline:none;font-size:10px;margin:6px 0}table.framework-table tbody tr td.action button:disabled{filter:grayscale(1);cursor:not-allowed}table.framework-table tbody tr.library td.sl-number{width:20px;text-align:center}table.framework-table tbody tr.library td.sl-number span{background:#1e5dd3;border-radius:50%;width:8px;height:8px;display:block}table.framework-table tbody tr.library td.sl-number.icon{padding:0 4px 0 8px}table.framework-table tbody tr.library td.name span{max-width:400px}table.framework-table tbody tr:hover{box-shadow:0 3px 6px #00000029;border-radius:4px}.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)}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}\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: "component", type: i7.LoaderInlineComponent, selector: "app-loader-inline" }, { kind: "pipe", type: i3.DecimalPipe, name: "number" }, { kind: "pipe", type: i8.FilterPipe, name: "filter" }, { kind: "pipe", type: i9.WithinDataPipe, name: "withinData" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ParentTableComponent, decorators: [{
            type: Component,
            args: [{ selector: 'app-parent-table', template: "<!-- <p>parent-table works!</p> -->\n<table class=\"framework-table\">\n    <thead>\n        <tr>\n            <th class=\"sl-number\">#</th>\n            <th>Name</th>\n            <th>Total</th>\n            <th>Assigned</th>\n            <th>UnAssigned</th>\n            <th></th>\n        </tr>\n    </thead>\n    <tbody>\n        <tr *ngFor=\"let report of libraryReport | filter: search\" class=\"library\">\n            <td class=\"sl-number icon\">\n                <span></span>\n            </td>\n            <td class=\"name\">\n                <div class=\"vx-d-flex vx-align-center\">\n                    <div *ngIf=\"report?.is_assigned\" class=\"vx-avatar-group\">\n                        <div *ngIf=\"report?.assigned_by_pic != '' || report?.assigned_by_short != ''\" class=\"vx-avatar md\" #entrustedBy appTooltip=\"Entrusted by: {{report?.assigned_by_name}}\"\n                            placement=\"bottom-left\" delay=\"0\" [tooltipMandatory]=\"true\"> \n                            <img [src]=\"report.assigned_by_pic\" alt=\"\" *ngIf=\"report?.assigned_by_pic\">\n                            <span class=\"green\" *ngIf=\"!report?.assigned_by_pic\">{{report?.assigned_by_short}}</span> \n                        </div>\n                        <div *ngIf=\"report?.employee_name != ''\" class=\"vx-avatar md\" #entrustedTo appTooltip=\"Entrusted to: {{report?.employee_name}}\"\n                            placement=\"bottom-left\" delay=\"0\" [tooltipMandatory]=\"true\">\n                            <img *ngIf=\"report?.employee_pic\" [src]=\"report.employee_pic\" alt=\"\">\n                            <span class=\"green\" *ngIf=\"!report?.employee_pic\">\n                                {{report?.employee_short}}\n                            </span>\n                        </div>\n                        <div *ngIf=\"report?.employee_name === '' && report?.multipleAssigneeArr?.length > 0\" class=\"vx-avatar md\">\n                            <span class=\"green\" appPopover (click)=\"multipleUsers.popover()\" placement=\"left\">+{{report?.multipleAssigneeArr?.length}}</span>\n                        </div>\n                        \n                    </div>\n                    <span class=\"title\" appTooltip=\"{{report.report_name}}\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\"> <span class=\"id\">{{ report?.is_assigned == 1 ? '[ ' + report?.cid + '] ' : ' ' }}</span>{{report.report_name}}</span>\n                </div>\n                <app-popover #multipleUsers>\n                    <div class=\"wf-action-list\">\n                        <ul class=\"action-item\">\n                            <li>\n                                <div class=\"avatar-card\" *ngFor=\" let assignee of report?.multipleAssigneeArr\">\n                                    <div class=\"avatar\" >\n                                        <span *ngIf=\"assignee?.profile_pic === ''\">{{assignee?.member_short_name}}</span>\n                                        <img *ngIf=\"assignee?.profile_pic !== ''\" [src]=\"assignee.employee_pic\" alt=\"\">\n                                    </div>\n                                    \n                                    <span class=\"value\">{{assignee?.member_name}}</span>\n                                </div>\n                            </li>\n                        </ul>\n                    </div>\n                </app-popover>\n            </td>\n            <td class=\"total\"></td>\n            <td class=\"assigned\"></td>\n            <td class=\"unassigned\">\n                <button type=\"button\" [disabled]=\"report?.is_assigned == 1 && currentCategory?.visibility == 2\" (click)=\"entrustFrameworkDetails(report)\" class=\"entrust\">Entrust</button>\n            </td>\n            <td class=\"action\">\n            </td>\n        </tr>\n        <tr *ngFor=\"let entity of entities  | filter: search\" class=\"library\">\n            <td class=\"sl-number icon\">\n                <i class=\"icons\">&#xe99f;</i>\n            </td>\n            <td class=\"name\" appTooltip=\"{{entity?.rc_name}} <br><span class='within-row'><span class='within'>WITHIN</span><span class='within-value'>{{entity?.parent_rc}}</span></span>\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\n                <span class=\"title\">{{entity?.rc_name}}</span>\n                <span class=\"within-row\" *ngIf=\"entity?.parent_rc?.length > 0\">\n                    <span class=\"within\">WITHIN</span>\n                    <span class=\"text\" *ngFor=\"let parent of entity?.parent_rc;let rc = index\">\n                        <ng-container *ngIf=\"rc>0\"> > </ng-container> {{parent}}\n                    </span>\n                </span>\n            </td>\n            <td class=\"total\">\n                <span class=\"text\">{{entity?.total_control}}</span>\n            </td>\n            <td class=\"assigned\">\n                <span class=\"text\">{{ entity?.mapped_control }}</span>\n                <span class=\"text\">{{ entity?.total_control == 0 ? 0 : ((entity?.mapped_control / entity?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"unassigned\">\n\n                <span class=\"text\">{{  entity?.total_control - entity?.mapped_control }}</span>\n                <span class=\"text\">{{ entity?.total_control == 0 ? 0 : (100 - (entity?.mapped_control / entity?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"action\">\n                <button type=\"button\"\n                    [disabled]=\"(entity?.all_entities_name?.length == 0 && entity?.libraryReport?.length == 0) || entity?.total_control < 1\"\n                    (click)=\"entity_open(entity)\"><i class=\"icons\">&#xe910;</i></button>\n            </td>\n        </tr>\n\n        <tr *ngFor=\"let data of tableList  | filter: search; let i = index\">\n            <td class=\"serial-number\">\n                <span>{{i+1}}</span>\n            </td>\n            <td class=\"name\" appTooltip=\"{{data?.item_name}} {{data|withinData}}\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\n                <span class=\"title\">{{data?.item_name}}</span>\n                <span class=\"within-row\" *ngIf=\"data?.parent_items_name\">\n                    <span class=\"within\">WITHIN</span>\n                    <span class=\"text\">{{data?.parent_items_name}}</span>\n                </span>\n                <!-- <span>{{data?.item_name}}</span>\n                <span *ngIf=\"data?.parent_items_name\">WITHIN {{data.parent_items_name}}</span> -->\n            </td>\n            <td class=\"total\">\n                <span class=\"text\">{{data?.total_control}}</span>\n            </td>\n            <td class=\"assigned\">\n                <span class=\"text\">{{ data?.mapped_control }}</span>\n                <span class=\"text\">{{ data?.total_control == 0 ? 0 : ((data?.mapped_control / data?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"unassigned\">\n                <span class=\"text\">{{data?.total_control - data?.mapped_control }}</span>\n                <span class=\"text\">{{ +data?.total_control == 0 ? 0 : (100 - (data?.mapped_control / data?.total_control) * 100 | number: '1.0-0') }}%</span>\n            </td>\n            <td class=\"action\">\n                <button type=\"button\"\n                    [disabled]=\"(data?.all_entities_name?.length < 1 && data?.libraryReport?.length < 1) && (data?.total_control < 1)\"\n                    (click)=\"getCategoryDetailsById(data?._id)\"><i class=\"icons\">&#xe910;</i></button>\n            </td>\n        </tr>\n    </tbody>\n</table>\n<app-loader-inline *ngIf=\"loader\"></app-loader-inline>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/avatars/avatars.css\";table.framework-table{width:100%;border-collapse:separate;border-spacing:0 4px}table.framework-table tr{border:none;table-layout:auto}table.framework-table thead{position:sticky;top:4px;z-index:1}table.framework-table thead:before{content:\"\";position:absolute;height:16px;background:#fff;top:-4px;right:-3px;left:0}table.framework-table thead tr th{font-size:10px;font-weight:500;line-height:16px;color:#747576;text-transform:uppercase;padding:4px;text-align:left;background:#fff;position:relative}table.framework-table thead tr th.sl-number{text-align:center}table.framework-table tbody tr td{padding:4px;border-top:1px solid #F1F1F1;border-bottom:1px solid #F1F1F1;text-align:left}table.framework-table tbody tr td span{text-align:center}table.framework-table tbody tr td.serial-number{width:28px;min-width:28px;max-width:28px;padding-left:8px;position:relative}table.framework-table tbody tr td.serial-number span{display:inline-flex;writing-mode:vertical-lr;align-items:center;justify-content:center;color:#747576;font-size:10px;background:#f8f8f8;position:absolute;top:0;bottom:0;left:4px}table.framework-table tbody tr td:first-child{border-left:1px solid #F1F1F1;border-radius:4px 0 0 4px}table.framework-table tbody tr td:last-child{border-right:1px solid #F1F1F1;border-radius:0 4px 4px 0}table.framework-table tbody tr td.name{width:calc(100% - 300px)}table.framework-table tbody tr td.name span.text,table.framework-table tbody tr td.name span.value{color:#161b2f;font-weight:400;font-size:13px;line-height:20px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}table.framework-table tbody tr td.name span.title{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#161b2f;font-weight:400;font-size:12px;line-height:18px;margin-left:0!important;text-align:left;max-width:400px}@media screen and (max-width: 1400px){table.framework-table tbody tr td.name span.title{max-width:350px}}table.framework-table tbody tr td.name span.title span.id{font-weight:500;font-size:10px}table.framework-table tbody tr td.name span.within-row{display:flex;width:400px;align-items:center;padding-bottom:0}@media screen and (max-width: 1400px){table.framework-table tbody tr td.name span.within-row{width:350px}}table.framework-table tbody tr td.name span.within-row span.within{font-size:9px;line-height:12px;background:#f1f1f1;border-radius:2px;color:#033187;text-transform:uppercase;padding:0 2px;margin-right:4px;height:12px;position:relative;letter-spacing:.4px;font-weight:500;margin-left:0}table.framework-table tbody tr td.name span.within-row span.text{color:#747576;font-weight:400;line-height:16px;font-size:12px;display:block;max-width:400px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}table.framework-table tbody tr td.name .vx-avatar-group+span.title{margin-left:8px!important}table.framework-table tbody tr td.total{width:70px;min-width:70px}table.framework-table tbody tr td.total span{border:1px solid #F1F1F1;line-height:16px;color:#161b2f;font-size:10px;padding:0 5px;display:inline-block;min-width:28px;border-radius:2px;margin:6px 0}table.framework-table tbody tr td.assigned{width:100px;max-width:100px;min-width:100px}table.framework-table tbody tr td.assigned span{border:1px solid #F1F1F1;line-height:16px;font-size:10px;padding:0 5px;display:inline-block;min-width:28px;border-radius:2px 0 0 2px}table.framework-table tbody tr td.assigned span+span{border-radius:0 2px 2px 0;border-left:none;color:#161b2f}table.framework-table tbody tr td.assigned span:first-child{color:#34aa44}table.framework-table tbody tr td.unassigned{width:100px;max-width:100px}table.framework-table tbody tr td.unassigned span{border:1px solid #F1F1F1;line-height:16px;font-size:10px;padding:0 5px;display:inline-block;min-width:28px;border-radius:2px 0 0 2px}table.framework-table tbody tr td.unassigned span+span{border-radius:0 2px 2px 0;border-left:none;color:#161b2f}table.framework-table tbody tr td.unassigned span:first-child{color:#f2bf19}table.framework-table tbody tr td.unassigned button.entrust{border:none;background:transparent!important;cursor:pointer;outline:none;font-size:11px;line-height:15px;border:1px solid #F1F1F1;border-radius:2px;padding:0 4px;text-transform:uppercase;font-weight:500;color:#1e5dd3}table.framework-table tbody tr td.unassigned button.entrust:disabled{filter:grayscale(1);cursor:not-allowed}table.framework-table tbody tr td.action{width:80px;min-width:80px;text-align:right}table.framework-table tbody tr td.action button{border:none;background:transparent!important;cursor:pointer;outline:none;font-size:10px;margin:6px 0}table.framework-table tbody tr td.action button:disabled{filter:grayscale(1);cursor:not-allowed}table.framework-table tbody tr.library td.sl-number{width:20px;text-align:center}table.framework-table tbody tr.library td.sl-number span{background:#1e5dd3;border-radius:50%;width:8px;height:8px;display:block}table.framework-table tbody tr.library td.sl-number.icon{padding:0 4px 0 8px}table.framework-table tbody tr.library td.name span{max-width:400px}table.framework-table tbody tr:hover{box-shadow:0 3px 6px #00000029;border-radius:4px}.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)}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.ResponsibilityService }, { type: i2.Configurations, decorators: [{
                    type: Optional
                }] }]; }, propDecorators: { tableList: [{
                type: Input
            }], search: [{
                type: Input
            }], closeParent: [{
                type: Output
            }], expandCategory: [{
                type: Output
            }], entrustFramework: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 