101 lines
4.5 KiB
HTML
101 lines
4.5 KiB
HTML
<div class="ui-g" style="max-width: 1025px;">
|
|
<div class="ui-g-12">
|
|
<div class="card card-w-title">
|
|
<h1 i18n="@@customerInfo">Customer Information</h1>
|
|
<div class="ui-g ui-g-nopad" style="margin-top:40px">
|
|
<form [formGroup]="form">
|
|
<div class="ui-g-12 ui-g-nopad">
|
|
<user-profile-form formControlName="profile" [requireName]="true" [focusOnFirst]="isNew" [updateCountry]="true"></user-profile-form>
|
|
</div>
|
|
|
|
<div class="ui-g-12 ui-md-6 ui-lg-6 form-row">
|
|
<span style="margin-right:12px">
|
|
<ng-container i18n="@@premiumLevel">Premium Level</ng-container>:
|
|
</span>
|
|
<p-dropdown id="premium" name="premium" formControlName="premium" [options]="premiumLevels" [style]="{'min-width': '120px'}">
|
|
<ng-template let-type pTemplate="item">
|
|
<span>
|
|
<strong>{{ type.label }}</strong>
|
|
</span>
|
|
</ng-template>
|
|
</p-dropdown>
|
|
</div>
|
|
|
|
<div class="ui-g-12 ui-md-6 ui-lg-6 form-row">
|
|
<p-checkbox id="billable" name="billable" formControlName="billable" label="Billable" binary="true"></p-checkbox>
|
|
</div>
|
|
|
|
<div class="ui-g-12 ">
|
|
<ng-container *ngIf="hasPaidSubs(); else trialing">
|
|
<ng-container [ngTemplateOutlet]="fieldSet" [ngTemplateOutletContext]="{subs: paidSubs, label: SubTexts.paid}"></ng-container>
|
|
</ng-container>
|
|
<ng-template #trialing>
|
|
<ng-container *ngIf="hasTrialSubs(); else noTrialSubs">
|
|
<ng-container [ngTemplateOutlet]="fieldSet" [ngTemplateOutletContext]="{subs: trialSubs, label: SubTexts.trial}"></ng-container>
|
|
<trial formControlName="trials" [trialDays]="trialDays" [trials]="trials" [disable]="true"></trial>
|
|
</ng-container>
|
|
<ng-template #noTrialSubs>
|
|
<ng-container *ngIf="hasLastEndedTrial(); else newTrial">
|
|
<ng-container [ngTemplateOutlet]="lastTrial"></ng-container>
|
|
<trial formControlName="trials" [trialDays]="trialDays" [trials]="trials"></trial>
|
|
</ng-container>
|
|
<ng-template #newTrial>
|
|
<trial formControlName="trials" [trialDays]="trialDays" [trials]="trials"></trial>
|
|
</ng-template>
|
|
</ng-template>
|
|
</ng-template>
|
|
</div>
|
|
|
|
<div class="ui-g-12">
|
|
<p-messages [(value)]="msgs" [closable]="false"></p-messages>
|
|
<agm-account-editor formControlName="account" [isNew]="isNew" (userExisted)="onUserExisted($event)" required="true" i18n-title="@@accessAccount" title="Access Account" showActive="true">
|
|
</agm-account-editor>
|
|
</div>
|
|
<div class="ui-g-12 toolbar padtop1 ui-fluid">
|
|
<button pButton [disabled]="form.invalid" type="button" style="width:auto" [icon]="isNew ? 'ui-icon-plus' : 'ui-icon-save'" [label]="isNew ? globals.create : globals.save" (click)="saveCustomer(); false"></button>
|
|
<button pButton type="button" style="width:auto" class="amber-btn" icon="ui-icon-arrow-back" (click)="goBack()" [label]="globals.back"></button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ng-template #lastTrial>
|
|
<label class="theme-color">{{SubTexts.lastTrial}}</label>
|
|
<div>
|
|
<ul>
|
|
<li><strong>{{SubTexts.lastStartDate}}: {{toTimestamp(trials.lastStartDate) | tsToDate: lang}}</strong></li>
|
|
<li><strong>{{SubTexts.lastEndDate}}: {{toTimestamp(trials.lastEndDate) | tsToDate: lang}}</strong></li>
|
|
</ul>
|
|
</div>
|
|
</ng-template>
|
|
|
|
<ng-template #fieldSet let-label="label" let-subs="subs">
|
|
<fieldset>
|
|
<legend>{{SubTexts.labelSub}}</legend>
|
|
<div class="ui-g">
|
|
<div class="ui-g-6">
|
|
<label class="theme-color">{{label}}</label>
|
|
<div *ngFor="let sub of subs ">
|
|
<ng-container *ngIf="sub.items[0].price | subPkg as fullPkg">
|
|
<ul>
|
|
<li>
|
|
{{fullPkg.name}}
|
|
<div>
|
|
<strong>
|
|
{{SubTexts.startDate}}: {{sub.periodStart | tsToDate: lang}}
|
|
{{SubTexts.endDate}}: {{sub.periodEnd | tsToDate: lang}}
|
|
</strong>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</ng-container>
|
|
</div>
|
|
</div>
|
|
<div *ngIf="hasLastEndedTrial()" class="ui-g-6">
|
|
<ng-container [ngTemplateOutlet]="lastTrial"></ng-container>
|
|
</div>
|
|
</div>
|
|
</fieldset>
|
|
</ng-template> |