vc-create-dashboard 2.0.4 → 2.0.8
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/create-dashboard.umd.js +92 -13
- package/bundles/create-dashboard.umd.js.map +1 -1
- package/create-dashboard.d.ts +2 -0
- package/create-dashboard.metadata.json +1 -1
- package/esm2015/create-dashboard.js +3 -1
- package/esm2015/create-dashboard.ngsummary.json +1 -1
- package/esm2015/lib/create-dashboard-container/create-dashboard.component.js +26 -9
- package/esm2015/lib/create-dashboard-container/create-dashboard.component.ngfactory.js +23 -14
- package/esm2015/lib/create-dashboard-container/create-dashboard.component.ngsummary.json +1 -1
- package/esm2015/lib/create-dashboard-container/create-dashboard.module.js +4 -2
- package/esm2015/lib/create-dashboard-container/create-dashboard.module.ngfactory.js +3 -2
- package/esm2015/lib/create-dashboard-container/create-dashboard.module.ngsummary.json +1 -1
- package/esm2015/lib/ui-kit/floating-bar/floating-bar.component.js +3 -3
- package/esm2015/lib/ui-kit/floating-bar/floating-bar.component.ngfactory.js +3 -3
- package/esm2015/lib/ui-kit/no-data/no-data.component.js +2 -2
- package/esm2015/lib/ui-kit/no-data/no-data.component.ngfactory.js +3 -3
- package/esm2015/lib/ui-kit/pagination/pagination.component.js +1 -1
- package/esm2015/lib/ui-kit/smiley-dialog/smiley-dialog.component.js +45 -0
- package/esm2015/lib/ui-kit/smiley-dialog/smiley-dialog.component.ngfactory.js +28 -0
- package/esm2015/lib/ui-kit/smiley-dialog/smiley-dialog.component.ngsummary.json +1 -0
- package/esm2015/lib/ui-kit/smiley-dialog/smiley-dialog.module.js +13 -0
- package/esm2015/lib/ui-kit/smiley-dialog/smiley-dialog.module.ngfactory.js +12 -0
- package/esm2015/lib/ui-kit/smiley-dialog/smiley-dialog.module.ngsummary.json +1 -0
- package/esm2015/lib/ui-kit/tooltip/tooltip.directive.js +2 -2
- package/fesm2015/create-dashboard.js +87 -15
- package/fesm2015/create-dashboard.js.map +1 -1
- package/lib/create-dashboard-container/create-dashboard.component.d.ts +3 -0
- package/lib/ui-kit/smiley-dialog/smiley-dialog.component.d.ts +14 -0
- package/lib/ui-kit/smiley-dialog/smiley-dialog.component.ngfactory.d.ts +1 -0
- package/lib/ui-kit/smiley-dialog/smiley-dialog.module.d.ts +2 -0
- package/lib/ui-kit/smiley-dialog/smiley-dialog.module.ngfactory.d.ts +3 -0
- package/package.json +1 -1
|
@@ -850,6 +850,7 @@
|
|
|
850
850
|
min: this.getCurrentDate()
|
|
851
851
|
};
|
|
852
852
|
this.toDatePickerConfig = {};
|
|
853
|
+
this.smileyMessage = '';
|
|
853
854
|
this.submitted = false;
|
|
854
855
|
}
|
|
855
856
|
CreateDashboardComponent.prototype.ngOnChanges = function () {
|
|
@@ -857,6 +858,10 @@
|
|
|
857
858
|
this.listDetails.nonRemovableUsersList.push(this.createdBy);
|
|
858
859
|
}
|
|
859
860
|
};
|
|
861
|
+
CreateDashboardComponent.prototype.onKeydownHandler = function (event) {
|
|
862
|
+
this.close.emit({ mode: 'discard' });
|
|
863
|
+
this.isSmiley = false;
|
|
864
|
+
};
|
|
860
865
|
CreateDashboardComponent.prototype.ngOnInit = function () {
|
|
861
866
|
var _this = this;
|
|
862
867
|
this.animation = true;
|
|
@@ -1154,7 +1159,8 @@
|
|
|
1154
1159
|
}
|
|
1155
1160
|
});
|
|
1156
1161
|
this.dashboardForm.configureWidget.forEach(function (savedWidget) {
|
|
1157
|
-
|
|
1162
|
+
var index = data.findIndex(function (dataElement) { return dataElement.id == savedWidget.widget_code; });
|
|
1163
|
+
if (index == -1) {
|
|
1158
1164
|
savedWidget.state = 'INACTIVE';
|
|
1159
1165
|
if (savedWidget.sub_widgets.length > 0) {
|
|
1160
1166
|
savedWidget.subWidgets.forEach(function (saveSubWidget) {
|
|
@@ -1336,8 +1342,13 @@
|
|
|
1336
1342
|
if (this.mode == 'CREATE') {
|
|
1337
1343
|
this.createDashboardService.submitDashboard(payload).subscribe(function (res) {
|
|
1338
1344
|
_this.vLoader = false;
|
|
1339
|
-
|
|
1340
|
-
_this.
|
|
1345
|
+
// this.snackBar.show('The dashboard has been created.');
|
|
1346
|
+
_this.isSmiley = true;
|
|
1347
|
+
_this.smileyMessage = 'The dashboard has been created.';
|
|
1348
|
+
setTimeout(function () {
|
|
1349
|
+
_this.isSmiley = false;
|
|
1350
|
+
_this.close.emit({ mode: 'created', id: res._id });
|
|
1351
|
+
}, 3000);
|
|
1341
1352
|
}, function (err) {
|
|
1342
1353
|
if (err.status === 409) {
|
|
1343
1354
|
_this.snackBar.show('A dashboard with this name already exists. Specify a different name for the dashboard.');
|
|
@@ -1355,8 +1366,13 @@
|
|
|
1355
1366
|
this.createDashboardService.updateDashboard(this.dashboardId, payload).subscribe({
|
|
1356
1367
|
next: function (res) {
|
|
1357
1368
|
_this.vLoader = false;
|
|
1358
|
-
|
|
1359
|
-
_this.
|
|
1369
|
+
// this.snackBar.show('The dashboard has been updated');
|
|
1370
|
+
_this.isSmiley = true;
|
|
1371
|
+
_this.smileyMessage = 'The dashboard has been updated';
|
|
1372
|
+
setTimeout(function () {
|
|
1373
|
+
_this.isSmiley = false;
|
|
1374
|
+
_this.close.emit({ mode: 'updated' });
|
|
1375
|
+
}, 3000);
|
|
1360
1376
|
},
|
|
1361
1377
|
error: function (error) {
|
|
1362
1378
|
console.error(error);
|
|
@@ -1494,7 +1510,7 @@
|
|
|
1494
1510
|
CreateDashboardComponent.decorators = [
|
|
1495
1511
|
{ type: i0.Component, args: [{
|
|
1496
1512
|
selector: 'app-create-dashboard',
|
|
1497
|
-
template: "<app-snack-bar></app-snack-bar>\r\n<div class=\"create-dashboard\" *ngIf=\"!openConfigureWidgets\">\r\n <div class=\"create-dashboard-container vx-d-flex vx-justify-end\" [class.animate-slideInRight]=\"animation\">\r\n <div class=\"more-option\" *ngIf=\"activeSelector && activeSelector!=='name'\">\r\n <app-user-list *ngIf=\"activeSelector==='whoCanView'\"\r\n (saveSelectedUsers)=\"saveSelectedList('whoCanView',$event)\"\r\n (closeUserList)=\"activateSelector('', false)\" [totalPages]=\"totalPages\" [totalList]=\"totalList\"\r\n [listDetails]=\"listDetails\"></app-user-list>\r\n <app-responsibility-center *ngIf=\"activeSelector==='rcList'\"\r\n [responsibilityCentersList]=\"responsibilityCentersList\" [radioSelection]=\"false\"\r\n [selectedResponsibilityCenters]=\"dashboardForm.selectedResponsibilityCenters\" [rcIdKey]=\"'item_id'\"\r\n (saveSelectedList)=\"saveSelectedList('rc',$event)\" (closeRcList)=\"activateSelector('', false)\">\r\n </app-responsibility-center>\r\n <app-categories *ngIf=\"activeSelector==='responsibilityCategories'\"\r\n [categoryList]=\"responsibilityCategoriesTree\" [allCategories]=\"allComplianceCategories\"\r\n [categoryIdKey]=\"'category_id'\" [selectedCategories]=\"dashboardForm.selectedResponsibilityCategories\"\r\n (saveSelectedCategory)=\"saveSelectedList('responsibilityCategories',$event)\"\r\n (closeCategoriesList)=\"activateSelector('', false)\"></app-categories>\r\n <app-risk-categories *ngIf=\"activeSelector==='riskCategories'\" [categoryList]=\"riskCategoryList\"\r\n [allCategories]=\"allRiskCategories\" [categoryIdKey]=\"'category_id'\"\r\n [selectedCategories]=\"dashboardForm.selectedRiskCategories\"\r\n (saveSelectedCategory)=\"saveSelectedList('riskCategory',$event)\"\r\n (closeCategoriesList)=\"activateSelector('', false)\"></app-risk-categories>\r\n\r\n <app-frequency *ngIf=\"activeSelector==='frequency'\" (closeFrequencyPopup)=\"activateSelector('', false)\"\r\n (saveFrequency)=\"saveFrequency($event)\" [savedFrequencyTab]=\"dashboardForm.selectedFrequencyType\"\r\n [selectedDate]=\"dashboardForm.frequencyDate\" [savedFrequencies]=\"dashboardForm.selectedFrequencies\">\r\n </app-frequency>\r\n </div>\r\n <div class=\"vx-dialog-container side-dialog\">\r\n\r\n <app-loader-inline *ngIf=\"vLoader\"></app-loader-inline>\r\n <div class=\"form-group\" [class.disabled]=\"disabled\">\r\n <div class=\"vx-dialog-body-container\" (scroll)=\"animateImage()\">\r\n <div class=\"form-group-row\" [class.disabled]=\"activeSelector && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img src=\"./assets/images/what.svg\"\r\n *ngIf=\"!dashboardForm.dashboardName || activeSelector === 'name'\" alt=\"\">\r\n <svg class=\"checkIcon\" *ngIf=\"dashboardForm.dashboardName && activeSelector !== 'name'\"\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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Dashboard Name<span class=\"required\">*</span></label>\r\n <div class=\"vx-input-group\">\r\n <input type=\"text\" placeholder=\"Add dashboard name (Max limit: 30 characters).\"\r\n [(ngModel)]=\"dashboardForm.dashboardName\" (keydown)=\"activeSelector = 'name'\"\r\n (focusin)=\"activateSelector('name',true)\"\r\n (focusout)=\"activateSelector('name',false)\">\r\n <span class=\"counter\" *ngIf=\"dashboardForm?.dashboardName?.length > 0\">{{30 -\r\n dashboardForm.dashboardName.length}}</span>\r\n </div>\r\n <p class=\"vx-txt-error\" [appScrollInView]=\"true\"\r\n *ngIf=\"submitted &&( dashboardForm?.dashboardName?.length>30 || !dashboardForm?.dashboardName)\">\r\n {{(dashboardForm.dashboardName.length>30)?'You have exceeded the maximum character\r\n limit of 30 characters.':'Please enter a name for this Dashboard.'}} </p>\r\n <div class=\"vx-input-group\">\r\n <marx-editor [editorConfig]=\"dashboardDescription\"\r\n [(ngModel)]=\"dashboardForm.dashboardDescriptionText\"></marx-editor>\r\n <span class=\"counter\"\r\n *ngIf=\"dashboardForm?.dashboardDescriptionText?.length > 0\">{{250 -\r\n dashboardForm?.dashboardDescriptionText.length}}</span>\r\n </div>\r\n <p class=\"vx-txt-error\" [appScrollInView]=\"true\"\r\n *ngIf=\"submitted && dashboardForm?.dashboardDescriptionText?.length>250\">\r\n You have exceeded the maximum character limit of 250 characters.\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'whoCanView'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'whoCanView' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img src=\"./assets/images/who.svg\"\r\n *ngIf=\"dashboardForm?.selectedViewers?.length==0 || activeSelector === 'whoCanView'\"\r\n alt=\"\">\r\n <svg class=\"checkIcon\"\r\n *ngIf=\"dashboardForm?.selectedViewers?.length>0 && activeSelector !== 'whoCanView'\"\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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Who can view this dashboard?<span\r\n class=\"required\">*</span></label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedViewers?.length==0\">\r\n <input type=\"text\" placeholder=\"Who can view this dashboard?\" readonly\r\n (click)=\"activateSelector('whoCanView', true)\">\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedViewers?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let user of dashboardForm?.selectedViewers?.slice(0,2)\"><i\r\n *ngIf=\"!listDetails.nonRemovableUsersList.includes(user.member_id)\"\r\n class=\"icons\" (click)=\"remove('whoCanView',user)\"></i>\r\n <span class=\"value\">{{user.member_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\" *ngIf=\"dashboardForm?.selectedViewers?.length > 2\"\r\n type=\"button\" appPopover (click)=\"userList.popover()\" placement=\"right\">+\r\n {{dashboardForm?.selectedViewers?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'user'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('whoCanView',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #userList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let user of dashboardForm?.selectedViewers | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\"\r\n *ngIf=\"!listDetails.nonRemovableUsersList.includes(user.member_id)\"\r\n (click)=\"remove('whoCanView',user)\"></i>\r\n {{ user?.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 <div class=\"form-group-row\" [class.active]=\"activeSelector === 'rcList'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'rcList' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length==0 || activeSelector === 'rcList'\"\r\n src=\"./assets/images/responsibility-center.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length>0 && activeSelector !== 'rcList'\"\r\n class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RESPONSIBILITY CENTER(S)</label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length==0\">\r\n <div class=\"custom-input\"\r\n aria-placeholder=\"Select the Responsibility Center(s) that you would like displayed in the Dashboard, if any.\"\r\n (click)=\"activateSelector('rcList', true)\" [class.error]=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\">\r\n </div>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let rc of dashboardForm?.selectedResponsibilityCenters?.slice(0,2)\"><i\r\n class=\"icons\" (click)=\"remove('rc',rc)\"></i>\r\n <span class=\"value\">{{rc.item_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\"\r\n *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length > 2\"\r\n type=\"button\" appPopover (click)=\"rcList.popover()\" placement=\"right\">+\r\n {{dashboardForm?.selectedResponsibilityCenters?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'rcList'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('rcList',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #rcList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let rc of dashboardForm?.selectedResponsibilityCenters | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\" (click)=\"remove('rc',rc)\"></i>\r\n {{ rc?.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 <div class=\"form-group-row\" [class.active]=\"activeSelector === 'responsibilityCategories'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'responsibilityCategories' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length==0 || activeSelector === 'responsibilityCategories'\"\r\n src=\"./assets/images/category.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length>0 && activeSelector !== 'responsibilityCategories'\"\r\n class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RESPONSIBILITY CATEGORIES</label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length==0\">\r\n <div class=\"custom-input\"\r\n aria-placeholder=\"Select the responsibility category or categories that this responsibility relates to.\"\r\n (click)=\"activateSelector('responsibilityCategories', true)\" [class.error]=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\"></div>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let rCategory of dashboardForm?.selectedResponsibilityCategories?.slice(0,2)\"><i\r\n class=\"icons\"\r\n (click)=\"remove('responsibilityCategories',rCategory)\"></i>\r\n <span class=\"value\">{{rCategory.item_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\"\r\n *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length > 2\"\r\n type=\"button\" appPopover (click)=\"rCategoryList.popover()\"\r\n placement=\"right\">+\r\n {{dashboardForm?.selectedResponsibilityCategories?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'responsibilityCategories'\" class=\"edit\"\r\n type=\"button\" (click)=\"activateSelector('responsibilityCategories',true)\">\r\n <i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #rCategoryList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let rCategory of dashboardForm?.selectedResponsibilityCategories | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\"\r\n (click)=\"remove('responsibilityCategories',rCategory)\"></i>\r\n {{ rCategory?.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 <div class=\"form-group-row\" [class.active]=\"activeSelector === 'riskCategories'\"\r\n *ngIf=\"showRiskCategory\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'riskCategories' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.selectedRiskCategories?.length==0 || activeSelector === 'riskCategories'\"\r\n src=\"./assets/images/category.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedRiskCategories?.length>0 && activeSelector !== 'riskCategories'\"\r\n class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RISK CATEGORIES</label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedRiskCategories?.length==0\">\r\n <div class=\"custom-input\"\r\n aria-placeholder=\"Select the Risk Categories that you would like displayed in the Dashboard, if any.\"\r\n (click)=\"activateSelector('riskCategories', true)\" [class.error]=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\"></div>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedRiskCategories?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let riskCategory of dashboardForm?.selectedRiskCategories?.slice(0,2)\"><i\r\n class=\"icons\"\r\n (click)=\"remove('riskCategory',riskCategory)\"></i>\r\n <span class=\"value\">{{riskCategory.category_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\" *ngIf=\"dashboardForm?.selectedRiskCategories?.length > 2\"\r\n type=\"button\" appPopover (click)=\"riskList.popover()\" placement=\"right\">+\r\n {{dashboardForm?.selectedRiskCategories?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'riskCategories'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('riskCategories',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #riskList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let riskCategory of dashboardForm?.selectedRiskCategories | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\"\r\n (click)=\"remove('riskCategory',riskCategory)\"></i>\r\n {{ riskCategory?.category_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 <div class=\"form-group-row\" [class.disabled]=\" activeSelector && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.displayCriteria?.length==0\" src=\"./assets/images/who.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.displayCriteria?.length>0 \" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">DISPLAY CRITERIA</label>\r\n <div class=\"radio-group\" *ngIf=\"showCriteria\" >\r\n <app-cs-radio [checked]=\"dashboardForm.displayCriteria=='or'\"\r\n (checkedEvent)=\"dashboardForm.displayCriteria='or'\">\r\n Those Items that have been assigned to either the selected Responsibility Center(s) or the selected Categories.</app-cs-radio>\r\n\r\n <app-cs-radio [checked]=\"dashboardForm.displayCriteria=='and'\"\r\n (checkedEvent)=\"dashboardForm.displayCriteria='and'\">\r\n Those Items that have been assigned to both the selected Responsibility Center(s) and the selected Categories.</app-cs-radio>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-group-row\" \r\n [class.disabled]=\" activeSelector && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"!dashboardForm?.selectedFromDate || !dashboardForm?.selectedToDate\" src=\"./assets/images/when.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedFromDate && dashboardForm?.selectedToDate\" class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">TIMEFRAME</label>\r\n <label class=\"vx-control-panel-sub-label\">Select how long you would like the information\r\n selected to be displayed for. If no timeframe is selected, the information will be\r\n displayed permanently.</label>\r\n <div class=\"input-group vx-d-flex vx-justify-between\">\r\n <div class=\"date-select\">\r\n <i class=\"icons\"></i>\r\n <input type=\"text\"\r\n [value]=\"dashboardForm.selectedFromDate | date: 'dd MMM yyyy'\"\r\n [placeholder]=\"'From'\" (click)=\"openFromDatePicker()\" readonly>\r\n <dp-date-picker #fromDatePicker [(ngModel)]=\"dashboardForm.selectedFromDate\"\r\n placeholder=\"Select Date\"\r\n (onSelect)=\"closeFromDatePicker(); datePickerOverlay = false\"\r\n [config]=\"fromDatePickerConfig\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeFromDatePicker()\" *ngIf=\"datePickerOverlay\">\r\n </div>\r\n </div>\r\n <div class=\"date-select\" *ngIf=\"!hideToDate\" [class.disabled]=\"!dashboardForm?.selectedFromDate \">\r\n <i class=\"icons\"></i>\r\n <input type=\"text\" [value]=\"dashboardForm.selectedToDate | date: 'dd MMM yyyy'\"\r\n [placeholder]=\"'To'\" (click)=\"openToDatePicker()\" readonly>\r\n <dp-date-picker #toDatePicker [(ngModel)]=\"dashboardForm.selectedToDate\"\r\n placeholder=\"Select Date\"\r\n (onSelect)=\"closeToDatePicker(); datePickerOverlay = false\"\r\n [config]=\"toDatePickerConfig\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeToDatePicker()\" *ngIf=\"datePickerOverlay\">\r\n </div>\r\n </div>\r\n </div>\r\n <p class=\"vx-txt-error\" [appScrollInView]=\"true\"\r\n *ngIf=\"submitted && (dashboardForm.selectedFromDate && (!dashboardForm.selectedToDate))\">\r\n Select a time-frame.</p>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'frequency'\" \r\n [class.disabled]=\" activeSelector && activeSelector !== 'frequency' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"!dashboardForm.frequencyMessage\" src=\"./assets/images/send-resolution.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm.frequencyMessage\" class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">\r\n Email Summaries </label>\r\n <label class=\"vx-control-panel-sub-label\">\r\n If you would like to send a summary of this Dashboard,\r\n please select a frequency(By default VComply sends a weekly Summary).\r\n </label>\r\n <div class=\"select\" *ngIf=\"!dashboardForm.frequencyMessage\">\r\n <input type=\"text\" placeholder=\"Email Summaries\" readonly\r\n (click)=\"activateSelector('frequency', true)\">\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm.frequencyMessage\">\r\n <div class=\"left frequency-left\" [innerHTML]=\"dashboardForm.frequencyMessage\" [arTooltip]=\"dashboardForm.frequencyMessage\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory] =\"true\">\r\n </div>\r\n\r\n <button *ngIf=\"dashboardForm.frequencyMessage\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('frequency',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"button-block\">\r\n <button class=\"vx-btn block primary\" [disabled]=\"activeSelector && activeSelector !== 'name'\" (click)=\"configureDashboard()\">Next:\r\n Configure\r\n Widgets</button>\r\n </div>\r\n </div>\r\n\r\n\r\n <button class=\"close-dialog\" type=\"button\" [disabled]=\"activeSelector && activeSelector !== 'name'\" (click)=\"close.emit({mode:'discard'})\">\r\n <i class=\"icons\"></i>\r\n </button>\r\n <div class=\"global-confirmation-alert\" *ngIf=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\">\r\n <div class=\"global-confirmation-alert-top\">\r\n <span class=\"icon-block\">\r\n <i class=\"icons\"></i>\r\n </span>\r\n <p class=\"text\" *ngIf=\"showRiskCategory\">Select a Responsibility Center, Responsibility Category or Risk Category.</p>\r\n <p class=\"text\" *ngIf=\"!showRiskCategory\">Select a Responsibility Center or Responsibility Category.</p>\r\n\r\n </div>\r\n <div class=\"global-confirmation-alert-bottom\">\r\n <p class=\"message\"></p>\r\n <div class=\"button-group\">\r\n <button class=\"fill\" type=\"button\" (click)=\"submitted=false\">OKAY</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<app-configure-widgets *ngIf=\"openConfigureWidgets\"\r\n [showRisk]=\"showRiskWidgets\" [showCompliance]=\"showComplianceWidgets\" [selectedWidgetsData]=\"selectedWidgets\"\r\n (widgetsDataModified)=\"setSelectedWidgets($event)\" (closeConfigureWidgets)=\"closeConfigureWidgets($event)\">\r\n</app-configure-widgets>",
|
|
1513
|
+
template: "<app-snack-bar></app-snack-bar>\r\n<div class=\"create-dashboard\" *ngIf=\"!openConfigureWidgets\">\r\n <div class=\"create-dashboard-container vx-d-flex vx-justify-end\" [class.animate-slideInRight]=\"animation\">\r\n <div class=\"more-option\" *ngIf=\"activeSelector && activeSelector!=='name'\">\r\n <app-user-list *ngIf=\"activeSelector==='whoCanView'\"\r\n (saveSelectedUsers)=\"saveSelectedList('whoCanView',$event)\"\r\n (closeUserList)=\"activateSelector('', false)\" [totalPages]=\"totalPages\" [totalList]=\"totalList\"\r\n [listDetails]=\"listDetails\"></app-user-list>\r\n <app-responsibility-center *ngIf=\"activeSelector==='rcList'\"\r\n [responsibilityCentersList]=\"responsibilityCentersList\" [radioSelection]=\"false\"\r\n [selectedResponsibilityCenters]=\"dashboardForm.selectedResponsibilityCenters\" [rcIdKey]=\"'item_id'\"\r\n (saveSelectedList)=\"saveSelectedList('rc',$event)\" (closeRcList)=\"activateSelector('', false)\">\r\n </app-responsibility-center>\r\n <app-categories *ngIf=\"activeSelector==='responsibilityCategories'\"\r\n [categoryList]=\"responsibilityCategoriesTree\" [allCategories]=\"allComplianceCategories\"\r\n [categoryIdKey]=\"'category_id'\" [selectedCategories]=\"dashboardForm.selectedResponsibilityCategories\"\r\n (saveSelectedCategory)=\"saveSelectedList('responsibilityCategories',$event)\"\r\n (closeCategoriesList)=\"activateSelector('', false)\"></app-categories>\r\n <app-risk-categories *ngIf=\"activeSelector==='riskCategories'\" [categoryList]=\"riskCategoryList\"\r\n [allCategories]=\"allRiskCategories\" [categoryIdKey]=\"'category_id'\"\r\n [selectedCategories]=\"dashboardForm.selectedRiskCategories\"\r\n (saveSelectedCategory)=\"saveSelectedList('riskCategory',$event)\"\r\n (closeCategoriesList)=\"activateSelector('', false)\"></app-risk-categories>\r\n\r\n <app-frequency *ngIf=\"activeSelector==='frequency'\" (closeFrequencyPopup)=\"activateSelector('', false)\"\r\n (saveFrequency)=\"saveFrequency($event)\" [savedFrequencyTab]=\"dashboardForm.selectedFrequencyType\"\r\n [selectedDate]=\"dashboardForm.frequencyDate\" [savedFrequencies]=\"dashboardForm.selectedFrequencies\">\r\n </app-frequency>\r\n </div>\r\n <div class=\"vx-dialog-container side-dialog\">\r\n\r\n <app-loader-inline *ngIf=\"vLoader\"></app-loader-inline>\r\n <div class=\"form-group\" [class.disabled]=\"disabled\">\r\n <div class=\"vx-dialog-body-container\" (scroll)=\"animateImage()\">\r\n <div class=\"form-group-row\" [class.disabled]=\"activeSelector && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img src=\"./assets/images/what.svg\"\r\n *ngIf=\"!dashboardForm.dashboardName || activeSelector === 'name'\" alt=\"\">\r\n <svg class=\"checkIcon\" *ngIf=\"dashboardForm.dashboardName && activeSelector !== 'name'\"\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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Dashboard Name<span class=\"required\">*</span></label>\r\n <div class=\"vx-input-group\">\r\n <input type=\"text\" placeholder=\"Add dashboard name (Max limit: 30 characters).\"\r\n [(ngModel)]=\"dashboardForm.dashboardName\" (keydown)=\"activeSelector = 'name'\"\r\n (focusin)=\"activateSelector('name',true)\"\r\n (focusout)=\"activateSelector('name',false)\">\r\n <span class=\"counter\" *ngIf=\"dashboardForm?.dashboardName?.length > 0\">{{30 -\r\n dashboardForm.dashboardName.length}}</span>\r\n </div>\r\n <p class=\"vx-txt-error\" [appScrollInView]=\"true\"\r\n *ngIf=\"submitted &&( dashboardForm?.dashboardName?.length>30 || !dashboardForm?.dashboardName)\">\r\n {{(dashboardForm.dashboardName.length>30)?'You have exceeded the maximum character\r\n limit of 30 characters.':'Please enter a name for this Dashboard.'}} </p>\r\n <div class=\"vx-input-group\">\r\n <marx-editor [editorConfig]=\"dashboardDescription\"\r\n [(ngModel)]=\"dashboardForm.dashboardDescriptionText\"></marx-editor>\r\n <span class=\"counter\"\r\n *ngIf=\"dashboardForm?.dashboardDescriptionText?.length > 0\">{{250 -\r\n dashboardForm?.dashboardDescriptionText.length}}</span>\r\n </div>\r\n <p class=\"vx-txt-error\" [appScrollInView]=\"true\"\r\n *ngIf=\"submitted && dashboardForm?.dashboardDescriptionText?.length>250\">\r\n You have exceeded the maximum character limit of 250 characters.\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'whoCanView'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'whoCanView' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img src=\"./assets/images/who.svg\"\r\n *ngIf=\"dashboardForm?.selectedViewers?.length==0 || activeSelector === 'whoCanView'\"\r\n alt=\"\">\r\n <svg class=\"checkIcon\"\r\n *ngIf=\"dashboardForm?.selectedViewers?.length>0 && activeSelector !== 'whoCanView'\"\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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">Who can view this dashboard?<span\r\n class=\"required\">*</span></label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedViewers?.length==0\">\r\n <input type=\"text\" placeholder=\"Who can view this dashboard?\" readonly\r\n (click)=\"activateSelector('whoCanView', true)\">\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedViewers?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let user of dashboardForm?.selectedViewers?.slice(0,2)\"><i\r\n *ngIf=\"!listDetails.nonRemovableUsersList.includes(user.member_id)\"\r\n class=\"icons\" (click)=\"remove('whoCanView',user)\"></i>\r\n <span class=\"value\">{{user.member_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\" *ngIf=\"dashboardForm?.selectedViewers?.length > 2\"\r\n type=\"button\" appPopover (click)=\"userList.popover()\" placement=\"right\">+\r\n {{dashboardForm?.selectedViewers?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'user'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('whoCanView',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #userList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let user of dashboardForm?.selectedViewers | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\"\r\n *ngIf=\"!listDetails.nonRemovableUsersList.includes(user.member_id)\"\r\n (click)=\"remove('whoCanView',user)\"></i>\r\n {{ user?.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 <div class=\"form-group-row\" [class.active]=\"activeSelector === 'rcList'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'rcList' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length==0 || activeSelector === 'rcList'\"\r\n src=\"./assets/images/responsibility-center.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length>0 && activeSelector !== 'rcList'\"\r\n class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RESPONSIBILITY CENTER(S)</label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length==0\">\r\n <div class=\"custom-input\"\r\n aria-placeholder=\"Select the Responsibility Center(s) that you would like displayed in the Dashboard, if any.\"\r\n (click)=\"activateSelector('rcList', true)\" [class.error]=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\">\r\n </div>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let rc of dashboardForm?.selectedResponsibilityCenters?.slice(0,2)\"><i\r\n class=\"icons\" (click)=\"remove('rc',rc)\"></i>\r\n <span class=\"value\">{{rc.item_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\"\r\n *ngIf=\"dashboardForm?.selectedResponsibilityCenters?.length > 2\"\r\n type=\"button\" appPopover (click)=\"rcList.popover()\" placement=\"right\">+\r\n {{dashboardForm?.selectedResponsibilityCenters?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'rcList'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('rcList',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #rcList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let rc of dashboardForm?.selectedResponsibilityCenters | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\" (click)=\"remove('rc',rc)\"></i>\r\n {{ rc?.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 <div class=\"form-group-row\" [class.active]=\"activeSelector === 'responsibilityCategories'\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'responsibilityCategories' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length==0 || activeSelector === 'responsibilityCategories'\"\r\n src=\"./assets/images/category.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length>0 && activeSelector !== 'responsibilityCategories'\"\r\n class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RESPONSIBILITY CATEGORIES</label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length==0\">\r\n <div class=\"custom-input\"\r\n aria-placeholder=\"Select the Responsibility Category or Categories that this responsibility relates to.\"\r\n (click)=\"activateSelector('responsibilityCategories', true)\" [class.error]=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\"></div>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let rCategory of dashboardForm?.selectedResponsibilityCategories?.slice(0,2)\"><i\r\n class=\"icons\"\r\n (click)=\"remove('responsibilityCategories',rCategory)\"></i>\r\n <span class=\"value\">{{rCategory.item_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\"\r\n *ngIf=\"dashboardForm?.selectedResponsibilityCategories?.length > 2\"\r\n type=\"button\" appPopover (click)=\"rCategoryList.popover()\"\r\n placement=\"right\">+\r\n {{dashboardForm?.selectedResponsibilityCategories?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'responsibilityCategories'\" class=\"edit\"\r\n type=\"button\" (click)=\"activateSelector('responsibilityCategories',true)\">\r\n <i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #rCategoryList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let rCategory of dashboardForm?.selectedResponsibilityCategories | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\"\r\n (click)=\"remove('responsibilityCategories',rCategory)\"></i>\r\n {{ rCategory?.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 <div class=\"form-group-row\" [class.active]=\"activeSelector === 'riskCategories'\"\r\n *ngIf=\"showRiskCategory\"\r\n [class.disabled]=\" activeSelector && activeSelector !== 'riskCategories' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.selectedRiskCategories?.length==0 || activeSelector === 'riskCategories'\"\r\n src=\"./assets/images/category.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedRiskCategories?.length>0 && activeSelector !== 'riskCategories'\"\r\n class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">RISK CATEGORIES</label>\r\n <div class=\"select\" *ngIf=\"dashboardForm?.selectedRiskCategories?.length==0\">\r\n <div class=\"custom-input\"\r\n aria-placeholder=\"Select the Risk Categories that you would like displayed in the Dashboard, if any.\"\r\n (click)=\"activateSelector('riskCategories', true)\" [class.error]=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\"></div>\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm?.selectedRiskCategories?.length>0\">\r\n <div class=\"left\">\r\n <div class=\"chip-container\">\r\n <span class=\"chip\"\r\n *ngFor=\"let riskCategory of dashboardForm?.selectedRiskCategories?.slice(0,2)\"><i\r\n class=\"icons\"\r\n (click)=\"remove('riskCategory',riskCategory)\"></i>\r\n <span class=\"value\">{{riskCategory.category_name}}</span></span>\r\n\r\n </div>\r\n <button class=\"count\" *ngIf=\"dashboardForm?.selectedRiskCategories?.length > 2\"\r\n type=\"button\" appPopover (click)=\"riskList.popover()\" placement=\"right\">+\r\n {{dashboardForm?.selectedRiskCategories?.slice(2).length}}</button>\r\n </div>\r\n <button *ngIf=\"activeSelector !== 'riskCategories'\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('riskCategories',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n\r\n </div>\r\n <app-popover #riskList [dontCloseonClick]=\"true\">\r\n <div class=\"action-list\">\r\n <ul class=\"action-item\">\r\n <li\r\n *ngFor=\"let riskCategory of dashboardForm?.selectedRiskCategories | slice: 2; let j = index\">\r\n <div class=\"avatar-card\">\r\n <span class=\"value\">\r\n <i class=\"icons\"\r\n (click)=\"remove('riskCategory',riskCategory)\"></i>\r\n {{ riskCategory?.category_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 <div class=\"form-group-row\" [class.disabled]=\" activeSelector && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"dashboardForm?.displayCriteria?.length==0\" src=\"./assets/images/who.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.displayCriteria?.length>0 \" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">DISPLAY CRITERIA</label>\r\n <div class=\"radio-group\" *ngIf=\"showCriteria\" >\r\n <app-cs-radio [checked]=\"dashboardForm.displayCriteria=='or'\"\r\n (checkedEvent)=\"dashboardForm.displayCriteria='or'\">\r\n Those Items that have been assigned to either the selected Responsibility Center(s) or the selected Categories.</app-cs-radio>\r\n\r\n <app-cs-radio [checked]=\"dashboardForm.displayCriteria=='and'\"\r\n (checkedEvent)=\"dashboardForm.displayCriteria='and'\">\r\n Those Items that have been assigned to both the selected Responsibility Center(s) and the selected Categories.</app-cs-radio>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-group-row\" \r\n [class.disabled]=\" activeSelector && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"!dashboardForm?.selectedFromDate || !dashboardForm?.selectedToDate\" src=\"./assets/images/when.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm?.selectedFromDate && dashboardForm?.selectedToDate\" class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">TIMEFRAME</label>\r\n <label class=\"vx-control-panel-sub-label\">Select how long you would like the information\r\n selected to be displayed for. If no timeframe is selected, the information will be\r\n displayed permanently.</label>\r\n <div class=\"input-group vx-d-flex vx-justify-between\">\r\n <div class=\"date-select\">\r\n <i class=\"icons\"></i>\r\n <input type=\"text\"\r\n [value]=\"dashboardForm.selectedFromDate | date: 'dd MMM yyyy'\"\r\n [placeholder]=\"'From'\" (click)=\"openFromDatePicker()\" readonly>\r\n <dp-date-picker #fromDatePicker [(ngModel)]=\"dashboardForm.selectedFromDate\"\r\n placeholder=\"Select Date\"\r\n (onSelect)=\"closeFromDatePicker(); datePickerOverlay = false\"\r\n [config]=\"fromDatePickerConfig\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeFromDatePicker()\" *ngIf=\"datePickerOverlay\">\r\n </div>\r\n </div>\r\n <div class=\"date-select\" *ngIf=\"!hideToDate\" [class.disabled]=\"!dashboardForm?.selectedFromDate \">\r\n <i class=\"icons\"></i>\r\n <input type=\"text\" [value]=\"dashboardForm.selectedToDate | date: 'dd MMM yyyy'\"\r\n [placeholder]=\"'To'\" (click)=\"openToDatePicker()\" readonly>\r\n <dp-date-picker #toDatePicker [(ngModel)]=\"dashboardForm.selectedToDate\"\r\n placeholder=\"Select Date\"\r\n (onSelect)=\"closeToDatePicker(); datePickerOverlay = false\"\r\n [config]=\"toDatePickerConfig\"></dp-date-picker>\r\n <div class=\"overlay\" (click)=\"closeToDatePicker()\" *ngIf=\"datePickerOverlay\">\r\n </div>\r\n </div>\r\n </div>\r\n <p class=\"vx-txt-error\" [appScrollInView]=\"true\"\r\n *ngIf=\"submitted && (dashboardForm.selectedFromDate && (!dashboardForm.selectedToDate))\">\r\n Select a time-frame.</p>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"form-group-row\" [class.active]=\"activeSelector === 'frequency'\" \r\n [class.disabled]=\" activeSelector && activeSelector !== 'frequency' && activeSelector !== 'name'\">\r\n <div class=\"image\">\r\n <img *ngIf=\"!dashboardForm.frequencyMessage\" src=\"./assets/images/send-resolution.svg\" alt=\"\">\r\n <svg *ngIf=\"dashboardForm.frequencyMessage\" class=\"checkIcon\" 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=\"form\">\r\n <div class=\"vx-form-group\">\r\n <label class=\"vx-control-panel\">\r\n Email Summaries </label>\r\n <label class=\"vx-control-panel-sub-label\">\r\n If you would like to send a summary of this Dashboard,\r\n please select a frequency(By default VComply sends a weekly Summary).\r\n </label>\r\n <div class=\"select\" *ngIf=\"!dashboardForm.frequencyMessage\">\r\n <input type=\"text\" placeholder=\"Email Summaries\" readonly\r\n (click)=\"activateSelector('frequency', true)\">\r\n </div>\r\n <div class=\"selected\" *ngIf=\"dashboardForm.frequencyMessage\">\r\n <div class=\"left frequency-left\" [innerHTML]=\"dashboardForm.frequencyMessage\" [arTooltip]=\"dashboardForm.frequencyMessage\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory] =\"true\">\r\n </div>\r\n\r\n <button *ngIf=\"dashboardForm.frequencyMessage\" class=\"edit\" type=\"button\"\r\n (click)=\"activateSelector('frequency',true)\"><i class=\"icons\"></i>\r\n Edit</button>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"button-block\">\r\n <button class=\"vx-btn block primary\" [disabled]=\"activeSelector && activeSelector !== 'name'\" (click)=\"configureDashboard()\">Next:\r\n Configure\r\n Widgets</button>\r\n </div>\r\n </div>\r\n\r\n\r\n <button class=\"close-dialog\" type=\"button\" [disabled]=\"activeSelector && activeSelector !== 'name'\" (click)=\"close.emit({mode:'discard'})\">\r\n <i class=\"icons\"></i>\r\n </button>\r\n <div class=\"global-confirmation-alert\" *ngIf=\"submitted && dashboardForm?.selectedResponsibilityCenters?.length==0 && \r\n dashboardForm?.selectedResponsibilityCategories?.length==0 &&\r\n dashboardForm?.selectedRiskCategories?.length==0\">\r\n <div class=\"global-confirmation-alert-top\">\r\n <span class=\"icon-block\">\r\n <i class=\"icons\"></i>\r\n </span>\r\n <p class=\"text\" *ngIf=\"showRiskCategory\">Select a Responsibility Center, Responsibility Category or Risk Category.</p>\r\n <p class=\"text\" *ngIf=\"!showRiskCategory\">Select a Responsibility Center or Responsibility Category.</p>\r\n\r\n </div>\r\n <div class=\"global-confirmation-alert-bottom\">\r\n <p class=\"message\"></p>\r\n <div class=\"button-group\">\r\n <button class=\"fill\" type=\"button\" (click)=\"submitted=false\">OKAY</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<app-smiley-dialog \r\n *ngIf=\"isSmiley\"\r\n [message]=\"smileyMessage\">\r\n</app-smiley-dialog>\r\n\r\n<app-configure-widgets *ngIf=\"openConfigureWidgets\"\r\n [showRisk]=\"showRiskWidgets\" [showCompliance]=\"showComplianceWidgets\" [selectedWidgetsData]=\"selectedWidgets\"\r\n (widgetsDataModified)=\"setSelectedWidgets($event)\" (closeConfigureWidgets)=\"closeConfigureWidgets($event)\">\r\n</app-configure-widgets>",
|
|
1498
1514
|
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/dialog/dialog.css\");@import url(\"https://cdn.v-comply.com/design-system/css/button/button.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.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-right.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/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-right.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/alignment/alignment.css\");@import url(\"https://cdn.v-comply.com/design-system/css/width/width.css\");@import url(\"https://cdn.v-comply.com/design-system/css/animate/animation.css\");@import url(\"https://cdn.v-comply.com/design-system/css/animate/animate-slide-right.css\");@import url(\"https://cdn.v-comply.com/design-system/css/forms/forms.css\");::ng-deep .create-dashboard-container{width:100vw;background:#161b2fcc}::ng-deep .create-dashboard .more-option{width:calc(100% - 500px);border-right:1px solid #f1f1f1;float:left}::ng-deep .create-dashboard .vx-dialog-container{background-color:#fff;border:none;position:relative}::ng-deep .create-dashboard .vx-dialog-container button.close-dialog{display:flex;position:absolute;top:0;right:0;height:36px;width:36px;font-size:18px;color:#161b2f;cursor:pointer;background:#0000;border:none;border-radius:50%;z-index:2;align-items:center;justify-content:center}::ng-deep .create-dashboard .vx-dialog-container button.close-dialog:hover{background:#f1f1f1}::ng-deep .create-dashboard .vx-dialog-container button.close-dialog:disabled{pointer-events:none;filter:grayscale(1);opacity:.3}::ng-deep .form-group .vx-dialog-body-container{padding:36px 28px 0 40px!important;height:calc(100vh - 50px);overflow:auto;margin-left:-22px;background-color:initial;position:relative;border-radius:0 0 0 30px;background:#0000}::ng-deep .form-group .vx-dialog-body-container .form-group-row{display:flex}::ng-deep .form-group .vx-dialog-body-container .form-group-row .image{width:36px;min-width:36px;height:36px;margin-left:-36px;margin-right:20px;margin-top:28px;display:flex;align-items:center;justify-content:center}::ng-deep .form-group .vx-dialog-body-container .form-group-row .image img{width:100%}::ng-deep .form-group .vx-dialog-body-container .form-group-row .image .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;animation:fillCheck .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;margin-top:0}::ng-deep .form-group .vx-dialog-body-container .form-group-row .image .checkIcon__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:strokeCheck .6s cubic-bezier(.65,0,.45,1) forwards}::ng-deep .form-group .vx-dialog-body-container .form-group-row .image .checkIcon__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:strokeCheck .3s cubic-bezier(.65,0,.45,1) .8s forwards}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form{width:100%}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group input+marx-editor{margin-top:8px;display:block}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group input:hover{border-color:#1e5dd3;box-shadow:0 0 5px #1e5dd345}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .select:after{content:\"\";border-top:4px solid #707070;border-right:4px solid #0000;border-left:4px solid #0000;position:absolute;right:16px;top:calc(50% - 2px)}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .select:hover{border-color:#1e5dd3;box-shadow:0 0 5px #1e5dd345}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .selected .left{width:auto;display:flex}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .selected .left.frequency-left{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;width:calc(100% - 70px)}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .selected .chip-container{width:auto}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .selected .chip-container .chip{display:flex!important}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .selected .chip-container .chip .value{max-width:100px;display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .vx-input-group{display:flex;position:relative}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .vx-input-group span.counter{background:#0000;color:#161b2f;font-size:9px;font-weight:500;position:absolute;top:0;right:0;border-radius:3px;height:16px;text-align:center;line-height:16px;padding:0 2px}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .vx-input-group marx-editor{width:100%}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-form-group .vx-input-group.vx-input-group{margin-top:8px}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor{display:block}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container{border-radius:4px;border-color:#dbdbdb}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container:focus-within,::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container:hover{border-color:#1e5dd3}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container:focus-within .editor-tools,::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container:hover .editor-tools{border-top-color:#1e5dd3!important;transition:none}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container .editable-block{min-height:60px;padding:11px 15px;line-height:20px;font-size:13px;color:#747576;font-weight:400;transition:all .2s ease-in-out;width:100%;max-height:90px}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none){::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container .editable-block:before{opacity:.72}}}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container .editor-tools{border-color:#dbdbdb;border-radius:0 0 2px 2px;transition:none}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container .editor-tools app-editor-menu .editor-menu .col button{height:22px!important;width:22px!important;padding:0 5px}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form marx-editor .editor-container .editor-tools app-editor-menu .editor-menu .col button svg{height:22px;width:22px}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form 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 .form-group .vx-dialog-body-container .form-group-row .form 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 .form-group .vx-dialog-body-container .form-group-row .form .custom-input{height:2.5rem;border-radius:.25rem;border:1px solid #dbdbdb;background:#fff;outline:none;padding:.1875rem .75rem;line-height:1.25rem;font-size:13px;color:#747576;font-weight:400;transition:all .2s ease-in-out;width:100%;cursor:pointer}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .custom-input:empty:not(:focus):before{content:attr(aria-placeholder);line-height:16px;font-size:12px;width:94%;display:block;pointer-events:none}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .custom-input.error{border:1px solid #d93b41}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form label.vx-control-panel i{font-size:12px;color:#1e5dd3;margin-left:7px;cursor:pointer}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-control-panel-sub-label{color:#747576;font-size:.6875rem;font-weight:400;line-height:1rem;margin-bottom:.5rem;display:block;text-transform:none;width:100%;margin-top:0}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .vx-control-panel-sub-label span.required{color:#eb2424}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form label.vx-control-panel+.vx-control-panel-sub-label{margin-top:-.5rem}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .radio-group app-cs-radio{margin-top:4px;display:block;width:100%}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .radio-group app-cs-radio label.radio-item{width:100%;position:relative}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .radio-group app-cs-radio label.radio-item span.radio{position:absolute;top:17px;left:12px}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .radio-group 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 .form-group .vx-dialog-body-container .form-group-row .form .radio-group app-cs-radio label.radio-item span.value i{font-size:12px;color:#1e5dd3}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .radio-group app-cs-radio label.radio-item svg{position:absolute;top:17px;left:12px}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .radio-group app-cs-radio label.radio-item input:checked~span.value{background:#eefcf0;border-color:#34aa44}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .radio-group app-cs-radio+app-cs-radio{margin-top:.5rem}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .date-select{position:relative;width:calc(50% - .25rem)}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .date-select input{padding-left:36px!important}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .date-select i{display:flex;justify-content:center;align-items:center;height:39px;width:14px;position:absolute;left:12px;top:0;color:#bcbcbc;font-size:14px;pointer-events:none;z-index:1}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form .date-select.disabled{pointer-events:none;filter:grayscale(1);opacity:.3}::ng-deep .form-group .vx-dialog-body-container .form-group-row .form label.vx-control-panel span.sub-label{color:#747576;font-size:.6875rem;font-weight:400;line-height:1rem;text-transform:none;width:100%}::ng-deep .form-group .vx-dialog-body-container .form-group-row.disabled{pointer-events:none;filter:grayscale(1);opacity:.3}::ng-deep .form-group .vx-dialog-body-container .form-group-row.active{pointer-events:unset;filter:grayscale(0);opacity:1}::ng-deep .form-group .vx-dialog-body-container .form-group-row.active .image{filter:grayscale(0)}::ng-deep .form-group .vx-dialog-body-container .form-group-row.active .image:before{display:none}::ng-deep .form-group .vx-dialog-body-container .form-group-row.active .form{opacity:1;filter:grayscale(0)}::ng-deep .form-group .vx-dialog-body-container .form-group-row.active .form .custom-input,::ng-deep .form-group .vx-dialog-body-container .form-group-row.active .form input[type=text]{border-color:#1e5dd3;box-shadow:0 0 5px #1e5dd345}::ng-deep .form-group .vx-dialog-body-container:after{content:\"\";width:100%;display:block;height:30px;position:sticky;right:0;bottom:0;left:0;z-index:6;background:linear-gradient(180deg,#fff0 0,#ffffffbf 22%,#fff);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=\"#00ffffff\",endColorstr=\"#ffffff\",GradientType=0)}::ng-deep .form-group .button-block{position:relative;z-index:2}::ng-deep .form-group .button-block button{height:50px;line-height:48px!important}::ng-deep .form-group .button-block button:disabled{opacity:.3}::ng-deep .form-group.disabled{pointer-events:none;z-index:2}::ng-deep .form-group.disabled .image{position:relative;filter:grayscale(1)}::ng-deep .form-group.disabled .image:before{content:\"\";position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;opacity:.7}::ng-deep .form-group.disabled .form{opacity:.3;filter:grayscale(1)}@keyframes strokeCheck{to{stroke-dashoffset:0}}@keyframes fillCheck{to{box-shadow:inset 0 0 0 2px #34aa44}}.action-list{width:220px}.action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.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:#0000;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:#0000;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:#0000;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.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{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}.global-confirmation-alert{display:block;position:absolute;z-index:9;right:0;bottom:0;left:0;background:#d93b41}.global-confirmation-alert-top{display:flex;align-items:center;justify-content:flex-start;padding:20px 20px 12px}.global-confirmation-alert span.icon-block{height:36px;width:36px;border-radius:50%;background:#fff;border:1px solid #dcdcdc;display:flex;justify-content:center;align-items:center;margin-right:16px}.global-confirmation-alert span.icon-block i{color:#d93b41;font-size:12px}.global-confirmation-alert p.text{color:#fff;font-size:14px;font-weight:300;margin:0;width:calc(100% - 52px)}.global-confirmation-alert-bottom{display:flex;align-items:center;padding:0 12px 12px 72px;background:#d93b41}.global-confirmation-alert-bottom .button-group{display:flex}.global-confirmation-alert-bottom p.message{font-size:14px;font-weight:500;margin:0;line-height:20px;color:#fff}.global-confirmation-alert button{height:24px;width:64px;border:1px solid #000;border-radius:2px;display:flex;align-items:center;justify-content:center;line-height:22px;cursor:pointer;font-size:11px;text-transform:uppercase;font-weight:500;padding:0}.global-confirmation-alert button+button{margin-left:4px}.global-confirmation-alert button.fill{background:#fff;color:#1e5dd3;border-color:#fff}.global-confirmation-alert button.outline{background:#0000;color:#fff;border-color:#fff}"]
|
|
1499
1515
|
},] }
|
|
1500
1516
|
];
|
|
@@ -1512,7 +1528,8 @@
|
|
|
1512
1528
|
createdBy: [{ type: i0.Input }],
|
|
1513
1529
|
fromDatePicker: [{ type: i0.ViewChild, args: ['fromDatePicker',] }],
|
|
1514
1530
|
toDatePicker: [{ type: i0.ViewChild, args: ['toDatePicker',] }],
|
|
1515
|
-
configureWidget: [{ type: i0.Input }]
|
|
1531
|
+
configureWidget: [{ type: i0.Input }],
|
|
1532
|
+
onKeydownHandler: [{ type: i0.HostListener, args: ['document:keydown.escape', ['$event'],] }]
|
|
1516
1533
|
};
|
|
1517
1534
|
|
|
1518
1535
|
// import { CsOptionComponent } from '../cs-option/cs-option.component';
|
|
@@ -2655,7 +2672,7 @@
|
|
|
2655
2672
|
{ type: i0.Component, args: [{
|
|
2656
2673
|
selector: 'app-pagination',
|
|
2657
2674
|
template: "<div class=\"pagination-box\">\r\n <ul>\r\n <li><button [class.disabled]=\"currentPage==1\" (click)=\"changePage('prev',0,'')\"><</button></li>\r\n <li *ngFor=\"let page of paginationArray\">\r\n <button [disabled]=\"page=='...'\" [class.disable]=\"page=='...'\" [class.active]=\"currentPage==page\" (click)=\"changePage('',page,'')\">\r\n <i *ngIf=\"page=='...'\" class=\"icons\"></i>{{page!='...'?page : ''}}</button></li>\r\n\r\n <li><button [class.disabled]=\"currentPage==totalCount\" (click)=\"changePage('',0,'next')\">></button></li>\r\n </ul>\r\n</div>",
|
|
2658
|
-
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");.pagination-box{margin-bottom:20px}.pagination-box ul{display:flex;align-items:center;padding:0;margin:0}.pagination-box ul li{list-style:none;display:flex}.pagination-box ul li:first-child{margin-right:4px;height:24px}.pagination-box ul li:first-child button{color:#1e5dd3;font-size:17px}.pagination-box ul li:last-child{margin-left:6px!important;height:24px}.pagination-box ul li:last-child button{color:#1e5dd3;font-size:17px}.pagination-box ul li button{border:1px solid #
|
|
2675
|
+
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/color/color.css\");@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");.pagination-box{margin-bottom:20px}.pagination-box ul{display:flex;align-items:center;padding:0;margin:0}.pagination-box ul li{list-style:none;display:flex}.pagination-box ul li:first-child{margin-right:4px;height:24px}.pagination-box ul li:first-child button{color:#1e5dd3;font-size:17px}.pagination-box ul li:last-child{margin-left:6px!important;height:24px}.pagination-box ul li:last-child button{color:#1e5dd3;font-size:17px}.pagination-box ul li button{border:1px solid #dbdbdb;background:#fff;border-radius:2px;color:#161b2f;font-weight:400;height:24px;min-width:24px;padding:0 5px;display:inline-flex;justify-content:center;align-items:center;outline:none;cursor:pointer;font-size:11px;margin:0}.pagination-box ul li button.active,.pagination-box ul li button:hover{border-color:#1e5dd3;color:#1e5dd3}.pagination-box ul li button.disabled{filter:grayscale(100%);pointer-events:none}.pagination-box ul li button.disable{pointer-events:none}"]
|
|
2659
2676
|
},] }
|
|
2660
2677
|
];
|
|
2661
2678
|
PaginationComponent.ctorParameters = function () { return [
|
|
@@ -2867,7 +2884,7 @@
|
|
|
2867
2884
|
this.el = el;
|
|
2868
2885
|
this.renderer = renderer;
|
|
2869
2886
|
this.showTooltip = true;
|
|
2870
|
-
this.offset =
|
|
2887
|
+
this.offset = 8;
|
|
2871
2888
|
}
|
|
2872
2889
|
ToolTipDirective.prototype.ngOnInit = function () { };
|
|
2873
2890
|
ToolTipDirective.prototype.onMouseEnter = function () {
|
|
@@ -3768,8 +3785,8 @@
|
|
|
3768
3785
|
FloatingBarComponent.decorators = [
|
|
3769
3786
|
{ type: i0.Component, args: [{
|
|
3770
3787
|
selector: 'floating-bar',
|
|
3771
|
-
template: "<div class=\"floating-bar-container\">\r\n <div class=\"floating-bar vx-d-flex vx-align-center vx-justify-between vx-p-3\">\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"text && !frequencyMessage && !singleCategory\">\r\n <span class=\"value\">This audit plan needs to be <strong>reviewed</strong> within 2 days after it has been\r\n completed.</span>\r\n </div>\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"frequencyMessage && !text\">\r\n <span class=\"value\" [innerHTML]=\"frequencyMessage\"></span>\r\n </div>\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"singleCategory && !frequencyMessage && !text\">\r\n <span\r\n class=\"select-item vx-d-flex vx-align-center vx-bg-white vx-txt-blue vx-fw-500 vx-fs-3 vx-pl-2 vx-pr-2 vx-lh-6\"><i\r\n class=\"icons vx-mr-2\"></i> {{singleCategory}}</span>\r\n </div>\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"!singleCategory && !text && !frequencyMessage\">\r\n <span\r\n class=\"select-item vx-d-flex vx-align-center vx-bg-white vx-txt-blue vx-fw-500 vx-fs-3 vx-pl-2 vx-pr-2 vx-lh-6\">\r\n <i *ngIf=\"selectedData.length\" (click)=\"deleteSelected(selectedData[0])\"\r\n class=\"icons vx-mr-2\"></i>{{selectedData[0]?.title}}</span>\r\n <span\r\n *ngIf=\"selectedData?.length > 1\"\r\n class=\"count vx-ml-2 vx-mr-2 vx-bg-blue vx-txt-white vx-fs-3 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-pl-1 vx-pr-1\"\r\n appPopover (click)=\"countPopup.popover()\" placement=\"left\">+{{selectedData?.length - 1}}\r\n </span>\r\n <span class=\"vx-fs-12 vx-fw-500 vx-paragraph-txt\" *ngIf=\"(selectedData?.length - 1) === 1\">Widget Selected</span>\r\n <span class=\"vx-fs-12 vx-fw-500 vx-paragraph-txt\" *ngIf=\"(selectedData?.length - 1) > 1\">Widgets Selected</span>\r\n <app-popover #countPopup [dontCloseonClick]=\"true\">\r\n <div class=\"floating-bar-action-list\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let data of selectedData | slice: 1; let j = index\">\r\n <div class=\"chip-item\">\r\n <i class=\"icons\" (click)=\"deleteSelected(data)\"></i>\r\n <span>{{data?.title}}</span>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n </div>\r\n <div class=\"right vx-d-flex vx-align-center\">\r\n <button class=\"vx-bg-white vx-txt-red vx-fw-500 vx-tt-uppercase\"\r\n (click)=\"cancelFloatingBar()\">Cancel</button>\r\n <!-- <button class=\"vx-bg-blue vx-txt-white vx-fw-500 vx-tt-uppercase\"\r\n (click)=\"submitFloatingBar()\">Update</button> -->\r\n <button class=\"vx-bg-blue vx-txt-white vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-center\"\r\n (click)=\"submitFloatingBar()\">Save</button>\r\n </div>\r\n </div>\r\n</div>\r\n",
|
|
3772
|
-
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.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/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/button/button.css\");.floating-bar{width:100%;background:#fff;position:relative}.floating-bar,.floating-bar .left span.select-item{box-shadow:0 2px 6px #4681ef20;border-radius:2px}.floating-bar .left span.select-item i{font-size:6px;cursor:pointer}.floating-bar .left span.count{min-width:24px;height:24px;border-radius:2px;cursor:pointer}.floating-bar .left .value{color:#747576;font-size:13px}.floating-bar .left .value strong{color:#161b2f;font-weight:500}.floating-bar .right button{border:none;border-radius:2px;font-size:11px;padding:0;width:72px;line-height:28px;margin-left:4px}.floating-bar-container{padding:5px 24px 10px 12px}.floating-bar-action-list{width:220px}.floating-bar-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.floating-bar-action-list ul.action-item{display:block}.floating-bar-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:#0000;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.floating-bar-action-list ul.action-item li button{color:#6e717e;text-align:left;text-decoration:none;cursor:pointer;background:#0000;font-size:12px;text-transform:capitalize;display:flex;width:100%;padding:7.5px 11px;border:none}.floating-bar-action-list ul.action-item li button i{font-size:17px;margin-right:10px;color:#1c5bd1}.floating-bar-action-list ul.action-item li button:hover{background:#f3f3f3}.floating-bar-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.floating-bar-action-list ul.action-item li .avatar-card.within-con{display:block}.floating-bar-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}.floating-bar-action-list ul.action-item li .avatar-card .avatar img{width:100%}.floating-bar-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.floating-bar-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:#0000;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.floating-bar-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#1c5bd1;cursor:pointer;margin-right:5px}.floating-bar-action-list ul.action-item li .avatar-card.no-image{display:block}.floating-bar-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.floating-bar-action-list ul.action-item li .chip-item{color:#1e5dd3;padding:10px;display:flex;align-items:center}.floating-bar-action-list ul.action-item li .chip-item i{margin-right:7px;font-size:10px;cursor:pointer;display:inline-flex}.floating-bar-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}.floating-bar-action-list ul.action-item li .chip-item span.chip-block{display:block;width:100%}.floating-bar-action-list ul.action-item li .chip-item span.id{font-size:9px}.floating-bar-action-list ul.action-item li .within{display:flex;align-items:center;justify-content:flex-start}.floating-bar-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}.floating-bar-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}.floating-bar-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}"]
|
|
3788
|
+
template: "<div class=\"floating-bar-container\">\r\n <div class=\"floating-bar vx-d-flex vx-align-center vx-justify-between vx-p-3\">\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"text && !frequencyMessage && !singleCategory\">\r\n <span class=\"value\">This audit plan needs to be <strong>reviewed</strong> within 2 days after it has been\r\n completed.</span>\r\n </div>\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"frequencyMessage && !text\">\r\n <span class=\"value\" [innerHTML]=\"frequencyMessage\"></span>\r\n </div>\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"singleCategory && !frequencyMessage && !text\">\r\n <span\r\n class=\"select-item vx-d-flex vx-align-center vx-bg-white vx-txt-blue vx-fw-500 vx-fs-3 vx-pl-2 vx-pr-2 vx-lh-6\"><i\r\n class=\"icons vx-mr-2\"></i> {{singleCategory}}</span>\r\n </div>\r\n <div class=\"left vx-d-flex vx-align-center\" *ngIf=\"!singleCategory && !text && !frequencyMessage\">\r\n <span\r\n class=\"select-item vx-d-flex vx-align-center vx-bg-white vx-txt-blue vx-fw-500 vx-fs-3 vx-pl-2 vx-pr-2 vx-lh-6\">\r\n <i *ngIf=\"selectedData.length\" (click)=\"deleteSelected(selectedData[0])\"\r\n class=\"icons vx-mr-2\"></i>{{selectedData[0]?.title}}</span>\r\n <span\r\n *ngIf=\"selectedData?.length > 1\"\r\n class=\"count vx-ml-2 vx-mr-2 vx-bg-blue vx-txt-white vx-fs-3 vx-fw-500 vx-d-flex vx-align-center vx-justify-center vx-pl-1 vx-pr-1\"\r\n appPopover (click)=\"countPopup.popover()\" placement=\"left\">+{{selectedData?.length - 1}}\r\n </span>\r\n <span class=\"vx-fs-12 vx-fw-500 vx-paragraph-txt selectedWidgets\" *ngIf=\"(selectedData?.length - 1) === 1\">Widget Selected</span>\r\n <span class=\"vx-fs-12 vx-fw-500 vx-paragraph-txt selectedWidgets\" *ngIf=\"(selectedData?.length - 1) > 1\">Widgets Selected</span>\r\n <app-popover #countPopup [dontCloseonClick]=\"true\">\r\n <div class=\"floating-bar-action-list\">\r\n <ul class=\"action-item\">\r\n <li *ngFor=\"let data of selectedData | slice: 1; let j = index\">\r\n <div class=\"chip-item\">\r\n <i class=\"icons\" (click)=\"deleteSelected(data)\"></i>\r\n <span>{{data?.title}}</span>\r\n </div>\r\n </li>\r\n </ul>\r\n </div>\r\n </app-popover>\r\n </div>\r\n <div class=\"right vx-d-flex vx-align-center\">\r\n <button class=\"vx-bg-white vx-txt-red vx-fw-500 vx-tt-uppercase\"\r\n (click)=\"cancelFloatingBar()\">Cancel</button>\r\n <!-- <button class=\"vx-bg-blue vx-txt-white vx-fw-500 vx-tt-uppercase\"\r\n (click)=\"submitFloatingBar()\">Update</button> -->\r\n <button class=\"vx-bg-blue vx-txt-white vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-center\"\r\n (click)=\"submitFloatingBar()\">Save</button>\r\n </div>\r\n </div>\r\n</div>\r\n",
|
|
3789
|
+
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");@import url(\"https://cdn.v-comply.com/design-system/css/text/text.css\");@import url(\"https://cdn.v-comply.com/design-system/css/color/color.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/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/button/button.css\");.floating-bar{width:100%;background:#fff;position:relative}.floating-bar,.floating-bar .left span.select-item{box-shadow:0 2px 6px #4681ef20;border-radius:2px}.floating-bar .left span.select-item i{font-size:6px;cursor:pointer}.floating-bar .left span.count{min-width:24px;height:24px;border-radius:2px;cursor:pointer}.floating-bar .left .value{color:#747576;font-size:13px}.floating-bar .left .value strong{color:#161b2f;font-weight:500}.floating-bar .right button{border:none;border-radius:2px;font-size:11px;padding:0;width:72px;line-height:28px;margin-left:4px}.floating-bar-container{padding:5px 24px 10px 12px}.floating-bar-action-list{width:220px}.floating-bar-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.floating-bar-action-list ul.action-item{display:block}.floating-bar-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:#0000;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.floating-bar-action-list ul.action-item li button{color:#6e717e;text-align:left;text-decoration:none;cursor:pointer;background:#0000;font-size:12px;text-transform:capitalize;display:flex;width:100%;padding:7.5px 11px;border:none}.floating-bar-action-list ul.action-item li button i{font-size:17px;margin-right:10px;color:#1c5bd1}.floating-bar-action-list ul.action-item li button:hover{background:#f3f3f3}.floating-bar-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.floating-bar-action-list ul.action-item li .avatar-card.within-con{display:block}.floating-bar-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}.floating-bar-action-list ul.action-item li .avatar-card .avatar img{width:100%}.floating-bar-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.floating-bar-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:#0000;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.floating-bar-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#1c5bd1;cursor:pointer;margin-right:5px}.floating-bar-action-list ul.action-item li .avatar-card.no-image{display:block}.floating-bar-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.floating-bar-action-list ul.action-item li .chip-item{color:#1e5dd3;padding:10px;display:flex;align-items:center}.floating-bar-action-list ul.action-item li .chip-item i{margin-right:7px;font-size:10px;cursor:pointer;display:inline-flex}.floating-bar-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}.floating-bar-action-list ul.action-item li .chip-item span.chip-block{display:block;width:100%}.floating-bar-action-list ul.action-item li .chip-item span.id{font-size:9px}.floating-bar-action-list ul.action-item li .within{display:flex;align-items:center;justify-content:flex-start}.floating-bar-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}.floating-bar-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}.floating-bar-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.floating-bar-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}.selectedWidgets{font-size:12px}"]
|
|
3773
3790
|
},] }
|
|
3774
3791
|
];
|
|
3775
3792
|
FloatingBarComponent.ctorParameters = function () { return [
|
|
@@ -4541,7 +4558,7 @@
|
|
|
4541
4558
|
NoDataComponent.decorators = [
|
|
4542
4559
|
{ type: i0.Component, args: [{
|
|
4543
4560
|
selector: 'app-no-data',
|
|
4544
|
-
template: "<div class=\"no-data-wrapper\">\r\n <div class=\"no-data-container\">\r\n <img [src]=\"noDataImage\" [alt]=\"altText\" class=\"image\" />\r\n <p class=\"text\" [innerHTML]=\"noDataText\" *ngIf=\"noDataText\"></p>\r\n <div class=\"button-row\"
|
|
4561
|
+
template: "<div class=\"no-data-wrapper\">\r\n <div class=\"no-data-container\">\r\n <img [src]=\"noDataImage\" [alt]=\"altText\" class=\"image\" />\r\n <p class=\"text\" [innerHTML]=\"noDataText\" *ngIf=\"noDataText\"></p>\r\n <div class=\"button-row\" *ngFor=\"let button of action\">\r\n <button *ngIf=\"!button?.buttonIcon\" (click)=\"actionEmitter(button)\" [innerHTML]=\"button?.buttonText\"\r\n [class.small]=\"smallButton\"></button>\r\n <button *ngIf=\"button?.buttonIcon\" (click)=\"actionEmitter(button)\" [class.small]=\"smallButton\">\r\n <i class=\"icons\" [innerHTML]=\"button?.buttonIcon\"></i> <span\r\n [innerHTML]=\"button?.buttonText\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n</div>",
|
|
4545
4562
|
styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\");@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.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/display/display.css\");@import url(\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\");::ng-deep .no-data-wrapper{display:flex;align-items:center;justify-content:center;height:100%;width:100%;background:#fff;border-radius:2px}::ng-deep .no-data-container{display:inline-block;text-align:center;width:450px}::ng-deep .no-data-container .image{width:300px;margin-bottom:20px;display:inline-block}::ng-deep .no-data-container p.text{font-size:17px;font-weight:400;line-height:24px;margin-bottom:25px;color:#161b2f;text-align:center;margin-top:0}::ng-deep .no-data-container p.text strong{font-weight:500}::ng-deep .no-data-container button{width:auto;height:38px;border-radius:2px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:500;line-height:24px;cursor:pointer;background:#1e5dd3;border:1px solid #1e5dd3;outline:none;text-transform:uppercase;padding:0 16px}::ng-deep .no-data-container button+button{margin-left:5px}::ng-deep .no-data-container button i+span{margin-left:12px}::ng-deep .no-data-container button.small{width:60px;height:24px;font-size:11px}::ng-deep .no-data-container button.small i{margin-right:5px;font-size:9px}::ng-deep .no-data-container .button-row{display:flex;justify-content:center}"]
|
|
4546
4563
|
},] }
|
|
4547
4564
|
];
|
|
@@ -4693,6 +4710,65 @@
|
|
|
4693
4710
|
},] }
|
|
4694
4711
|
];
|
|
4695
4712
|
|
|
4713
|
+
var SmileyDialogComponent = /** @class */ (function () {
|
|
4714
|
+
function SmileyDialogComponent() {
|
|
4715
|
+
this.action = new i0.EventEmitter();
|
|
4716
|
+
this.closeSmiley = new i0.EventEmitter();
|
|
4717
|
+
}
|
|
4718
|
+
SmileyDialogComponent.prototype.handleKeyboardEvent = function (event) {
|
|
4719
|
+
if (event.key === 'Escape') {
|
|
4720
|
+
this.smileyCloseEmitter({});
|
|
4721
|
+
}
|
|
4722
|
+
};
|
|
4723
|
+
SmileyDialogComponent.prototype.ngOnInit = function () {
|
|
4724
|
+
var _this = this;
|
|
4725
|
+
if (this.autoClose) {
|
|
4726
|
+
setTimeout(function () {
|
|
4727
|
+
_this.close();
|
|
4728
|
+
}, 8000);
|
|
4729
|
+
}
|
|
4730
|
+
};
|
|
4731
|
+
SmileyDialogComponent.prototype.close = function () {
|
|
4732
|
+
this.closeSmiley.emit();
|
|
4733
|
+
};
|
|
4734
|
+
SmileyDialogComponent.prototype.actionEmitter = function (event) {
|
|
4735
|
+
this.action.emit(event === null || event === void 0 ? void 0 : event.id);
|
|
4736
|
+
};
|
|
4737
|
+
SmileyDialogComponent.prototype.smileyCloseEmitter = function (event) {
|
|
4738
|
+
this.closeSmiley.emit();
|
|
4739
|
+
};
|
|
4740
|
+
return SmileyDialogComponent;
|
|
4741
|
+
}());
|
|
4742
|
+
SmileyDialogComponent.decorators = [
|
|
4743
|
+
{ type: i0.Component, args: [{
|
|
4744
|
+
selector: 'app-smiley-dialog',
|
|
4745
|
+
template: "<!-- active -->\r\n<div class=\"smiley-popup active\">\r\n <button class=\"close\" (click)=\"smileyCloseEmitter($event)\">\r\n <i class=\"icons\"></i>\r\n </button>\r\n <div class=\"smiley-container\">\r\n <div class=\"smiley\">\r\n <!-- active deactive -->\r\n <div class=\"smiley-circle active\">\r\n <div class=\"smiley-circle-inner\">\r\n <div class=\"eyes\">\r\n <div class=\"eye\"></div>\r\n <div class=\"eye\"></div>\r\n </div>\r\n <div class=\"mouth\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <h3>{{ message }}</h3>\r\n <div class=\"successSmilyButton\">\r\n <button *ngFor=\"let button of actionButtons\" (click)=\"actionEmitter(button)\" [class]=\"button?.class\">\r\n {{ button?.buttonText }}\r\n </button>\r\n </div>\r\n <!-- <div class=\"successSmilyButton\"> -->\r\n <!-- <button>White Button</button>\r\n <button class=\"blue-btn\">Blue Button</button> -->\r\n <!-- </div> -->\r\n </div>\r\n</div>\r\n",
|
|
4746
|
+
styles: [".smiley-popup{background:#d93b41;display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9}.smiley-popup:before{content:\"\";position:absolute;z-index:0;background:#fff;top:0;right:0;bottom:0;left:0;transition-delay:1s;border-top-right-radius:0;transition:all .3s ease-in-out}.smiley-popup.active:before{border-top-right-radius:180px}.smiley-popup .close{color:#fff;font-size:22px;position:absolute;top:13px;right:21px;z-index:10;background:none;border:none;padding:0;cursor:pointer}.smiley-container{width:550px;text-align:center;position:relative;z-index:10}.smiley-container .smiley{display:block;width:500px;height:251px;overflow:hidden;position:relative;animation:slide-fwd-center .45s cubic-bezier(.68,-.55,.265,1.55) both;margin:0 auto 25px}.smiley-container .smiley:before{position:absolute;background:#ffedc5;width:50px;height:50px;content:\"\";border-radius:50%;top:101px;right:93px}.smiley-container .smiley:after{position:absolute;background:#ffbf15;width:35px;height:35px;border-radius:50%;content:\"\";top:200px;left:92px}.smiley-container .smiley-circle{background:#ffd83d;border-radius:100%;padding:25px;position:relative;width:250px;height:250px;margin:0 auto;box-shadow:inset -21px -14px 0 #f4c337}.smiley-container .smiley-circle:before{width:23px;height:5px;background:#ffbf15;position:absolute;content:\"\";top:116px;left:-66px}.smiley-container .smiley-circle:after{width:5px;height:23px;background:#ffbf15;position:absolute;content:\"\";top:107px;left:-57px}.smiley-container .smiley-circle-inner{height:182px;width:100%;margin:0 auto}.smiley-container .smiley-circle-inner .eyes{width:164px;margin:40px auto 0;box-sizing:border-box;padding:0 5px;transition:all .3s cubic-bezier(.645,.045,.355,1)}.smiley-container .smiley-circle-inner .eyes:before{width:5px;height:20px;background:#ffbf15;position:absolute;content:\"\";top:0;right:-19px}.smiley-container .smiley-circle-inner .eyes:after{width:20px;height:5px;background:#ffbf15;position:absolute;content:\"\";top:7px;right:-27px}.smiley-container .smiley-circle-inner .eyes .eye{width:40px;height:40px;background:#404549;float:left;border-radius:100%;overflow:hidden;position:relative}.smiley-container .smiley-circle-inner .eyes .eye:before{position:absolute;width:10px;height:10px;content:\"\";background:#ffe9b0;border-radius:50%;top:7px;left:1px}.smiley-container .smiley-circle-inner .eyes .eye:after{display:block;content:\"\";position:absolute;width:0;height:0;background:#fed800;transform:rotate(0deg);top:-15px;left:5px;transition:all .3s cubic-bezier(.645,.045,.355,1)}.smiley-container .smiley-circle-inner .eyes .eye:nth-of-type(2){float:right}.smiley-container .smiley-circle-inner .mouth{border-top-left-radius:100px;border-top-right-radius:100px;border-bottom-left-radius:100px;border-bottom-right-radius:100px;height:75px;width:150px;margin:0 auto;box-sizing:border-box;position:absolute;left:0;right:0;background:#404549;transition:all .3s cubic-bezier(.645,.045,.355,1)}.smiley-container .smiley-circle-inner .mouth:before{width:95px;height:95px;position:absolute;opacity:0;bottom:-507px;left:-6px;background:#ffd83d;content:\"\";border-radius:86px;transition:all .3s cubic-bezier(.645,.045,.355,1)}.smiley-container .smiley-circle.active .eyes .eye{height:40px;margin-top:0;animation:wink 3s infinite}.smiley-container .smiley-circle.active .mouth{animation:move-mouth-down .3s;animation-delay:.3s;animation-fill-mode:forwards}.smiley-container .smiley-circle.deactive .eyes .eye{animation:wink2 3s infinite}.smiley-container .smiley-circle.deactive .smiley-circle-inner{animation:move-angry-head .6s;animation-delay:.3s;animation-fill-mode:forwards}.smiley-container .smiley-circle.deactive .smiley-circle-inner .mouth{width:95px;height:51px;border-top-left-radius:100px;border-top-right-radius:100px;border-bottom-left-radius:0;border-bottom-right-radius:0;top:60px}.smiley-container .smiley-circle.deactive .smiley-circle-inner .mouth:before{background:#ffd83d;content:\"\";bottom:-55px;left:0;opacity:1;transition:all .3s cubic-bezier(.645,.045,.355,1)}.smiley-container h3{font-size:26px;color:#161b2f;font-weight:400;margin:0 0 40px}.smiley-container .successSmilyButton{display:flex;align-items:center}.smiley-container .successSmilyButton button{background:#fff;border:1px solid #1e5dd3;color:#1e5dd3;font-size:14px;font-weight:500;margin:0 5px;border-radius:3px;padding:8px;width:280px;height:54px;cursor:pointer;text-transform:uppercase}.smiley-container .successSmilyButton button.blue-btn{background:#1e5dd3;color:#fff}@keyframes slide-fwd-center{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes move-mouth-down{0%{border-top-left-radius:100px;border-top-right-radius:100px;border-bottom-left-radius:100px;border-bottom-right-radius:100px;height:10%;width:40%;bottom:25%;margin:0 auto;box-sizing:border-box;position:absolute;bottom:18%;left:0;right:0;background:#404549;transition:all .3s cubic-bezier(.645,.045,.355,1)}to{width:60%;height:30%;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:100px;border-bottom-right-radius:100px;box-sizing:border-box;position:absolute;bottom:18%;background:#404549;transition:all .3s cubic-bezier(.645,.045,.355,1)}}@keyframes wink{0%{height:40px;margin-top:0}10%{height:40px;margin-top:0}15%{height:4px;margin-top:18px}20%{height:40px;margin-top:0}to{height:40px;margin-top:0}}@keyframes wink2{0%{height:40px;margin-top:0}10%{height:40px;margin-top:0}15%{height:4px;margin-top:18px}20%{height:40px;margin-top:0}to{height:40px;margin-top:0}}@keyframes move-angry-head{0%{transform:translateX(0)}20%{transform:translateX(-20%)}40%{transform:translateX(15%)}60%{transform:translateX(-10%)}80%{transform:translateX(5%)}to{transform:translateX(0)}}"]
|
|
4747
|
+
},] }
|
|
4748
|
+
];
|
|
4749
|
+
SmileyDialogComponent.ctorParameters = function () { return []; };
|
|
4750
|
+
SmileyDialogComponent.propDecorators = {
|
|
4751
|
+
message: [{ type: i0.Input }],
|
|
4752
|
+
autoClose: [{ type: i0.Input }],
|
|
4753
|
+
actionButtons: [{ type: i0.Input }],
|
|
4754
|
+
action: [{ type: i0.Output }],
|
|
4755
|
+
closeSmiley: [{ type: i0.Output }],
|
|
4756
|
+
handleKeyboardEvent: [{ type: i0.HostListener, args: ['window:keyup', ['$event'],] }]
|
|
4757
|
+
};
|
|
4758
|
+
|
|
4759
|
+
var SmileyDialogModule = /** @class */ (function () {
|
|
4760
|
+
function SmileyDialogModule() {
|
|
4761
|
+
}
|
|
4762
|
+
return SmileyDialogModule;
|
|
4763
|
+
}());
|
|
4764
|
+
SmileyDialogModule.decorators = [
|
|
4765
|
+
{ type: i0.NgModule, args: [{
|
|
4766
|
+
declarations: [SmileyDialogComponent],
|
|
4767
|
+
imports: [common.CommonModule],
|
|
4768
|
+
exports: [SmileyDialogComponent],
|
|
4769
|
+
},] }
|
|
4770
|
+
];
|
|
4771
|
+
|
|
4696
4772
|
var CreateDashboardModule = /** @class */ (function () {
|
|
4697
4773
|
function CreateDashboardModule() {
|
|
4698
4774
|
}
|
|
@@ -4735,7 +4811,8 @@
|
|
|
4735
4811
|
VLoaderModule,
|
|
4736
4812
|
SnackBarModule,
|
|
4737
4813
|
NoDataModule,
|
|
4738
|
-
DirectivesModule
|
|
4814
|
+
DirectivesModule,
|
|
4815
|
+
SmileyDialogModule
|
|
4739
4816
|
],
|
|
4740
4817
|
exports: [
|
|
4741
4818
|
CreateDashboardComponent
|
|
@@ -4788,6 +4865,8 @@
|
|
|
4788
4865
|
exports.ɵcc = LoaderInlineComponent;
|
|
4789
4866
|
exports.ɵcd = SnackBarModule;
|
|
4790
4867
|
exports.ɵce = SnackBarComponent;
|
|
4868
|
+
exports.ɵcf = SmileyDialogModule;
|
|
4869
|
+
exports.ɵcg = SmileyDialogComponent;
|
|
4791
4870
|
exports.ɵd = PaginationService;
|
|
4792
4871
|
exports.ɵe = SnackBarService;
|
|
4793
4872
|
exports.ɵf = ConfigureWidgetsService;
|