Commit d30be74b authored by Lukas Burgey's avatar Lukas Burgey

Change the visuals of the vo component

parent db947c60
......@@ -22,7 +22,7 @@ export class CredentialsComponent implements OnInit {
@Inject(MAT_DIALOG_DATA) public data: any,
) {
this.stateItem = data.stateItem;
this.service = data.service;
this.service = data.stateItem.service;
}
ngOnInit() {
......
......@@ -59,13 +59,12 @@ export class DialogService {
);
}
public openCredentials(service: t.Service, stateItem: t.DeploymentStateItem) {
public openCredentials(stateItem: t.DeploymentStateItem) {
this.credentialsDialog = this.dialog.open(
CredentialsComponent,
{
data: {
stateItem: stateItem,
service: service,
}
}
);
......
......@@ -3,7 +3,7 @@
<mat-panel-title style="min-width: 100px;">{{ group.name }}</mat-panel-title>
</mat-expansion-panel-header>
<div *ngIf="deploymentMapped()">
<div [ngSwitch]="deployment.state_target">
<div [ngSwitch]="deployment?.state_target">
<span *ngSwitchCase="'not_deployed'">
You currently did not request access to services of this VO.
</span>
......@@ -25,60 +25,51 @@
<tr>
<td style="min-width: 100px;">Site</td>
<td style="min-width: 100px;">Service</td>
<td style="min-width: 100px;">State</td>
<td style="min-width: 100px;">Message</td>
<td style="min-width: 75px;">State</td>
<td style="min-width: 200px;"></td>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let site of sites()">
<tr *ngFor="let service of servicesBySite(site);" style="height: 42px;">
<tr *ngFor="let item of deployment?.state_items" >
<td>
<span style="margin-right: 10px;" matTooltip="Site {{ site.name }} provides the service {{ service.name }} for members of {{ group.name }}">
<span style="margin-right: 10px;" matTooltip="Site {{ item.site.name }} provides the service {{ item.service.name }} for members of {{ item.group.name }}">
<mat-icon>account_balance</mat-icon>
{{ site.name }}
{{ item.site.name }}
</span>
</td>
<td>
<span style="margin-right: 10px;" matTooltip="{{ userService.serviceDescription(service) }}">
<span style="margin-right: 10px;" matTooltip="{{ userService.serviceDescription(item.service) }}">
<mat-icon>web</mat-icon>
{{ service.name }}
{{ item.service.name }}
</span>
</td>
<td>
<span [ngSwitch]="stateItem(service, site)?.state" class="childs-inline">
<button *ngSwitchCase="'deployed'" (click)="dialog.openCredentials(service, stateItem(service, site))" mat-button mat-icon-button matTooltip="The credentials are deployed for the service {{ service.name }}. Click to see details.">
<mat-icon>call_made</mat-icon>
</button>
<button *ngSwitchCase="'questionnaire'" (click)="dialog.openQuestionnaire(stateItem(service, site))" mat-button mat-icon-buttonmatTooltip="This site needs more data to deploy the keys. Please click to submit the data.">
<mat-icon>warning</mat-icon>
</button>
<span *ngSwitchCase="'deployment_pending'" mat-icon-button matTooltip="Waiting for the deployment of the credentials to the site {{ site.name }}">
<mat-progress-spinner diameter="24" mode="indeterminate"></mat-progress-spinner>
<span [ngSwitch]="item.state" class="childs-inline">
<mat-icon *ngSwitchCase="'deployed'" matTooltip="The credentials are deployed for the service {{ item.service.name }}. Click to see details.">call_made</mat-icon>
<mat-icon *ngSwitchCase="'questionnaire'" matTooltip="This site needs more data to deploy the keys. Please click to submit the data.">warning</mat-icon>
<mat-progress-spinner *ngSwitchCase="'deployment_pending'" diameter="24" mode="indeterminate" matTooltip="Waiting for the deployment of the credentials to the site {{ item.site.name }}"></mat-progress-spinner>
<mat-progress-spinner *ngSwitchCase="'removal_pending'" diameter="24" mode="indeterminate" matTooltip="Waiting for the removal of the credentials from the site {{ item.site.name }}"></mat-progress-spinner>
<mat-icon *ngSwitchCase="'not_deployed'" mat-icon-button matTooltip="The credentials are not deployed for the service {{ item.service.name }}.">call_received</mat-icon>
<mat-icon *ngSwitchCase="'failed'" mat-icon-button matTooltip="Site {{ item.site.name }} failed to deploy the credentials. The deployment will be retried. Click for details.">error</mat-icon>
<mat-icon *ngSwitchCase="'rejected'" mat-icon-button matTooltip="Site {{ item.site.name }} rejected the deployment of the credentials. Click for details.">error</mat-icon>
<mat-icon *ngSwitchDefault mat-icon-button matTooltip="Access to this service was never requested.">call_received</mat-icon>
</span>
<span *ngSwitchCase="'removal_pending'" mat-icon-button matTooltip="Waiting for the removal of the credentials from the site {{ site.name }}">
<mat-progress-spinner diameter="24" mode="indeterminate"></mat-progress-spinner>
</span>
<button *ngSwitchCase="'not_deployed'" mat-icon-button matTooltip="The credentials are not deployed for the service {{ service.name }}.">
<mat-icon>call_received</mat-icon>
</td>
<td>
<button *ngIf="item.state == 'questionnaire'" (click)="dialog.openQuestionnaire(item)" mat-raised-button class="mat-elevation-z6">
Questionnaire
</button>
<button *ngSwitchCase="'failed'" (click)="dialog.openMessage(stateItem(service, site))" mat-icon-button matTooltip="Site {{ site.name }} failed to deploy the credentials. The deployment will be retried. Click for details.">
<mat-icon>error</mat-icon>
<button *ngIf="item.state == 'deployed'" (click)="dialog.openCredentials(item)" mat-raised-button class="mat-elevation-z6">
Credentials
</button>
<button *ngSwitchCase="'rejected'" (click)="dialog.openMessage(stateItem(service, site))" mat-icon-button matTooltip="Site {{ site.name }} rejected the deployment of the credentials. Click for details.">
<mat-icon>error</mat-icon>
<button *ngIf="item.state == 'failed'" (click)="dialog.openMessage(item)" mat-raised-button class="mat-elevation-z6">
Failure
</button>
<button *ngSwitchDefault mat-icon-button matTooltip="Access to this service was never requested.">
<mat-icon>call_received</mat-icon>
<button *ngIf="item.state == 'rejected'" (click)="dialog.openMessage(item)" mat-raised-button class="mat-elevation-z6">
Rejected
</button>
</span>
</td>
<td>
<p>
{{ stateItem(service, site)?.message }}
</p>
</td>
</tr>
</ng-container>
</tbody>
</table>
</ng-template>
......@@ -88,16 +79,18 @@
membership of this VO.
</p>
</ng-template>
{{ deployment?.state_items | json }}
<mat-action-row>
<div [ngSwitch]="deployment?.state_target">
<button *ngSwitchCase="'not_deployed'" mat-raised-button color="accent" matTooltip="TODO" (click)="changeDeployment('add')">
Deploy credentials to services of VO {{ group.name }}
<button *ngSwitchCase="'not_deployed'" (click)="changeDeployment('add')" mat-raised-button color="primary" matTooltip="Deploy credentials to services of VO {{ group.name }}">
Deploy credentials
</button>
<button *ngSwitchCase="'deployed'" mat-raised-button color="accent" matTooltip="TODO" (click)="changeDeployment('remove')">
Remove credentials from services of VO {{ group.name }}
<button *ngSwitchCase="'deployed'" (click)="changeDeployment('remove')" mat-raised-button color="primary" matTooltip="Remove credentials from services of VO {{ group.name }}">
Remove credentials
</button>
<button *ngSwitchDefault mat-raised-button color="accent" matTooltip="TODO" (click)="changeDeployment('add')">
Deploy credentials to future services of VO {{ group.name }}
<button *ngSwitchDefault (click)="changeDeployment('add')" mat-raised-button color="primary" matTooltip="Deploy credentials to services of VO {{ group.name }}">
Deploy credentials
</button>
</div>
</mat-action-row>
......
......@@ -38,6 +38,9 @@ button.mat-button {
mat-icon {
vertical-align: middle;
}
button.mat-raised-button {
vertical-align: middle;
}
mat-checkbox {
margin-right: 10px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment