adding import package basic functionalities
[ccsdk/cds.git] / cds-ui / designer-client / src / app / modules / feature-modules / packages / packages-dashboard / package-list / package-list.component.html
1 <div class="row packages-card">
2     <div class="col-lg-3 col-md-6 d-flex">
3         <!--Add Package Card-->
4         <div class="card addPaackage-card">
5             <div class="card-body text-center">
6                 <img src="/assets/img/icon-addPackage.svg">
7             </div>
8             <div class="card-footer row">
9                 <div class="col text-center">
10                     <a tourAnchor="create" routerLink="/packages/createPackage" role="button" aria-pressed="true"
11                         class="btn-create-package float"><i class="icon-create-white" aria-hidden="true"></i>Create
12                         Package
13                     </a>
14                     <br />
15                     <a data-target="#importPackageModal" data-toggle="modal"  id="clone-btn" role="button"
16                        aria-pressed="true" class="btn-import-package float"><i
17                             class="icon-import-blue" aria-hidden="true"></i>Import Package
18                     </a>
19                     <ngx-ui-loader></ngx-ui-loader>
20                 </div>
21             </div>
22         </div>
23     </div>
24     <div class="col-lg-3 col-md-6 d-flex" *ngFor="let bluePrint of viewedPackages">
25         <!--Card 1-->
26         <div class="card">
27             <div class="card-body">
28                 <div class="row">
29                     <div class="col-10 pr-0">
30                         <a class="card-title" [routerLink]="['/packages/package', bluePrint.id]"
31                             (click)="testDispatch(bluePrint)">
32                             <!-- <img class="icon-deployed" src="/assets/img/icon-deploy.svg"> -->
33                             <p class="packageName" tooltip="{{bluePrint.artifactName}}" placement="bottom">
34                                 {{bluePrint.artifactName}}</p>
35                             <span class="package-version">v{{bluePrint.artifactVersion}}</span>
36                         </a>
37
38                     </div>
39                     <div class="col-2">
40                         <div class="dropdown">
41                             <input class="dropdown-toggle" type="text">
42                             <div class="dropdown-text">
43                                 <!-- <img src="/assets/img/icon-menuDots.svg" title="Actions"> -->
44                                 <i class="icon-menuDots" aria-hidden="true"></i>
45                             </div>
46                             <ul class="dropdown-content">
47                                 <li class="action-clone">
48                                     <a href="#">
49                                         <i class="icon-clone-sm" aria-hidden="true"></i>
50                                         Clone
51                                     </a>
52                                 </li>
53                                 <li class="action-archive">
54                                     <a href="#">
55                                         <i class="icon-archive-sm" aria-hidden="true"></i>
56                                         Archive
57                                     </a>
58                                 </li>
59                                 <li class="action-archive">
60                                     <a (click)="downloadPackage(bluePrint.artifactName,bluePrint.artifactVersion)">
61                                         <i class="icon-download" aria-hidden="true"></i>
62                                         Download
63                                     </a>
64                                 </li>
65                                 <li class="action-delete">
66                                     <a href="#">
67                                         <i class="icon-delete-sm" aria-hidden="true"></i>
68                                         Delete
69                                     </a>
70                                 </li>
71                             </ul>
72                         </div>
73
74                     </div>
75                 </div>
76                 <div class="row">
77                     <div class="col">
78                         <p class="mb-0 mt-1">Last modified {{ bluePrint.createdDate | date:'short' }}
79                         </p>
80                         <p class="mb-2">By {{bluePrint.updatedBy.split('<')[0]}}</p>
81                         <p class="package-desc" [delay]="300" tooltip="{{bluePrint.artifactDescription}}"
82                             placement="bottom left">{{bluePrint.artifactDescription}}</p>
83                         <ul class="package-contributers">
84                             <li>
85                                 <button type="button" class="border-fade" data-toggle="tooltip" data-placement="bottom"
86                                     title="User name">
87                                     <img src="/assets/img/img-user1.jpeg">
88                                 </button>
89                             </li>
90                             <li>
91                                 <button type="button" data-toggle="tooltip" data-placement="bottom" title="User name">
92                                     <img src="/assets/img/img-user2.jpg">
93                                 </button>
94                             </li>
95                             <li>
96                                 <button type="button" data-toggle="tooltip" data-placement="bottom" title="User name">
97                                     <img src="/assets/img/img-user3.jpg">
98                                 </button>
99                             </li>
100                             <li>
101                                 <a href="">5 contributors</a>
102                             </li>
103                         </ul>
104                     </div>
105                 </div>
106                 <div class="card-footer">
107                     <div class="row">
108
109                         <div class="col">
110                             <button type="button" (click)="view(bluePrint.id)" class="btn btn-card-config"><i
111                                     class="icon-btn-card-config" aria-hidden="true"></i>Configuration</button>
112                         </div>
113                         <div class="col">
114                             <button type="button" class="btn btn-card-topology"><i class="icon-btn-card-topology"
115                                     aria-hidden="true"></i>Designer Mode
116                             </button>
117                         </div>
118                     </div>
119                 </div>
120             </div>
121
122         </div>
123     </div>
124 </div>
125
126
127 <app-import-package></app-import-package>