Skip to content

Commit

Permalink
fix: layout of dry run[3141]
Browse files Browse the repository at this point in the history
  • Loading branch information
Ihar committed Dec 6, 2024
1 parent b3670e4 commit 7c3299d
Show file tree
Hide file tree
Showing 3 changed files with 83 additions and 58 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -182,86 +182,93 @@
<!-- ></tr>-->
<!-- </table>-->

<p-table [value]="documents" class="table" (sortFunction)="onSortChange($event)">
<p-table
[value]="documents"
class="table no-hover"
[rowHover]="false"
[selectionMode]="null"
[responsiveLayout]="'scroll'"
>
<ng-template pTemplate="header">
<tr>
<th pSortableColumn="history">
<th>
History
<p-sortIcon field="history"></p-sortIcon>
</th>

<ng-container *ngFor="let field of fields">
<ng-template [ngIf]="field.type === 'text' && field.name">
<th pSortableColumn="{{ field.index }}">
{{ field.title }}
<p-sortIcon field="{{ field.index }}"></p-sortIcon>
<help-icon *ngIf="field.tooltip" [text]="field.tooltip"></help-icon>
</th>
</ng-template>

<ng-template [ngIf]="!(field.type === 'text' && field.name)">
<th>
{{ field.title }}
<help-icon *ngIf="field.tooltip" [text]="field.tooltip"></help-icon>
</th>
</ng-template>
<th *ngIf="field.type === 'text' && field.name" pSortableColumn="{{ field.index }}">
{{ field.title }}
<!-- <p-sortIcon field="{{ field.index }}"></p-sortIcon>-->
<help-icon *ngIf="field.tooltip" [text]="field.tooltip"></help-icon>
</th>
<th *ngIf="!(field.type === 'text' && field.name)">
{{ field.title }}
<help-icon *ngIf="field.tooltip" [text]="field.tooltip"></help-icon>
</th>
</ng-container>

<th>Status Details</th>
</tr>
</ng-template>

<ng-template pTemplate="body" let-element>
<tr [ngClass]="{'has-history-row': element.history, revoked: element.option?.status === 'Revoked'}"
(click)="statusDetailed = statusDetailed === element ? null : element">

<tr
[ngClass]="{
'has-history-row': element.history,
revoked: element.option?.status === 'Revoked'
}"
(click)="statusDetailed = statusDetailed === element ? null : element"
>
<td>
<div *ngIf="element.history && element.history.length">
<i [ngClass]="statusDetailed === element ? 'pi pi-caret-down' : 'pi pi-caret-right'"></i>
<i [ngClass]="statusDetailed === element ? 'pi pi-chevron-down' : 'pi pi-chevron-right'"></i>
</div>
</td>

<ng-container *ngFor="let field of fields">
<td>
<div [style.width]="field.width">
<ng-container *ngIf="getGroup(element, field) as option">
<span *ngIf="option.type == 'text'" [title]="getText(element, option)" class="text">
{{ getText(element, option) }}
</span>
<span *ngIf="option.type == 'text'" [title]="getText(element, option)"
class="text">
{{ getText(element, option) }}
</span>
<span *ngIf="option.type == 'issuer'" [title]="getText(element, option)"
class="text">
{{ getIssuer(element, option) }}
</span>
{{ getIssuer(element, option) }}
</span>
<span *ngIf="option.type == 'array'" [title]="getText(element, option)"
class="text array">
{{ getText(element, option) }}
{{ getText(element, option) }}
<i class="pi pi-caret-down" (click)="onArray($event, element, option)"></i>
</span>
</span>
<span *ngIf="option.type == 'serials' && getArray(element, option)"
[title]="getText(element, option)" class="text serials">
<hedera-explorer
*ngFor="let serial of getArray(element, option)"
[params]="serial.tokenId"
[subParams]="serial.serial"
subType="serials"
type="tokens"
>{{ serial.serial }}</hedera-explorer>
<i class="pi pi-caret-down" (click)="onSerials($event, element, option)"></i>
</span>
<hedera-explorer
*ngFor="let serial of getArray(element, option)"
[params]="serial.tokenId"
[subParams]="serial.serial"
subType="serials"
type="tokens"
>
{{ serial.serial }}
</hedera-explorer>
<i class="pi pi-caret-down"
(click)="onSerials($event, element, option)"></i>
</span>
<span *ngIf="option.type == 'button'" class="col-btn"
(click)="$event.stopImmediatePropagation()">
<div (click)="onButton($event, element, option)" class="btn-field {{ option.uiClass }}">
{{ getText(element, option) }}
</div>
</span>
<div (click)="onButton($event, element, option)"
class="btn-field {{ option.uiClass }}">
{{ getText(element, option) }}
</div>
</span>
<div *ngIf="option.type == 'block'" class="col-btn"
(click)="$event.stopImmediatePropagation()">
<render-block
[block]="option._block"
[dryRun]="dryRun"
[policyId]="policyId"
[static]="getConfig(element, option, option._block)"
></render-block>
>
</render-block>
</div>
<div *ngIf="option.type == 'blocks'" class="col-btn col-blocks"
(click)="$event.stopImmediatePropagation()">
Expand All @@ -271,15 +278,17 @@
[dryRun]="dryRun"
[policyId]="policyId"
[static]="getConfig(element, option, block)"
></render-block>
>
</render-block>
</div>
</ng-container>
</div>
</td>
</ng-container>
</tr>

<td [attr.colspan]="fields.length + 1" *ngIf="statusDetailed === element"
class="expanded-detail">
<tr *ngIf="statusDetailed === element">
<td [attr.colspan]="fields.length + 1" class="expanded-detail">
<div class="timeline-container">
<div *ngFor="let historyElem of element.history" [attr.date-is]="historyElem.created"
class="timeline-item">
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -328,3 +328,19 @@ tr.revoked td:not(.mat-column-history) {
text-overflow: ellipsis;
white-space: nowrap;
}

::ng-deep .table.no-hover th,
::ng-deep .p-datatable .p-sortable-column.p-highlight:hover {
background-color: transparent;
cursor: default;
color: var(--color-grey-5, #495057);
}

::ng-deep .p-datatable-thead {
font-size: 14px;
font-weight: 400;
}

::ng-deep .p-datatable-tbody .pi {
font-size: 0.75rem;
}
20 changes: 10 additions & 10 deletions frontend/src/app/views/login/login.component.scss
Original file line number Diff line number Diff line change
Expand Up @@ -159,16 +159,16 @@ form {
}
}

//.primary-text-button {
// color: var(--color-primary, #4169E2);
// font-family: Inter, sans-serif;
// font-size: 14px;
// font-style: normal;
// font-weight: 500;
// line-height: 30px;
// /* 214.286% */
// cursor: pointer;
//}
.primary-text-button {
color: var(--color-primary, #4169E2);
font-family: Inter, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 30px;
/* 214.286% */
cursor: pointer;
}

.preloader {
width: 16px;
Expand Down

0 comments on commit 7c3299d

Please sign in to comment.