mirror of https://github.com/Squidex/squidex.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
89 lines
3.8 KiB
89 lines
3.8 KiB
<div class="card" [class.selectable]="isSelectable" [class.border-primary]="isSelected" (click)="selected.emit(asset)" (sqxFileDrop)="updateFile($event)">
|
|
<div class="card-body">
|
|
<div class="file-preview" *ngIf="asset && progress == 0" @fade>
|
|
<span class="file-type" *ngIf="asset.fileType">
|
|
{{asset.fileType}}
|
|
</span>
|
|
|
|
<div *ngIf="asset.isImage" class="file-image">
|
|
<img [sqxImageSource]="asset | sqxAssetPreviewUrl">
|
|
</div>
|
|
<div *ngIf="!asset.isImage" class="file-icon-container">
|
|
<img class="file-icon" [attr.src]="asset | sqxFileIcon">
|
|
</div>
|
|
|
|
<div class="file-overlay">
|
|
<div class="file-overlay-background"></div>
|
|
|
|
<div class="file-menu">
|
|
<a class="file-edit" *ngIf="!isDisabled" (click)="renameDialog.show()">
|
|
<i class="icon-pencil"></i>
|
|
</a>
|
|
<a class="file-download" [attr.href]="asset | sqxAssetUrl" target="_blank" (click)="$event.stopPropagation()">
|
|
<i class="icon-download"></i>
|
|
</a>
|
|
|
|
<a class="file-delete" (click)="deleting.emit(asset); $event.stopPropagation()" *ngIf="!isDisabled && !removeMode">
|
|
<i class="icon-delete"></i>
|
|
</a>
|
|
<a class="file-delete" (click)="removing.emit(asset); $event.stopPropagation()" *ngIf="removeMode">
|
|
<i class="icon-close"></i>
|
|
</a>
|
|
</div>
|
|
|
|
<span class="file-overlay-type" *ngIf="asset.fileType">
|
|
{{asset.fileType}}
|
|
</span>
|
|
<span class="file-user">
|
|
<i class="icon-user"></i> {{asset.lastModifiedBy | sqxUserNameRef}}
|
|
</span>
|
|
<span class="file-modified">
|
|
{{asset.lastModified | sqxFromNow}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-footer" *ngIf="asset && progress == 0">
|
|
<div class="file-name" [attr.title]="asset.fileName">
|
|
{{asset.fileName}}
|
|
</div>
|
|
<div class="file-info">
|
|
<ng-container *ngIf="asset.pixelWidth">{{asset.pixelWidth}}x{{asset.pixelHeight}}px, </ng-container> {{asset.fileSize | sqxFileSize}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="upload-progress" *ngIf="progress > 0">
|
|
<sqx-progress-bar mode="Circle" [value]="progress"></sqx-progress-bar>
|
|
</div>
|
|
|
|
<div class="drop-overlay" *ngIf="asset && progress == 0">
|
|
<div class="drop-overlay-background"></div>
|
|
|
|
<span class="drop-overlay-text">Drop to update</span>
|
|
</div>
|
|
</div>
|
|
|
|
<ng-container *sqxModalView="renameDialog;onRoot:true">
|
|
<form [formGroup]="renameForm.form" (ngSubmit)="renameAsset()">
|
|
<sqx-modal-dialog (close)="cancelRenameAsset()">
|
|
<ng-container title>
|
|
Rename asset
|
|
</ng-container>
|
|
|
|
<ng-container content>
|
|
<div class="form-group">
|
|
<label for="assetName">Name</label>
|
|
|
|
<sqx-control-errors for="name" [submitted]="renameForm.submitted | async"></sqx-control-errors>
|
|
|
|
<input type="text" class="form-control" id="assetName" formControlName="name" autocomplete="off" sqxFocusOnInit />
|
|
</div>
|
|
</ng-container>
|
|
|
|
<ng-container footer>
|
|
<button type="reset" class="float-left btn btn-secondary" (click)="cancelRenameAsset()">Cancel</button>
|
|
<button type="submit" class="float-right btn btn-success">Rename</button>
|
|
</ng-container>
|
|
</sqx-modal-dialog>
|
|
</form>
|
|
</ng-container>
|