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.
 
 
 
 
 

132 lines
6.1 KiB

<div class="row g-0" [class.compare]="formModelCompare">
<div [class.col-12]="!formModelCompare" [class.col-6]="formModelCompare">
<sqx-focus-marker [controlId]="formModel.path">
@if (!(formModel.hiddenChanges | async)) {
<div class="table-items-row table-items-row-summary" [class.field-invalid]="isInvalid | async">
@if (formModel.hasChanges | async) {
<div class="change-marker-host">
<div class="change-marker">{{ "contents.pendingChangesTitle" | sqxTranslate }}</div>
</div>
}
@if (showAllControls) {
@for (language of languages; track language; let i = $index) {
<div class="form-group">
<sqx-field-editor
[comments]="commentsState"
[displaySuffix]="prefix(language)"
[form]="form"
[formContext]="formContext"
[formLevel]="formLevel"
[formModel]="formModel.get(language)"
[hasChatBot]="hasChatBot"
[isCollapsed]="isCollapsed"
[isComparing]="!!formModelCompare"
[language]="language"
[languages]="languages">
<ng-container>
@if (i === 0) {
<ng-container *ngTemplateOutlet="sharedButtons" />
}
</ng-container>
</sqx-field-editor>
</div>
}
} @else {
<sqx-field-editor
[comments]="commentsState"
[form]="form"
[formContext]="formContext"
[formLevel]="formLevel"
[formModel]="getControl()"
[hasChatBot]="hasChatBot"
[isCollapsed]="isCollapsed"
[isComparing]="!!formModelCompare"
[language]="language"
[languages]="languages">
<ng-container>
<ng-container *ngTemplateOutlet="sharedButtons" />
</ng-container>
</sqx-field-editor>
}
</div>
}
</sqx-focus-marker>
</div>
@if (formModelCompare && formCompare) {
<div class="col-6 col-right">
@if (!(isDisabled | async)) {
<div class="copy-button-container">
@if (isDifferent | async) {
<button class="btn btn-primary btn-sm field-copy" attr.aria-label="{{ 'common.copy' | sqxTranslate }}" (click)="copy()" type="button">
<i class="icon-arrow_back"></i>
</button>
}
</div>
}
@if (!(formModelCompare!.hiddenChanges | async)) {
<div class="table-items-row table-items-row-summary">
@if (showAllControls) {
@for (language of languages; track language) {
<div class="form-group">
<sqx-field-editor
[displaySuffix]="prefix(language)"
[form]="formCompare"
[formContext]="formContext"
[formLevel]="formLevel"
[formModel]="formModelCompare.get(language)"
[hasChatBot]="hasChatBot"
[isCollapsed]="isCollapsed"
[isComparing]="!!formModelCompare"
[language]="language"
[languages]="languages" />
</div>
}
} @else {
<sqx-field-editor
[form]="formCompare"
[formContext]="formContext"
[formLevel]="formLevel"
[formModel]="getControlCompare()!"
[hasChatBot]="hasChatBot"
[isCollapsed]="isCollapsed"
[isComparing]="!!formModelCompare"
[language]="language"
[languages]="languages" />
}
</div>
}
</div>
}
</div>
<ng-template #sharedButtons>
<sqx-field-languages
[formModel]="formModel"
[language]="language"
(languageChange)="languageChange.emit($event)"
[languages]="languages"
[showAllControls]="showAllControls"
(showAllControlsChange)="changeShowAllControls($event)" />
<sqx-field-copy-button [formModel]="formModel" [languages]="languages" />
@if (isTranslatable) {
<sqx-menu-item
(action)="translate()"
[disabled]="formModel.field.isDisabled"
icon="translate"
menuLabel="i18n:contents.autotranslateMenu"
small
tabIndex="-1"
tooltip="i18n:contents.autotranslate" />
}
@if (isCollapsed) {
<sqx-menu-item (action)="toggle()" icon="minus2" menuLabel="i18n:common.collapse" small tooltip="i18n:contents.arrayCollapseItem" />
} @else {
<sqx-menu-item (action)="toggle()" icon="plus2" menuLabel="i18n:common.expand" small tooltip="i18n:contents.arrayCollapseItem" />
}
</ng-template>