static-assets/static-assets-file-picker/static-assets-file-picker.component.ts
| providers |
{
provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => StaticAssetsFilePickerComponent), multi: true
}
|
| selector | c8y-static-assets-file-picker |
| standalone | true |
| imports |
CoreModule
TooltipModule
|
| templateUrl | ./static-assets-file-picker.component.html |
Properties |
Methods |
Inputs |
constructor(staticAssetsModal: StaticAssetsModalService, staticAssets: StaticAssetsService)
|
|||||||||
|
Parameters :
|
| isCSSURL |
Type : boolean
|
Default value : false
|
| layout |
Type : StaticAssetsModalComponent
|
Default value : 'grid'
|
| size |
Type : number
|
Default value : 48
|
| staticAssetType |
Type : StaticAssetsModalComponent
|
Default value : 'branding'
|
| supportedFileExtensions |
Type : StaticAssetsModalComponent
|
Default value : []
|
| clear |
clear()
|
|
Returns :
void
|
| Async loadFileDetails | ||||||
loadFileDetails(currentUrl: string)
|
||||||
|
Parameters :
Returns :
any
|
| Async openFilePicker |
openFilePicker()
|
|
Returns :
any
|
| registerOnChange | ||||||
registerOnChange(fn: (value: string) => void)
|
||||||
|
Parameters :
Returns :
void
|
| registerOnTouched | ||||||
registerOnTouched(fn: () => void)
|
||||||
|
Parameters :
Returns :
void
|
| writeValue | ||||||
writeValue(value: string)
|
||||||
|
Parameters :
Returns :
void
|
| currentFile |
Type : StaticAsset | undefined
|
Default value : undefined
|
| currentValue |
Type : string
|
| loading |
Default value : false
|
<div class="d-flex a-i-center gap-8">
<div *ngIf="!currentValue else fileSelected" class="d-contents">
<i c8yIcon="no-image" class="icon-48 text-muted"></i>
<p class="m-r-auto text-muted"><em translate>No file selected.</em></p>
</div>
<ng-template #fileSelected>
<c8y-loading *ngIf="loading"></c8y-loading>
<div *ngIf="!loading && !currentFile">
<p translate>Unable to locate file: "{{ currentValue }}"</p>
</div>
<div *ngIf="!loading && currentFile" style="min-height: 48px" class="d-flex a-i-center">
<img *ngIf="currentFile" [src]="currentFile.path" class="img-responsive" [ngStyle]="{'width.px': size}" alt="{{currentFile?.fileName }}">
</div>
<span class="text-truncate" title="{{ currentFile?.fileName || currentValue }}">{{ currentFile?.fileName || currentValue }}</span>
<button class=" m-l-auto btn btn-dot btn-dot--danger"
type="button" (click)="clear()"
[delay]="500"
[attr.aria-label]="'Remove' | translate"
placement="top"
tooltip="{{'Remove' | translate}}">
<i c8yIcon="minus-circle"></i>
</button>
</ng-template>
<button (click)="openFilePicker()" class="btn btn-default btn-sm">
<span *ngIf="!currentFile">
{{'Select' | translate}}
</span>
<span *ngIf="currentFile">
{{'Replace' | translate}}
</span>
</button>
</div>