fix UI bugs for Webhooks

Signed-off-by: AllForNothing <sshijun@vmware.com>
This commit is contained in:
AllForNothing 2019-08-19 14:41:28 +08:00
parent 841ac24ebc
commit f11d4922d5
7 changed files with 21 additions and 11 deletions

View File

@ -1,4 +1,7 @@
<div class="row"> <div *ngIf="loadingWebhook" class="clr-row mt-2 center">
<span class="spinner spinner-md"></span>
</div>
<div class="row" *ngIf="!loadingWebhook">
<div *ngIf="!showCreate"> <div *ngIf="!showCreate">
<div> <div>
<div class="row flex-items-xs-between rightPos"> <div class="row flex-items-xs-between rightPos">
@ -20,7 +23,7 @@
<clr-dg-column>{{'WEBHOOK.STATUS' | translate}}</clr-dg-column> <clr-dg-column>{{'WEBHOOK.STATUS' | translate}}</clr-dg-column>
<clr-dg-column>{{'WEBHOOK.CREATED' | translate}}</clr-dg-column> <clr-dg-column>{{'WEBHOOK.CREATED' | translate}}</clr-dg-column>
<clr-dg-column>{{'WEBHOOK.LAST_TRIGGERED' | translate}}</clr-dg-column> <clr-dg-column>{{'WEBHOOK.LAST_TRIGGERED' | translate}}</clr-dg-column>
<clr-dg-row *ngFor="let item of lastTriggers"> <clr-dg-row *clrDgItems="let item of lastTriggers">
<clr-dg-cell>{{item.event_type}}</clr-dg-cell> <clr-dg-cell>{{item.event_type}}</clr-dg-cell>
<clr-dg-cell [ngSwitch]="item.enabled"> <clr-dg-cell [ngSwitch]="item.enabled">
<div *ngSwitchCase="true" class="icon-wrap"> <div *ngSwitchCase="true" class="icon-wrap">
@ -37,6 +40,7 @@
</clr-dg-row> </clr-dg-row>
<clr-dg-footer> <clr-dg-footer>
<span *ngIf="lastTriggerCount">1 - {{lastTriggerCount}} {{'WEBHOOK.OF' | translate}} </span> {{lastTriggerCount}} {{'WEBHOOK.ITEMS' | translate}} <span *ngIf="lastTriggerCount">1 - {{lastTriggerCount}} {{'WEBHOOK.OF' | translate}} </span> {{lastTriggerCount}} {{'WEBHOOK.ITEMS' | translate}}
<clr-dg-pagination [clrDgPageSize]="10"></clr-dg-pagination>
</clr-dg-footer> </clr-dg-footer>
</clr-datagrid> </clr-datagrid>
</div> </div>

View File

@ -35,3 +35,7 @@
.enabled-icon { .enabled-icon {
margin: -2px 5px 0 0; margin: -2px 5px 0 0;
} }
.center {
justify-content: center;
align-items: center;
}

View File

@ -50,6 +50,7 @@ export class WebhookComponent implements OnInit {
isEnabled: boolean; isEnabled: boolean;
loading: boolean = false; loading: boolean = false;
showCreate: boolean = false; showCreate: boolean = false;
loadingWebhook: boolean = true;
projectId: number; projectId: number;
projectName: string; projectName: string;
constructor( constructor(
@ -92,6 +93,7 @@ export class WebhookComponent implements OnInit {
getWebhook(projectId: number) { getWebhook(projectId: number) {
this.webhookService this.webhookService
.listWebhook(projectId) .listWebhook(projectId)
.pipe(finalize(() => (this.loadingWebhook = false)))
.subscribe( .subscribe(
response => { response => {
if (response.length) { if (response.length) {

View File

@ -341,8 +341,8 @@
}, },
"WEBHOOK": { "WEBHOOK": {
"EDIT_BUTTON": "EDIT", "EDIT_BUTTON": "EDIT",
"ENABLED_BUTTON": "ENABLED", "ENABLED_BUTTON": "ENABLE",
"DISABLED_BUTTON": "DISABLED", "DISABLED_BUTTON": "DISABLE",
"TYPE": "Webhook", "TYPE": "Webhook",
"STATUS": "Status", "STATUS": "Status",
"CREATED": "Created", "CREATED": "Created",

View File

@ -342,8 +342,8 @@
}, },
"WEBHOOK": { "WEBHOOK": {
"EDIT_BUTTON": "EDIT", "EDIT_BUTTON": "EDIT",
"ENABLED_BUTTON": "ENABLED", "ENABLED_BUTTON": "ENABLE",
"DISABLED_BUTTON": "DISABLED", "DISABLED_BUTTON": "DISABLE",
"TYPE": "Webhook", "TYPE": "Webhook",
"STATUS": "Status", "STATUS": "Status",
"CREATED": "Created", "CREATED": "Created",

View File

@ -334,8 +334,8 @@
}, },
"WEBHOOK": { "WEBHOOK": {
"EDIT_BUTTON": "EDIT", "EDIT_BUTTON": "EDIT",
"ENABLED_BUTTON": "ENABLED", "ENABLED_BUTTON": "ENABLE",
"DISABLED_BUTTON": "DISABLED", "DISABLED_BUTTON": "DISABLE",
"TYPE": "Webhook", "TYPE": "Webhook",
"STATUS": "Status", "STATUS": "Status",
"CREATED": "Created", "CREATED": "Created",

View File

@ -368,8 +368,8 @@
}, },
"WEBHOOK": { "WEBHOOK": {
"EDIT_BUTTON": "EDIT", "EDIT_BUTTON": "EDIT",
"ENABLED_BUTTON": "ENABLED", "ENABLED_BUTTON": "ENABLE",
"DISABLED_BUTTON": "DISABLED", "DISABLED_BUTTON": "DISABLE",
"TYPE": "Webhook", "TYPE": "Webhook",
"STATUS": "Status", "STATUS": "Status",
"CREATED": "Created", "CREATED": "Created",