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

Delete file attribute

Browse Source
This commit is contained in:
Adina Țeudan 2021-03-23 01:47:31 +02:00
parent 9c38dd83cb
commit f0056fee56
9 changed files with 121 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/red-ui/src/app/app.module.ts
View File

@ -117,6 +117,7 @@ import { FileAttributesListingScreenComponent } from './screens/admin/file-attri
import { SearchInputComponent } from './components/search-input/search-input.component';
import { AppRoutingModule } from './app-routing.module';
import { AddEditFileAttributeDialogComponent } from './dialogs/add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component';
import { ConfirmDeleteFileAttributeDialogComponent } from './dialogs/confirm-delete-file-attribute-dialog/confirm-delete-file-attribute-dialog.component';
export function HttpLoaderFactory(httpClient: HttpClient) {
return new TranslateHttpLoader(httpClient, '/assets/i18n/', '.json');
@ -220,7 +221,8 @@ const matImports = [
PaginationComponent,
FileAttributesListingScreenComponent,
SearchInputComponent,
AddEditFileAttributeDialogComponent
AddEditFileAttributeDialogComponent,
ConfirmDeleteFileAttributeDialogComponent
],
imports: [
BrowserModule,

21
apps/red-ui/src/app/dialogs/confirm-delete-file-attribute-dialog/confirm-delete-file-attribute-dialog.component.html Normal file
View File

@ -0,0 +1,21 @@
<section class="dialog">
<div class="dialog-header heading-l">
{{ 'confirm-delete-file-attribute.title' | translate: { name: fileAttribute.name } }}
</div>
<div class="dialog-content">
<div class="heading" translate="confirm-delete-file-attribute.warning"></div>
<mat-checkbox *ngFor="let checkbox of checkboxes; let idx = index" [(ngModel)]="checkbox.value" color="primary">
{{ 'confirm-delete-file-attribute.checkbox-' + (idx + 1) | translate }}
</mat-checkbox>
</div>
<div class="dialog-actions">
<button [disabled]="!valid" color="primary" mat-flat-button (click)="deleteFileAttribute()">
{{ 'confirm-delete-file-attribute.delete' | translate }}
</button>
<div class="all-caps-label cancel" (click)="cancel()" translate="confirm-delete-file-attribute.cancel"></div>
</div>
<redaction-circle-button icon="red:close" mat-dialog-close class="dialog-close"></redaction-circle-button>
</section>

13
apps/red-ui/src/app/dialogs/confirm-delete-file-attribute-dialog/confirm-delete-file-attribute-dialog.component.scss Normal file
View File

@ -0,0 +1,13 @@
@import '../../../assets/styles/red-variables';
.dialog-header {
color: $primary;
}
.heading {
margin-bottom: 24px;
}
mat-checkbox:not(:last-of-type) {
margin-bottom: 6px;
}

38
apps/red-ui/src/app/dialogs/confirm-delete-file-attribute-dialog/confirm-delete-file-attribute-dialog.component.ts Normal file
View File

@ -0,0 +1,38 @@
import { Component, Inject } from '@angular/core';
import { AppStateService } from '../../state/app-state.service';
import { FileAttribute, FileAttributesControllerService } from '@redaction/red-ui-http';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
@Component({
selector: 'redaction-confirm-delete-file-attribute-dialog',
templateUrl: './confirm-delete-file-attribute-dialog.component.html',
styleUrls: ['./confirm-delete-file-attribute-dialog.component.scss']
})
export class ConfirmDeleteFileAttributeDialogComponent {
public fileAttribute: FileAttribute;
public ruleSetId: string;
public checkboxes = [{ value: false }, { value: false }];
constructor(
private readonly _appStateService: AppStateService,
private readonly _fileAttributesService: FileAttributesControllerService,
public dialogRef: MatDialogRef<ConfirmDeleteFileAttributeDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: { fileAttribute: FileAttribute; ruleSetId: string }
) {
this.fileAttribute = data.fileAttribute;
this.ruleSetId = data.ruleSetId;
}
public get valid() {
return this.checkboxes[0].value && this.checkboxes[1].value;
}
async deleteFileAttribute() {
console.log('deleting...');
this.dialogRef.close(true);
}
public cancel() {
this.dialogRef.close();
}
}

21
apps/red-ui/src/app/dialogs/dialog.service.ts
View File

@ -29,6 +29,7 @@ import { EditColorDialogComponent } from './edit-color-dialog/edit-color-dialog.
import { RemoveAnnotationsDialogComponent } from './remove-annotations-dialog/remove-annotations-dialog.component';
import { ForceRedactionDialogComponent } from './force-redaction-dialog/force-redaction-dialog.component';
import { AddEditFileAttributeDialogComponent } from './add-edit-file-attribute-dialog/add-edit-file-attribute-dialog.component';
import { ConfirmDeleteFileAttributeDialogComponent } from './confirm-delete-file-attribute-dialog/confirm-delete-file-attribute-dialog.component';
const dialogConfig = {
width: '662px',
@ -354,6 +355,26 @@ export class DialogService {
return ref;
}
public openConfirmDeleteFileAttributeDialog(
fileAttribute: FileAttribute,
ruleSetId: string,
cb?: Function
): MatDialogRef<ConfirmDeleteFileAttributeDialogComponent> {
const ref = this._dialog.open(ConfirmDeleteFileAttributeDialogComponent, {
...dialogConfig,
data: { fileAttribute, ruleSetId },
autoFocus: true
});
ref.afterClosed().subscribe((result) => {
if (result && cb) {
cb(result);
}
});
return ref;
}
openRemoveAnnotationModal($event: MouseEvent, annotation: AnnotationWrapper, callback: () => void) {
$event?.stopPropagation();

15
apps/red-ui/src/app/screens/admin/file-attributes-listing-screen/file-attributes-listing-screen.component.html
View File

@ -61,9 +61,9 @@
column="name"
></redaction-table-col-name>
<redaction-table-col-name label="file-attributes-listing.table-col-names.created-by" class="flex-center"></redaction-table-col-name>
<!-- <redaction-table-col-name label="file-attributes-listing.table-col-names.created-by" class="flex-center"></redaction-table-col-name>-->
<redaction-table-col-name label="file-attributes-listing.table-col-names.permissions" class="flex-center"></redaction-table-col-name>
<redaction-table-col-name label="file-attributes-listing.table-col-names.read-only" class="flex-center"></redaction-table-col-name>
<div></div>
@ -83,11 +83,10 @@
<div>
{{ attribute.name }}
</div>
<div class="center">
-
<!-- TODO-->
<!-- <redaction-initials-avatar [userId]="attribute.userId" [withName]="true" size="large"></redaction-initials-avatar>-->
</div>
<!-- TODO-->
<!-- <div class="center">-->
<!-- <redaction-initials-avatar [userId]="attribute.userId" [withName]="true" size="large"></redaction-initials-avatar>-->
<!-- </div>-->
<div class="center">
<redaction-circle-button
*ngIf="!attribute.editable"
@ -108,7 +107,7 @@
>
</redaction-circle-button>
<redaction-circle-button
(action)="openAddEditAttributeDialog($event, attribute)"
(action)="openConfirmDeleteAttributeDialog($event, attribute)"
tooltip="file-attributes-listing.action.delete"
tooltipPosition="before"
type="dark-bg"

4
apps/red-ui/src/app/screens/admin/file-attributes-listing-screen/file-attributes-listing-screen.component.scss
View File

@ -30,7 +30,7 @@ redaction-table-col-name::ng-deep {
cdk-virtual-scroll-viewport {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 1fr 1fr 1fr 1fr 11px;
grid-template-columns: auto 1fr 1fr 3fr 11px;
.table-item {
> div:not(.scrollbar-placeholder) {
@ -47,7 +47,7 @@ redaction-table-col-name::ng-deep {
&.has-scrollbar:hover {
::ng-deep.cdk-virtual-scroll-content-wrapper {
grid-template-columns: auto 1fr 1fr 1fr 1fr;
grid-template-columns: auto 1fr 1fr 3fr;
}
}
}

7
apps/red-ui/src/app/screens/admin/file-attributes-listing-screen/file-attributes-listing-screen.component.ts
View File

@ -81,6 +81,13 @@ export class FileAttributesListingScreenComponent implements OnInit {
});
}
public openConfirmDeleteAttributeDialog($event: MouseEvent, fileAttribute?: FileAttribute) {
$event.stopPropagation();
this._dialogService.openConfirmDeleteFileAttributeDialog(fileAttribute, this._appStateService.activeRuleSetId, async () => {
await this._loadData();
});
}
public toggleAttributeSelected($event: MouseEvent, attribute: FileAttribute) {
$event.stopPropagation();
const idx = this.selectedFileAttributeIds.indexOf(attribute.id);

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

@ -715,7 +715,7 @@
"table-col-names": {
"name": "Name",
"created-by": "Created by",
"permissions": "Permissions"
"read-only": "Read-Only"
},
"no-data": "No file attributes.",
"read-only": "Read-only",
@ -724,6 +724,14 @@
"delete": "Delete attribute"
}
},
"confirm-delete-file-attribute": {
"title": "Delete {{name}}",
"warning": "Warning: this cannot be undone!",
"delete": "Delete Attribute",
"cancel": "Keep Attribute",
"checkbox-1": "All documents it is used on will be impacted",
"checkbox-2": "All inputted details on the documents will be lost"
},
"user-listing": {
"table-header": {
"title": "{{length}} users"