parent
a276a37d3d
commit
7737fce36a
@ -0,0 +1,37 @@
|
||||
<h1 mat-dialog-title>Sort Entries</h1>
|
||||
<div mat-dialog-content>
|
||||
<div class="sort-input-list">
|
||||
<div class="sort-input-row" *ngFor="let sortKey of sortEntries">
|
||||
<mat-form-field>
|
||||
<mat-label>Key</mat-label>
|
||||
<mat-select required [(value)]="sortKey.sortType">
|
||||
<mat-option value="Namespace">Namespace</mat-option>
|
||||
<mat-option value="FileName">File Name</mat-option>
|
||||
<mat-option value="FileSize">File Size</mat-option>
|
||||
<mat-option value="FileImportedTime">Time Imported</mat-option>
|
||||
<mat-option value="FileCreatedTime">Time Created</mat-option>
|
||||
<mat-option value="FileChangeTime">Time Changed</mat-option>
|
||||
<mat-option value="FileType">File Type</mat-option>
|
||||
<mat-option value="NumTags">Number of Tags</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="sortKey.sortType === 'Namespace'">
|
||||
<mat-label>Namespace Name</mat-label>
|
||||
<input #namespaceInput matInput required [value]="sortKey.namespaceName ?? ''" (change)="sortKey.namespaceName = namespaceInput.value">
|
||||
</mat-form-field>
|
||||
<div class="filler" *ngIf="sortKey.sortType !== 'Namespace'"></div>
|
||||
<mat-form-field>
|
||||
<mat-label>Direction</mat-label>
|
||||
<mat-select [(value)]="sortKey.sortDirection" required>
|
||||
<mat-option value="Ascending">Ascending</mat-option>
|
||||
<mat-option value="Descending">Descending</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<button *ngIf="sortEntries.indexOf(sortKey) === sortEntries.length -1" mat-flat-button (click)="addNewSortKey()"><mat-icon>add</mat-icon></button>
|
||||
<button *ngIf="sortEntries.indexOf(sortKey) !== sortEntries.length -1" mat-flat-button (click)="removeSortKey(sortKey)"><mat-icon>remove</mat-icon></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dialog-actions" mat-dialog-actions>
|
||||
<button mat-flat-button color="primary" (click)="confirmSort()">Sort</button>
|
||||
</div>
|
||||
@ -0,0 +1,24 @@
|
||||
mat-dialog-content {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.sort-input-list {
|
||||
display: table;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sort-input-row {
|
||||
display: table-row;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
mat-form-field, .filler {
|
||||
display: table-cell;
|
||||
padding: 0 1em;
|
||||
}
|
||||
|
||||
.dialog-actions {
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { FilterDialogComponent } from './filter-dialog.component';
|
||||
|
||||
describe('FilterDialogComponent', () => {
|
||||
let component: FilterDialogComponent;
|
||||
let fixture: ComponentFixture<FilterDialogComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ FilterDialogComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(FilterDialogComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,31 @@
|
||||
import {Component, Inject} from '@angular/core';
|
||||
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
|
||||
import {SortKey} from "../../../models/SortKey";
|
||||
|
||||
@Component({
|
||||
selector: 'app-filter-dialog',
|
||||
templateUrl: './filter-dialog.component.html',
|
||||
styleUrls: ['./filter-dialog.component.scss']
|
||||
})
|
||||
export class FilterDialogComponent {
|
||||
|
||||
public sortEntries: SortKey[] = []
|
||||
|
||||
constructor(public dialogRef: MatDialogRef<FilterDialogComponent>, @Inject(MAT_DIALOG_DATA) data: any) {
|
||||
this.sortEntries = data.sortEntries;
|
||||
}
|
||||
|
||||
addNewSortKey() {
|
||||
const sortKey = new SortKey("FileName", "Ascending", undefined);
|
||||
this.sortEntries.push(sortKey)
|
||||
}
|
||||
|
||||
public removeSortKey(sortKey: SortKey): void {
|
||||
const index = this.sortEntries.indexOf(sortKey);
|
||||
this.sortEntries.splice(index, 1);
|
||||
}
|
||||
|
||||
public confirmSort(): void {
|
||||
this.dialogRef.close(this.sortEntries);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,29 @@
|
||||
export class SortKey {
|
||||
|
||||
|
||||
constructor(
|
||||
public sortType: "Namespace" | "FileName" | "FileSize" | "FileImportedTime" | "FileCreatedTime" | "FileChangeTime" | "FileType" | "NumTags",
|
||||
public sortDirection: "Ascending" | "Descending",
|
||||
public namespaceName: string | undefined
|
||||
) {}
|
||||
|
||||
public toString(): string {
|
||||
if (this.sortType == "Namespace") {
|
||||
return `${this.sortType} '${this.namespaceName}' ${this.sortDirection}`
|
||||
} else {
|
||||
return `${this.sortType} ${this.sortDirection}`
|
||||
}
|
||||
}
|
||||
|
||||
public toBackendType(): any {
|
||||
|
||||
if (this.sortType == "Namespace") {
|
||||
return {"Namespace": {direction: this.sortDirection, tag: this.namespaceName}}
|
||||
} else {
|
||||
let returnObj: any = {};
|
||||
returnObj[this.sortType] = this.sortDirection;
|
||||
|
||||
return returnObj;
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue