Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

Bulk actions on csv import file attributes dialog

Browse Source
This commit is contained in:
Adina Țeudan 2021-04-09 20:03:08 +03:00
parent a160aae8d9
commit e200d339eb
5 changed files with 83 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
apps/red-ui/src/app/modules/admin/screens/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.html
View File

@ -123,6 +123,20 @@
</span>
<ng-container *ngIf="areSomeFieldsSelected">
<redaction-circle-button
[matMenuTriggerFor]="readOnlyMenu"
tooltip="file-attributes-csv-import.table-header.actions.read-only"
type="dark-bg"
icon="red:read-only"
>
</redaction-circle-button>
<redaction-circle-button
[matMenuTriggerFor]="displayMenu"
tooltip="file-attributes-csv-import.table-header.actions.display"
type="dark-bg"
icon="red:visibility"
>
</redaction-circle-button>
<redaction-circle-button
(action)="deactivateSelection()"
tooltip="file-attributes-csv-import.table-header.actions.remove-selected"
@ -130,6 +144,45 @@
icon="red:trash"
>
</redaction-circle-button>
<div class="separator"></div>
<redaction-chevron-button
text="file-attributes-csv-import.table-header.actions.type"
[matMenuTriggerFor]="typeMenu"
></redaction-chevron-button>
<mat-menu #readOnlyMenu="matMenu" class="no-padding-bottom">
<button
mat-menu-item
(click)="setAttributeForSelection('readonly', true)"
translate="file-attributes-csv-import.table-header.actions.enable-read-only"
></button>
<button
mat-menu-item
(click)="setAttributeForSelection('readonly', false)"
translate="file-attributes-csv-import.table-header.actions.disable-read-only"
></button>
</mat-menu>
<mat-menu #displayMenu="matMenu" class="no-padding-bottom">
<button
mat-menu-item
(click)="setAttributeForSelection('display', true)"
translate="file-attributes-csv-import.table-header.actions.enable-display"
></button>
<button
mat-menu-item
(click)="setAttributeForSelection('display', false)"
translate="file-attributes-csv-import.table-header.actions.disable-display"
></button>
</mat-menu>
<mat-menu #typeMenu="matMenu" class="no-padding-bottom">
<button *ngFor="let type of ['Text', 'Number', 'Date']" mat-menu-item (click)="setAttributeForSelection('type', type)">
{{ 'file-attributes-csv-import.types.' + type | translate }}
</button>
</mat-menu>
</ng-container>
</div>

12
apps/red-ui/src/app/modules/admin/screens/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.scss
View File

@ -173,6 +173,18 @@
.all-caps-label {
margin-right: 10px;
}
redaction-circle-button {
margin-right: 2px;
}
.separator {
margin-left: 14px;
background-color: $separator;
width: 1px;
height: 30px;
margin-right: 16px;
}
}
cdk-virtual-scroll-viewport {

6
apps/red-ui/src/app/modules/admin/screens/file-attributes-csv-import-dialog/file-attributes-csv-import-dialog.component.ts
View File

@ -177,6 +177,12 @@ export class FileAttributesCsvImportDialogComponent implements OnInit {
this.selectedFields = [];
}
public setAttributeForSelection(attribute: string, value: any) {
for (const csvColumn of this.selectedFields) {
this.activeFields.find((f) => f.csvColumn === csvColumn)[attribute] = value;
}
}
public async save() {
await this._fileAttributesControllerService
.addOrUpdateFileAttributesConfig(

9
apps/red-ui/src/assets/i18n/en.json
View File

@ -1135,7 +1135,14 @@
"table-header": {
"title": "{{length}} file attributes",
"actions": {
"remove-selected": "Remove Selected"
"remove-selected": "Remove Selected",
"read-only": "Make Read-only",
"enable-read-only": "Enable Read-only for all attributes",
"disable-read-only": "Disable Read-only for all attributes",
"display": "Toggle Display",
"enable-display": "Enable Display for all attributes",
"disable-display": "Disable Display for all attributes",
"type": "Type"
}
},
"file": "File:",

4
apps/red-ui/src/assets/styles/red-menu.scss
View File

@ -12,6 +12,10 @@
padding-bottom: 24px;
}
&.no-padding-bottom .mat-menu-content:not(:empty) {
padding-bottom: 8px;
}
.mat-menu-item {
font-size: 13px;
color: $accent;