All files / src/app/components/file-upload file-upload.component.html

96.07% Statements 49/51
100% Branches 6/6
66.66% Functions 2/3
100% Lines 31/31

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44516x     5x 1037x 1032x 1x 1x 1x   5x 1032x 1x 1x 1x   5x   5x 5x 1032x   12x 388x 6x 6x 6x   5x     5x 256x 5x 261x 261x 128x   5x   5x   5x  
<p-fileupload #fileUpload name="myfile[]" [accept]="fileType" (onSelect)="updateSelectedFile($event)">
    <ng-template #header>
        <div>
            <div class="flex flex-row font-semibold text-lg gap-1">
                {{ headerText }}
                @if (required) {
                    <div class="text-red-500">
                        *
                    </div>
                }
            </div>
            @if (required) {
                <div class="text-red-500">
                    File is required.
                </div>
            }
        </div>
    </ng-template>
    <ng-template #content let-removeFileCallback="removeFileCallback" let-chooseCallback="chooseCallback">
        <div class="flex flex-column pt-2">
            @if (selectedFile === undefined) {
                <div class="flex align-items-center justify-content-center flex-column">
                    <p-button class="upload-button pt-2 pt-1" icon="pi pi-cloud-upload" title="Required"
                        [rounded]="true" [outlined]="true" severity="secondary"
                        (onClick)="onOpenFileFinder($event, chooseCallback)"/>
                    <p class="mt-6 mb-0">Drag and drop files to here to upload.</p>
                </div>
            }
            @else {
                <div class="flex justify-content-center flex-wrap gap-4">
                    <div class="border-round flex flex-column surface-border align-items-center gap-4">
                        <div>
                            <i class="{{ fileIcon }} text-7xl"></i>
                        </div>
                        <span class="font-semibold text-overflow-ellipsis max-w-15rem white-space-nowrap overflow-hidden">{{ selectedFile.name }}</span>
                        <div>{{ formatSize(selectedFile.size) }}</div>
                        <p-button icon="pi pi-times" (onClick)="onRemoveTemplatingFile($event, removeFileCallback, 0)" [outlined]="true" [rounded]="true" severity="danger" />
                    </div>
                </div>
            }
        </div>
    </ng-template>
</p-fileupload>