File
Implements
Metadata
| selector |
cd-rgw-user-details |
| styleUrls |
./rgw-user-details.component.scss |
| templateUrl |
./rgw-user-details.component.html |
Index
Properties
|
|
|
Methods
|
|
|
Inputs
|
|
|
Constructor
constructor(rgwUserService: RgwUserService, bsModalService: BsModalService, i18n: I18n)
|
|
|
Parameters :
| Name |
Type |
Optional |
| rgwUserService |
RgwUserService
|
No
|
| bsModalService |
BsModalService
|
No
|
| i18n |
I18n
|
No
|
|
Methods
|
ngOnChanges
|
ngOnChanges()
|
|
|
|
|
|
showKeyModal
|
showKeyModal()
|
|
|
|
|
|
Public
accessKeyTpl
|
Type : TemplateRef<any>
|
Decorators :
@ViewChild('accessKeyTpl')
|
|
|
|
keys
|
Type : any
|
Default value : []
|
|
|
|
Public
secretKeyTpl
|
Type : TemplateRef<any>
|
Decorators :
@ViewChild('secretKeyTpl')
|
|
|
import { Component, Input, OnChanges, OnInit, TemplateRef, ViewChild } from '@angular/core';
import { I18n } from '@ngx-translate/i18n-polyfill';
import * as _ from 'lodash';
import { BsModalService } from 'ngx-bootstrap/modal';
import { RgwUserService } from '../../../shared/api/rgw-user.service';
import { CdTableColumn } from '../../../shared/models/cd-table-column';
import { CdTableSelection } from '../../../shared/models/cd-table-selection';
import { RgwUserS3Key } from '../models/rgw-user-s3-key';
import { RgwUserSwiftKey } from '../models/rgw-user-swift-key';
import { RgwUserS3KeyModalComponent } from '../rgw-user-s3-key-modal/rgw-user-s3-key-modal.component';
import { RgwUserSwiftKeyModalComponent } from '../rgw-user-swift-key-modal/rgw-user-swift-key-modal.component';
@Component({
selector: 'cd-rgw-user-details',
templateUrl: './rgw-user-details.component.html',
styleUrls: ['./rgw-user-details.component.scss']
})
export class RgwUserDetailsComponent implements OnChanges, OnInit {
@ViewChild('accessKeyTpl')
public accessKeyTpl: TemplateRef<any>;
@ViewChild('secretKeyTpl')
public secretKeyTpl: TemplateRef<any>;
@Input()
selection: CdTableSelection;
// Details tab
user: any;
// Keys tab
keys: any = [];
keysColumns: CdTableColumn[] = [];
keysSelection: CdTableSelection = new CdTableSelection();
constructor(
private rgwUserService: RgwUserService,
private bsModalService: BsModalService,
private i18n: I18n
) {}
ngOnInit() {
this.keysColumns = [
{
name: this.i18n('Username'),
prop: 'username',
flexGrow: 1
},
{
name: this.i18n('Type'),
prop: 'type',
flexGrow: 1
}
];
}
ngOnChanges() {
if (this.selection.hasSelection) {
this.user = this.selection.first();
// Sort subusers and capabilities.
this.user.subusers = _.sortBy(this.user.subusers, 'id');
this.user.caps = _.sortBy(this.user.caps, 'type');
// Load the user/bucket quota of the selected user.
this.rgwUserService.getQuota(this.user.uid).subscribe((resp: object) => {
_.extend(this.user, resp);
});
// Process the keys.
this.keys = [];
this.user.keys.forEach((key: RgwUserS3Key) => {
this.keys.push({
id: this.keys.length + 1, // Create an unique identifier
type: 'S3',
username: key.user,
ref: key
});
});
this.user.swift_keys.forEach((key: RgwUserSwiftKey) => {
this.keys.push({
id: this.keys.length + 1, // Create an unique identifier
type: 'Swift',
username: key.user,
ref: key
});
});
this.keys = _.sortBy(this.keys, 'user');
}
}
updateKeysSelection(selection: CdTableSelection) {
this.keysSelection = selection;
}
showKeyModal() {
const key = this.keysSelection.first();
const modalRef = this.bsModalService.show(
key.type === 'S3' ? RgwUserS3KeyModalComponent : RgwUserSwiftKeyModalComponent
);
switch (key.type) {
case 'S3':
modalRef.content.setViewing();
modalRef.content.setValues(key.ref.user, key.ref.access_key, key.ref.secret_key);
break;
case 'Swift':
modalRef.content.setValues(key.ref.user, key.ref.secret_key);
break;
}
}
}
<tabset *ngIf="selection.hasSingleSelection">
<tab i18n-heading
heading="Details">
<div *ngIf="user">
<table class="table table-striped table-bordered">
<tbody>
<tr>
<td i18n
class="bold col-sm-1">Username</td>
<td class="col-sm-3">{{ user.uid }}</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">Full name</td>
<td class="col-sm-3">{{ user.display_name }}</td>
</tr>
<tr *ngIf="user.email.length">
<td i18n
class="bold col-sm-1">Email address</td>
<td class="col-sm-3">{{ user.email }}</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">Suspended</td>
<td class="col-sm-3">{{ user.suspended | booleanText }}</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">System</td>
<td class="col-sm-3">{{ user.system | booleanText }}</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">Maximum buckets</td>
<td class="col-sm-3">{{ user.max_buckets }}</td>
</tr>
<tr *ngIf="user.subusers && user.subusers.length">
<td i18n
class="bold col-sm-1">Subusers</td>
<td class="col-sm-3">
<div *ngFor="let subuser of user.subusers">
{{ subuser.id }} ({{ subuser.permissions }})
</div>
</td>
</tr>
<tr *ngIf="user.caps && user.caps.length">
<td i18n
class="bold col-sm-1">Capabilities</td>
<td class="col-sm-3">
<div *ngFor="let cap of user.caps">
{{ cap.type }} ({{ cap.perm }})
</div>
</td>
</tr>
</tbody>
</table>
<!-- User quota -->
<div *ngIf="user.user_quota">
<legend i18n>User quota</legend>
<table class="table table-striped table-bordered">
<tbody>
<tr>
<td i18n
class="bold col-sm-1">Enabled</td>
<td class="col-sm-3">{{ user.user_quota.enabled | booleanText }}</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">Maximum size</td>
<td *ngIf="user.user_quota.max_size <= -1"
i18n
class="col-sm-3">Unlimited</td>
<td *ngIf="user.user_quota.max_size > -1"
class="col-sm-3">
{{ user.user_quota.max_size | dimlessBinary }}
</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">Maximum objects</td>
<td *ngIf="user.user_quota.max_objects <= -1"
i18n
class="col-sm-3">Unlimited</td>
<td *ngIf="user.user_quota.max_objects > -1"
class="col-sm-3">
{{ user.user_quota.max_objects }}
</td>
</tr>
</tbody>
</table>
</div>
<!-- Bucket quota -->
<div *ngIf="user.bucket_quota">
<legend i18n>Bucket quota</legend>
<table class="table table-striped table-bordered">
<tbody>
<tr>
<td i18n
class="bold col-sm-1">Enabled</td>
<td class="col-sm-3">{{ user.bucket_quota.enabled | booleanText }}</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">Maximum size</td>
<td *ngIf="user.bucket_quota.max_size <= -1"
i18n
class="col-sm-3">Unlimited</td>
<td *ngIf="user.bucket_quota.max_size > -1"
class="col-sm-3">
{{ user.bucket_quota.max_size | dimlessBinary }}
</td>
</tr>
<tr>
<td i18n
class="bold col-sm-1">Maximum objects</td>
<td *ngIf="user.bucket_quota.max_objects <= -1"
i18n
class="col-sm-3">Unlimited</td>
<td *ngIf="user.bucket_quota.max_objects > -1"
class="col-sm-3">
{{ user.bucket_quota.max_objects }}
</td>
</tr>
</tbody>
</table>
</div>
</div>
</tab>
<tab i18n-heading
heading="Keys">
<cd-table [data]="keys"
[columns]="keysColumns"
columnMode="flex"
selectionType="multi"
forceIdentifier="true"
(updateSelection)="updateKeysSelection($event)">
<div class="table-actions">
<div class="btn-group"
dropdown>
<button type="button"
class="btn btn-sm btn-primary"
[disabled]="!keysSelection.hasSingleSelection"
(click)="showKeyModal()">
<i class="fa fa-eye"></i>
<ng-container i18n>Show</ng-container>
</button>
</div>
</div>
</cd-table>
</tab>
</tabset>
Legend
Html element with directive