tin-spa 2.9.0 → 2.9.2
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/esm2020/lib/components/table/detailsDialog.component.mjs +17 -3
- package/esm2020/lib/components/table-action/table-action.component.mjs +2 -2
- package/esm2020/lib/components/table-internal/detailsDialog-internal.component.mjs +17 -3
- package/esm2020/lib/components/table-lite/detailsDialog-lite.component.mjs +17 -3
- package/esm2020/lib/pages/roles/roles.component.mjs +19 -3
- package/esm2020/lib/services/button.service.mjs +20 -7
- package/esm2020/lib/services/datalib.service.mjs +3 -2
- package/fesm2015/tin-spa.mjs +71 -16
- package/fesm2015/tin-spa.mjs.map +1 -1
- package/fesm2020/tin-spa.mjs +88 -16
- package/fesm2020/tin-spa.mjs.map +1 -1
- package/lib/pages/roles/roles.component.d.ts +1 -0
- package/lib/services/button.service.d.ts +1 -2
- package/package.json +1 -1
package/fesm2020/tin-spa.mjs
CHANGED
|
@@ -1486,7 +1486,7 @@ class DataServiceLib {
|
|
|
1486
1486
|
columns: [
|
|
1487
1487
|
{ name: 'name', type: 'text' },
|
|
1488
1488
|
{ name: 'description', type: 'text' },
|
|
1489
|
-
{ name: 'departmentName', type: '
|
|
1489
|
+
{ name: 'departmentName', type: 'chip', detailsConfig: this.departmentDetailsConfig, alias: 'Department' },
|
|
1490
1490
|
],
|
|
1491
1491
|
buttons: [
|
|
1492
1492
|
{ name: 'create', display: 'Create', dialog: true, action: { url: 'positions?action=create', method: 'post' } },
|
|
@@ -1975,6 +1975,7 @@ class DataServiceLib {
|
|
|
1975
1975
|
this.capApprovals.display = "Approvals";
|
|
1976
1976
|
this.capApprovals.link = "home/admin/approvals";
|
|
1977
1977
|
this.capApprovals.icon = "rule";
|
|
1978
|
+
this.capApprovals.isBool = true;
|
|
1978
1979
|
this.capApprovalsConfig.name = "cap22";
|
|
1979
1980
|
this.capApprovalsConfig.display = "Approvals Config";
|
|
1980
1981
|
this.capApprovalsConfig.link = "home/admin/approvals-config";
|
|
@@ -2997,11 +2998,10 @@ class ButtonService {
|
|
|
2997
2998
|
};
|
|
2998
2999
|
return colorMap[button.name] || '#4050B5';
|
|
2999
3000
|
}
|
|
3000
|
-
isButtonVisible(button, row, isLoadComplete) {
|
|
3001
|
-
|
|
3002
|
-
|
|
3003
|
-
|
|
3004
|
-
}
|
|
3001
|
+
// isButtonVisible(button: Button, row: any, isLoadComplete: boolean): boolean {
|
|
3002
|
+
// if (!isLoadComplete) return false;
|
|
3003
|
+
// return this.testVisible(button,row);
|
|
3004
|
+
// }
|
|
3005
3005
|
getTitleAction(mode, buttons) {
|
|
3006
3006
|
const modeMap = {
|
|
3007
3007
|
'view': 'View',
|
|
@@ -3019,11 +3019,25 @@ class ButtonService {
|
|
|
3019
3019
|
}
|
|
3020
3020
|
return this.getDefaultIcon(button.name, config.flatButtons);
|
|
3021
3021
|
}
|
|
3022
|
-
testDisabled(button, row) {
|
|
3022
|
+
testDisabled(button, row, config) {
|
|
3023
|
+
// Check standard locking/approval rules
|
|
3023
3024
|
if ((button.name === 'edit' || button.name === 'delete') && row?.locked)
|
|
3024
3025
|
return true;
|
|
3025
3026
|
if (row?.pendingApproval && !button.ignoreApproval && button.name != 'view')
|
|
3026
3027
|
return true;
|
|
3028
|
+
// Check form access if detailsConfig exists
|
|
3029
|
+
if (button.detailsConfig?.formConfig) {
|
|
3030
|
+
const access = Core.getFormAccess(button.detailsConfig.formConfig, this.authService.currentRoleSource.value);
|
|
3031
|
+
if (!this.hasRequiredAccess(access, button.name))
|
|
3032
|
+
return true;
|
|
3033
|
+
}
|
|
3034
|
+
// Check form access levels from table config
|
|
3035
|
+
if (['create', 'edit', 'view', 'delete'].includes(button.name) && config?.formConfig) {
|
|
3036
|
+
const access = Core.getFormAccess(config.formConfig, this.authService.currentRoleSource.value);
|
|
3037
|
+
if (!this.hasRequiredAccess(access, button.name))
|
|
3038
|
+
return true;
|
|
3039
|
+
}
|
|
3040
|
+
// Check button-specific disabled rules
|
|
3027
3041
|
return button.disabled ? button.disabled(row) : false;
|
|
3028
3042
|
}
|
|
3029
3043
|
testVisible(button, row, config) {
|
|
@@ -4828,11 +4842,25 @@ class DetailsDialogLite {
|
|
|
4828
4842
|
}
|
|
4829
4843
|
testDisabled(row, buttonName) {
|
|
4830
4844
|
const button = this.getButton(buttonName);
|
|
4831
|
-
|
|
4845
|
+
if (!button)
|
|
4846
|
+
return false;
|
|
4847
|
+
// Create a copy of the button with component's detailsConfig
|
|
4848
|
+
const buttonWithConfig = {
|
|
4849
|
+
...button,
|
|
4850
|
+
detailsConfig: button.detailsConfig ? { ...button.detailsConfig } : this.detailsConfig
|
|
4851
|
+
};
|
|
4852
|
+
return this.buttonService.testDisabled(buttonWithConfig, row);
|
|
4832
4853
|
}
|
|
4833
4854
|
testVisible(row, buttonName) {
|
|
4834
4855
|
const button = this.getButton(buttonName);
|
|
4835
|
-
|
|
4856
|
+
if (!button)
|
|
4857
|
+
return false;
|
|
4858
|
+
// Create a copy of the button with component's detailsConfig
|
|
4859
|
+
const buttonWithConfig = {
|
|
4860
|
+
...button,
|
|
4861
|
+
detailsConfig: button.detailsConfig ? { ...button.detailsConfig } : this.detailsConfig
|
|
4862
|
+
};
|
|
4863
|
+
return this.buttonService.testVisible(buttonWithConfig, row);
|
|
4836
4864
|
}
|
|
4837
4865
|
testVisibleTab(tblConfig) {
|
|
4838
4866
|
if (!this.tableConfigService.hasTableAccess(tblConfig)) {
|
|
@@ -5578,7 +5606,7 @@ class TableActionComponent {
|
|
|
5578
5606
|
}
|
|
5579
5607
|
testDisabled(row, buttonName) {
|
|
5580
5608
|
const button = this.displayedButtons.find(b => b.name === buttonName);
|
|
5581
|
-
return button ? this.buttonService.testDisabled(button, row) : true;
|
|
5609
|
+
return button ? this.buttonService.testDisabled(button, row, this.config) : true;
|
|
5582
5610
|
}
|
|
5583
5611
|
getButtonColor(button, row) {
|
|
5584
5612
|
return this.buttonService.getButtonColor(button, row);
|
|
@@ -6110,11 +6138,25 @@ class DetailsDialogInternal {
|
|
|
6110
6138
|
}
|
|
6111
6139
|
testDisabled(row, buttonName) {
|
|
6112
6140
|
const button = this.getButton(buttonName);
|
|
6113
|
-
|
|
6141
|
+
if (!button)
|
|
6142
|
+
return false;
|
|
6143
|
+
// Create a copy of the button with component's detailsConfig
|
|
6144
|
+
const buttonWithConfig = {
|
|
6145
|
+
...button,
|
|
6146
|
+
detailsConfig: button.detailsConfig ? { ...button.detailsConfig } : this.detailsConfig
|
|
6147
|
+
};
|
|
6148
|
+
return this.buttonService.testDisabled(buttonWithConfig, row);
|
|
6114
6149
|
}
|
|
6115
6150
|
testVisible(row, buttonName) {
|
|
6116
6151
|
const button = this.getButton(buttonName);
|
|
6117
|
-
|
|
6152
|
+
if (!button)
|
|
6153
|
+
return false;
|
|
6154
|
+
// Create a copy of the button with component's detailsConfig
|
|
6155
|
+
const buttonWithConfig = {
|
|
6156
|
+
...button,
|
|
6157
|
+
detailsConfig: button.detailsConfig ? { ...button.detailsConfig } : this.detailsConfig
|
|
6158
|
+
};
|
|
6159
|
+
return this.buttonService.testVisible(buttonWithConfig, row);
|
|
6118
6160
|
}
|
|
6119
6161
|
testVisibleTab(tblConfig) {
|
|
6120
6162
|
if (!this.tableConfigService.hasTableAccess(tblConfig)) {
|
|
@@ -7021,11 +7063,25 @@ class DetailsDialog {
|
|
|
7021
7063
|
}
|
|
7022
7064
|
testDisabled(row, buttonName) {
|
|
7023
7065
|
const button = this.getButton(buttonName);
|
|
7024
|
-
|
|
7066
|
+
if (!button)
|
|
7067
|
+
return false;
|
|
7068
|
+
// Create a copy of the button with component's detailsConfig
|
|
7069
|
+
const buttonWithConfig = {
|
|
7070
|
+
...button,
|
|
7071
|
+
detailsConfig: button.detailsConfig ? { ...button.detailsConfig } : this.detailsConfig
|
|
7072
|
+
};
|
|
7073
|
+
return this.buttonService.testDisabled(buttonWithConfig, row);
|
|
7025
7074
|
}
|
|
7026
7075
|
testVisible(row, buttonName) {
|
|
7027
7076
|
const button = this.getButton(buttonName);
|
|
7028
|
-
|
|
7077
|
+
if (!button)
|
|
7078
|
+
return false;
|
|
7079
|
+
// Create a copy of the button with component's detailsConfig
|
|
7080
|
+
const buttonWithConfig = {
|
|
7081
|
+
...button,
|
|
7082
|
+
detailsConfig: button.detailsConfig ? { ...button.detailsConfig } : this.detailsConfig
|
|
7083
|
+
};
|
|
7084
|
+
return this.buttonService.testVisible(buttonWithConfig, row);
|
|
7029
7085
|
}
|
|
7030
7086
|
testVisibleTab(tblConfig) {
|
|
7031
7087
|
if (!this.tableConfigService.hasTableAccess(tblConfig)) {
|
|
@@ -9863,6 +9919,7 @@ class RolesComponent {
|
|
|
9863
9919
|
this.loadRoles();
|
|
9864
9920
|
}
|
|
9865
9921
|
onCapItemChange(capItem, checked, role) {
|
|
9922
|
+
return; //disabled to allow sub component access without granting whole menu access
|
|
9866
9923
|
if (!checked && capItem.capSubItems) {
|
|
9867
9924
|
// When parent is unchecked, set all subitems to Restricted
|
|
9868
9925
|
capItem.capSubItems.forEach(subItem => {
|
|
@@ -9870,6 +9927,21 @@ class RolesComponent {
|
|
|
9870
9927
|
});
|
|
9871
9928
|
}
|
|
9872
9929
|
}
|
|
9930
|
+
hasSubItemsAccess(capItem, role) {
|
|
9931
|
+
if (!capItem.capSubItems)
|
|
9932
|
+
return false;
|
|
9933
|
+
// Check if any sub-item has access
|
|
9934
|
+
return capItem.capSubItems.some(subItem => {
|
|
9935
|
+
// Check direct sub-items
|
|
9936
|
+
if (role[subItem.name] > 0)
|
|
9937
|
+
return true;
|
|
9938
|
+
// Check sub-sub-items recursively
|
|
9939
|
+
if (subItem.capSubItems) {
|
|
9940
|
+
return subItem.capSubItems.some(subSubItem => role[subSubItem.name] > 0);
|
|
9941
|
+
}
|
|
9942
|
+
return false;
|
|
9943
|
+
});
|
|
9944
|
+
}
|
|
9873
9945
|
addRole() {
|
|
9874
9946
|
const dialogRef = this.dialog.open(addRoleDialog, {
|
|
9875
9947
|
width: "1100px",
|
|
@@ -9924,10 +9996,10 @@ class RolesComponent {
|
|
|
9924
9996
|
}
|
|
9925
9997
|
}
|
|
9926
9998
|
RolesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RolesComponent, deps: [{ token: HttpService }, { token: i1$2.Router }, { token: AuthService }, { token: DataServiceLib }, { token: DialogService }, { token: i4.MatDialog }, { token: MessageService }], target: i0.ɵɵFactoryTarget.Component });
|
|
9927
|
-
RolesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: RolesComponent, selector: "spa-roles", ngImport: i0, template: "<h4> Roles </h4>\r\n<hr />\r\n\r\n<div class=\"container-fluid mb-5\">\r\n\r\n <div class=\"d-flex justify-content-between mb-2\">\r\n\r\n <div >\r\n <button id=\"btnNewRole\" mat-raised-button color=\"primary\" (click)=\"addRole()\">New Role</button>\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-end\">\r\n <button id=\"btnRefresh\" mat-mini-fab color=\"primary\" (click)=\"refresh()\" matTooltip=\"refresh data\" matTooltipPosition=\"right\"><mat-icon class=\"refreshIcon\">refresh</mat-icon></button>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"row mt-2 mb-1\" *ngFor=\"let role of roles\">\r\n\r\n <mat-card class=\"mat-elevation-z8\" style=\"width:100%\">\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n\r\n <label style=\"font-size: 16px;\">{{role.roleName}}</label>\r\n\r\n <button mat-icon-button color=\"primary\" matTooltip=\"Rename Role\" (click)=\"renameRole(role)\">\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n </div>\r\n\r\n <hr style=\"margin-top: 0px;\">\r\n\r\n <div class=\"tin-row\" style=\" font-size:12px;\">\r\n\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capItem of appConfig.capItems\">\r\n\r\n <mat-checkbox *ngIf=\"capItem.isBool || capItem.capSubItems\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capItem.name]\" (ngModelChange)=\"onCapItemChange(capItem, $event, role)\">\r\n {{capItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capItem.isBool && !capItem.capSubItems\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capItem.display\"\r\n [(value)]=\"role[capItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n <ng-container *ngIf=\"capItem.capSubItems && role[capItem.name]\">\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capSubItem of capItem.capSubItems\">\r\n\r\n <mat-checkbox *ngIf=\"capSubItem.isBool\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capSubItem.name]\">\r\n {{capSubItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capSubItem.isBool\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capSubItem.display\"\r\n [(value)]=\"role[capSubItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n\r\n
|
|
9999
|
+
RolesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: RolesComponent, selector: "spa-roles", ngImport: i0, template: "<h4> Roles </h4>\r\n<hr />\r\n\r\n<div class=\"container-fluid mb-5\">\r\n\r\n <div class=\"d-flex justify-content-between mb-2\">\r\n\r\n <div >\r\n <button id=\"btnNewRole\" mat-raised-button color=\"primary\" (click)=\"addRole()\">New Role</button>\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-end\">\r\n <button id=\"btnRefresh\" mat-mini-fab color=\"primary\" (click)=\"refresh()\" matTooltip=\"refresh data\" matTooltipPosition=\"right\"><mat-icon class=\"refreshIcon\">refresh</mat-icon></button>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"row mt-2 mb-1\" *ngFor=\"let role of roles\">\r\n\r\n <mat-card class=\"mat-elevation-z8\" style=\"width:100%\">\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n\r\n <label style=\"font-size: 16px;\">{{role.roleName}}</label>\r\n\r\n <button mat-icon-button color=\"primary\" matTooltip=\"Rename Role\" (click)=\"renameRole(role)\">\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n </div>\r\n\r\n <hr style=\"margin-top: 0px;\">\r\n\r\n <div class=\"tin-row\" style=\" font-size:12px;\">\r\n\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capItem of appConfig.capItems\">\r\n\r\n <mat-checkbox *ngIf=\"capItem.isBool || capItem.capSubItems\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capItem.name]\" (ngModelChange)=\"onCapItemChange(capItem, $event, role)\">\r\n {{capItem.display}}\r\n <span *ngIf=\"!role[capItem.name] && hasSubItemsAccess(capItem, role)\" class=\"asterisk\" style=\"color: red;\">*</span>\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capItem.isBool && !capItem.capSubItems\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capItem.display\"\r\n [(value)]=\"role[capItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n <ng-container *ngIf=\"capItem.capSubItems && role[capItem.name]\">\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capSubItem of capItem.capSubItems\">\r\n\r\n <mat-checkbox *ngIf=\"capSubItem.isBool\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capSubItem.name]\">\r\n {{capSubItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capSubItem.isBool\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capSubItem.display\"\r\n [(value)]=\"role[capSubItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n <ng-container *ngIf=\"capSubItem.capSubItems\">\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capSubSubItem of capSubItem.capSubItems\">\r\n\r\n <mat-checkbox *ngIf=\"capSubSubItem.isBool\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capSubSubItem.name]\">\r\n {{capSubSubItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capSubSubItem.isBool\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capSubSubItem.display\"\r\n [(value)]=\"role[capSubSubItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n </div>\r\n\r\n </ng-container>\r\n\r\n\r\n\r\n </div>\r\n\r\n </ng-container>\r\n\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <mat-card-actions>\r\n\r\n <button mat-mini-fab color=\"primary\" (click)=\"updateRole(role)\" style=\"margin-right:10px;\">\r\n <mat-icon>done_all</mat-icon>\r\n </button>\r\n\r\n <button mat-mini-fab color=\"warn\" (click)=\"deleteRole(role)\" style=\"margin-right:10px\">\r\n <mat-icon>delete</mat-icon>\r\n </button>\r\n\r\n </mat-card-actions>\r\n\r\n </mat-card>\r\n\r\n </div>\r\n\r\n\r\n</div>\r\n\r\n", styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.refreshIcon{font-size:22px!important;margin-top:-7px!important}\n"], dependencies: [{ kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i16.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i16.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: SelectComponent, selector: "spa-select", inputs: ["detailsConfig"] }] });
|
|
9928
10000
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: RolesComponent, decorators: [{
|
|
9929
10001
|
type: Component,
|
|
9930
|
-
args: [{ selector: "spa-roles", template: "<h4> Roles </h4>\r\n<hr />\r\n\r\n<div class=\"container-fluid mb-5\">\r\n\r\n <div class=\"d-flex justify-content-between mb-2\">\r\n\r\n <div >\r\n <button id=\"btnNewRole\" mat-raised-button color=\"primary\" (click)=\"addRole()\">New Role</button>\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-end\">\r\n <button id=\"btnRefresh\" mat-mini-fab color=\"primary\" (click)=\"refresh()\" matTooltip=\"refresh data\" matTooltipPosition=\"right\"><mat-icon class=\"refreshIcon\">refresh</mat-icon></button>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"row mt-2 mb-1\" *ngFor=\"let role of roles\">\r\n\r\n <mat-card class=\"mat-elevation-z8\" style=\"width:100%\">\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n\r\n <label style=\"font-size: 16px;\">{{role.roleName}}</label>\r\n\r\n <button mat-icon-button color=\"primary\" matTooltip=\"Rename Role\" (click)=\"renameRole(role)\">\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n </div>\r\n\r\n <hr style=\"margin-top: 0px;\">\r\n\r\n <div class=\"tin-row\" style=\" font-size:12px;\">\r\n\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capItem of appConfig.capItems\">\r\n\r\n <mat-checkbox *ngIf=\"capItem.isBool || capItem.capSubItems\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capItem.name]\" (ngModelChange)=\"onCapItemChange(capItem, $event, role)\">\r\n {{capItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capItem.isBool && !capItem.capSubItems\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capItem.display\"\r\n [(value)]=\"role[capItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n <ng-container *ngIf=\"capItem.capSubItems && role[capItem.name]\">\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capSubItem of capItem.capSubItems\">\r\n\r\n <mat-checkbox *ngIf=\"capSubItem.isBool\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capSubItem.name]\">\r\n {{capSubItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capSubItem.isBool\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capSubItem.display\"\r\n [(value)]=\"role[capSubItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n\r\n
|
|
10002
|
+
args: [{ selector: "spa-roles", template: "<h4> Roles </h4>\r\n<hr />\r\n\r\n<div class=\"container-fluid mb-5\">\r\n\r\n <div class=\"d-flex justify-content-between mb-2\">\r\n\r\n <div >\r\n <button id=\"btnNewRole\" mat-raised-button color=\"primary\" (click)=\"addRole()\">New Role</button>\r\n </div>\r\n\r\n <div class=\"d-flex justify-content-end\">\r\n <button id=\"btnRefresh\" mat-mini-fab color=\"primary\" (click)=\"refresh()\" matTooltip=\"refresh data\" matTooltipPosition=\"right\"><mat-icon class=\"refreshIcon\">refresh</mat-icon></button>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"row mt-2 mb-1\" *ngFor=\"let role of roles\">\r\n\r\n <mat-card class=\"mat-elevation-z8\" style=\"width:100%\">\r\n\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n\r\n <label style=\"font-size: 16px;\">{{role.roleName}}</label>\r\n\r\n <button mat-icon-button color=\"primary\" matTooltip=\"Rename Role\" (click)=\"renameRole(role)\">\r\n <mat-icon>edit</mat-icon>\r\n </button>\r\n </div>\r\n\r\n <hr style=\"margin-top: 0px;\">\r\n\r\n <div class=\"tin-row\" style=\" font-size:12px;\">\r\n\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capItem of appConfig.capItems\">\r\n\r\n <mat-checkbox *ngIf=\"capItem.isBool || capItem.capSubItems\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capItem.name]\" (ngModelChange)=\"onCapItemChange(capItem, $event, role)\">\r\n {{capItem.display}}\r\n <span *ngIf=\"!role[capItem.name] && hasSubItemsAccess(capItem, role)\" class=\"asterisk\" style=\"color: red;\">*</span>\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capItem.isBool && !capItem.capSubItems\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capItem.display\"\r\n [(value)]=\"role[capItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n <ng-container *ngIf=\"capItem.capSubItems && role[capItem.name]\">\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capSubItem of capItem.capSubItems\">\r\n\r\n <mat-checkbox *ngIf=\"capSubItem.isBool\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capSubItem.name]\">\r\n {{capSubItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capSubItem.isBool\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capSubItem.display\"\r\n [(value)]=\"role[capSubItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n <ng-container *ngIf=\"capSubItem.capSubItems\">\r\n\r\n <div class=\"tin-row\" *ngFor=\"let capSubSubItem of capSubItem.capSubItems\">\r\n\r\n <mat-checkbox *ngIf=\"capSubSubItem.isBool\"\r\n color=\"primary\" style=\"min-width: 100px;\" [(ngModel)]=\"role[capSubSubItem.name]\">\r\n {{capSubSubItem.display}}\r\n </mat-checkbox>\r\n\r\n <spa-select\r\n *ngIf=\"!capSubSubItem.isBool\"\r\n [options]=\"roleAccessOptions\"\r\n optionDisplay=\"name\"\r\n optionValue=\"value\"\r\n [display]=\"capSubSubItem.display\"\r\n [(value)]=\"role[capSubSubItem.name]\"\r\n width=\"100px\" style=\"font-size: 12px;\">\r\n </spa-select>\r\n\r\n </div>\r\n\r\n </ng-container>\r\n\r\n\r\n\r\n </div>\r\n\r\n </ng-container>\r\n\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <mat-card-actions>\r\n\r\n <button mat-mini-fab color=\"primary\" (click)=\"updateRole(role)\" style=\"margin-right:10px;\">\r\n <mat-icon>done_all</mat-icon>\r\n </button>\r\n\r\n <button mat-mini-fab color=\"warn\" (click)=\"deleteRole(role)\" style=\"margin-right:10px\">\r\n <mat-icon>delete</mat-icon>\r\n </button>\r\n\r\n </mat-card-actions>\r\n\r\n </mat-card>\r\n\r\n </div>\r\n\r\n\r\n</div>\r\n\r\n", styles: [".mat-mini-fab{width:32px;height:32px}.mat-mini-fab mat-icon{font-size:16px;margin-top:-3px}.refreshIcon{font-size:22px!important;margin-top:-7px!important}\n"] }]
|
|
9931
10003
|
}], ctorParameters: function () { return [{ type: HttpService }, { type: i1$2.Router }, { type: AuthService }, { type: DataServiceLib }, { type: DialogService }, { type: i4.MatDialog }, { type: MessageService }]; } });
|
|
9932
10004
|
|
|
9933
10005
|
class CreateAccountComponent {
|