FarmMaps/FarmMapsLib
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

AW-432 add click for uploaded file
All checks were successful
FarmMaps.Develop/FarmMapsLib/develop This commit looks good
Details

Browse Source
This commit is contained in:
Willem Dantuma 2019-08-16 09:26:25 +02:00
parent c3a2383b2e
commit c5d7550750
5 changed files with 27 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
projects/common/src/lib/components/resumable-file-upload/resumable-file-upload.component.html
View File

@ -10,7 +10,8 @@
<div class="card-block p-3">
<ul class="list-unstyled">
<li *ngFor="let file of uploadService.files" class="upload-file busy" [ngClass]="{'done': file.success,'busy':file.success == false,'error': file.error }">
<div><span class="file-name" [attr.title]="file?.fileName">{{file.fileName}}</span><span class="fa fa-times" title="Cancel" (click)="uploadService.cancelFile(file)"></span><span class="fa fa-check"></span></div>
<div *ngIf="file.success == false"><span class="file-name" [attr.title]="file?.fileName">{{file.fileName}}</span><span class="fa fa-times" title="Cancel" (click)="uploadService.cancelFile(file)"></span><span class="fa fa-check"></span></div>
<div *ngIf="file.success"><a href="#" (click)="handleUploadedFileClick($event,file)" class="file-name" [attr.title]="file?.fileName">{{file.fileName}}</a><span class="fa fa-check"></span></div>
<div class="progress-container"><div class="progress-bar" [style.width]="file.progress+'%'"></div></div>
<div class="errormessage">{{file.errorMessage}}</div>
</li>

9
projects/common/src/lib/components/resumable-file-upload/resumable-file-upload.component.scss
View File

@ -68,6 +68,15 @@ div.card-header span.fa {
vertical-align: middle;
}
.upload-file > div > a.file-name {
display: inline-block;
width: calc(100% - 20px);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: middle;
}
.upload-file.busy > div > span.fa-times {
color: theme-color("danger");
width: 20px;

10
projects/common/src/lib/components/resumable-file-upload/resumable-file-upload.component.ts
View File

@ -1,4 +1,4 @@
import { Component, Input, HostListener, ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
import { Component, Input,Output, HostListener, ChangeDetectorRef, OnDestroy, OnInit,EventEmitter } from '@angular/core';
import { ResumableFileUploadService, File } from './resumable-file-upload.service';
import { Subscription } from 'rxjs';
@ -17,7 +17,8 @@ export class ResumableFileUploadComponent implements OnInit, OnDestroy {
this.uploadService.parentCode = parentCode;
else
this.uploadService.parentCode = null;
}
}
@Output() onUploadedFileClick:EventEmitter<string> = new EventEmitter();
constructor(private cd: ChangeDetectorRef, public uploadService: ResumableFileUploadService) {
}
@ -35,6 +36,11 @@ export class ResumableFileUploadComponent implements OnInit, OnDestroy {
if(this.refreshSub) this.refreshSub.unsubscribe();
}
handleUploadedFileClick(event:MouseEvent,file:File) {
event.preventDefault();
this.onUploadedFileClick.emit(file.identifier);
}
//TODO do this with an canunload guard
@HostListener('window:beforeunload')
windowBeforeUnload = function () {

7
src/assets/bootstrap.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
src/index.html
View File

@ -7,6 +7,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link href="assets/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<app-root></app-root>