paradizelost/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-07-28 18:24:38 -05:00
Code Issues Packages Projects Releases Wiki Activity

Add back plus button which retains filter text

Browse Source
This commit is contained in:
Michael Shamoon
2021-04-04 17:05:27 -07:00
parent 46fe2da563
commit fd9a871f81
5 changed files with 89 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src-ui/src/app/components/common/input/select/select.component.html
View File

@@ -1,30 +1,45 @@
<div class="form-group paperless-input-select">
<label [for]="inputId">{{title}}</label>
<div>
<ng-select *ngIf="allowCreateNew; else noAddTag" name="inputId" [(ngModel)]="value"
[disabled]="disabled"
[style.color]="textColor"
[style.background]="backgroundColor"
[clearable]="allowNull"
[items]="items"
[addTag]="addItemRef"
bindLabel="name"
bindValue="id"
(blur)="onTouched()">
</ng-select>
<ng-template #noAddTag>
<ng-select name="inputId" [(ngModel)]="value"
<div [class.input-group]="allowCreateNew">
<ng-select *ngIf="allowCreateNew; else noAddTag" name="inputId" [(ngModel)]="value"
[disabled]="disabled"
[style.color]="textColor"
[style.background]="backgroundColor"
[clearable]="allowNull"
[items]="items"
[addTag]="addItemRef"
bindLabel="name"
bindValue="id"
(blur)="onTouched()">
(change)="onChange(value)"
(search)="onSearch($event)"
(focus)="clearLastSearchTerm()"
(clear)="clearLastSearchTerm()"
(blur)="onBlur()">
</ng-select>
</ng-template>
</div>
<ng-template #noAddTag>
<ng-select name="inputId" [(ngModel)]="value"
[disabled]="disabled"
[style.color]="textColor"
[style.background]="backgroundColor"
[clearable]="allowNull"
[items]="items"
bindLabel="name"
bindValue="id"
(change)="onChange(value)"
(search)="onSearch($event)"
(focus)="clearLastSearchTerm()"
(clear)="clearLastSearchTerm()"
(blur)="onBlur()">
</ng-select>
</ng-template>
<div *ngIf="allowCreateNew" class="input-group-append">
<button class="btn btn-outline-secondary" type="button" (click)="addItem()">
<svg class="buttonicon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#plus" />
</svg>
</button>
</div>
</div>
<small *ngIf="hint" class="form-text text-muted">{{hint}}</small>
<small *ngIf="getSuggestions().length > 0">
<span i18n>Suggestions:</span>&nbsp;

25
src-ui/src/app/components/common/input/select/select.component.ts
View File

@@ -39,6 +39,8 @@ export class SelectComponent extends AbstractInputComponent<number> {
public addItemRef: (name) => void
private _lastSearchTerm: string
get allowCreateNew(): boolean {
return this.createNew.observers.length > 0
}
@@ -52,7 +54,28 @@ export class SelectComponent extends AbstractInputComponent<number> {
}
addItem(name: string) {
this.createNew.next(name)
if (name) this.createNew.next(name)
else this.createNew.next(this._lastSearchTerm)
this.clearLastSearchTerm()
}
clickNew() {
this.createNew.next(this._lastSearchTerm)
this.clearLastSearchTerm()
}
clearLastSearchTerm() {
this._lastSearchTerm = null
}
onSearch($event) {
this._lastSearchTerm = $event.term
}
onBlur() {
setTimeout(() => {
this.clearLastSearchTerm()
}, 3000);
}
}