fixed: error when showing videos

This commit is contained in:
1721518185
2023-12-19 20:00:36 +08:00
parent f2254cfd0c
commit a6a86e40ac
3 changed files with 23 additions and 8 deletions
@@ -1,2 +1,2 @@
<app-my-upload [filterCriteria]="username"></app-my-upload>
<app-my-upload filterCriteria="username"></app-my-upload>
@@ -3,15 +3,17 @@
<nz-row nzGutter="16">
<nz-col nzSpan="8" *ngFor="let item of images;let index = index">
<nz-card [nzHoverable]="true">
<nz-card-meta [title]="item.picTitle"></nz-card-meta>
<nz-card-meta nzTitle="{{item.picTitle}}"></nz-card-meta>
<img *ngIf="item.type.startsWith('image')" [src]="item.url" alt="Uploaded Image" class="media"/>
<video *ngIf="item.type.startsWith('video')" [src]="item.url" controls class="media"></video>
<audio *ngIf="item.type.startsWith('audio')" [src]="item.url" controls class="media"></audio>
<nz-card-meta [nzTitle]="'Upload by ' + username" [nzDescription]="item.uploadTime| date:'medium'"></nz-card-meta>
</nz-card>
<button nz-button nzType="primary" [ngStyle]="{ marginRight: '8px' }" (click)="previewImage(item)">Preview</button>
<button nz-button nzType="primary" [ngStyle]="{ marginRight: '8px' }" (click)="downloadImage(item.url)">Download</button>
<button nz-button nzType="primary" nzDanger (click)="deleteImage(index)">Delete</button>
<div *ngIf="filterCriteria=='username'">
<button nz-button nzType="primary" [ngStyle]="{ marginRight: '8px' }" (click)="previewImage(item)">Preview</button>
<button nz-button nzType="primary" [ngStyle]="{ marginRight: '8px' }" (click)="downloadImage(item.url)">Download</button>
<button nz-button nzType="primary" nzDanger (click)="deleteImage(index)">Delete</button>
</div>
</nz-col>
</nz-row>
@@ -112,10 +112,23 @@ export class MyUploadComponent implements OnInit {
const url = blob.getElementsByTagName('Url')[0].textContent || '';
const blobUrl = `${containerUrl}/${name}${this.extractSasToken()}`;
const picTitle = name.split('_')[0].replace(`${this.containerName}/`, '');
const extension = name.split('.').pop() || '';
let type = '';
const imageExtensions = ['jpg', 'jpeg', 'png', 'gif'];
const audioExtensions = ['mp3', 'wav'];
const videoExtensions = ['mp4', 'avi'];
if (imageExtensions.includes(extension)) {
type = `image/${extension}`;
}else if (audioExtensions.includes(extension)) {
type = `audio/${extension}`;
}else if (videoExtensions.includes(extension)) {
type = `video/${extension}`;
}else {
type = 'application/octet-stream';
}
this.images.push({
url: url,
type: 'image/jpeg',
type: type,
uploadTime: lastModified,
blobUrl: blobUrl,
picTitle: picTitle