summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/pages/workspace/tosca-artifacts/tosca-artifact-page.component.html
blob: fe550642b1f2928bcb45d9d7ff4d0991cf64159e (plain)
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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<div class="tosca-artifact-page">
    <loader [display]="isLoading" [relative]="true"></loader>
    <ngx-datatable
            columnMode="flex"
            [headerHeight]="40"
            [rowHeight]="35"
            [reorderable]="false"
            [swapColumns]="false"
            [rows]="toscaArtifacts$ | async"
            [sorts]="[{prop: 'artifactDisplayName', dir: 'desc'}]"
            #toscaArtifactsTable
            (activate)="onActivate($event)">
        <ngx-datatable-row-detail [rowHeight]="80">
            <ng-template let-row="row" let-expanded="expanded" ngx-datatable-row-detail-template>
                <div>Label: {{row.artifactLabel}}</div>
                <div>UUID: {{row.artifactUUID}}</div>
                <div>Description: {{row.description}}</div>
            </ng-template>
        </ngx-datatable-row-detail>
        <ngx-datatable-column [resizeable]="false" name="Name" [flexGrow]="3"
                              [prop]="'artifactDisplayName'">
            <ng-template ngx-datatable-cell-template let-row="row" let-expanded="expanded">
                <div class="expand-collapse-cell">
                    <svg-icon [clickable]="true" class="expand-collapse-icon"
                              [name]="expanded ? 'caret1-up-o': 'caret1-down-o'" [mode]="'primary'"
                              [size]="'medium'"></svg-icon>
                    <span>{{row.artifactDisplayName }}</span>
                </div>
            </ng-template>
        </ngx-datatable-column>
        <ngx-datatable-column [resizeable]="false" name="Type" [flexGrow]="3">
            <ng-template ngx-datatable-cell-template let-row="row">
                {{row.artifactType}}
            </ng-template>
        </ngx-datatable-column>
        <ngx-datatable-column [resizeable]="false" name="Version" [flexGrow]="1">
            <ng-template ngx-datatable-cell-template let-row="row">
                {{ row.artifactVersion }}
            </ng-template>
        </ngx-datatable-column>
        <ngx-datatable-column *ngIf="isService() && isCheckedOut()" [resizeable]="false" name="Upload" [flexGrow]="1">
            <ng-template ngx-datatable-cell-template let-row="row">
                <div class="download-artifact-button">
                    <upload-artifact
                        [artifact]="row"
                        [componentId]="componentId"
                        [componentType]="componentType"
                        [disabled]="!isCheckedOut()"
                        [extensions]="getExtension(row.artifactType)"
                        (onFileUpload)="onFileUpload($event, row.artifactType)"
                        testId="upload_{{row.artifactDisplayName}}"
                    ></upload-artifact>
                </div>
            </ng-template>
        </ngx-datatable-column>
        <ngx-datatable-column [resizeable]="false" name="Download" [flexGrow]="1">
            <ng-template ngx-datatable-cell-template let-row="row">
                <div class="download-artifact-button">
                    <download-artifact [artifact]="row" [componentId]="componentId"
                                       [componentType]="componentType"
                                       testId="download_{{row.artifactDisplayName}}"></download-artifact>
                </div>
            </ng-template>
        </ngx-datatable-column>
    </ngx-datatable>
</div>