gilles/scrutiny
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

working on expanding row content.

Browse Source
This commit is contained in:
Jason Kulatunga
2022-06-09 22:13:44 -07:00
parent cbd230a7e0
commit b9eb5687cd
3 changed files with 83 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webapp/frontend/src/app/modules/detail/detail.component.html
+53 -8
View File
@@ -329,17 +329,62 @@
<!-- Expanded Content Column - The detail row is made up of this one column that spans across all columns -->
<ng-container matColumnDef="expandedDetail">
<td mat-cell *matCellDef="let attribute" [attr.colspan]="smartAttributeTableColumns.length">
<div class="attribute-detail"
[@detailExpand]="attribute == expandedAttribute ? 'expanded' : 'collapsed'">
<div class="attribute-position-diagram">
<div class="attribute-position"> {{getAttributeName(attribute)}} </div>
<div class="attribute-symbol"> {{getAttributeName(attribute)}} </div>
<div class="attribute-name"> {{getAttributeName(attribute)}} </div>
<div class="attribute-weight"> {{getAttributeName(attribute)}} </div>
<div class="flex flex-auto w-1/3 min-w-80 py-4">
<div class="flex flex-col flex-auto justify-end text-md pb-3">
{{getAttributeDescription(attribute)}}
</div>
</div>
<div class="attribute-detail-description">
{{getAttributeDescription(attribute)}}
<span class="attribute-detail-description-attribution"> -- Wikipedia </span>
<div class="flex flex-auto w-2/3 min-w-80">
<div class="flex flex-col flex-auto justify-end text-md px-6 pb-3">
<div class="flex items-center justify-between py-3 border-b last:border-b-0 ng-star-inserted">
<div class="flex items-center w-1/4">Type</div>
<div class="flex items-center w-1/4">Value</div>
<div class="flex items-center w-1/4">Worst/Thresh</div>
<div class="flex items-center w-1/4">Failure</div>
</div>
<div class="flex items-center justify-between py-3 border-b last:border-b-0 ng-star-inserted">
<div class="flex items-center w-1/4">
<div class="flex-shrink-0 w-2 h-2 mr-3 rounded-full"
[ngClass]="{'bg-red': getAttributeScrutinyStatusName(attribute.status) === 'failed',
'bg-green': getAttributeScrutinyStatusName(attribute.status) === 'passed',
'bg-yellow': getAttributeStatusName(attribute.status) === 'warn'}"></div>
<div class="truncate">Scrutiny</div>
</div>
<div class="w-1/4 items-center font-medium">{{getAttributeValue(attribute)}}</div>
<div class="w-1/4 items-center text-secondary">--</div>
<div class="w-1/4 items-center text-secondary">{{(attribute.failure_rate | percent) || '--'}}</div>
</div>
<div class="flex items-center justify-between py-3 border-b last:border-b-0 ng-star-inserted">
<div class="flex items-center w-1/4">
<div class="flex-shrink-0 w-2 h-2 mr-3 rounded-full"
[ngClass]="{'bg-red': getAttributeSmartStatusName(attribute.status) === 'failed',
'bg-green': getAttributeSmartStatusName(attribute.status) === 'passed'}"
></div>
<div class="truncate">Normalized</div>
</div>
<div class="w-1/4 items-center font-medium">{{attribute.value}}</div>
<div class="w-1/4 items-center text-secondary">{{getAttributeWorst(attribute) || '--' }}/{{getAttributeThreshold(attribute)}}</div>
<div class="w-1/4 items-center text-secondary">--</div>
</div>
<div class="flex items-center justify-between py-3 border-b last:border-b-0 ng-star-inserted">
<div class="flex items-center w-1/4">
<div class="flex-shrink-0 w-2 h-2 mr-3 rounded-full"></div>
<div class="truncate">Raw</div>
</div>
<div class="w-1/4 items-center font-medium">{{attribute.raw_value}}</div>
<div class="w-1/4 items-center text-secondary">--</div>
<div class="w-1/4 items-center text-secondary">--</div>
</div>
</div>
</div>
</div>
</td>