fabric8-analytics-dep-editor
Version:
80 lines (79 loc) • 3.8 kB
HTML
<div id="list-start" class="list-group list-view-pf list-view-pf-view listElementComponent" [ngStyle]="{'border': isOpen === true ? '1px solid #bbbbbb' : '15px'}">
<div class="list-group-item list-group-item-action list-group-item-primary" *ngIf="dependency">
<div class="list-group-item-header" [ngStyle]="{'background': isOpen === true ? '#def3ff' : '#fff'}">
<div class="check">
<div class="list-view-pf-checkbox" *ngIf="fromAddDependency !== 'true'">
<input #dependency.name type="checkbox" class="check-dep" [ngStyle]="{'top': fromAddDependency === 'true' ? '29px' : '30px'}"
[checked]="saveTagname" (change)="changeTagname(saveTagname)">
</div>
<div class="list-view-pf-expand">
<span class="fa fa-angle-right" [ngClass]="{'fa ': true,'fa-angle-down': isOpen, 'fa-angle-right': !isOpen}" (click)="isOpen = !isOpen"></span>
</div>
</div>
<div class="list-view-pf-actions" [ngClass]="{'add-dependency-action': fromAddDependency === 'true'}">
<button class="btn btn-default close" (click)="removeCompanion(dependency)" *ngIf="fromAddDependency !== 'true'">
<span class="pficon pficon-remove"></span>
</button>
<button class="btn btn-default close" (click)="removeDependency(dependency)" *ngIf="fromAddDependency === 'true'">
<span class="pficon pficon-remove"></span>
</button>
</div>
<div class="list-view-pf-main-info">
<div class="list-view-pf-body">
<div class="list-view-pf-description" [ngStyle]="{'padding-top': fromAddDependency === 'true' ? 0 : '0px'}">
<div class="list-group-item-heading" [title]="dependency.name">
{{dependency.name}}
</div>
</div>
<div class="list-view-pf-additional-info">
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-stacked">
{{dependency.version}}
</div>
<div class="list-view-pf-additional-info-item list-view-pf-additional-info-item-stacked">
<strong *ngIf="dependency?.security?.length">
<span class="pficon-warning-triangle-o"></span>
</strong>
<strong *ngIf="!dependency?.security?.length">
<span class="pficon-ok"></span>
</strong>
<span id="security">Security</span>
</div>
</div>
</div>
</div>
<div class="list-view-pf-main-info reason">
{{dependency.reason}}
</div>
</div>
<div class="list-group-item-container container-fluid container-expand" *ngIf="isOpen">
<div class="row-table col-sm-11 col-sm-offset-1">
<table>
<thead>
<tr>
<th>Github Statistics:</th>
<td>Contributors</td>
<td>Dependent Repo.</td>
<td>Forks</td>
<td>Stars</td>
<td>Github Usage</td>
</tr>
</thead>
<tbody>
<tr>
<td> </td>
<td>{{dependency.github.contributors}}</td>
<td>{{dependency.github.dependent_repos}}</td>
<td>{{dependency.github.forks_count}}</td>
<td>{{dependency.github.stargazers_count}}</td>
<td>{{dependency.github.used_by.length}}</td>
</tr>
</tbody>
</table>
<p>
<span class="package-licence">Licenses:</span>
<span *ngFor="let license of dependency.licenses;let i= index;"><span *ngIf="(i+1) !== dependency.licenses.length" >{{license}}, </span><span *ngIf="(i+1) === dependency.licenses.length" >{{license}}.</span></span>
</p>
</div>
</div>
</div>
</div>