paradizelost/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-04-02 13:45:10 -05:00
Code Issues Packages Projects Releases Wiki Activity

better selection

Browse Source
This commit is contained in:
jonaswinkler 2020-12-26 01:08:54 +01:00
parent 99b5e25731
commit 25fb9fb185
4 changed files with 12 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
View File

@ -1,11 +1,11 @@
<div class="card mb-3 bg-light shadow-sm" [class.card-selected]="selected" [class.document-card]="selectable"> <div class="card mb-3 bg-light shadow-sm" [class.card-selected]="selected" [class.document-card]="selectable">
<div class="row no-gutters"> <div class="row no-gutters">
<div class="col-md-2 d-none d-lg-block doc-img-background" [class.doc-img-background-selected]="selected"> <div class="col-md-2 d-none d-lg-block doc-img-background" [class.doc-img-background-selected]="selected">
<img [src]="getThumbUrl()" class="card-img doc-img border-right" (click)="selected = selectable ? !selected : false"> <img [src]="getThumbUrl()" class="card-img doc-img border-right" (click)="setSelected(selectable ? !selected : false)">
<div style="top: 0; left: 0" class="position-absolute border-right border-bottom bg-light p-1" [class.document-card-check]="!selected"> <div style="top: 0; left: 0" class="position-absolute border-right border-bottom bg-light p-1" [class.document-card-check]="!selected">
<div class="custom-control custom-checkbox"> <div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="smallCardCheck{{document.id}}" [checked]="selected" (change)="selected = $event.target.checked"> <input type="checkbox" class="custom-control-input" id="smallCardCheck{{document.id}}" [checked]="selected" (change)="setSelected($event.target.checked)">
<label class="custom-control-label" for="smallCardCheck{{document.id}}"></label> <label class="custom-control-label" for="smallCardCheck{{document.id}}"></label>
</div> </div>
</div> </div>

12
src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts
View File

@ -12,15 +12,11 @@ export class DocumentCardLargeComponent implements OnInit {
constructor(private documentService: DocumentService, private sanitizer: DomSanitizer) { } constructor(private documentService: DocumentService, private sanitizer: DomSanitizer) { }
_selected = false
get selected() {
return this._selected
}
@Input() @Input()
set selected(value: boolean) { selected = false
this._selected = value
setSelected(value: boolean) {
this.selected = value
this.selectedChange.emit(value) this.selectedChange.emit(value)
} }

4
src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
View File

@ -1,11 +1,11 @@
<div class="col p-2 h-100 document-card"> <div class="col p-2 h-100 document-card">
<div class="card h-100 shadow-sm" [class.card-selected]="selected"> <div class="card h-100 shadow-sm" [class.card-selected]="selected">
<div class="border-bottom" [class.doc-img-background-selected]="selected"> <div class="border-bottom" [class.doc-img-background-selected]="selected">
<img class="card-img doc-img" [src]="getThumbUrl()" (click)="selected = !selected"> <img class="card-img doc-img" [src]="getThumbUrl()" (click)="setSelected(!selected)">
<div style="top: 0; left: 0" class="position-absolute border-right border-bottom bg-light p-1" [class.document-card-check]="!selected"> <div style="top: 0; left: 0" class="position-absolute border-right border-bottom bg-light p-1" [class.document-card-check]="!selected">
<div class="custom-control custom-checkbox"> <div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="smallCardCheck{{document.id}}" [checked]="selected" (change)="selected = $event.target.checked"> <input type="checkbox" class="custom-control-input" id="smallCardCheck{{document.id}}" [checked]="selected" (change)="setSelected($event.target.checked)">
<label class="custom-control-label" for="smallCardCheck{{document.id}}"></label> <label class="custom-control-label" for="smallCardCheck{{document.id}}"></label>
</div> </div>
</div> </div>

12
src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts
View File

@ -12,15 +12,11 @@ export class DocumentCardSmallComponent implements OnInit {
constructor(private documentService: DocumentService) { } constructor(private documentService: DocumentService) { }
_selected = false
get selected() {
return this._selected
}
@Input() @Input()
set selected(value: boolean) { selected = false
this._selected = value
setSelected(value: boolean) {
this.selected = value
this.selectedChange.emit(value) this.selectedChange.emit(value)
} }