vcomply-workflow-engine 2.5.13 → 2.5.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/vcomply-workflow-engine.umd.js +252 -221
- package/bundles/vcomply-workflow-engine.umd.js.map +1 -1
- package/esm2015/lib/sharedComponents/directive/input-trim.directive.js +17 -0
- package/esm2015/lib/sharedComponents/directive/input-trim.directive.ngsummary.json +1 -0
- package/esm2015/lib/sharedComponents/framework-list/framework-list.component.js +3 -2
- package/esm2015/lib/sharedComponents/framework-list/framework-responsibility-table/framework-responsibility-table.component.js +2 -2
- package/esm2015/lib/sharedComponents/framework-list/framework-responsibility-table/framework-responsibility-table.component.ngfactory.js +12 -12
- package/esm2015/lib/workflow-engine.module.js +3 -1
- package/esm2015/lib/workflow-engine.module.ngfactory.js +1 -1
- package/esm2015/lib/workflow-risk/workflow-risk.component.js +2 -2
- package/esm2015/lib/workflow-risk/workflow-risk.component.ngfactory.js +90 -86
- package/esm2015/vcomply-workflow-engine.js +217 -216
- package/esm2015/vcomply-workflow-engine.ngsummary.json +1 -1
- package/fesm2015/vcomply-workflow-engine.js +22 -4
- package/fesm2015/vcomply-workflow-engine.js.map +1 -1
- package/lib/sharedComponents/directive/input-trim.directive.d.ts +3 -0
- package/package.json +1 -1
- package/vcomply-workflow-engine.d.ts +216 -215
- package/vcomply-workflow-engine.metadata.json +1 -1
|
@@ -1666,7 +1666,7 @@ class WorkflowRiskComponent {
|
|
|
1666
1666
|
WorkflowRiskComponent.decorators = [
|
|
1667
1667
|
{ type: Component, args: [{
|
|
1668
1668
|
selector: 'app-workflow-risk',
|
|
1669
|
-
template: "<div class=\"workflw-risk\" *ngIf=\"!showSmiley\">\r\n <!-- Risk Type -->\r\n <div class=\"form-group-row\" [class.active]=\"false\"\r\n [class.disabled]=\"false\">\r\n <div class=\"left\" [class.checked]=\"false\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/what.svg\" alt=\"im\" *ngIf=\"true\">\r\n\r\n <svg *ngIf=\"false\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Type <span class=\"required\">*</span></label>\r\n <div class=\"risk-type-field\">\r\n <div class=\"type-item\" [class.active]=\"riskForm?.riskType === 'NORMAL'\">\r\n <button [class.disabled]=\"!riskTypeChangeAllowed\" (click)=\"changeRisk('NORMAL')\">ADD TO RISK REGISTER</button>\r\n <i class=\"icons info\" [appTooltip]=\"'This option lets you add a risk directly to the Risk Register. The risk owners will receive an alert and they can begin the the risk assessment process.'\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n <div class=\"type-item\" [class.active]=\"riskForm?.riskType === 'REPORTED'\">\r\n <button [class.disabled]=\"!riskTypeChangeAllowed\" (click)=\"changeRisk('REPORTED')\">REPORT A RISK</button>\r\n <i class=\"icons info\" [appTooltip]=\"'This options lets you report a risk and assign it to the risk owners. The risk owners will have the option to either add the risk to the Risk Register or flag it for a follow-up at a later date.'\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n <span class=\"background-glider\"></span>\r\n </div>\r\n <p *ngIf=\"false\" class=\"error-message\">Add a risk type</p>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Name -->\r\n <div class=\"form-group-row\" [class.active]=\"false\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'name' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm.title\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/what.svg\" alt=\"im\" *ngIf=\"!riskForm.title || activeSelector === 'name'\">\r\n\r\n <svg *ngIf=\"riskForm.title && activeSelector !== 'name'\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Name <span class=\"required\">*</span></label>\r\n <input type=\"text\" (keydown)=\"activeSelector = 'name'\" (focusin)=\"activateSelector('name',true)\"\r\n (focusout)=\"activateSelector('name',false)\" [(ngModel)]=\"riskForm.title\"\r\n placeholder=\"Add a risk name\" *ngIf=\"riskForm?.title?.trim() =='' || activeSelector === 'name'\">\r\n <div class=\"selected\" *ngIf=\"riskForm?.title?.trim()!= '' && activeSelector !== 'name'\">\r\n <div class=\"chip-container\">\r\n <span class=\"value\">{{riskForm.title}}</span>\r\n </div>\r\n <button class=\"edit\" (click)=\"activateSelector('name',true)\" type=\"button\"><i\r\n class=\"icons\"></i> Edit</button>\r\n </div>\r\n <p *ngIf=\"submitted && (!riskForm.title)\" class=\"error-message\">Add a risk name</p>\r\n <marx-editor [(ngModel)]=\"riskForm.description\" [editorConfig]=\"description\" (clickOutside)=\"checkDescription()\"></marx-editor>\r\n <p *ngIf=\"submitted && (riskForm.riskType ==='REPORTED' && !riskForm?.description?.trim()?.length)\" class=\"error-message\">Add a risk description</p>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Responsibility Center -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'rc'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'rc' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.responsibilityCentersList?.length>0\">\r\n <img *ngIf=\"riskForm?.responsibilityCentersList?.length==0 || activeSelector === 'rc'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/responsibility-center.svg\" alt=\"\">\r\n\r\n <svg *ngIf=\"riskForm?.responsibilityCentersList?.length>0 && activeSelector !== 'rc'\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Responsibility Center <span class=\"required\">*</span>\r\n <i class=\"icons\" [appTooltip]=\"'Responsibility Centers represent the corporate and operational infrastructure of an organization. One or more Responsibility Centers can be exposed to a risk and accordingly, the risk must be assessed against each Responsibility Center.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i>\r\n </label>\r\n <div class=\"select\" *ngIf=\"riskForm?.responsibilityCentersList?.length==0\">\r\n <input type=\"text\" (click)=\"activateSelector('rc',true)\"\r\n placeholder=\"Select Responsibility Center(s)\" readonly>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"riskForm?.responsibilityCentersList?.length>0\">\r\n <div class=\"chip-container\" [class.more-one]=\"riskForm?.responsibilityCentersList?.length>1\" [class.plus]=\"riskForm?.responsibilityCentersList?.length>2\">\r\n <span class=\"chip\" *ngFor=\"let rcName of riskForm?.responsibilityCentersList?.slice(0,2)\"><i\r\n class=\"icons\" (click)=\"remove('rc',rcName)\"></i> {{rcName.item_name}}</span>\r\n <button class=\"count\" *ngIf=\"riskForm?.responsibilityCentersList?.length > 2\" type=\"button\"\r\n appPopover (click)=\"popoverRC.popover()\" placement=\"right\">+\r\n {{riskForm?.responsibilityCentersList?.slice(2).length}}</button>\r\n </div>\r\n\r\n <button *ngIf=\"activeSelector !== 'rc'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('rc',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n <p *ngIf=\"submitted && (riskForm?.responsibilityCentersList?.length==0)\" class=\"error-message\">Assign\r\n this risk to a Responsibility Center(s)</p>\r\n <app-popover #popoverRC [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let rcName of riskForm?.responsibilityCentersList | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\" (click)=\"remove('rc',rcName)\"></i>\r\n {{ rcName.item_name }}\r\n </span>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- RISK OWNER -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'owner'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'owner' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.ownersList?.length>0\">\r\n <img *ngIf=\"riskForm?.ownersList?.length ==0 || activeSelector === 'owner'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/im-creating.svg\" alt=\"\" />\r\n\r\n <svg *ngIf=\"riskForm?.ownersList?.length>0 && activeSelector !== 'owner'\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RISK OWNER <span class=\"required\">*</span>\r\n <i class=\"icons\" [appTooltip]=\"'This is the person that is responsible for managing the risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i>\r\n </label>\r\n <div class=\"select\" *ngIf=\"riskForm?.ownersList?.length ==0\">\r\n <input type=\"text\" (click)=\"activateSelector('owner',true)\" placeholder=\"Select Risk Owner(s)\"\r\n readonly>\r\n </div>\r\n \r\n <div class=\"selected\" *ngIf=\"riskForm?.ownersList?.length>0\">\r\n <div class=\"chip-container\" [class.more-one]=\"riskForm?.ownersList?.length>1\" [class.plus]=\"riskForm?.ownersList?.length>2\">\r\n <ng-container *ngIf=\"(riskForm?.ownersList|shortMerge : nonRemovableUsersList) as ownerList\">\r\n <span class=\"chip\" *ngFor=\"let owner of ownerList?.slice(0,2)\"><i class=\"icons\"\r\n *ngIf=\"!nonRemovableUsersList.includes(owner?.member_id)\" (click)=\"remove('owner',owner)\"></i>\r\n {{owner?.member_name}}</span>\r\n <button class=\"count\" *ngIf=\"riskForm?.ownersList?.length > 2\" type=\"button\" appPopover\r\n (click)=\"popoverOwner.popover()\" placement=\"right\">+\r\n {{riskForm?.ownersList?.slice(2).length}}</button>\r\n </ng-container>\r\n\r\n </div>\r\n\r\n <button *ngIf=\"activeSelector !== 'owner'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('owner',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n <p *ngIf=\"submitted && (riskForm?.ownersList?.length===0)\" class=\"error-message\">Select Owner(s) for this risk.</p>\r\n <app-popover #popoverOwner [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ng-container *ngIf=\"(riskForm?.ownersList|shortMerge : nonRemovableUsersList) as ownerPop\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let owner of ownerPop | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i *ngIf = \"!nonRemovableUsersList.includes(owner?.member_id)\" class=\"icons\" (click)=\"remove('owner',owner)\"></i>\r\n {{ owner.member_name }}\r\n </span>\r\n </div>\r\n </li>\r\n </ul>\r\n </ng-container>\r\n </div>\r\n </app-popover>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Category -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'category'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'category' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.category?.selectedCategory\">\r\n <img *ngIf=\"!riskForm?.category?.selectedCategory || activeSelector === 'category'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/category.svg\" alt=\"\" />\r\n\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm?.category?.selectedCategory && activeSelector !== 'category'\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Category\r\n <i class=\"icons\" [appTooltip]=\"'Risk Categories are used to group similar risks.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n <div class=\"select\" *ngIf=\"!riskForm?.category?.selectedCategory\">\r\n <input type=\"text\" (click)=\"activateSelector('category',true)\" placeholder=\"Select Risk Category\"\r\n readonly>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"riskForm?.category?.selectedCategory\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"><i class=\"icons\"\r\n (click)=\"remove('category',riskForm.category.selectedCategory)\"></i>{{riskForm?.category?.selectedCategory?.category_name}}\r\n </span>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'category'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('category',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"riskForm?.categoryCustomTags?.length>0\">\r\n <div class=\"vx-form-group\" *ngFor=\"let tag of riskForm.categoryCustomTags\">\r\n <label class=\"vx-control-panel\">{{tag.custom_tag_name}}</label>\r\n <input type=\"text\" [(ngModel)]=\"tag.custom_tag_value\" [placeholder]=\"tag.custom_tag_name\">\r\n </div>\r\n </ng-container>\r\n\r\n </div>\r\n </div>\r\n <!-- Assessment Deadline -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'assessment'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'assessment' && sideSelectorElements.includes(activeSelector)\"\r\n *ngIf=\"!settingsInfo?.assessment_deadline_enable && riskForm?.riskType !== 'REPORTED'\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.assessment_deadline_days>=1\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/when.svg\"\r\n *ngIf=\"riskForm?.assessment_deadline_days<1 || activeSelector === 'assessment'\" alt=\"\" />\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm?.assessment_deadline_days>=1 && activeSelector !== 'assessment'\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Assessment Deadline <span class=\"required\">*</span>\r\n <i class=\"icons\" [appTooltip]=\"'This is the date that the inherent risk assessment must be completed by.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n <div class=\"input\">\r\n <span class=\"text\">Set Number of days</span>\r\n <div class=\"input-group counter\">\r\n <button (click)=\"changeRiskAssessment('subtract')\">\r\n <i class=\"icons\"></i>\r\n </button>\r\n <input type=\"number\" [(ngModel)]=\"riskForm.assessment_deadline_days\"\r\n (focusin)=\"activateSelector('assessment',true)\"\r\n (focusout)=\"activateSelector('assessment',false)\" name=\"riskAssessmentDeadline\"\r\n validateAssessment #deadline=\"ngModel\"\r\n (ngModelChange)=\"changeRiskAssessmentDeadline($event)\"\r\n onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\" />\r\n <button (click)=\"changeRiskAssessment('add')\">\r\n <i class=\"icons\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <p *ngIf=\"submitted && (riskForm?.assessment_deadline_days<1)\" class=\"error-message\">\r\n Enter a value greater than 0.\r\n </p>\r\n <label class=\"vx-control-panel\" *ngIf=\"riskForm?.assessment_deadline_days>=1\">\r\n This risk assessment needs to be completed by {{ date | date: 'dd MMM yyyy' }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Overseer -->\r\n <div [appScrollInView]=\"scrollToBottom\" class=\"form-group-row\" [class.active]=\"activeSelector === 'overseer'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'overseer' && sideSelectorElements.includes(activeSelector)\"\r\n *ngIf=\"riskForm.addOverseer\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.overseersList?.length>0\">\r\n <img *ngIf=\"riskForm?.overseersList?.length==0 || activeSelector === 'overseer'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/oversight.svg\" alt=\"\" />\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm?.overseersList?.length>0 && activeSelector !== 'overseer'\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Overseer<i class=\"icons\" [appTooltip]=\"'This is the person that is responsible for overseeing the risk but who is not responsible for managing the risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n <div class=\"select\" *ngIf=\"riskForm?.overseersList?.length==0\">\r\n <input type=\"text\" (click)=\"activateSelector('overseer',true)\" placeholder=\"Select Risk Overseer(s)\"\r\n readonly>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"riskForm?.overseersList?.length>0\">\r\n <div class=\"chip-container\" [class.more-one]=\"riskForm?.overseersList?.length>1\" [class.plus]=\"riskForm?.overseersList?.length>2\">\r\n <span class=\"chip\" *ngFor=\"let owner of riskForm?.overseersList?.slice(0,2)\"><i class=\"icons\"\r\n (click)=\"remove('overseer',owner)\"></i> {{owner.member_name}}</span>\r\n <button class=\"count\" *ngIf=\"riskForm?.overseersList?.length > 2\" type=\"button\" appPopover\r\n (click)=\"popoverOverseer.popover()\" placement=\"right\">+\r\n {{riskForm?.overseersList?.slice(2).length}}</button>\r\n </div>\r\n\r\n <button *ngIf=\"activeSelector !== 'overseer'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('overseer',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n <app-popover #popoverOverseer [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let owner of riskForm?.overseersList | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\" (click)=\"remove('overseer',owner)\"></i>\r\n {{ owner.member_name }}\r\n </span>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Mitigation Priority -->\r\n <div [appScrollInView]=\"scrollToBottom\" class=\"form-group-row\" [class.active]=\"false\"\r\n [class.disabled]=\"activeSelector && sideSelectorElements.includes(activeSelector)\"\r\n *ngIf=\"riskForm.addMitigation\">\r\n <div class=\"left\" [class.checked]=\"riskForm.mitigation\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/priority.svg\" *ngIf=\"!riskForm.mitigation\" alt=\"\" />\r\n <!-- <svg viewBox=\"25 25 50 50\" class=\"edit-loader\">\r\n <circle cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke=\"#1e5dd3\" stroke-width=\"3\" class=\"loader-path\"></circle>\r\n </svg> -->\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm.mitigation\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Mitigation Priority\r\n <i class=\"icons\" [appTooltip]=\"'This sets the priority level for the mitigation of each risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n\r\n <cs-select [(ngModel)]=\"riskForm.mitigation\" [placeholder]=\"'Select a mitigation priority'\"\r\n name=\"riskForm.mitigation\">\r\n <cs-option *ngFor=\"let data of mitigationDetails\" [value]=\"data?.mitigation_id\"\r\n [color]=\"data?.mitigation_color\">\r\n {{ data.mitigation_name }}\r\n </cs-option>\r\n </cs-select>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Recommended Mitigation Plan -->\r\n <div [appScrollInView]=\"scrollToBottom\" class=\"form-group-row\" *ngIf=\"riskForm?.addMitigationPlan\">\r\n <div class=\"left\">\r\n <img *ngIf=\"!riskForm.mitigationDescriptionPlan\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/objectives.svg\" alt=\"\" />\r\n <svg *ngIf=\"riskForm.mitigationDescriptionPlan\" class=\"checkIcon\" \r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label for=\"\" class=\"vx-control-panel\">Recommended Mitigation Plans<link rel=\"manifest\" href=\"./manifest.json\">\r\n <i class=\"icons\" [appTooltip]=\"'Specify the mitigation plan that can be undertaken to mitigate the risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i>\r\n </label>\r\n <marx-editor [(ngModel)]=\"riskForm.mitigationDescriptionPlan\"\r\n [editorConfig]=\"mitigationDescriptionPlan\" (clickOutside)=\"checkMitigationPlan()\">\r\n </marx-editor>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n</div>\r\n<app-responsibility-centers-list *ngIf=\"activeSelector === 'rc'\" [responsibilityCentersList]=\"responsibilityCentersList\"\r\n [selectedResponsibilityCenters]=\"riskForm.responsibilityCentersList\" [rcIdKey]=\"'rc_id'\"\r\n (saveSelectedList)=\"saveSelectedRCList($event)\" (closeRcList)=\"activateSelector('rc',false)\"\r\n [singularText]=\"'Responsibility Center selected'\" [pluralText]=\"'Responsibility Centers selected'\" >\r\n</app-responsibility-centers-list>\r\n\r\n<app-owner-list *ngIf=\"activeSelector === 'owner'\" [usersList]=\"ownersList\" [selectedUsers]=\"riskForm.ownersList\"\r\n [userIdKey]=\"'member_id'\" [itemEmailKey]=\"'member_email'\" [itemNameKey]=\"'member_name'\" (saveSelectedList)=\"saveSelectedOwnersList($event)\"\r\n [nonRemovableUsersList]=\"nonRemovableUsersList\" (closeUsersList)=\"activateSelector('owner',false)\"\r\n [singularText]=\"'User selected'\" [pluralText]=\"'Users selected'\" ></app-owner-list>\r\n\r\n<app-category-list *ngIf=\"activeSelector === 'category'\" [categoryList]=\"categoryList\"\r\n [selectedCategory]=\"riskForm.category\" (saveSelectedCategory)=\"saveSelectedCategory($event)\"\r\n (closeCategoriesList)=\"activateSelector('category',false)\"></app-category-list>\r\n<app-owner-list *ngIf=\"activeSelector === 'overseer'\" [usersList]=\"overseersList\"\r\n [selectedUsers]=\"riskForm.overseersList\" [userIdKey]=\"'member_id'\" [itemNameKey]=\"'member_name'\" [itemEmailKey]=\"'member_email'\"\r\n (saveSelectedList)=\"saveSelectedOverseersList($event)\" (closeUsersList)=\"activateSelector('overseer',false)\"\r\n [singularText]=\"'User selected'\" [pluralText]=\"'Users selected'\" >\r\n</app-owner-list>\r\n<app-loader-inline *ngIf=\"loader\"></app-loader-inline>\r\n<!-- <app-smiley-dialog *ngIf=\"showSmiley\" [message]=\"smileyMessage\" [actionButtons]=\"actionButtons\"\r\n (action)=\"action($event)\" (closeSmiley)=\"closeSmiley($event)\"></app-smiley-dialog> -->\r\n\r\n <app-smiley-dialog-inline\r\n *ngIf=\"showSmiley\"\r\n [message]=\"smileyMessage\"\r\n [actionButtons]=\"actionButtons\"\r\n (action)=\"action($event)\"\r\n (closeSmiley)=\"closeSmiley($event)\">\r\n </app-smiley-dialog-inline>\r\n",
|
|
1669
|
+
template: "<div class=\"workflw-risk\" *ngIf=\"!showSmiley\">\r\n <!-- Risk Type -->\r\n <div class=\"form-group-row\" [class.active]=\"false\"\r\n [class.disabled]=\"false\">\r\n <div class=\"left\" [class.checked]=\"false\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/what.svg\" alt=\"im\" *ngIf=\"true\">\r\n\r\n <svg *ngIf=\"false\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Type <span class=\"required\">*</span></label>\r\n <div class=\"risk-type-field\">\r\n <div class=\"type-item\" [class.active]=\"riskForm?.riskType === 'NORMAL'\">\r\n <button [class.disabled]=\"!riskTypeChangeAllowed\" (click)=\"changeRisk('NORMAL')\">ADD TO RISK REGISTER</button>\r\n <i class=\"icons info\" [appTooltip]=\"'This option lets you add a risk directly to the Risk Register. The risk owners will receive an alert and they can begin the the risk assessment process.'\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n <div class=\"type-item\" [class.active]=\"riskForm?.riskType === 'REPORTED'\">\r\n <button [class.disabled]=\"!riskTypeChangeAllowed\" (click)=\"changeRisk('REPORTED')\">REPORT A RISK</button>\r\n <i class=\"icons info\" [appTooltip]=\"'This options lets you report a risk and assign it to the risk owners. The risk owners will have the option to either add the risk to the Risk Register or flag it for a follow-up at a later date.'\" placement=\"bottom-right\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\"></i>\r\n </div>\r\n <span class=\"background-glider\"></span>\r\n </div>\r\n <p *ngIf=\"false\" class=\"error-message\">Add a risk type</p>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Name -->\r\n <div class=\"form-group-row\" [class.active]=\"false\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'name' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm.title\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/what.svg\" alt=\"im\" *ngIf=\"riskForm?.title?.trim()?.length === 0 || activeSelector === 'name'\">\r\n\r\n <svg *ngIf=\"riskForm?.title?.trim()?.length > 0 && activeSelector !== 'name'\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Name <span class=\"required\">*</span></label>\r\n <input spaceTrim type=\"text\" (keydown)=\"activeSelector = 'name'\" (focusin)=\"activateSelector('name',true)\"\r\n (focusout)=\"activateSelector('name',false)\" [(ngModel)]=\"riskForm.title\"\r\n placeholder=\"Add a risk name\" *ngIf=\"riskForm?.title?.trim() =='' || activeSelector === 'name'\">\r\n <div class=\"selected\" *ngIf=\"riskForm?.title?.trim()!= '' && activeSelector !== 'name'\">\r\n <div class=\"chip-container\">\r\n <span class=\"value\">{{riskForm.title}}</span>\r\n </div>\r\n <button class=\"edit\" (click)=\"activateSelector('name',true)\" type=\"button\"><i\r\n class=\"icons\"></i> Edit</button>\r\n </div>\r\n <p *ngIf=\"submitted && (!riskForm.title)\" class=\"error-message\">Add a risk name</p>\r\n <marx-editor [(ngModel)]=\"riskForm.description\" [editorConfig]=\"description\" (clickOutside)=\"checkDescription()\"></marx-editor>\r\n <p *ngIf=\"submitted && (riskForm.riskType ==='REPORTED' && !riskForm?.description?.trim()?.length)\" class=\"error-message\">Add a risk description</p>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Responsibility Center -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'rc'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'rc' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.responsibilityCentersList?.length>0\">\r\n <img *ngIf=\"riskForm?.responsibilityCentersList?.length==0 || activeSelector === 'rc'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/responsibility-center.svg\" alt=\"\">\r\n\r\n <svg *ngIf=\"riskForm?.responsibilityCentersList?.length>0 && activeSelector !== 'rc'\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Responsibility Center <span class=\"required\">*</span>\r\n <i class=\"icons\" [appTooltip]=\"'Responsibility Centers represent the corporate and operational infrastructure of an organization. One or more Responsibility Centers can be exposed to a risk and accordingly, the risk must be assessed against each Responsibility Center.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i>\r\n </label>\r\n <div class=\"select\" *ngIf=\"riskForm?.responsibilityCentersList?.length==0\">\r\n <input type=\"text\" (click)=\"activateSelector('rc',true)\"\r\n placeholder=\"Select Responsibility Center(s)\" readonly>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"riskForm?.responsibilityCentersList?.length>0\">\r\n <div class=\"chip-container\" [class.more-one]=\"riskForm?.responsibilityCentersList?.length>1\" [class.plus]=\"riskForm?.responsibilityCentersList?.length>2\">\r\n <span class=\"chip\" *ngFor=\"let rcName of riskForm?.responsibilityCentersList?.slice(0,2)\"><i\r\n class=\"icons\" (click)=\"remove('rc',rcName)\"></i> {{rcName.item_name}}</span>\r\n <button class=\"count\" *ngIf=\"riskForm?.responsibilityCentersList?.length > 2\" type=\"button\"\r\n appPopover (click)=\"popoverRC.popover()\" placement=\"right\">+\r\n {{riskForm?.responsibilityCentersList?.slice(2).length}}</button>\r\n </div>\r\n\r\n <button *ngIf=\"activeSelector !== 'rc'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('rc',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n <p *ngIf=\"submitted && (riskForm?.responsibilityCentersList?.length==0)\" class=\"error-message\">Assign\r\n this risk to a Responsibility Center(s)</p>\r\n <app-popover #popoverRC [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let rcName of riskForm?.responsibilityCentersList | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\" (click)=\"remove('rc',rcName)\"></i>\r\n {{ rcName.item_name }}\r\n </span>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- RISK OWNER -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'owner'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'owner' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.ownersList?.length>0\">\r\n <img *ngIf=\"riskForm?.ownersList?.length ==0 || activeSelector === 'owner'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/im-creating.svg\" alt=\"\" />\r\n\r\n <svg *ngIf=\"riskForm?.ownersList?.length>0 && activeSelector !== 'owner'\" class=\"checkIcon\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RISK OWNER <span class=\"required\">*</span>\r\n <i class=\"icons\" [appTooltip]=\"'This is the person that is responsible for managing the risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i>\r\n </label>\r\n <div class=\"select\" *ngIf=\"riskForm?.ownersList?.length ==0\">\r\n <input type=\"text\" (click)=\"activateSelector('owner',true)\" placeholder=\"Select Risk Owner(s)\"\r\n readonly>\r\n </div>\r\n \r\n <div class=\"selected\" *ngIf=\"riskForm?.ownersList?.length>0\">\r\n <div class=\"chip-container\" [class.more-one]=\"riskForm?.ownersList?.length>1\" [class.plus]=\"riskForm?.ownersList?.length>2\">\r\n <ng-container *ngIf=\"(riskForm?.ownersList|shortMerge : nonRemovableUsersList) as ownerList\">\r\n <span class=\"chip\" *ngFor=\"let owner of ownerList?.slice(0,2)\"><i class=\"icons\"\r\n *ngIf=\"!nonRemovableUsersList.includes(owner?.member_id)\" (click)=\"remove('owner',owner)\"></i>\r\n {{owner?.member_name}}</span>\r\n <button class=\"count\" *ngIf=\"riskForm?.ownersList?.length > 2\" type=\"button\" appPopover\r\n (click)=\"popoverOwner.popover()\" placement=\"right\">+\r\n {{riskForm?.ownersList?.slice(2).length}}</button>\r\n </ng-container>\r\n\r\n </div>\r\n\r\n <button *ngIf=\"activeSelector !== 'owner'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('owner',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n <p *ngIf=\"submitted && (riskForm?.ownersList?.length===0)\" class=\"error-message\">Select Owner(s) for this risk.</p>\r\n <app-popover #popoverOwner [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ng-container *ngIf=\"(riskForm?.ownersList|shortMerge : nonRemovableUsersList) as ownerPop\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let owner of ownerPop | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i *ngIf = \"!nonRemovableUsersList.includes(owner?.member_id)\" class=\"icons\" (click)=\"remove('owner',owner)\"></i>\r\n {{ owner.member_name }}\r\n </span>\r\n </div>\r\n </li>\r\n </ul>\r\n </ng-container>\r\n </div>\r\n </app-popover>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Category -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'category'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'category' && sideSelectorElements.includes(activeSelector)\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.category?.selectedCategory\">\r\n <img *ngIf=\"!riskForm?.category?.selectedCategory || activeSelector === 'category'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/category.svg\" alt=\"\" />\r\n\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm?.category?.selectedCategory && activeSelector !== 'category'\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Category\r\n <i class=\"icons\" [appTooltip]=\"'Risk Categories are used to group similar risks.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n <div class=\"select\" *ngIf=\"!riskForm?.category?.selectedCategory\">\r\n <input type=\"text\" (click)=\"activateSelector('category',true)\" placeholder=\"Select Risk Category\"\r\n readonly>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"riskForm?.category?.selectedCategory\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"><i class=\"icons\"\r\n (click)=\"remove('category',riskForm.category.selectedCategory)\"></i>{{riskForm?.category?.selectedCategory?.category_name}}\r\n </span>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'category'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('category',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"riskForm?.categoryCustomTags?.length>0\">\r\n <div class=\"vx-form-group\" *ngFor=\"let tag of riskForm.categoryCustomTags\">\r\n <label class=\"vx-control-panel\">{{tag.custom_tag_name}}</label>\r\n <input type=\"text\" [(ngModel)]=\"tag.custom_tag_value\" [placeholder]=\"tag.custom_tag_name\">\r\n </div>\r\n </ng-container>\r\n\r\n </div>\r\n </div>\r\n <!-- Assessment Deadline -->\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'assessment'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'assessment' && sideSelectorElements.includes(activeSelector)\"\r\n *ngIf=\"!settingsInfo?.assessment_deadline_enable && riskForm?.riskType !== 'REPORTED'\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.assessment_deadline_days>=1\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/when.svg\"\r\n *ngIf=\"riskForm?.assessment_deadline_days<1 || activeSelector === 'assessment'\" alt=\"\" />\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm?.assessment_deadline_days>=1 && activeSelector !== 'assessment'\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Assessment Deadline <span class=\"required\">*</span>\r\n <i class=\"icons\" [appTooltip]=\"'This is the date that the inherent risk assessment must be completed by.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n <div class=\"input\">\r\n <span class=\"text\">Set Number of days</span>\r\n <div class=\"input-group counter\">\r\n <button (click)=\"changeRiskAssessment('subtract')\">\r\n <i class=\"icons\"></i>\r\n </button>\r\n <input type=\"number\" [(ngModel)]=\"riskForm.assessment_deadline_days\"\r\n (focusin)=\"activateSelector('assessment',true)\"\r\n (focusout)=\"activateSelector('assessment',false)\" name=\"riskAssessmentDeadline\"\r\n validateAssessment #deadline=\"ngModel\"\r\n (ngModelChange)=\"changeRiskAssessmentDeadline($event)\"\r\n onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\" />\r\n <button (click)=\"changeRiskAssessment('add')\">\r\n <i class=\"icons\"></i>\r\n </button>\r\n </div>\r\n </div>\r\n <p *ngIf=\"submitted && (riskForm?.assessment_deadline_days<1)\" class=\"error-message\">\r\n Enter a value greater than 0.\r\n </p>\r\n <label class=\"vx-control-panel\" *ngIf=\"riskForm?.assessment_deadline_days>=1\">\r\n This risk assessment needs to be completed by {{ date | date: 'dd MMM yyyy' }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Overseer -->\r\n <div [appScrollInView]=\"scrollToBottom\" class=\"form-group-row\" [class.active]=\"activeSelector === 'overseer'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'overseer' && sideSelectorElements.includes(activeSelector)\"\r\n *ngIf=\"riskForm.addOverseer\">\r\n <div class=\"left\" [class.checked]=\"riskForm?.overseersList?.length>0\">\r\n <img *ngIf=\"riskForm?.overseersList?.length==0 || activeSelector === 'overseer'\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/oversight.svg\" alt=\"\" />\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm?.overseersList?.length>0 && activeSelector !== 'overseer'\"\r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Overseer<i class=\"icons\" [appTooltip]=\"'This is the person that is responsible for overseeing the risk but who is not responsible for managing the risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n <div class=\"select\" *ngIf=\"riskForm?.overseersList?.length==0\">\r\n <input type=\"text\" (click)=\"activateSelector('overseer',true)\" placeholder=\"Select Risk Overseer(s)\"\r\n readonly>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"riskForm?.overseersList?.length>0\">\r\n <div class=\"chip-container\" [class.more-one]=\"riskForm?.overseersList?.length>1\" [class.plus]=\"riskForm?.overseersList?.length>2\">\r\n <span class=\"chip\" *ngFor=\"let owner of riskForm?.overseersList?.slice(0,2)\"><i class=\"icons\"\r\n (click)=\"remove('overseer',owner)\"></i> {{owner.member_name}}</span>\r\n <button class=\"count\" *ngIf=\"riskForm?.overseersList?.length > 2\" type=\"button\" appPopover\r\n (click)=\"popoverOverseer.popover()\" placement=\"right\">+\r\n {{riskForm?.overseersList?.slice(2).length}}</button>\r\n </div>\r\n\r\n <button *ngIf=\"activeSelector !== 'overseer'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('overseer',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n <app-popover #popoverOverseer [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let owner of riskForm?.overseersList | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\" (click)=\"remove('overseer',owner)\"></i>\r\n {{ owner.member_name }}\r\n </span>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Risk Mitigation Priority -->\r\n <div [appScrollInView]=\"scrollToBottom\" class=\"form-group-row\" [class.active]=\"false\"\r\n [class.disabled]=\"activeSelector && sideSelectorElements.includes(activeSelector)\"\r\n *ngIf=\"riskForm.addMitigation\">\r\n <div class=\"left\" [class.checked]=\"riskForm.mitigation\">\r\n <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/priority.svg\" *ngIf=\"!riskForm.mitigation\" alt=\"\" />\r\n <!-- <svg viewBox=\"25 25 50 50\" class=\"edit-loader\">\r\n <circle cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" stroke=\"#1e5dd3\" stroke-width=\"3\" class=\"loader-path\"></circle>\r\n </svg> -->\r\n <svg class=\"checkIcon\" *ngIf=\"riskForm.mitigation\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Risk Mitigation Priority\r\n <i class=\"icons\" [appTooltip]=\"'This sets the priority level for the mitigation of each risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i></label>\r\n\r\n <cs-select [(ngModel)]=\"riskForm.mitigation\" [placeholder]=\"'Select a mitigation priority'\"\r\n name=\"riskForm.mitigation\">\r\n <cs-option *ngFor=\"let data of mitigationDetails\" [value]=\"data?.mitigation_id\"\r\n [color]=\"data?.mitigation_color\">\r\n {{ data.mitigation_name }}\r\n </cs-option>\r\n </cs-select>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Recommended Mitigation Plan -->\r\n <div [appScrollInView]=\"scrollToBottom\" class=\"form-group-row\" *ngIf=\"riskForm?.addMitigationPlan\">\r\n <div class=\"left\">\r\n <img *ngIf=\"!riskForm.mitigationDescriptionPlan\"\r\n src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/objectives.svg\" alt=\"\" />\r\n <svg *ngIf=\"riskForm.mitigationDescriptionPlan\" class=\"checkIcon\" \r\n xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n </svg>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"vx-form-group\">\r\n <label for=\"\" class=\"vx-control-panel\">Recommended Mitigation Plans<link rel=\"manifest\" href=\"./manifest.json\">\r\n <i class=\"icons\" [appTooltip]=\"'Specify the mitigation plan that can be undertaken to mitigate the risk.'\"\r\n placement=\"bottom\"\r\n delay=\"0\" type=\"white\"\r\n [tooltipMandatory]=\"true\"></i>\r\n </label>\r\n <marx-editor [(ngModel)]=\"riskForm.mitigationDescriptionPlan\"\r\n [editorConfig]=\"mitigationDescriptionPlan\" (clickOutside)=\"checkMitigationPlan()\">\r\n </marx-editor>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n</div>\r\n<app-responsibility-centers-list *ngIf=\"activeSelector === 'rc'\" [responsibilityCentersList]=\"responsibilityCentersList\"\r\n [selectedResponsibilityCenters]=\"riskForm.responsibilityCentersList\" [rcIdKey]=\"'rc_id'\"\r\n (saveSelectedList)=\"saveSelectedRCList($event)\" (closeRcList)=\"activateSelector('rc',false)\"\r\n [singularText]=\"'Responsibility Center selected'\" [pluralText]=\"'Responsibility Centers selected'\" >\r\n</app-responsibility-centers-list>\r\n\r\n<app-owner-list *ngIf=\"activeSelector === 'owner'\" [usersList]=\"ownersList\" [selectedUsers]=\"riskForm.ownersList\"\r\n [userIdKey]=\"'member_id'\" [itemEmailKey]=\"'member_email'\" [itemNameKey]=\"'member_name'\" (saveSelectedList)=\"saveSelectedOwnersList($event)\"\r\n [nonRemovableUsersList]=\"nonRemovableUsersList\" (closeUsersList)=\"activateSelector('owner',false)\"\r\n [singularText]=\"'User selected'\" [pluralText]=\"'Users selected'\" ></app-owner-list>\r\n\r\n<app-category-list *ngIf=\"activeSelector === 'category'\" [categoryList]=\"categoryList\"\r\n [selectedCategory]=\"riskForm.category\" (saveSelectedCategory)=\"saveSelectedCategory($event)\"\r\n (closeCategoriesList)=\"activateSelector('category',false)\"></app-category-list>\r\n<app-owner-list *ngIf=\"activeSelector === 'overseer'\" [usersList]=\"overseersList\"\r\n [selectedUsers]=\"riskForm.overseersList\" [userIdKey]=\"'member_id'\" [itemNameKey]=\"'member_name'\" [itemEmailKey]=\"'member_email'\"\r\n (saveSelectedList)=\"saveSelectedOverseersList($event)\" (closeUsersList)=\"activateSelector('overseer',false)\"\r\n [singularText]=\"'User selected'\" [pluralText]=\"'Users selected'\" >\r\n</app-owner-list>\r\n<app-loader-inline *ngIf=\"loader\"></app-loader-inline>\r\n<!-- <app-smiley-dialog *ngIf=\"showSmiley\" [message]=\"smileyMessage\" [actionButtons]=\"actionButtons\"\r\n (action)=\"action($event)\" (closeSmiley)=\"closeSmiley($event)\"></app-smiley-dialog> -->\r\n\r\n <app-smiley-dialog-inline\r\n *ngIf=\"showSmiley\"\r\n [message]=\"smileyMessage\"\r\n [actionButtons]=\"actionButtons\"\r\n (action)=\"action($event)\"\r\n (closeSmiley)=\"closeSmiley($event)\">\r\n </app-smiley-dialog-inline>\r\n",
|
|
1670
1670
|
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");::ng-deep .workflw-risk{display:block;position:relative}", "@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");::-webkit-scrollbar-track{background-color:#f1f1f1;position:absolute}::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}button{font-family:Poppins,sans-serif}::ng-deep .vx-form-group{display:block;position:relative;margin-bottom:20px}::ng-deep .vx-form-group:after{content:\"\";display:block;clear:both}::ng-deep .vx-form-group .select{position:relative}::ng-deep .vx-form-group .select:after{border-left-color:#707070;border-bottom:1px solid #707070;border-right:1px solid #707070;border-top-color:#707070;content:\"\";display:inline-block;right:15px;position:absolute;top:calc(50% - 4px);width:5px;height:5px;transform:rotate(45deg)}::ng-deep .vx-form-group .select input{cursor:pointer;padding-right:30px!important}::ng-deep .vx-form-group .select .custom-input{height:40px;border-radius:4px;border:1px solid #dbdbdb;background:#fff;outline:none;padding:3px 12px;line-height:16px;font-size:13px;color:#747576;font-weight:400;transition:all .2s ease-in-out;width:100%;cursor:pointer}::ng-deep .vx-form-group .select .custom-input:empty:not(:focus):before{content:attr(aria-placeholder);line-height:16px;font-size:13px;width:94%;display:block;pointer-events:none;opacity:.8}::ng-deep .vx-form-group .select .custom-input:hover{border-color:#1e5dd3;box-shadow:0 0 5px rgba(30,93,211,.27)}::ng-deep .vx-form-group .select .custom-input.frequency-custom-input{padding-right:116px}::ng-deep .vx-form-group .select+app-cs-switch{display:block;margin-top:8px}::ng-deep .vx-form-group .select+app-cs-switch label.cs-switch span.value{white-space:nowrap;margin-right:5px;text-transform:uppercase}::ng-deep .vx-form-group .select+app-cs-radio{margin-top:8px!important}::ng-deep .vx-form-group .select~app-cs-radio{margin-top:4px;display:block;width:100%}::ng-deep .vx-form-group .select~app-cs-radio label.radio-item{width:100%;position:relative}::ng-deep .vx-form-group .select~app-cs-radio label.radio-item span.radio{position:absolute;top:8px;left:12px}::ng-deep .vx-form-group .select~app-cs-radio label.radio-item span.value{font-size:11px;text-transform:uppercase;border:1px solid #dbdbdb;border-radius:4px;padding:8px 8px 8px 36px;width:100%;display:flex;justify-content:space-between;margin:0;max-width:100%;font-weight:500;color:#707070}::ng-deep .vx-form-group .select~app-cs-radio label.radio-item span.value i{font-size:12px;color:#1e5dd3}::ng-deep .vx-form-group .select~app-cs-radio label.radio-item svg{position:absolute;top:8px;left:12px}::ng-deep .vx-form-group .select~app-cs-radio label.radio-item input:checked~span.value{background:#eefcf0;border-color:#34aa44}::ng-deep .vx-form-group .select.button-sec:after{display:none}::ng-deep .vx-form-group .select.button-sec button{background:transparent;border:none;display:inline-flex;float:right;color:#1e5dd3;text-transform:uppercase;font-weight:600;cursor:pointer;font-size:11px;position:absolute;top:12px;right:8px;padding:0;margin:0}::ng-deep .vx-form-group .select+.vx-control-panel{margin-top:8px}::ng-deep .vx-form-group .select+.selected{margin-top:8px}::ng-deep .vx-form-group .select.select{margin-top:8px}::ng-deep .vx-form-group .upload-format{border:1px solid #dbdbdb;border-radius:4px;padding:8px 12px;display:block}::ng-deep .vx-form-group .upload-format span.text{line-height:20px;font-size:13px;color:#747576;font-weight:400;transition:all .2s ease-in-out;width:100%;display:block;margin-bottom:6px}::ng-deep .vx-form-group .upload-format .radio-group{display:flex}::ng-deep .vx-form-group .upload-format .radio-group app-cs-radio{display:inline-block}::ng-deep .vx-form-group .upload-format .radio-group app-cs-radio label.radio-item span.value{font-size:11px;text-transform:uppercase;margin-left:8px}::ng-deep .vx-form-group .upload-format .radio-group app-cs-radio+app-cs-radio{margin-left:12px}::ng-deep .vx-form-group .upload-format~.upload-format{margin-top:4px}::ng-deep .vx-form-group .form-tab{display:flex;justify-content:flex-start}::ng-deep .vx-form-group .form-tab button{background:transparent;color:#161b2f;font-size:11px;line-height:16px;text-transform:uppercase;cursor:pointer;padding:8px 8px 8px 0;border:none;outline:none;font-weight:500}::ng-deep .vx-form-group .form-tab button:disabled{opacity:.5;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}::ng-deep .vx-form-group .form-tab button+button{padding:8px}::ng-deep .vx-form-group .form-tab button.active{color:#1e5dd3}::ng-deep .vx-form-group .tab-group{border:1px solid #dbdbdb;border-radius:4px;padding:0;display:block;position:relative}::ng-deep .vx-form-group .tab-group .upload-file{padding:16px 24px;display:flex;align-items:center}::ng-deep .vx-form-group .tab-group .upload-file .image{width:80px;margin-right:20px}::ng-deep .vx-form-group .tab-group .upload-file .browse{display:flex;align-items:center;justify-content:center;width:calc(100% - 100px);text-align:center}::ng-deep .vx-form-group .tab-group .upload-file .browse span{display:inline-block;font-size:12px;color:#747576;line-height:16px;padding:0 4px}::ng-deep .vx-form-group .tab-group .upload-file .browse .label{font-size:11px;color:#1e5dd3;line-height:16px;font-weight:600;text-transform:uppercase;margin:0;padding:0}::ng-deep .vx-form-group .tab-group .upload-file .browse .label input{opacity:0;position:absolute;top:0;margin:0;padding:0;right:0;bottom:0;left:0;cursor:pointer;width:100%}::ng-deep .vx-form-group .tab-group.active{border-color:#1e5dd3}::ng-deep .vx-form-group .tab-group.uploaded{margin-top:4px}::ng-deep .vx-form-group .tab-group.uploaded .upload-file{padding:12px \u200B24px}::ng-deep .vx-form-group .tab-group.uploaded .upload-file .image{display:none}::ng-deep .vx-form-group .tab-group.uploaded .upload-file .browse{width:100%}::ng-deep .vx-form-group .tab-group+label.vx-form-group{margin-top:8px;margin-bottom:4px}::ng-deep .vx-form-group .file-list{background:#fbfbfb;border:1px solid #f1f1f1;border-radius:4px;padding:12px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;position:relative}::ng-deep .vx-form-group .file-list span.file-name{color:#747576;line-height:16px;font-size:11px;font-weight:400;cursor:pointer;max-width:calc(100% - 20px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep .vx-form-group .file-list .button-group{display:flex}::ng-deep .vx-form-group .file-list button{font-size:12px;color:#eb2424;cursor:pointer;display:flex;padding:0;border:none;outline:none;background:transparent}::ng-deep .vx-form-group .file-list button.edit{color:#1e5dd3}::ng-deep .vx-form-group .file-list button+button{margin-left:16px}::ng-deep .vx-form-group .file-list+.file-list{margin-top:4px}::ng-deep .vx-form-group .file-list .file-container{display:flex;justify-content:space-between;width:100%}::ng-deep .vx-form-group .file-list.policy{background:#fff}::ng-deep .vx-form-group .file-list cs-select{position:relative;margin-top:8px;width:100%}::ng-deep .vx-form-group .file-list cs-select .selection-wrap .input-group input.value{height:32px!important;font-size:11px!important}::ng-deep .vx-form-group .file-list cs-select .selection-wrap .input-group i{right:12px!important;top:12px!important}::ng-deep .vx-form-group .file-list app-line-loader{display:block;position:absolute;left:10px;right:10px;bottom:0}::ng-deep .vx-form-group label.vx-control-panel{color:#161b2f;font-size:11px;font-weight:500;line-height:16px;margin-bottom:8px;display:block;text-transform:uppercase;width:100%;margin-top:4px;text-align:left}::ng-deep .vx-form-group label.vx-control-panel.custom-tag{font-size:10px}::ng-deep .vx-form-group label.vx-control-panel.vx-mt-8{margin-top:8px}::ng-deep .vx-form-group label.vx-control-panel span.required{color:#eb2424;font-size:16px;font-weight:400;position:relative;top:-2px}::ng-deep .vx-form-group label.vx-control-panel .button{background:transparent;border:none;display:inline-flex;float:right;color:#1e5dd3;text-transform:uppercase;font-weight:600;cursor:pointer;font-size:11px;padding:0;margin:0}::ng-deep .vx-form-group label.vx-control-panel app-cs-switch{float:right;display:block}::ng-deep .vx-form-group label.vx-control-panel i{margin-left:8px;font-size:12px;color:#1e5dd3;cursor:pointer;position:relative;top:1px}::ng-deep .vx-form-group label.vx-control-panel i.depreciation-icon{color:#e4b700;font-size:16px;position:relative;top:3px}::ng-deep .vx-form-group label.vx-control-panel .checkpoint-version{background:#f1f1f1;border-radius:2px;color:#042e7d;font-size:10px;font-weight:600;line-height:14px;margin-left:4px;padding:0 2px}::ng-deep .vx-form-group .input,::ng-deep .vx-form-group input[type=text]{height:40px;border-radius:4px;border:1px solid #dbdbdb;background:#fff;outline:none;padding:8px 12px;line-height:20px;font-size:13px;color:#747576;transition:all .2s ease-in-out;width:100%;font-weight:400}::ng-deep .vx-form-group .input::-moz-placeholder,::ng-deep .vx-form-group input[type=text]::-moz-placeholder{color:#747576;font-weight:400}::ng-deep .vx-form-group .input:-ms-input-placeholder,::ng-deep .vx-form-group input[type=text]:-ms-input-placeholder{color:#747576;font-weight:400}::ng-deep .vx-form-group .input::placeholder,::ng-deep .vx-form-group input[type=text]::placeholder{color:#747576;font-weight:400}::ng-deep .vx-form-group .input:focus,::ng-deep .vx-form-group .input:hover,::ng-deep .vx-form-group input[type=text]:focus,::ng-deep .vx-form-group input[type=text]:hover{border-color:#1e5dd3;box-shadow:0 0 5px rgba(30,93,211,.27)}::ng-deep .vx-form-group .input.error,::ng-deep .vx-form-group input[type=text].error{border-color:#eb2424;color:#eb2424;margin-bottom:4px}::ng-deep .vx-form-group .input.error:focus,::ng-deep .vx-form-group input[type=text].error:focus{box-shadow:0 0 5px rgba(211,30,30,.27)}::ng-deep .vx-form-group .input:disabled,::ng-deep .vx-form-group input[type=text]:disabled{background:#f1f1f1;cursor:not-allowed;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}::ng-deep .vx-form-group .input:disabled:hover,::ng-deep .vx-form-group input[type=text]:disabled:hover{border-color:#dbdbdb;box-shadow:none}::ng-deep .vx-form-group .input span.text,::ng-deep .vx-form-group input[type=text] span.text{font-size:13px;color:#747576;font-weight:400;display:block;width:100%}::ng-deep .vx-form-group .input .input-group,::ng-deep .vx-form-group input[type=text] .input-group{display:flex;align-items:center}::ng-deep .vx-form-group .input .input-group.counter,::ng-deep .vx-form-group input[type=text] .input-group.counter{min-width:96px;width:96px}::ng-deep .vx-form-group .input .input-group.counter button,::ng-deep .vx-form-group input[type=text] .input-group.counter button{height:24px;width:24px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:#747576;font-size:8px;cursor:pointer;outline:none}::ng-deep .vx-form-group .input .input-group.counter input,::ng-deep .vx-form-group input[type=text] .input-group.counter input{-webkit-appearance:textfield;-moz-appearance:textfield;height:24px;width:calc(100% - 48px);border:1px solid #f1f1f1;outline:none;padding:0 6px;text-align:center}::ng-deep .vx-form-group .input .input-group.counter input::-webkit-inner-spin-button,::ng-deep .vx-form-group .input .input-group.counter input::-webkit-outer-spin-button,::ng-deep .vx-form-group input[type=text] .input-group.counter input::-webkit-inner-spin-button,::ng-deep .vx-form-group input[type=text] .input-group.counter input::-webkit-outer-spin-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0}::ng-deep .vx-form-group .input+.file-list,::ng-deep .vx-form-group input[type=text]+.file-list{margin-top:8px}::ng-deep .vx-form-group .input::-moz-placeholder,::ng-deep .vx-form-group input[type=text]::-moz-placeholder{font-size:13px}::ng-deep .vx-form-group .input::placeholder,::ng-deep .vx-form-group input[type=text]::placeholder{font-size:13px}::ng-deep .vx-form-group .input:-ms-input-placeholder,::ng-deep .vx-form-group input[type=text]:-ms-input-placeholder{font-size:13px}::ng-deep .vx-form-group .input::-ms-input-placeholder,::ng-deep .vx-form-group input[type=text]::-ms-input-placeholder{font-size:13px}::ng-deep .vx-form-group .classification{height:40px;border-radius:4px;border:1px solid #dbdbdb;background:#fff;padding:8px 12px;display:flex;justify-content:space-between}::ng-deep .vx-form-group .classification label{width:100%;position:relative;z-index:1;margin:0 4px 0 0}::ng-deep .vx-form-group .classification label span{display:block;width:100%;height:24px;border:1px solid #f1f1f1;border-radius:2px;line-height:24px;font-size:10px;text-align:center;color:#747576;font-weight:500;position:relative;text-transform:uppercase}::ng-deep .vx-form-group .classification label span:before{height:2px;content:\"\";top:0;right:0;left:0;border-radius:2px;position:absolute;transition:all .2s ease-in-out}::ng-deep .vx-form-group .classification label input{opacity:0;position:absolute;top:0;right:0;bottom:0;left:0;margin:0;padding:0;width:100%;height:100%;cursor:pointer;z-index:1}::ng-deep .vx-form-group .classification label input:checked+span{color:#fff}::ng-deep .vx-form-group .classification label input:checked+span:before{bottom:0;height:100%;z-index:-1}::ng-deep .vx-form-group .classification label.low span:before{background:#34aa44}::ng-deep .vx-form-group .classification label.low-med span:before{background:#f2bf19}::ng-deep .vx-form-group .classification label.med-high span:before{background:#f29619}::ng-deep .vx-form-group .classification label.high span:before{background:#eb2424}::ng-deep .vx-form-group .classification label:last-of-type{margin-right:0}::ng-deep .vx-form-group .input{display:flex;align-items:center}::ng-deep .vx-form-group .selected{height:40px;border-radius:4px;border:1px solid #f1f1f1;background:#fbfbfb;outline:none;padding:8px;line-height:20px;font-size:13px;color:#747576;font-weight:400;transition:all .2s ease-in-out;width:100%;display:flex;align-items:center;position:relative;justify-content:space-between}::ng-deep .vx-form-group .selected.first-field{z-index:2}::ng-deep .vx-form-group .selected .chip-container{display:flex;width:calc(100% - 60px);align-items:center}::ng-deep .vx-form-group .selected .chip-container.checkpoints{width:calc(100% - 120px)}::ng-deep .vx-form-group .selected .chip-container span.chip{background:#fff;border-radius:2px;box-shadow:0 0 3px #1e5dd31a;height:24px;padding:0 8px;color:#1e5dd3;font-size:12px;display:block;width:auto;max-width:100%;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:24px}::ng-deep .vx-form-group .selected .chip-container span.chip.disabled{background:#f1f1f1;box-shadow:none;color:#747576;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}::ng-deep .vx-form-group .selected .chip-container span.chip i{font-weight:400;margin-right:8px;cursor:pointer;font-size:10px;position:relative;top:1px}::ng-deep .vx-form-group .selected .chip-container span.chip span.step{background:#1e5dd3;border-radius:2px;color:#fff;font-size:9px;line-height:14px;padding:0 4px;font-weight:400;text-align:center;min-width:auto;margin-right:4px}::ng-deep .vx-form-group .selected .chip-container span.chip+span.chip{margin-left:4px}::ng-deep .vx-form-group .selected .chip-container span.chip.with-question{display:flex;align-items:center;justify-content:space-between;width:100%}::ng-deep .vx-form-group .selected .chip-container span.chip.with-question span.value{color:#1e5dd3;font-size:12px;font-weight:400;line-height:24px;padding:0;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:calc(100% - 80px)}::ng-deep .vx-form-group .selected .chip-container span.chip.with-question span.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-left:8px}::ng-deep .vx-form-group .selected .chip-container span.value{color:#747576;font-size:13px;line-height:20px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - 52px);padding:0 4px}::ng-deep .vx-form-group .selected .chip-container span.checkpoint-point-text{color:#747576;font-size:10px;font-weight:500;padding:0 8px;width:122px;line-height:14px}::ng-deep .vx-form-group .selected .chip-container span.checkpoint-point-text.first{position:relative;min-width:162px}::ng-deep .vx-form-group .selected .chip-container span.checkpoint-point-text.first:before{background:#f1f1f1;content:\"\";position:absolute;top:0;right:0;height:calc(100% + 12px);width:1px}::ng-deep .vx-form-group .selected .chip-container span.checkpoint-point-text .no{color:#1e5dd3}::ng-deep .vx-form-group .selected .chip-container.plus span.chip{max-width:calc(50% - 35px)}::ng-deep .vx-form-group .selected .chip-container.more-one span.chip{max-width:50%}::ng-deep .vx-form-group .selected .chip-container .chip-inner{background:#fff;border-radius:2px;box-shadow:0 2px 4px #1e5dd31a;line-height:24px;padding:0 4px 0 8px;display:flex;align-items:center}::ng-deep .vx-form-group .selected .chip-container .chip-inner .chip{background:transparent;border-radius:0;box-shadow:none;height:auto;line-height:unset;padding:0;color:#747576;max-width:300px}::ng-deep .vx-form-group .selected .chip-container .chip-inner button.count{border-radius:20px;height:16px;padding:0 6px;border:none;font-size:9px;line-height:16px;margin-left:4px;min-width:20px}::ng-deep .vx-form-group .selected .chip-container .chip-inner button.count.user{background:#34aa44}::ng-deep .vx-form-group .selected .chip-container .chip-inner i.cross{cursor:pointer}::ng-deep .vx-form-group .selected button.count{background:#1e5dd3;border-radius:2px;height:24px;padding:0 8px;border:1px solid #1e5dd3;cursor:pointer;outline:none;color:#fff;font:13px;font-weight:500;line-height:20px;white-space:nowrap;margin-left:8px}::ng-deep .vx-form-group .selected button.edit{border:1px solid #f1f1f1;border-radius:2px;background:#fff;outline:none;cursor:pointer;display:block;height:24px;padding:0 5px 0 4px;font-size:11px;font-weight:500;color:#1e5dd3;text-transform:uppercase;white-space:nowrap;margin-left:8px}::ng-deep .vx-form-group .selected button.edit i{font-weight:400;font-size:8px;margin-right:4px}::ng-deep .vx-form-group .selected button.close-btn{background:transparent;border:none;padding:0;margin-left:8px;font-size:10px;color:#c7381b;display:flex;align-items:center}::ng-deep .vx-form-group .selected .workflow-label{min-width:92px;padding:4px;text-align:center;margin-left:-8px;margin-right:8px;border-right:1px solid #f1f1f1}::ng-deep .vx-form-group .selected .workflow-label p{margin:0;display:block;text-transform:uppercase}::ng-deep .vx-form-group .selected .workflow-label p.title{font-size:9px;line-height:12px;color:#161b2f;font-weight:500}::ng-deep .vx-form-group .selected .workflow-label p.description{font-size:11px;line-height:16px;color:#161b2f;font-weight:600}::ng-deep .vx-form-group .selected .workflow-label+.chip-container{width:calc(100% - 148px)}::ng-deep .vx-form-group .selected+.selected{margin-top:8px}::ng-deep .vx-form-group .selected+app-cs-switch{display:block;margin-top:8px}::ng-deep .vx-form-group .selected+app-cs-switch label.cs-switch span.value{white-space:nowrap;margin-right:5px;text-transform:uppercase}::ng-deep .vx-form-group .selected+app-cs-switch.who-toggle label.cs-switch span.value{color:#747576}::ng-deep .vx-form-group .selected+app-cs-radio{margin-top:8px!important}::ng-deep .vx-form-group .selected~app-cs-radio{margin-top:4px;display:block;width:100%}::ng-deep .vx-form-group .selected~app-cs-radio label.radio-item{width:100%;position:relative}::ng-deep .vx-form-group .selected~app-cs-radio label.radio-item span.radio{position:absolute;top:8px;left:12px}::ng-deep .vx-form-group .selected~app-cs-radio label.radio-item span.value{font-size:11px;text-transform:uppercase;border:1px solid #dbdbdb;border-radius:4px;padding:8px 8px 8px 36px;width:100%;display:flex;justify-content:space-between;margin:0;max-width:100%;font-weight:500;color:#707070}::ng-deep .vx-form-group .selected~app-cs-radio label.radio-item span.value i{font-size:12px;color:#1e5dd3}::ng-deep .vx-form-group .selected~app-cs-radio label.radio-item svg{position:absolute;top:8px;left:12px}::ng-deep .vx-form-group .selected~app-cs-radio label.radio-item input:checked~span.value{background:#eefcf0;border-color:#34aa44}::ng-deep .vx-form-group .selected.readOnly{pointer-events:none}::ng-deep .vx-form-group .selected span.chip{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .vx-form-group .select-list{position:absolute;background:#fff;box-shadow:0 0 5px #1e5dd3;top:100%;right:0;left:0;z-index:2}::ng-deep .vx-form-group .select-list .vx-radio-group label.vx-radio-item{width:100%;padding:12px 16px}::ng-deep .vx-form-group .select-list .vx-radio-group label.vx-radio-item:hover{background:#f8f8f8}::ng-deep .vx-form-group marx-editor{margin-top:8px;display:block}::ng-deep .vx-form-group marx-editor .editor-container{border-radius:4px;border:1px solid #dbdbdb}::ng-deep .vx-form-group marx-editor .editor-container .editable-block{min-height:60px;padding:11px 15px;max-height:100px;line-height:20px;font-size:13px;color:#747576;font-weight:400;transition:all .2s ease-in-out;width:100%}::ng-deep .vx-form-group marx-editor .editor-container .editable-block ul{padding:0 0 0 10px;margin-top:0}::ng-deep .vx-form-group marx-editor .editor-container .editable-block ul li{list-style:disc}::ng-deep .vx-form-group marx-editor .editor-container .editable-block ol{padding:0 0 0 10px;margin-top:0}::ng-deep .vx-form-group marx-editor .editor-container .editable-block ol li{list-style:decimal}::ng-deep .vx-form-group marx-editor .editor-container .editor-tools{z-index:1;border-top:1px solid #dbdbdb;transition:none;border-radius:0 0 3px 3px;position:static}::ng-deep .vx-form-group marx-editor .editor-container .editor-tools app-editor-menu .editor-menu .col button{height:22px!important;width:22px!important;padding:0 5px}::ng-deep .vx-form-group marx-editor .editor-container .editor-tools app-editor-menu .editor-menu .col button svg{height:22px;width:22px}::ng-deep .vx-form-group marx-editor .editor-container .editor-tools app-editor-menu .editor-menu .col button.submit{width:80px!important;line-height:22px;justify-content:center}::ng-deep .vx-form-group marx-editor .editor-container .editor-tools app-editor-menu .editor-menu .col .popover.small ul.option-list li button{width:100%!important;height:auto!important}::ng-deep .vx-form-group marx-editor .editor-container:focus-within{border-color:#1e5dd3!important}::ng-deep .vx-form-group marx-editor .editor-container:focus-within .editor-tools{border-color:#1e5dd3!important}::ng-deep .vx-form-group marx-editor .editor-container:hover{border-color:#1e5dd3!important}::ng-deep .vx-form-group marx-editor .editor-container:hover .editor-tools{border-color:#1e5dd3!important}::ng-deep .vx-form-group marx-editor+app-cs-switch{margin-top:8px}::ng-deep .vx-form-group app-cs-switch label.cs-switch span.value{font-size:11px;color:#747576;text-transform:uppercase}::ng-deep .vx-form-group app-cs-switch+app-cs-switch{margin-top:8px}::ng-deep .vx-form-group .date-time-picker{display:flex;justify-content:space-between;height:40px;border-radius:4px;border:1px solid #dbdbdb;padding:11px 0}::ng-deep .vx-form-group .date-time-picker:focus-within{border-color:#1e5dd3;box-shadow:0 0 5px rgba(30,93,211,.27)}::ng-deep .vx-form-group .date-time-picker .picker-group{width:50%;position:relative;display:flex;align-items:center}::ng-deep .vx-form-group .date-time-picker .picker-group:first-of-type{border-right:1px solid #dbdbdb}::ng-deep .vx-form-group .date-time-picker .picker-group:only-of-type{border:none;width:100%}::ng-deep .vx-form-group .date-time-picker .picker-group input{height:38px;background:#fff;line-height:38px;font-size:13px;color:#747576;transition:all .2s ease-in-out;width:100%;font-weight:400;border:none;padding:0 12px 0 34px;outline:none}::ng-deep .vx-form-group .date-time-picker .picker-group input:focus,::ng-deep .vx-form-group .date-time-picker .picker-group input:hover{box-shadow:none;border:none}::ng-deep .vx-form-group .date-time-picker .picker-group input::-moz-placeholder{color:#999;font-size:13px}::ng-deep .vx-form-group .date-time-picker .picker-group input::placeholder{color:#999;font-size:13px}::ng-deep .vx-form-group .date-time-picker .picker-group input:-ms-input-placeholder{color:#999;font-size:13px}::ng-deep .vx-form-group .date-time-picker .picker-group input::-ms-input-placeholder{color:#999;font-size:13px}::ng-deep .vx-form-group .date-time-picker .picker-group i{display:flex;justify-content:center;align-items:center;height:16px;width:16px;position:absolute;left:12px;top:0;color:#bcbcbc;font-size:16px;pointer-events:none}::ng-deep .vx-form-group app-cs-radio.main-filed{margin-top:4px;display:block;width:100%}::ng-deep .vx-form-group app-cs-radio.main-filed label.radio-item{width:100%;position:relative}::ng-deep .vx-form-group app-cs-radio.main-filed label.radio-item span.radio{position:absolute;top:8px;left:12px}::ng-deep .vx-form-group app-cs-radio.main-filed label.radio-item span.value{font-size:11px;text-transform:uppercase;border:1px solid #dbdbdb;border-radius:4px;padding:8px 8px 8px 36px;width:100%;display:flex;justify-content:space-between;margin:0;max-width:100%;color:#707070}::ng-deep .vx-form-group app-cs-radio.main-filed label.radio-item span.value i{font-size:12px;color:#1e5dd3}::ng-deep .vx-form-group app-cs-radio.main-filed label.radio-item svg{position:absolute;top:8px;left:12px}::ng-deep .vx-form-group app-cs-radio.main-filed label.radio-item input:checked~span.value{background:#eefcf0;border-color:#34aa44}::ng-deep .vx-form-group .switch-row{display:flex}::ng-deep .vx-form-group .switch-row app-cs-switch{display:block;margin-top:8px}::ng-deep .vx-form-group .switch-row app-cs-switch label.cs-switch span.value{white-space:nowrap;margin-right:0;text-transform:uppercase;color:#747576!important}::ng-deep .vx-form-group .switch-row app-cs-switch label.cs-switch span.value i{display:inline-flex;font-size:11px;cursor:pointer;color:#1e5dd3;align-items:center;line-height:16px;margin:0 4px}::ng-deep .vx-form-group .switch-row app-cs-switch+app-cs-switch{margin-left:8px}::ng-deep .vx-form-group .switch-row.align-right{justify-content:flex-end}::ng-deep .vx-form-group .switch-row.align-right label.cs-switch span.value{margin-right:8px}::ng-deep .vx-form-group .risk-type-field{background:#f8f8f8;border:1px solid #dbdbdb;border-radius:4px;height:40px;display:flex;align-items:center;padding:4px;position:relative;z-index:1}::ng-deep .vx-form-group .risk-type-field .type-item{width:50%;position:relative}::ng-deep .vx-form-group .risk-type-field .type-item button{background:transparent;border:none;border-radius:0;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase;width:100%;height:32px;padding:0 12px;text-align:left}::ng-deep .vx-form-group .risk-type-field .type-item button.disabled{background:transparent!important;color:#dbdbdb!important;filter:unset!important;opacity:unset!important;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}::ng-deep .vx-form-group .risk-type-field .type-item .info{color:#1e5dd3;font-size:12px;position:absolute;top:10px;right:12px;cursor:pointer}::ng-deep .vx-form-group .risk-type-field .type-item.active button{color:#1e5dd3!important}::ng-deep .vx-form-group .risk-type-field .type-item:nth-child(2).active~.background-glider{transform:translate(100%)}::ng-deep .vx-form-group .risk-type-field .background-glider{background:#fff;border-radius:4px;box-shadow:0 1px 3px #161b2f26;position:absolute;display:flex;width:208px;height:32px;z-index:-1;transition:.25s ease-out}.left{width:36px;height:36px;margin-top:30px;margin-left:-58px;margin-right:20px;display:flex;justify-content:center;align-items:center;position:relative;z-index:10;border-radius:50%}.left.deadline-completed{margin-top:18px}.left.checked{background:transparent}.left img{width:36px}.left .checkIcon{width:32px;height:32px;background:#fff;border-radius:50%;stroke-width:4;stroke:#34aa44;stroke-miterlimit:10;box-shadow:inset 0 0 0 #34aa44;-webkit-animation:fillCheck .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;animation:fillCheck .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;margin-top:0}.left .checkIcon__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;-webkit-animation:strokeCheck .6s cubic-bezier(.65,0,.45,1) forwards;animation:strokeCheck .6s cubic-bezier(.65,0,.45,1) forwards}.left .checkIcon__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;-webkit-animation:strokeCheck .3s cubic-bezier(.65,0,.45,1) .8s forwards;animation:strokeCheck .3s cubic-bezier(.65,0,.45,1) .8s forwards}.right{width:100%}.right span.indicator{position:absolute;top:36px;left:-16px;font-size:12px;color:#f0b819;cursor:pointer}.form-group-row{display:flex;position:relative;transition:all .2s ease-in-out}.form-group-row.disabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;filter:grayscale(1);z-index:2}.form-group-row.disabled .left{position:relative}.form-group-row.disabled .left:before{content:\"\";position:absolute;top:2px;right:0;bottom:0;left:2px;background:#fff;opacity:.7;border-radius:50%;width:32px;height:32px}.form-group-row.disabled .right{opacity:.3}.form-group-row.active{pointer-events:none;filter:grayscale(0);z-index:2;opacity:1}.form-group-row.active .right .vx-form-group .custom-input,.form-group-row.active .right .vx-form-group input{border-color:#1e5dd3;box-shadow:0 0 5px rgba(30,93,211,.27)}::ng-deep .radio-group-selector app-cs-radio{margin-top:4px;display:block;width:100%}::ng-deep .radio-group-selector app-cs-radio label.radio-item{width:100%;position:relative}::ng-deep .radio-group-selector app-cs-radio label.radio-item .radio,::ng-deep .radio-group-selector app-cs-radio label.radio-item .radiomark{position:absolute!important;top:9px;left:12px}::ng-deep .radio-group-selector app-cs-radio label.radio-item .value{font-size:11px!important;text-transform:uppercase;border:1px solid #dbdbdb;border-radius:4px;padding:8px 8px 8px 36px;width:100%;display:flex;justify-content:space-between;margin:0!important;max-width:100%!important;font-weight:500!important;color:#707070!important}::ng-deep .radio-group-selector app-cs-radio label.radio-item .value i{font-size:12px;color:#1e5dd3}::ng-deep .radio-group-selector app-cs-radio label.radio-item input:checked~span.value{background:#eefcf0;border-color:#34aa44}@-webkit-keyframes strokeCheck{to{stroke-dashoffset:0}}@keyframes strokeCheck{to{stroke-dashoffset:0}}@-webkit-keyframes fillCheck{to{box-shadow:inset 0 0 0 2px #34aa44}}@keyframes fillCheck{to{box-shadow:inset 0 0 0 2px #34aa44}}.action-list{width:220px}.action-list ul{padding:0;margin:0;-webkit-animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;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}.action-list ul.action-item{display:block}.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}.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}.action-list ul.action-item li button i{font-size:17px;margin-right:10px;color:#1c5bd1}.action-list ul.action-item li button:hover{background:#f3f3f3}.action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.action-list ul.action-item li .avatar-card.within-con{display:block}.action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;overflow:hidden;background:#4681ef;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.action-list ul.action-item li .avatar-card .avatar img{width:100%}.action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.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;-moz-text-align-last:left;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#1c5bd1;cursor:pointer;margin-right:5px}.action-list ul.action-item li .avatar-card.no-image{display:block}.action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.action-list ul.action-item li .chip-item{color:#1e5dd3;padding:10px;display:flex;align-items:center}.action-list ul.action-item li .chip-item i{margin-right:7px;font-size:10px;cursor:pointer;display:inline-flex}.action-list ul.action-item li .chip-item span{display:block;width:auto;max-width:calc(100% - 17px);font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-list ul.action-item li .chip-item span.chip-block{display:block;width:100%}.action-list ul.action-item li .chip-item span.id{font-size:9px}.action-list ul.action-item li .within{display:flex;align-items:center;justify-content:flex-start}.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}.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}.action-list ul.action-item li:first-child{-webkit-animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(2){-webkit-animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(3){-webkit-animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(4){-webkit-animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(5){-webkit-animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(6){-webkit-animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(7){-webkit-animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(8){-webkit-animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(9){-webkit-animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(10){-webkit-animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both;animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@-webkit-keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@-webkit-keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}p.error-message{font-size:11px;font-weight:400;color:#eb2424;line-height:16px;margin-top:8px;margin-bottom:0}.edit-loader{position:absolute;top:-3px;left:-3px;width:46px;height:46px;transform:rotate(180deg)}.circular-loader{-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;height:100%;transform-origin:center center;width:100%;position:absolute;top:0;left:0;margin:auto}.loader-path{stroke-dasharray:150,200;stroke-dashoffset:-10;-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite;stroke-linecap:round}@-webkit-keyframes rotate{to{transform:rotate(1turn)}}@keyframes rotate{to{transform:rotate(1turn)}}@-webkit-keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35}to{stroke-dasharray:89,200;stroke-dashoffset:-124}}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35}to{stroke-dasharray:89,200;stroke-dashoffset:-124}}::ng-deep .dropdown{position:fixed;background:#fff;box-shadow:0 3px 6px #00000029;padding:24px 0;z-index:9;max-height:calc(100vh - 200px);overflow:auto}::ng-deep .dropdown ul.dropdown-list{padding:0 20px;margin:0;display:block}::ng-deep .dropdown ul.dropdown-list li{list-style:none}::ng-deep .dropdown ul.dropdown-list li app-cs-radio{display:flex}::ng-deep .dropdown ul.dropdown-list li app-cs-radio label.radio-item{width:100%;position:relative}::ng-deep .dropdown ul.dropdown-list li app-cs-radio label.radio-item span.radio{position:absolute;top:12px;left:12px}::ng-deep .dropdown ul.dropdown-list li app-cs-radio label.radio-item span.value{padding:11px 12px 11px 32px;width:100%;border:1px solid #bcbcbc;border-radius:4px;margin-left:0;max-width:100%}::ng-deep .dropdown ul.dropdown-list li app-cs-radio label.radio-item svg{position:absolute;top:12px;left:12px}::ng-deep .dropdown ul.dropdown-list li app-cs-radio label.radio-item input[type=radio]:checked~span.value{background:#e8feeb;border-color:#34aa44}::ng-deep .dropdown ul.dropdown-list li+li{margin-top:8px}app-smiley-dialog{position:relative;z-index:10}app-smiley-dialog-inline{position:absolute;top:-3px;right:0;bottom:0;z-index:999;width:520px;height:calc(100vh + 3px)}::ng-deep .vx-overlay{position:fixed;z-index:3;top:0;right:0;bottom:0;left:0}dp-date-picker{width:100%;position:fixed!important;z-index:14;top:-40px;left:0}dp-date-picker input{width:100%;border:none;opacity:0;pointer-events:none}dp-date-picker input:focus{outline:none}dp-date-picker .dp-popup{width:412px;box-shadow:0 0 20px #161b2f26;background-color:#fff;border-radius:4px;-webkit-animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both}dp-date-picker .dp-popup dp-day-calendar,dp-date-picker .dp-popup dp-month-calendar{width:100%;pointer-events:auto}dp-date-picker .dp-popup dp-day-calendar button,dp-date-picker .dp-popup dp-month-calendar button{background:transparent;border:none;outline:none}dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left,dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right,dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left,dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right,dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{width:40px;height:40px;display:flex;justify-content:center;align-items:center;border-radius:50%;font-size:14px}dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-left:hover,dp-date-picker .dp-popup dp-day-calendar button.dp-calendar-nav-right:hover,dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:hover,dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-left:hover,dp-date-picker .dp-popup dp-month-calendar button.dp-calendar-nav-right:hover,dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:hover{background-color:#f3f3f3}dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn,dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn{display:none}dp-date-picker .dp-popup dp-day-calendar button.dp-current-location-btn:before,dp-date-picker .dp-popup dp-month-calendar button.dp-current-location-btn:before{content:\"\";height:10px;width:10px;border-radius:50%;background:#000;display:inline-flex}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week,dp-date-picker .dp-popup dp-day-calendar .dp-weekdays,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week,dp-date-picker .dp-popup dp-month-calendar .dp-weekdays{display:flex;justify-content:space-around}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week .dp-calendar-weekday,dp-date-picker .dp-popup dp-day-calendar .dp-weekdays .dp-calendar-weekday,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week .dp-calendar-weekday,dp-date-picker .dp-popup dp-month-calendar .dp-weekdays .dp-calendar-weekday{width:52px;border-left:none;border-bottom-color:#fff;color:#747576;font-size:11px;font-weight:600;text-transform:uppercase}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button,dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button,dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button:hover,dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button:hover,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button:hover,dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button:hover{background-color:#f3f3f3}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-selected,dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-selected,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-selected,dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-selected{background:#1e5dd3}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-week button.dp-current-day,dp-date-picker .dp-popup dp-day-calendar .dp-weekdays button.dp-current-day,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-week button.dp-current-day,dp-date-picker .dp-popup dp-month-calendar .dp-weekdays button.dp-current-day{border:1px solid rgba(0,0,0,.38);color:#1e5dd3;background-color:#fff}dp-date-picker .dp-popup dp-day-calendar .dp-day-calendar-container,dp-date-picker .dp-popup dp-month-calendar .dp-day-calendar-container{padding:20px;border-radius:2px}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container{display:flex;margin:0 0 20px;border:none}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-nav-container .dp-nav-header button,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-nav-container .dp-nav-header button{color:#000;font-size:17px;font-weight:500;margin:0 0 0 12px;padding:0}dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container,dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container{width:80px;display:flex}dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,dp-date-picker .dp-popup dp-day-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button,dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-left button,dp-date-picker .dp-popup dp-month-calendar .dp-nav-btns-container .dp-calendar-nav-container-right button{margin:0!important}dp-date-picker .dp-popup dp-day-calendar .dp-calendar-wrapper,dp-date-picker .dp-popup dp-month-calendar .dp-calendar-wrapper{border:none}dp-date-picker .dp-open+div{position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:0!important;display:flex;justify-content:center;align-items:center;z-index:99;pointer-events:none;background:rgba(0,0,0,.3)}@-webkit-keyframes slide-bottom{0%{transform:translateY(-100px)}to{transform:translateY(0)}}@keyframes slide-bottom{0%{transform:translateY(-100px)}to{transform:translateY(0)}}::ng-deep span.file{display:block;width:20px;min-width:20px;border-radius:0 0 2px 2px;position:relative;margin-right:5px;border:1px solid #747576;border-top:none;margin-top:5px;background:#fff}::ng-deep span.file.table{margin-right:8px;width:18px;min-width:18px}::ng-deep span.file.table i{font-size:8px}::ng-deep span.file.table .format{height:8px;font-size:7px;line-height:8px;font-weight:400}::ng-deep span.file:before{position:absolute;border-radius:0;top:-4px;right:-1px;content:\"\";height:4px;width:4px;display:block;background:linear-gradient(45deg,#747576,#747576 1%,#747576 50%,rgba(41,137,216,0) 51%,rgba(125,185,232,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\"#34aa44\",endColorstr=\"#007db9e8\",GradientType=1)}::ng-deep span.file:after{height:4px;left:-1px;right:3px;border-top:1px solid;border-right:none;border-left:1px solid;content:\"\";top:-4px;position:absolute;border-radius:2px 0 0 0;background:#fff}::ng-deep span.file .format{height:10px;font-size:6px;text-transform:uppercase;background:transparent;font-weight:600;text-align:center;display:block;line-height:10px}::ng-deep span.file i{font-size:10px;height:10px;display:flex;align-items:center;justify-content:center;color:#dbdbdb}::ng-deep span.file.docx{width:22px!important}::ng-deep span.file.pdf,::ng-deep span.file.template{border-color:#f31c39}::ng-deep span.file.pdf:before,::ng-deep span.file.template:before{background:linear-gradient(45deg,#f31c39,#f31c39 50%,rgba(41,137,216,0) 51%,rgba(125,185,232,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\"#f31c39\",endColorstr=\"#007db9e8\",GradientType=1)}::ng-deep span.file.pdf:after,::ng-deep span.file.template:after{border-color:#f31c39}::ng-deep span.file.pdf .format,::ng-deep span.file.template .format{color:#f31c39}::ng-deep span.file.css,::ng-deep span.file.less,::ng-deep span.file.scss,::ng-deep span.file.xls,::ng-deep span.file.xlsx{border-color:#34aa44}::ng-deep span.file.css:before,::ng-deep span.file.less:before,::ng-deep span.file.scss:before,::ng-deep span.file.xls:before,::ng-deep span.file.xlsx:before{background:linear-gradient(45deg,#34aa44,#34aa44 1%,#34aa44 50%,rgba(41,137,216,0) 51%,rgba(125,185,232,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\"#34aa44\",endColorstr=\"#007db9e8\",GradientType=1)}::ng-deep span.file.css:after,::ng-deep span.file.less:after,::ng-deep span.file.scss:after,::ng-deep span.file.xls:after,::ng-deep span.file.xlsx:after{border-color:#34aa44;color:#34aa44}::ng-deep span.file.css .format,::ng-deep span.file.less .format,::ng-deep span.file.scss .format,::ng-deep span.file.xls .format,::ng-deep span.file.xlsx .format{color:#34aa44}::ng-deep span.file.doc,::ng-deep span.file.docx,::ng-deep span.file.psd{border-color:#1e5dd3}::ng-deep span.file.doc:before,::ng-deep span.file.docx:before,::ng-deep span.file.psd:before{background:linear-gradient(45deg,#1e5dd3,#1e5dd3 1%,#1e5dd3 50%,rgba(41,137,216,0) 51%,rgba(125,185,232,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\"#34aa44\",endColorstr=\"#007db9e8\",GradientType=1)}::ng-deep span.file.doc:after,::ng-deep span.file.docx:after,::ng-deep span.file.psd:after{border-color:#1e5dd3}::ng-deep span.file.doc .format,::ng-deep span.file.docx .format,::ng-deep span.file.psd .format{color:#1e5dd3}::ng-deep span.file.ai,::ng-deep span.file.html,::ng-deep span.file.jpeg,::ng-deep span.file.jpg,::ng-deep span.file.png,::ng-deep span.file.ppt{border-color:#f6882f}::ng-deep span.file.ai:before,::ng-deep span.file.html:before,::ng-deep span.file.jpeg:before,::ng-deep span.file.jpg:before,::ng-deep span.file.png:before,::ng-deep span.file.ppt:before{background:linear-gradient(45deg,#f6882f,#f6882f 1%,#f6882f 50%,rgba(41,137,216,0) 51%,rgba(125,185,232,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\"#34aa44\",endColorstr=\"#007db9e8\",GradientType=1)}::ng-deep span.file.ai:after,::ng-deep span.file.html:after,::ng-deep span.file.jpeg:after,::ng-deep span.file.jpg:after,::ng-deep span.file.png:after,::ng-deep span.file.ppt:after{border-color:#f6882f}::ng-deep span.file.ai .format,::ng-deep span.file.html .format,::ng-deep span.file.jpeg .format,::ng-deep span.file.jpg .format,::ng-deep span.file.png .format,::ng-deep span.file.ppt .format{color:#f6882f}::ng-deep span.file.php{border-color:#7aa6f7}::ng-deep span.file.php:before{background:linear-gradient(45deg,#7aa6f7,#7aa6f7 1%,#7aa6f7 50%,rgba(41,137,216,0) 51%,rgba(125,185,232,0));filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\"#34aa44\",endColorstr=\"#007db9e8\",GradientType=1)}::ng-deep span.file.php:after{border-color:#7aa6f7}::ng-deep span.file.php .format{color:#7aa6f7}::ng-deep ngx-material-timepicker-container .timepicker-backdrop-overlay{background-color:rgba(0,0,0,.05)!important;z-index:9999999999!important}::ng-deep ngx-material-timepicker-container .timepicker-overlay{z-index:9999999999!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker{width:232px!important;border-radius:2px!important;box-shadow:0 4px 30px #161b2f26!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header{background-color:#fff!important;padding:0!important;border-radius:2px 2px 0 0}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container{display:block!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__time{color:#000!important;width:150px!important;margin:0 auto;line-height:60px}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__time ngx-material-timepicker-dial-control .timepicker-dial__control{font-size:40px;background-color:transparent!important;color:#000!important;font-weight:600;text-align:right;caret-color:transparent;outline:none;font-family:Poppins;line-height:56px}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__time ngx-material-timepicker-dial-control .timepicker-dial__control:focus,::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__time ngx-material-timepicker-dial-control .timepicker-dial__control:hover{background-color:transparent!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__time ngx-material-timepicker-dial-control:last-of-type .timepicker-dial__control{text-align:left}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__time span{padding:0 8px}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period{display:flex!important;width:182px;margin:0 auto!important;background:#f1f1f1;padding:4px 10px;border-radius:20px;position:relative}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period:before{background:#f1f1f1;content:\"\";position:absolute;top:15px;left:-25px;width:calc(100% + 50px);height:2px}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period .timepicker-period{flex-direction:unset!important;position:relative;z-index:1}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period .timepicker-period:after{content:\"\";position:absolute;right:-12px;top:0;border-left:14px solid #f1f1f1;border-bottom:12px solid transparent;border-top:12px solid transparent;z-index:-1}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period .timepicker-period:before{content:\"\";position:absolute;left:-18px;top:0;border-right:14px solid #f1f1f1;border-bottom:12px solid transparent;border-top:12px solid transparent;z-index:-1}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period .timepicker-period button{font-size:11px;background-color:transparent;padding:0;border-radius:20px;color:#747576;font-weight:600;font-family:Poppins;width:84px;height:24px}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period .timepicker-period button.timepicker-dial__item_active{background:#fff!important;color:#1e5dd3!important;box-shadow:0 1px 2px #dbdbdb}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__header .timepicker-dial__container .timepicker-dial__period .timepicker-period button+button{margin-left:0!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .clock-face{width:200px!important;height:200px!important;padding:10px!important;background:transparent!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .clock-face .clock-face__number--outer{height:calc(224px / 2 - 20px)!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .clock-face .clock-face__number--outer span{color:#000}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .clock-face .clock-face__number--outer span.active{color:#fff}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .clock-face .clock-face__clock-hand{height:80px!important;top:calc(50% - 80px)!important;background-color:#1e5dd3!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .clock-face .clock-face__number>span.active{background-color:#1e5dd3!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .clock-face .clock-face__clock-hand_minute:before{border:4px solid #1e5dd3!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .timepicker__actions{display:flex!important;padding:10px 0 0!important;background:#fff!important;justify-content:space-around!important;border-radius:0 0 2px 2px!important;overflow:hidden}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .timepicker__actions div:first-child ngx-material-timepicker-button button.timepicker-button{background:#f8f8f8;color:#1e5dd3}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .timepicker__actions div ngx-material-timepicker-button button.timepicker-button{line-height:28px!important;width:100%;background:#1e5dd3;color:#fff;border-radius:0!important;height:32px!important;width:116px!important}::ng-deep ngx-material-timepicker-container ngx-material-timepicker-content .timepicker .timepicker__main-content .timepicker__actions div ngx-material-timepicker-button button.timepicker-button span{font-weight:500!important;font-size:11px;font-family:Poppins}"]
|
|
1671
1671
|
},] }
|
|
1672
1672
|
];
|
|
@@ -14385,6 +14385,7 @@ class FrameworkListComponent {
|
|
|
14385
14385
|
this.getSubCategories(this.selectedValues.framework._id, { search: true });
|
|
14386
14386
|
break;
|
|
14387
14387
|
case 'responsibilities':
|
|
14388
|
+
console.log("responsibility data", event);
|
|
14388
14389
|
this.responsibilitiesList.currentPage = event;
|
|
14389
14390
|
if (((_c = (_b = (_a = this.selectedValues) === null || _a === void 0 ? void 0 : _a.framework) === null || _b === void 0 ? void 0 : _b.parent_list_details) === null || _c === void 0 ? void 0 : _c.length) == 0 && ((_e = (_d = this.selectedValues) === null || _d === void 0 ? void 0 : _d.framework) === null || _e === void 0 ? void 0 : _e.child_list_details.length) == 0 && ((_g = (_f = this.selectedValues) === null || _f === void 0 ? void 0 : _f.framework) === null || _g === void 0 ? void 0 : _g.totalControls) > 0) {
|
|
14390
14391
|
this.getResponsibilities(this.selectedValues.framework._id);
|
|
@@ -14538,7 +14539,7 @@ FrameworkListComponent.decorators = [
|
|
|
14538
14539
|
{ type: Component, args: [{
|
|
14539
14540
|
selector: 'app-framework-list',
|
|
14540
14541
|
template: "<!-- <p>framework-list works!</p> -->\r\n<div class=\"framework-list\">\r\n <div class=\"framework-list-head\">\r\n <h3 *ngIf=\"currentList=='framework'\" class=\"framework-list-title\"> Select From a Framework</h3>\r\n <h3 *ngIf=\"currentList=='categories'\" class=\"framework-list-title\"> Select From a Framework >\r\n {{selectedValues?.framework?.name}}</h3>\r\n\r\n <h3 *ngIf=\"currentList=='responsibilities'\" class=\"framework-list-title\">\r\n <i class=\"icons\" (click)=\"goBack()\"></i> {{selectedValues?.framework?.name}}</h3>\r\n\r\n <!-- <h3 *ngIf=\"breadCrumb.length>0\" class=\"framework-list-title\">\r\n <i class=\"icons\" *ngIf=\"breadCrumb?.length > 0\" (click)=\"getCategoryDetailsById()\"></i>\r\n <ng-container *ngFor=\"let item of breadCrumb; let i = index\">\r\n <span class=\"arrow\">{{(i>0)?'>':''}}</span>\r\n <span\r\n [class.link]=\"tableComponent.currentEntity || (!(tableComponent.currentEntity) && i !== breadCrumb?.length -1)\"\r\n (click)=\"getCategoryDetailsById(item.itemId)\" [appTooltip]=\"item.itemName\" placement=\"bottom\"\r\n delay=\"0\">{{item.itemName}}\r\n </span>\r\n\r\n </ng-container>\r\n <ng-container *ngIf=\"tableComponent.currentEntity\"> <span class=\"arrow\">></span>\r\n {{breadCrumb[breadCrumb?.length - 1].itemName}}\r\n <span> for {{tableComponent.currentEntity}}</span>\r\n </ng-container>\r\n </h3> -->\r\n </div>\r\n <div class=\"framework-list-body\">\r\n <div class=\"filter-card-row\" *ngIf=\"currentList=='framework'\">\r\n <!--this section will not appear on child part -->\r\n <div class=\"filter-card\" [class.active]=\"activeTab == 'regulations'\" (click)=\"changeTab('regulations')\">\r\n <div class=\"left\">\r\n <label>Regulations</label>\r\n </div>\r\n\r\n <span class=\"counter\">{{frameworkCount.regulations}}</span>\r\n </div>\r\n <div class=\"filter-card\" [class.active]=\"activeTab == 'standards'\" (click)=\"changeTab('standards')\">\r\n <div class=\"left\">\r\n <label>Standards</label>\r\n </div>\r\n <span class=\"counter\">{{frameworkCount.standards}}</span>\r\n </div>\r\n <div class=\"filter-card\" [class.active]=\"activeTab == 'internalControls'\"\r\n (click)=\"changeTab('internalControls')\">\r\n <div class=\"left\">\r\n <label>Internal Controls</label>\r\n </div>\r\n <span class=\"counter\">{{frameworkCount.internalControls}}</span>\r\n </div>\r\n <div class=\"filter-card\" [class.active]=\"activeTab == 'others'\" (click)=\"changeTab('others')\">\r\n <div class=\"left\">\r\n <label>Others</label>\r\n </div>\r\n <span class=\"counter\">{{frameworkCount.others}}</span>\r\n </div>\r\n </div>\r\n <div class=\"framework-list-search\">\r\n <i class=\"icons\"></i>\r\n <input type=\"text\" #searchField [placeholder]=\"placeholderText[currentList]\"\r\n (keyup.enter)=\"searchBy($event.target.value,currentList)\" />\r\n </div>\r\n <!-- <app-workflow-pagination></app-workflow-pagination> -->\r\n <app-pagination *ngIf=\"currentList=='framework' && frameworkData.totalPages > 1\" [start]=\"frameworkData.from\"\r\n [end]=\"frameworkData.to\" [total]=\"frameworkData.totalRecords\" [pageCount]=\"frameworkData.totalPages\"\r\n [currentPage]=\"frameworkData.currentPage\" (selectedPage)=\"changePage($event,'frameworks')\"></app-pagination>\r\n <app-pagination *ngIf=\"currentList=='categories' && subCategoriesList.totalPages > 1\"\r\n [start]=\"subCategoriesList.from\" [end]=\"subCategoriesList.to\" [total]=\"subCategoriesList.totalRecords\"\r\n [pageCount]=\"subCategoriesList.totalPages\" [currentPage]=\"subCategoriesList.currentPage\"\r\n (selectedPage)=\"changePage($event,'categories')\"></app-pagination>\r\n <app-pagination *ngIf=\"currentList=='responsibilities' && responsibilitiesList.totalPages > 1\"\r\n [start]=\"responsibilitiesList.from\" [end]=\"responsibilitiesList.to\"\r\n [total]=\"responsibilitiesList.totalRecords\" [pageCount]=\"responsibilitiesList.totalPages\"\r\n [currentPage]=\"responsibilitiesList.currentPage\" (selectedPage)=\"changePage($event,'responsibilities')\">\r\n </app-pagination>\r\n <!-- For parent -->\r\n <!-- <div class=\"framework-list-pagination\">\r\n <app-workflow-pagination></app-workflow-pagination>\r\n </div> -->\r\n <!-- [class.no-card]=\"breadCrumb.length>0\" -->\r\n <div class=\"framework-list-table\" [class.no-card]=\"currentList=='categories' || currentList=='responsibilities'\">\r\n <app-framework-list-table *ngIf=\"currentList=='framework'\" [listLoader]=\"loader\"\r\n [frameworkType]=\"'framework'\" (selectedFramework)=\"selectFramework($event)\"\r\n [currentFramework]=\"selectedValues[currentList]\" [frameworksList]=\"frameworkData\">\r\n </app-framework-list-table>\r\n <app-framework-list-table *ngIf=\"currentList=='categories'\" [listLoader]=\"loader\"\r\n [frameworksList]=\"subCategoriesList\" (selectedFramework)=\"selectFramework($event)\"\r\n [currentFramework]=\"selectedValues[currentList]\" [frameworkType]=\"'subFramework'\">\r\n </app-framework-list-table>\r\n <app-framework-responsibility-table *ngIf=\"currentList=='responsibilities'\" [listLoader]=\"loader\"\r\n [currentSelectedControl]=\"selectedValues[currentList]\" [controlsList]=\"responsibilitiesList.data\"\r\n (selectedControl)=\"selectFramework($event)\" (assignControl)=\"assignSelectedControl($event)\">\r\n </app-framework-responsibility-table>\r\n <app-no-data *ngIf=\"frameworkData?.data?.length==0 && currentList=='framework' && !loader\"\r\n [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\"\r\n [noDataText]=\"'No data to display'\"></app-no-data>\r\n <app-no-data *ngIf=\"subCategoriesList?.data?.length==0 && currentList=='categories' && !loader\"\r\n [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\"\r\n [noDataText]=\"'No data to display'\"></app-no-data>\r\n <app-no-data *ngIf=\"responsibilitiesList?.data?.length==0 && currentList=='responsibilities' && !loader\"\r\n [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\"\r\n [noDataText]=\"'No data to display'\"></app-no-data>\r\n <!-- old table list -->\r\n <!-- <app-parent-table #parentTable *ngIf=\"showParent\" [search]=\"search\"\r\n (expandCategory)=\"expandCategory($event)\" [tableList]=\"categoryList[activeTab].list\"\r\n (entrustFramework)=\"entrustFrameworkDetails($event)\">\r\n </app-parent-table> -->\r\n </div>\r\n\r\n\r\n </div>\r\n <!-- [singularText]=\"'User selected'\" [pluralText]=\"'Users selected'\" (closeEvent)=\"save(selectedIds)\"\r\n (closeList)=\"close()\" (deleteEvent)=\"deleteEvent($event)\"\r\n [isDisabled]=\"(groupsList?.length + usersList?.length) === 0 || selectedUsers?.length === 0\" -->\r\n <app-floating-bar [selectedData]=\"(selectedValues[currentList]?.name)?[selectedValues[currentList]]:[]\"\r\n [displayElementKey]=\"floatingBarDisplayKeys[currentList]\" [isDisabled]=\"!selectedValues[currentList]?.name\" (closeEvent)=\"save()\" (closeList)=\"goBack()\"\r\n (deleteEvent)=\"remove()\"></app-floating-bar>\r\n <app-loader-inline *ngIf=\"loader\"></app-loader-inline>\r\n\r\n</div>",
|
|
14541
|
-
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");::ng-deep .framework-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:500px;bottom:0;left:0;z-index:-1}::ng-deep .framework-list-head{height:44px;background:#fbfbfb;padding:12px}::ng-deep .framework-list-title{line-height:20px;font-size:14px;color:#161b2f;margin:0;font-weight:500;display:flex;align-items:center}::ng-deep .framework-list-title i{font-size:20px;margin-right:8px;cursor:pointer}::ng-deep .framework-list-title span.link{color:#1e5dd3;cursor:pointer;text-transform:capitalize}::ng-deep .framework-list-title span.link.not-click{pointer-events:none;color:#161b2f}::ng-deep .framework-list-title span.link:last-of-type{pointer-events:none;color:#161b2f}::ng-deep .framework-list-title span{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}::ng-deep .framework-list-title span.arrow{margin:0 8px;display:inline-block;font-size:20px}::ng-deep .framework-list-title span.arrow:empty{display:none}::ng-deep .framework-list-search{position:relative;margin-bottom:8px}::ng-deep .framework-list-search 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 .framework-list-search input:focus{border-color:#1e5dd3}::ng-deep .framework-list-search i{position:absolute;left:17px;font-size:12px;font-weight:400;top:17px;pointer-events:none;color:#f1f1f1}::ng-deep .framework-list app-workflow-pagination .pagination-sec{padding-top:0!important}::ng-deep .framework-list-body{padding:28px 36px 12px;height:calc(100vh - 120px)}::ng-deep .framework-list-body .filter-card{display:flex;align-items:center;border:1px solid #dbdbdb;border-radius:4px;height:55px;padding:12px 15px;width:100%;justify-content:space-between;cursor:pointer}::ng-deep .framework-list-body .filter-card.active{box-shadow:0 3px 6px #1e5dd340}::ng-deep .framework-list-body .filter-card.active .counter{background:#f1f1f1;color:#161b2f}::ng-deep .framework-list-body .filter-card label{font-weight:600;text-transform:uppercase;color:#747576;line-height:16px;margin-left:0;font-size:11px;width:100%;pointer-events:none}::ng-deep .framework-list-body .filter-card p{line-height:16px;font-size:10px;color:#161b2f;font-weight:600;margin:0}::ng-deep .framework-list-body .filter-card span.counter{display:flex;height:32px;min-width:32px;border-radius:4px;background:#042e7d;color:#fff;font-size:11px;font-weight:600;justify-content:center;align-items:center;padding:0 5px;line-height:32px}::ng-deep .framework-list-body .filter-card .left{display:flex;flex-wrap:wrap}::ng-deep .framework-list-body .filter-card+.filter-card{margin-left:4px}::ng-deep .framework-list-body .filter-card-row{display:flex;padding-bottom:8px}::ng-deep .framework-list-table{position:relative;height:calc(100% - 116px);overflow:hidden;overflow-y:auto}::ng-deep .framework-list-table app-parent-table{height:calc(100vh - 260px);overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;display:block;padding-right:8px;margin-right:-8px}::ng-deep .framework-list-table app-parent-table::-webkit-scrollbar-track{background-color:#f1f1f1;position:absolute}::ng-deep .framework-list-table app-parent-table::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .framework-list-table app-parent-table::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .framework-list-table::-webkit-scrollbar-track{background-color:transparent}::ng-deep .framework-list-table::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .framework-list-table::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .framework-list-table.no-card{height:calc(100vh -
|
|
14542
|
+
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");::ng-deep .framework-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:500px;bottom:0;left:0;z-index:-1}::ng-deep .framework-list-head{height:44px;background:#fbfbfb;padding:12px}::ng-deep .framework-list-title{line-height:20px;font-size:14px;color:#161b2f;margin:0;font-weight:500;display:flex;align-items:center}::ng-deep .framework-list-title i{font-size:20px;margin-right:8px;cursor:pointer}::ng-deep .framework-list-title span.link{color:#1e5dd3;cursor:pointer;text-transform:capitalize}::ng-deep .framework-list-title span.link.not-click{pointer-events:none;color:#161b2f}::ng-deep .framework-list-title span.link:last-of-type{pointer-events:none;color:#161b2f}::ng-deep .framework-list-title span{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}::ng-deep .framework-list-title span.arrow{margin:0 8px;display:inline-block;font-size:20px}::ng-deep .framework-list-title span.arrow:empty{display:none}::ng-deep .framework-list-search{position:relative;margin-bottom:8px}::ng-deep .framework-list-search 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 .framework-list-search input:focus{border-color:#1e5dd3}::ng-deep .framework-list-search i{position:absolute;left:17px;font-size:12px;font-weight:400;top:17px;pointer-events:none;color:#f1f1f1}::ng-deep .framework-list app-workflow-pagination .pagination-sec{padding-top:0!important}::ng-deep .framework-list-body{padding:28px 36px 12px;height:calc(100vh - 120px)}::ng-deep .framework-list-body .filter-card{display:flex;align-items:center;border:1px solid #dbdbdb;border-radius:4px;height:55px;padding:12px 15px;width:100%;justify-content:space-between;cursor:pointer}::ng-deep .framework-list-body .filter-card.active{box-shadow:0 3px 6px #1e5dd340}::ng-deep .framework-list-body .filter-card.active .counter{background:#f1f1f1;color:#161b2f}::ng-deep .framework-list-body .filter-card label{font-weight:600;text-transform:uppercase;color:#747576;line-height:16px;margin-left:0;font-size:11px;width:100%;pointer-events:none}::ng-deep .framework-list-body .filter-card p{line-height:16px;font-size:10px;color:#161b2f;font-weight:600;margin:0}::ng-deep .framework-list-body .filter-card span.counter{display:flex;height:32px;min-width:32px;border-radius:4px;background:#042e7d;color:#fff;font-size:11px;font-weight:600;justify-content:center;align-items:center;padding:0 5px;line-height:32px}::ng-deep .framework-list-body .filter-card .left{display:flex;flex-wrap:wrap}::ng-deep .framework-list-body .filter-card+.filter-card{margin-left:4px}::ng-deep .framework-list-body .filter-card-row{display:flex;padding-bottom:8px}::ng-deep .framework-list-table{position:relative;height:calc(100% - 116px);overflow:hidden;overflow-y:auto}::ng-deep .framework-list-table app-parent-table{height:calc(100vh - 260px);overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;display:block;padding-right:8px;margin-right:-8px}::ng-deep .framework-list-table app-parent-table::-webkit-scrollbar-track{background-color:#f1f1f1;position:absolute}::ng-deep .framework-list-table app-parent-table::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .framework-list-table app-parent-table::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .framework-list-table::-webkit-scrollbar-track{background-color:transparent}::ng-deep .framework-list-table::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .framework-list-table::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .framework-list-table.no-card{height:calc(100vh - 252px)}::ng-deep .framework-list-table:before{background:#fff;position:absolute;top:0;right:-8px;height:32px;width:8px;content:\"\"}"]
|
|
14542
14543
|
},] }
|
|
14543
14544
|
];
|
|
14544
14545
|
FrameworkListComponent.ctorParameters = () => [
|
|
@@ -26986,7 +26987,7 @@ class FrameworkResponsibilityTableComponent {
|
|
|
26986
26987
|
FrameworkResponsibilityTableComponent.decorators = [
|
|
26987
26988
|
{ type: Component, args: [{
|
|
26988
26989
|
selector: 'app-framework-responsibility-table',
|
|
26989
|
-
template: "<div class=\"framework-responsibility-table\">\r\n <div class=\"table-header\" *ngIf=\"loader || controlsList?.length\">\r\n <div class=\"table-row\">\r\n <div\r\n class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\">\r\n #</div>\r\n <div\r\n class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center name\">\r\n NAME</div>\r\n <div\r\n class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center action-button\">\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"table-body\">\r\n <lib-framework-table-loader *ngIf=\"loader\"></lib-framework-table-loader>\r\n <!-- when radio button was checked then active class was true -->\r\n <ng-container *ngIf=\"!loader\">\r\n <div class=\"table-row\" (click)=\"selectControl(control)\" [class.active]=\"currentSelectedControl?.id == control?.id\"\r\n *ngFor=\"let control of controlsList; let i =index;\">\r\n <div class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\">\r\n <div class=\"sr-no\" [appTooltip]=\"
|
|
26990
|
+
template: "<div class=\"framework-responsibility-table\">\r\n <div class=\"table-header\" *ngIf=\"loader || controlsList?.length\">\r\n <div class=\"table-row\">\r\n <div\r\n class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\">\r\n #</div>\r\n <div\r\n class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center name\">\r\n NAME</div>\r\n <div\r\n class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center action-button\">\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"table-body\">\r\n <lib-framework-table-loader *ngIf=\"loader\"></lib-framework-table-loader>\r\n <!-- when radio button was checked then active class was true -->\r\n <ng-container *ngIf=\"!loader\">\r\n <div class=\"table-row\" (click)=\"selectControl(control)\" [class.active]=\"currentSelectedControl?.id == control?.id\"\r\n *ngFor=\"let control of controlsList; let i =index;\">\r\n <div class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\">\r\n <div class=\"sr-no\" [appTooltip]=\" i+1\" placement=\"bottom\" delay=\"0\" type=\"black\"\r\n [tooltipMandatory]=\"true\">\r\n {{i+1}}\r\n <app-cs-radio [checked]=\"currentSelectedControl?.id == control?.id\">\r\n </app-cs-radio>\r\n </div>\r\n </div>\r\n <div class=\"table-column vx-pr-1 vx-d-flex vx-align-center name\">\r\n <!-- <div class=\"vx-avatar-group vx-mr-2\">\r\n <div class=\"vx-avatar md\" [appTooltip]=\"'Harshvardhan Kariwala'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\r\n <span class=\"blue\">hk</span>\r\n <img *ngIf=\"false\" src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/profile_pic/thumb/1591875227667_vcomply.png\" alt=\"\">\r\n </div>\r\n <div class=\"vx-avatar md\" [appTooltip]=\"'Harshvardhan Kariwala'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"true\">\r\n <span class=\"green\">hk</span>\r\n <img *ngIf=\"false\" src=\"https://s3-eu-west-1.amazonaws.com/eu.v-comply.com/profile_pic/thumb/1591875227667_vcomply.png\" alt=\"\">\r\n </div>\r\n </div> -->\r\n <div class=\"vx-d-block vx-w-100\">\r\n <div class=\"vx-d-flex vx-w-100\">\r\n <div class=\"responsibility-name vx-fs-12 vx-label-txt vx-pr-2\" [appTooltip]=\"control?.name\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">\r\n <!-- <span class=\"id vx-fs-10 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mr-1\">[CID-18087001]</span> -->\r\n {{control?.name}}\r\n </div>\r\n <button class=\"info-btn vx-fs-14 vx-txt-blue vx-m-0 vx-p-0 vx-d-flex vx-align-center\" appPopover (click)=\"responsibilityInfoBtn.popover()\" placement=\"left\"><i class=\"icons\"></i></button>\r\n <app-popover #responsibilityInfoBtn [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <div class=\"responsibility-info vx-p-3\">\r\n <!-- <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-mb-1\">FREQUENCY:</div>\r\n <div class=\"vx-fs-13 vx-paragraph-txt\">{{(control?.frequency) ?control?.frequency: 'N/A'}}</div>\r\n <div class=\"separator vx-mt-2 vx-mb-2\"></div> -->\r\n <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-mb-1\">OBJECTIVE:</div>\r\n <div class=\"vx-fs-12 vx-paragraph-txt\" [innerHtml]=\"(control?.objectives) ? control?.objectives: 'N/A'\"></div>\r\n <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-mb-1 vx-mt-1\">NOTES:</div>\r\n <div class=\"vx-fs-12 vx-paragraph-txt\" [innerHtml]=\"(control?.description) ? control?.description: 'N/A'\"></div>\r\n </div>\r\n </div>\r\n </app-popover>\r\n </div>\r\n <div class=\"within-part\">\r\n <span class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mr-1\">Frequency:</span>\r\n <span class=\"value\" [appTooltip]=\"(control?.frequency) ?control?.frequency: 'N/A'\" placement=\"bottom-left\" delay=\"0\" type=\"black\" [tooltipMandatory]=\"false\">{{(control?.frequency) ?control?.frequency: 'N/A'}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center vx-justify-end action-button\">\r\n <button\r\n class=\"assign-btn vx-fs-11 vx-fw-500 vx-txt-blue vx-p-0 vx-pl-2 vx-pr-2 vx-m-0 vx-tt-uppercase vx-d-flex vx-align-center vx-justify-center vx-lh-4\"\r\n (click)=\"assign(control)\">ASSIGN</button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>\r\n</div>",
|
|
26990
26991
|
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\");@import url(\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/avatars/avatars.css\");::ng-deep .framework-responsibility-table .table-header{background:#fff;border-radius:.125rem;position:sticky;top:0;z-index:1}::ng-deep .framework-responsibility-table .table-header .table-column{line-height:1rem!important;min-height:1.875rem!important}::ng-deep .framework-responsibility-table .table-body{position:relative}::ng-deep .framework-responsibility-table .table-body .table-row{background:#fff;border-radius:.125rem;border:1px solid #f1f1f1;transition:all .2s ease-in-out;margin-bottom:.25rem}::ng-deep .framework-responsibility-table .table-body .table-row:hover{transition:all .2s ease-in-out;box-shadow:0 3px 6px #00000029}::ng-deep .framework-responsibility-table .table-body .table-row:hover .table-column.serial .sr-no{background:#fff;font-size:0}::ng-deep .framework-responsibility-table .table-body .table-row:hover .table-column.serial .sr-no app-cs-radio{opacity:1}::ng-deep .framework-responsibility-table .table-body .table-row.active{border-color:#1e5dd3}::ng-deep .framework-responsibility-table .table-body .table-row.active .table-column.serial .sr-no{background:#fff;font-size:0}::ng-deep .framework-responsibility-table .table-body .table-row.active .table-column.serial .sr-no app-cs-radio{opacity:1}::ng-deep .framework-responsibility-table .table-row{display:flex;justify-content:space-between;position:relative}::ng-deep .framework-responsibility-table .table-row.row-clickable{cursor:pointer}::ng-deep .framework-responsibility-table .table-column{color:#747576;min-height:2.5rem;position:relative;width:100%}::ng-deep .framework-responsibility-table .table-column i.info{color:#1e5dd3;cursor:pointer}::ng-deep .framework-responsibility-table .table-column .sorting{cursor:pointer;position:relative;top:1px;left:-1px}::ng-deep .framework-responsibility-table .table-column.serial{width:2.5rem;max-width:2.5rem;justify-content:center}::ng-deep .framework-responsibility-table .table-column.serial .sr-no{width:1.25rem;background:#f8f8f8;-ms-writing-mode:tb-lr;writing-mode:vertical-lr;color:#747576;font-size:.625rem;font-weight:500;display:flex;height:2.5rem;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .framework-responsibility-table .table-column.serial .sr-no app-cs-radio{position:absolute;top:.75rem;left:.125rem;width:1rem;height:1rem;opacity:0;transition:all .2s ease-in-out}::ng-deep .framework-responsibility-table .table-column.serial .sr-no app-cs-radio .radio-item{position:absolute;top:0;left:0}::ng-deep .framework-responsibility-table .table-column.name{width:calc(100% - 7rem);min-width:calc(100% - 7rem)}::ng-deep .framework-responsibility-table .table-column.name .responsibility-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:calc(100% - 6.5rem)}::ng-deep .framework-responsibility-table .table-column.name button.info-btn{background:transparent;border-radius:0;border:none}::ng-deep .framework-responsibility-table .table-column.action-button{width:4.5rem;min-width:4.5rem}::ng-deep .framework-responsibility-table .table-column.action-button button.assign-btn{background:transparent;border-radius:.125rem;border:1px solid #f1f1f1}::ng-deep .responsibility-info{-webkit-animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 12px #1c5bd126;border-radius:.25rem;width:320px;max-height:220px;overflow:auto}::ng-deep .responsibility-info::-webkit-scrollbar-track{background-color:transparent}::ng-deep .responsibility-info::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .responsibility-info::-webkit-scrollbar-thumb{border-radius:3px;background-color:#dbdbdb;position:absolute}::ng-deep .responsibility-info .separator{background:#f1f1f1;width:100%;height:1px}@-webkit-keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.within-part{display:flex;align-items:center;padding-right:12px}.within-part .value{text-overflow:ellipsis!important;white-space:nowrap!important;overflow:hidden!important;font-size:11px!important;color:#747576!important}.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}"]
|
|
26991
26992
|
},] }
|
|
26992
26993
|
];
|
|
@@ -27013,6 +27014,22 @@ FrameworkTableLoaderComponent.decorators = [
|
|
|
27013
27014
|
];
|
|
27014
27015
|
FrameworkTableLoaderComponent.ctorParameters = () => [];
|
|
27015
27016
|
|
|
27017
|
+
class spaceTrimDirective {
|
|
27018
|
+
onKeyDown(event) {
|
|
27019
|
+
const input = event.target;
|
|
27020
|
+
let trimmed = input.value.trim();
|
|
27021
|
+
input.value = trimmed;
|
|
27022
|
+
}
|
|
27023
|
+
}
|
|
27024
|
+
spaceTrimDirective.decorators = [
|
|
27025
|
+
{ type: Directive, args: [{
|
|
27026
|
+
selector: '[spaceTrim]'
|
|
27027
|
+
},] }
|
|
27028
|
+
];
|
|
27029
|
+
spaceTrimDirective.propDecorators = {
|
|
27030
|
+
onKeyDown: [{ type: HostListener, args: ['blur', ['$event'],] }]
|
|
27031
|
+
};
|
|
27032
|
+
|
|
27016
27033
|
class VComplyWorkflowEngineModule {
|
|
27017
27034
|
static forRoot(environmentConfig) {
|
|
27018
27035
|
return {
|
|
@@ -27085,6 +27102,7 @@ VComplyWorkflowEngineModule.decorators = [
|
|
|
27085
27102
|
DragDropDirective,
|
|
27086
27103
|
AutofocusDirective,
|
|
27087
27104
|
ScrollInViewDirective,
|
|
27105
|
+
spaceTrimDirective,
|
|
27088
27106
|
ShortMergePipe,
|
|
27089
27107
|
SpaceBreakerPipe,
|
|
27090
27108
|
FormatHtmlPipe,
|
|
@@ -27154,5 +27172,5 @@ VComplyWorkflowEngineModule.decorators = [
|
|
|
27154
27172
|
* Generated bundle index. Do not edit.
|
|
27155
27173
|
*/
|
|
27156
27174
|
|
|
27157
|
-
export { VComplyWorkflowEngineModule, WorkflowEngineContainerComponent, WorkflowEngineService, UiKitService as ɵa, SnackBarService as ɵb, ReviewFrequencyComponent as ɵba, FrequencyContainerComponent as ɵbb, FrequencyDailyComponent as ɵbc, FrequencyWeeklyComponent as ɵbd, FrequencyMonthlyComponent as ɵbe, FrequencyQuarterlyComponent as ɵbf, FrequencyBiannualComponent as ɵbg, FrequencyAnnualComponent as ɵbh, FrequencyOneTimeComponent as ɵbi, FrequencyRandomComponent as ɵbj, FrequencyOnCompletionOfComponent as ɵbk, FrequencyOngoingComponent as ɵbl, FrequencyTopComponent as ɵbm, FrequencyLifecycleComponent as ɵbn, FrequencyDueDateComponent as ɵbo, FrequencyCheckboxListComponent as ɵbp, FrequencyRadioListComponent as ɵbq, GroupUsersListComponent as ɵbr, AddMultipleResponsibilityComponent as ɵbs, FrequencyBulkService as ɵbt, BulkResponsibilityViewComponent as ɵbu, CheckpointsPolicyContainerComponent as ɵbv, CheckpointsPolicyListComponent as ɵbw, CheckpointsPolicyQuestionsComponent as ɵbx, WorkflowSurveyFormComponent as ɵby, LogAnIssueComponent as ɵbz, AuthService as ɵc, LogIssueService as ɵca, FilterPipe as ɵcb, CheckboxListComponent as ɵcc, RadioListComponent as ɵcd, ListMapperPipe as ɵce, CreateDocumentsComponent as ɵcf, SearchPipe$1 as ɵcg, UserFilterPipe as ɵch, FrameworkListComponent as ɵci, ParentTableComponent as ɵcj, DataTypePipe as ɵck, CheckpointFloatingBarComponent as ɵcl, FormatAndEvidenceComponent as ɵcm, RiskClassificationComponent as ɵcn, DragDropDirective as ɵco, AutofocusDirective as ɵcp, ScrollInViewDirective as ɵcq,
|
|
27175
|
+
export { VComplyWorkflowEngineModule, WorkflowEngineContainerComponent, WorkflowEngineService, UiKitService as ɵa, SnackBarService as ɵb, ReviewFrequencyComponent as ɵba, FrequencyContainerComponent as ɵbb, FrequencyDailyComponent as ɵbc, FrequencyWeeklyComponent as ɵbd, FrequencyMonthlyComponent as ɵbe, FrequencyQuarterlyComponent as ɵbf, FrequencyBiannualComponent as ɵbg, FrequencyAnnualComponent as ɵbh, FrequencyOneTimeComponent as ɵbi, FrequencyRandomComponent as ɵbj, FrequencyOnCompletionOfComponent as ɵbk, FrequencyOngoingComponent as ɵbl, FrequencyTopComponent as ɵbm, FrequencyLifecycleComponent as ɵbn, FrequencyDueDateComponent as ɵbo, FrequencyCheckboxListComponent as ɵbp, FrequencyRadioListComponent as ɵbq, GroupUsersListComponent as ɵbr, AddMultipleResponsibilityComponent as ɵbs, FrequencyBulkService as ɵbt, BulkResponsibilityViewComponent as ɵbu, CheckpointsPolicyContainerComponent as ɵbv, CheckpointsPolicyListComponent as ɵbw, CheckpointsPolicyQuestionsComponent as ɵbx, WorkflowSurveyFormComponent as ɵby, LogAnIssueComponent as ɵbz, AuthService as ɵc, LogIssueService as ɵca, FilterPipe as ɵcb, CheckboxListComponent as ɵcc, RadioListComponent as ɵcd, ListMapperPipe as ɵce, CreateDocumentsComponent as ɵcf, SearchPipe$1 as ɵcg, UserFilterPipe as ɵch, FrameworkListComponent as ɵci, ParentTableComponent as ɵcj, DataTypePipe as ɵck, CheckpointFloatingBarComponent as ɵcl, FormatAndEvidenceComponent as ɵcm, RiskClassificationComponent as ɵcn, DragDropDirective as ɵco, AutofocusDirective as ɵcp, ScrollInViewDirective as ɵcq, spaceTrimDirective as ɵcr, ShortMergePipe as ɵcs, SpaceBreakerPipe as ɵct, FormatHtmlPipe as ɵcu, WithinDataPipe as ɵcv, ResponsibilityRiskSelectorComponent as ɵcw, ConditionalFocusDirective as ɵcx, ListLoaderComponent as ɵcy, ArrayFilterPipe as ɵcz, TokenDecoderService as ɵd, AuditCategoryListComponent as ɵda, DocumentSectionComponent as ɵdb, WorkflowAssessmentComponent as ɵdc, AssessmentService$2 as ɵdd, ImportAnAssessmentComponent as ɵde, AssessmentListComponent as ɵdf, AssessmentService$1 as ɵdg, RadioListWithPaginationComponent as ɵdh, LinkTreatmentLoaderComponent as ɵdi, AssessmentListLoaderComponent as ɵdj, AssessmentListSubLoaderComponent as ɵdk, UncategorizedFilterPipe as ɵdl, ProgramListingComponent as ɵdm, WorkflowProgramComponent as ɵdn, ProgramsService as ɵdo, RolesListComponent as ɵdp, FrameworkListTableComponent as ɵdq, FrameworkResponsibilityTableComponent as ɵdr, FrameworkTableLoaderComponent as ɵds, ArrayConcatPipe as ɵdt, CreateAssessmentModule as ɵdu, CreateAssessmentContainerComponent as ɵdv, EditorService as ɵdw, DialogService as ɵdx, DialogModule as ɵdy, DialogComponent as ɵdz, Configurations as ɵe, InsertionDirective as ɵea, DialogRef as ɵeb, DialogConfig as ɵec, QuestionTypeComponent as ɵed, AddPageDetailsComponent as ɵee, AssessmentSettingsComponent as ɵef, ResultCriteriaService as ɵeg, AddSegmentPopupComponent as ɵeh, AddResponseSetPopupComponent as ɵei, EditorWrapperComponent as ɵej, ValidatorService as ɵek, QuickSettingsComponent as ɵel, SingleLineEditorComponent as ɵem, ResponseSelectorComponent as ɵen, MoveComponent as ɵeo, LogicComponent as ɵep, AddLogicComponent as ɵeq, ToolkitComponent as ɵer, ErrorMessagePipe as ɵes, QuestionFilterPipe as ɵet, QuestionParserPipe as ɵeu, FormatterPipe as ɵev, SettingAnonymousComponent as ɵew, SettingResponseSegmentComponent as ɵex, PageHeaderComponent as ɵey, WelcomeThankyouComponent as ɵez, WorkflowRiskComponent as ɵf, CurrentPageQuestionPipe as ɵfa, QuestionPageFilterPipe as ɵfb, TypeOfPipe as ɵfc, TooltipModule as ɵfd, ToolTipDirective as ɵfe, PopoverModule as ɵff, PopoverComponent as ɵfg, PopoverService as ɵfh, PopoverDirective as ɵfi, PopoverEventDirective as ɵfj, PopoverLongpressDirective as ɵfk, FormgroupModule$1 as ɵfl, CsCheckboxComponent$1 as ɵfm, CsRadioComponent$1 as ɵfn, CsSwitchComponent$1 as ɵfo, CsRadioGroupComponent$1 as ɵfp, CsSelectComponent$2 as ɵfq, PascalPipe$1 as ɵfr, CsCheckboxIndeterminateComponent$1 as ɵfs, NoDataModule$1 as ɵft, NoDataComponent$1 as ɵfu, BuildModule as ɵfv, MultipleChoiceComponent as ɵfw, CheckboxComponent$1 as ɵfx, ImageChoiceComponent as ɵfy, StarRatingComponent as ɵfz, AddRiskService as ɵg, MatrixDropdownComponent as ɵga, DropdownComponent as ɵgb, MatrixRatingScaleComponent as ɵgc, RankingComponent as ɵgd, SliderComponent as ɵge, MultipleTextboxComponent as ɵgf, DateTimeComponent as ɵgg, ChoiceSettingsPanelComponent as ɵgh, WelcomeComponent$1 as ɵgi, ThankYouComponent$1 as ɵgj, WeightageSelectorComponent as ɵgk, FormgroupModule as ɵgl, CsCheckboxComponent as ɵgm, CsRadioComponent as ɵgn, CsSwitchComponent as ɵgo, CsRadioGroupComponent as ɵgp, CsSelectComponent as ɵgq, PascalPipe as ɵgr, SearchMultiSelectPipe as ɵgs, ClickOutsideDirective as ɵgt, CsCheckboxIndeterminateComponent as ɵgu, PreviewModule as ɵgv, PreviewWrapperComponent as ɵgw, PreviewMultipleChoiceComponent as ɵgx, PreviewCheckboxComponent as ɵgy, PreviewImageChoiceComponent as ɵgz, WorkflowComplianceComponent as ɵh, PreviewStarRatingComponent as ɵha, PreviewSingleTextboxComponent as ɵhb, PreviewCommentBoxComponent as ɵhc, PreviewMatrixDropdownComponent as ɵhd, PreviewDropdownComponent as ɵhe, PreviewMatrixRatingScaleComponent as ɵhf, PreviewRankingComponent as ɵhg, PreviewSliderComponent as ɵhh, PreviewMultipleTextboxComponent as ɵhi, PreviewDateTimeComponent as ɵhj, PreviewFileUploadComponent as ɵhk, WelcomeComponent as ɵhl, ThankYouComponent as ɵhm, SelectModule as ɵhn, CsSelectComponent$1 as ɵho, SelectService as ɵhp, CsOptionComponent as ɵhq, AssessmentPreviewModule as ɵhr, CheckboxQuestionComponent as ɵhs, DateTimeComponent$1 as ɵht, DeviceComponent as ɵhu, FileUploadComponent as ɵhv, PreviewComponent as ɵhw, PreviewContainerComponent as ɵhx, QuickSettingsComponent$1 as ɵhy, RadioQuestionComponent as ɵhz, ResponsibilityService as ɵi, SelectQuestionComponent as ɵia, SingleTextboxComponent as ɵib, PageHeaderComponent$1 as ɵic, WelcomeComponent$2 as ɵid, LogicQuestionsModule as ɵie, LogicMultipleChoiceComponent as ɵif, LogicCheckboxComponent as ɵig, LogicImageChoiceComponent as ɵih, LogicStarRatingComponent as ɵii, LogicSingleTextboxComponent as ɵij, LogicCommentBoxComponent as ɵik, LogicDropdownComponent as ɵil, LogicRankingComponent as ɵim, LogicSliderComponent as ɵin, LogicMultipleTextboxComponent as ɵio, LogicDateTimeComponent as ɵip, EditorLoaderModule as ɵiq, EditorLoaderComponent as ɵir, LineLoaderModule as ɵis, LineLoaderComponent as ɵit, VLoaderModule as ɵiu, LoaderComponent$1 as ɵiv, LoaderInlineComponent as ɵiw, SmileyDialogModule as ɵix, SmileyDialogComponent as ɵiy, SnackBarModule as ɵiz, FrequencyService as ɵj, SnackBarComponent as ɵja, SmileyDialogInlineModule as ɵjb, SmileyDialogInlineComponent as ɵjc, ClickOutsideModule as ɵjd, ClickOutsideDirective$1 as ɵje, PopoverHoverModule as ɵjf, PopoverHoverComponent as ɵjg, PopoverHoverService as ɵjh, PopoverHoverDirective as ɵji, PaginationModule$1 as ɵjj, PaginationComponent$1 as ɵjk, ActionDialogModule as ɵjl, DeleteComponent as ɵjm, DeactivateComponent as ɵjn, ActiveComponent as ɵjo, DuplicateComponent as ɵjp, CreateProgramUiModule as ɵjq, TabSelector as ɵjr, TickMarkComponent as ɵjs, FormFieldComponent as ɵjt, FilePillComponent as ɵju, InputWithPillComponent as ɵjv, SwitchComponent as ɵjw, InputTrimDirective as ɵjx, RoleListComponent as ɵjy, CheckboxComponent as ɵjz, WorkflowPolicyComponent as ɵk, VuiFloatingBarComponent as ɵka, SearchPipe as ɵkb, UserGroupListComponent as ɵkc, ListToIdPipe as ɵkd, RefDisconnectPipe as ɵke, AssessmentPickerComponent as ɵkf, AssessmentService as ɵkg, AssessmentLoaderComponent as ɵkh, AssessmentSubLoaderComponent as ɵki, Pagination as ɵkj, DefineFrameworkListingComponent as ɵkk, FrameworkService as ɵkl, CustomFieldComponent as ɵkm, LoaderComponent as ɵkn, LoaderFrameworkComponent as ɵko, PagerPipe as ɵkp, CategoryAllSelectPipe as ɵkq, SubCatIndeterPipe as ɵkr, SearchNewPipe as ɵks, SelectedAssessmentPipe as ɵkt, AssessmentResolverPipe as ɵku, PaginationModule as ɵkv, PaginationComponent as ɵkw, NoDataModule as ɵkx, NoDataComponent as ɵky, PolicyService as ɵl, MoreOptionComponent as ɵm, OwnerListComponent as ɵn, UserRadioListComponent as ɵo, CategoryListComponent as ɵp, CategoryMultiSelectComponent as ɵq, FloatingBarComponent as ɵr, ResponsibilityCentersListComponent as ɵs, WorkflowPaginationComponent as ɵt, AddMultipleRiskComponent as ɵu, BulkViewComponent as ɵv, CheckpointsComponent as ɵw, ConfirmationAlertComponent as ɵx, CheckpointsQuestionsComponent as ɵy, CheckpointsListComponent as ɵz };
|
|
27158
27176
|
//# sourceMappingURL=vcomply-workflow-engine.js.map
|