Headless CMS and Content Managment Hub
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

140 lines
6.9 KiB

<sqx-modal-dialog size="lg" fullHeight="true" (close)="emitComplete()" [showFooter]="step === 2 || step === 4">
<ng-container title>
<ng-container *ngIf="mode === 'EditTrigger'">
Edit Trigger
</ng-container>
<ng-container *ngIf="mode === 'EditAction'">
Edit Action
</ng-container>
<ng-container *ngIf="mode === 'Wizard'">
Create new Rule
</ng-container>
</ng-container>
<ng-container content>
<nav aria-label="breadcrumb" *ngIf="isWizard">
<ol class="breadcrumb steps">
<li class="breadcrumb-item" [class.active]="step === 1" [class.done]="step > 1">
<a class="force" (click)="go(1)" [class.disabled]="step <= 1">
<i class="icon-checkmark"></i> Select Trigger
</a>
</li>
<li class="breadcrumb-item" [class.active]="step === 2" [class.done]="step > 2">
<a class="force" (click)="go(2)" [class.disabled]="step <= 2">
<i class="icon-checkmark"></i> Edit Trigger
</a>
</li>
<li class="breadcrumb-item" [class.active]="step === 3" [class.done]="step > 3">
<a class="force" (click)="go(3)" [class.disabled]="step <= 3">
<i class="icon-checkmark"></i> Select Action
</a>
</li>
<li class="breadcrumb-item" [class.active]="step === 4">
<i class="icon-checkmark"></i> Edit Action
</li>
</ol>
</nav>
<ng-container [ngSwitch]="step">
<ng-container *ngSwitchCase="1">
<sqx-form-alert>
The selection of the trigger type cannot be changed later.
</sqx-form-alert>
<div class="row no-gutters">
<div *ngFor="let triggerType of ruleTriggers | sqxKeys" class="col-12 col-md-6">
<div class="rule-element" (click)="selectTriggerType(triggerType)">
<sqx-rule-element [type]="triggerType" [isSmall]="false" [element]="ruleTriggers[triggerType]"></sqx-rule-element>
</div>
</div>
</div>
</ng-container>
<ng-container *ngSwitchCase="2">
<form [formGroup]="triggerForm.form" (ngSubmit)="saveTrigger()">
<h3 class="wizard-title">
{{triggerElement.display}}
</h3>
<ng-container [ngSwitch]="trigger.triggerType">
<ng-container *ngSwitchCase="'AssetChanged'">
<sqx-asset-changed-trigger
[trigger]="trigger"
[triggerForm]="triggerForm.form"
[triggerFormSubmitted]="triggerForm.submitted | async">
</sqx-asset-changed-trigger>
</ng-container>
<ng-container *ngSwitchCase="'Comment'">
<sqx-comment-trigger
[trigger]="trigger"
[triggerForm]="triggerForm.form"
[triggerFormSubmitted]="triggerForm.submitted | async">
</sqx-comment-trigger>
</ng-container>
<ng-container *ngSwitchCase="'ContentChanged'">
<sqx-content-changed-trigger
[schemas]="schemas"
[trigger]="trigger"
[triggerForm]="triggerForm.form"
[triggerFormSubmitted]="triggerForm.submitted | async">
</sqx-content-changed-trigger>
</ng-container>
<ng-container *ngSwitchCase="'SchemaChanged'">
<sqx-schema-changed-trigger
[trigger]="trigger"
[triggerForm]="triggerForm.form"
[triggerFormSubmitted]="triggerForm.submitted | async">
</sqx-schema-changed-trigger>
</ng-container>
<ng-container *ngSwitchCase="'Usage'">
<sqx-usage-trigger
[trigger]="trigger"
[triggerForm]="triggerForm.form"
[triggerFormSubmitted]="triggerForm.submitted | async">
</sqx-usage-trigger>
</ng-container>
</ng-container>
</form>
</ng-container>
<ng-container *ngSwitchCase="3">
<sqx-form-alert marginTop="0">
The selection of the action type cannot be changed later.
</sqx-form-alert>
<div class="row no-gutters">
<div *ngFor="let actionType of ruleActions | sqxKeys" class="col-12 col-md-6">
<div class="rule-element" (click)="selectActionType(actionType)">
<sqx-rule-element [type]="actionType" [isSmall]="false" [element]="ruleActions[actionType]"></sqx-rule-element>
</div>
</div>
</div>
</ng-container>
<ng-container *ngSwitchCase="4">
<form [formGroup]="actionForm.form" (ngSubmit)="saveAction()">
<h3 class="wizard-title">
{{actionElement.display}}
</h3>
<sqx-generic-action
[definition]="actionElement"
[action]="action"
[actionForm]="actionForm.form"
[actionFormSubmitted]="actionForm.submitted | async">
</sqx-generic-action>
</form>
</ng-container>
</ng-container>
</ng-container>
<ng-container footer>
<ng-container *ngIf="step === 2 || step === 4">
<button type="reset" class="float-left btn btn-secondary" (click)="emitComplete()">Cancel</button>
</ng-container>
<ng-container *ngIf="isEditable">
<button *ngIf="step === 2 && isWizard" type="submit" class="float-right btn btn-primary" (click)="saveTrigger()">Next</button>
<button *ngIf="step === 2 && !isWizard" type="submit" class="float-right btn btn-primary" (click)="saveTrigger()">Save</button>
<button *ngIf="step === 4" type="submit" class="float-right btn btn-primary" (click)="saveAction()">Save</button>
</ng-container>
</ng-container>
</sqx-modal-dialog>