default-subscriptions/default-subscriptions.component.ts
The component shows the main view for managing default subscriptions configuration.
| selector | c8y-default-subscriptions |
| templateUrl | ./default-subscriptions.component.html |
Properties |
Methods |
|
constructor(fb: FormBuilder, defaultSubscriptionsService: DefaultSubscriptionsService, alertService: AlertService)
|
||||||||||||
|
Parameters :
|
| Async initForm |
initForm()
|
|
Loads the list of apps, builds the form and hooks value change events for override switches.
Returns :
any
|
| isEmptyView |
isEmptyView()
|
|
Checks if there are no application rows to be displayed.
Returns :
boolean
|
| isSubscribed | ||||||||||||
isSubscribed(app: IApplication, subscribedApps: PartialAppsList)
|
||||||||||||
|
Checks if given application is subscribed (present in the given list of applications).
Parameters :
Returns :
boolean
True, if the application is present in the list. |
| Async ngOnInit |
ngOnInit()
|
|
Initializes the loading of the form and the current settings.
Returns :
any
|
| Async save |
save()
|
|
Saves the current value of form object to backend.
Returns :
any
|
| shouldShowAppRow | ||||
shouldShowAppRow(appRowRawValue)
|
||||
|
Checks if given application row should be displayed. The row is displayed when any of its checkboxes is selected or any of the lists is being overridden.
Parameters :
Returns :
boolean
|
| currentDefaultSubscriptions |
Type : DefaultSubscriptions
|
|
Default subscriptions defined in the current tenant. |
| disabledCheckboxHint |
Default value : gettext('Select "Override inherited" to enable.')
|
|
Hint text for disabled checkboxes. |
| form |
Type : FormGroup
|
|
Form object. |
| loading |
Type : boolean
|
|
Whether the configuration is being loaded. |
| parentDefaultSubscriptions |
Type : DefaultSubscriptions
|
|
Default subscriptions inherited from parent tenant. |
<c8y-title>{{ 'Default subscriptions' | translate }}</c8y-title>
<form [formGroup]="form" (ngSubmit)="save()">
<div class="card card--fullpage col-lg-max">
<div class="card-header separator">
<h4 class="card-title" translate>Applications</h4>
</div>
<div class="inner-scroll">
<div class="sticky-top separator-bottom">
<div class="flex-row">
<div class="col-sm-6 col-xs-6 p-l-24 p-l-xs-16">
<p translate>
Configure default subscriptions in the platform, both for tenant creation and for
platform upgrade. To display a full list of available applications, override inherited
settings.
</p>
</div>
<div class="col-sm-6 col-xs-6 bg-gray-white p-16 text-center separator-bottom">
<div class="row">
<div class="col-sm-6 col-xs-6">
<p><strong translate>Subscribed on tenant creation</strong></p>
<div>
<label class="c8y-switch" title="{{ 'Override inherited' | translate }}">
<input type="checkbox" formControlName="overrideOnCreationSubscriptions" />
<span></span>
<span>
{{ 'Override inherited' | translate }}
</span>
</label>
</div>
</div>
<div class="col-sm-6 col-xs-6">
<p><strong translate>Subscribed on platform upgrade</strong></p>
<div>
<label class="c8y-switch" title="{{ 'Override inherited' | translate }}">
<input type="checkbox" formControlName="overrideOnUpgradeSubscriptions" />
<span></span>
<span>
{{ 'Override inherited' | translate }}
</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="card-block" *ngIf="loading"></div>
<div class="card-block card-block d-flex a-i-center j-c-center d-col" *ngIf="loading">
<c8y-loading></c8y-loading>
<span translate>Loading application subscriptions…</span>
</div>
<div class="card-block" *ngIf="loading"></div>
<ng-container formArrayName="appRows">
<div class="bg-gray-white" *ngIf="!loading && isEmptyView()"></div>
<div class="card-block bg-white" *ngIf="!loading && isEmptyView()">
<div class="c8y-empty-state">
<h1 class="c8y-icon c8y-icon-c8y-data c8y-icon-duocolor"></h1>
<h3 translate>No application subscriptions yet.</h3>
<p translate>
Select "Override inherited" to define the list of subscribed applications.
</p>
</div>
</div>
<div class="bg-gray-white" *ngIf="!loading && isEmptyView()"></div>
<div *ngFor="let appRowControl of form.get('appRows')['controls']; let i = index">
<ng-container
*ngIf="shouldShowAppRow(appRowControl.getRawValue())"
formArrayName="{{ i }}"
>
<div class="flex-row a-i-stretch">
<div class="col-sm-6 col-xs-6 separator-bottom">
<div class="c8y-list__item__block">
<div class="c8y-list__item__appicon">
<c8y-app-icon
[app]="appRowControl.value.app"
[name]="appRowControl.value.app.name"
[contextPath]="appRowControl.value.app.contextPath"
></c8y-app-icon>
</div>
<div class="c8y-list__item__body">
<div class="content-flex-30">
<div class="col-6">
<p
class="text-truncate"
title="{{ appRowControl.value.app | humanizeAppName | async }}"
>
{{ appRowControl.value.app | humanizeAppName | async }}
</p>
<small class="text-muted">{{ appRowControl.value.app.contextPath }}</small>
</div>
<div class="col-6 text-right-sm">
<p>
<span class="text-label-small m-r-4" translate> Tenant ID </span>
{{ appRowControl.value.app.owner.tenant.id }}
</p>
<!-- TODO: uncomment when company name is available
<p>
<span class="text-label-small m-r-4" translate>Company</span>
<small class="text-muted">company name</small>
</p> -->
</div>
</div>
</div>
</div>
</div>
<div
class="
col-sm-3 col-xs-3
bg-gray-white
separator-bottom
d-flex
j-c-center
a-i-center
"
>
<label
class="c8y-checkbox"
[ngClass]="{ disabled: appRowControl.controls.subscribedOnCreation.disabled }"
>
<input type="checkbox" formControlName="subscribedOnCreation" />
<span *ngIf="!appRowControl.controls.subscribedOnCreation.disabled"></span>
<span
*ngIf="appRowControl.controls.subscribedOnCreation.disabled"
title="{{ disabledCheckboxHint | translate }}"
></span>
</label>
</div>
<div
class="
col-sm-3 col-xs-3
bg-gray-white
separator-bottom
d-flex
j-c-center
a-i-center
"
>
<label
class="c8y-checkbox"
[ngClass]="{ disabled: appRowControl.controls.subscribedOnUpgrade.disabled }"
>
<input type="checkbox" formControlName="subscribedOnUpgrade" />
<span *ngIf="!appRowControl.controls.subscribedOnUpgrade.disabled"></span>
<span
*ngIf="appRowControl.controls.subscribedOnUpgrade.disabled"
title="{{ disabledCheckboxHint | translate }}"
></span>
</label>
</div>
</div>
</ng-container>
</div>
</ng-container>
</div>
<div class="card-footer separator">
<button
type="submit"
class="btn btn-primary"
[disabled]="form.invalid || form.pristine"
title="{{ 'Save default subscriptions' | translate }}"
>
{{ 'Save' | translate }}
</button>
</div>
</div>
</form>