mirror of https://github.com/Squidex/squidex.git
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.
133 lines
7.3 KiB
133 lines
7.3 KiB
<div class="table-items-row table-items-row-expandable language">
|
|
<div class="table-items-row-summary row gx-2 align-items-center">
|
|
<div class="col-2" [class.language-master]="language.isMaster" [class.language-optional]="language.isOptional">
|
|
<span class="truncate">{{ language.iso2Code }}</span>
|
|
</div>
|
|
|
|
<div class="col" [class.language-master]="language.isMaster" [class.language-optional]="language.isOptional">
|
|
<span class="truncate">{{ language.englishName }}</span>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<div class="float-end">
|
|
@if (!language.isMaster) {
|
|
<button
|
|
class="btn btn-outline-secondary btn-expand me-1"
|
|
attr.aria-label="{{ 'common.options' | sqxTranslate }}"
|
|
[class.expanded]="isEditing"
|
|
(click)="toggleEditing()"
|
|
type="button">
|
|
<span class="hidden">{{ "common.settings" | sqxTranslate }}</span> <i class="icon-settings"></i>
|
|
</button>
|
|
}
|
|
<button
|
|
class="btn btn-text-danger"
|
|
attr.aria-label="{{ 'common.delete' | sqxTranslate }}"
|
|
confirmRememberKey="removeLanguage"
|
|
confirmText="i18n:languages.deleteConfirmText"
|
|
confirmTitle="i18n:languages.deleteConfirmTitle"
|
|
[disabled]="!language.canDelete"
|
|
(sqxConfirmClick)="remove()"
|
|
type="button">
|
|
<i class="icon-bin2"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@if (isEditing) {
|
|
<div class="table-items-row-details">
|
|
<form [formGroup]="editForm.form" (ngSubmit)="save()">
|
|
<div class="table-items-row-details-tabs clearfix">
|
|
<div class="float-end">
|
|
<button class="btn btn-text-secondary" (click)="toggleEditing()" type="button">
|
|
{{ "common.cancel" | sqxTranslate }}
|
|
</button>
|
|
@if (isEditable) {
|
|
<button class="btn btn-primary ms-1" type="submit">{{ "common.save" | sqxTranslate }}</button>
|
|
}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-items-row-details-tab">
|
|
@if (isEditable || fallbackLanguages.length > 0) {
|
|
<sqx-form-row for="fallback" hideError label="common.fallback" [prefix]="language.iso2Code">
|
|
@if (fallbackLanguages.length > 0) {
|
|
<div
|
|
class="fallback-languages"
|
|
cdkDropList
|
|
[cdkDropListData]="$any(fallbackLanguages)"
|
|
[cdkDropListDisabled]="!isEditable"
|
|
(cdkDropListDropped)="sort($event)">
|
|
@for (language of fallbackLanguages; track language) {
|
|
<div class="fallback-language table-drag" cdkDrag cdkDragLockAxis="y">
|
|
<div class="row g-0">
|
|
@if (isEditable) {
|
|
<div class="col-auto">
|
|
<i class="icon-drag2 drag-handle me-1" cdkDragHandle></i>
|
|
</div>
|
|
}
|
|
|
|
<div class="col">{{ language.englishName }}</div>
|
|
|
|
@if (isEditable) {
|
|
<div class="col-auto">
|
|
<button
|
|
class="btn btn-text-secondary btn-sm"
|
|
attr.aria-label="{{ 'common.remove' | sqxTranslate }}"
|
|
(click)="removeFallbackLanguage(language)"
|
|
type="button">
|
|
<i class="icon-close"></i>
|
|
</button>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|
|
|
|
@if (otherLanguage && isEditable) {
|
|
<form class="form fallback-form" (ngSubmit)="addFallbackLanguage()">
|
|
<div class="row gx-2">
|
|
<div class="col">
|
|
<select
|
|
class="form-select fallback-select"
|
|
id="{{ language.iso2Code }}_fallback"
|
|
name="otherLanguage"
|
|
[(ngModel)]="otherLanguage">
|
|
@for (otherLanguage of fallbackLanguagesNew; track language.iso2Code) {
|
|
<option [ngValue]="otherLanguage">
|
|
{{ otherLanguage.englishName || otherLanguage.iso2Code }}
|
|
</option>
|
|
}
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<button class="btn btn-success" type="submit">
|
|
{{ "languages.add" | sqxTranslate }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
}
|
|
</sqx-form-row>
|
|
}
|
|
|
|
@if (!language.isMaster) {
|
|
<sqx-form-row check for="isMaster" hint="languages.masterHint" label="languages.master" [prefix]="language.iso2Code">
|
|
<input class="form-check-input" id="{{ language.iso2Code }}_isMaster" formControlName="isMaster" type="checkbox" />
|
|
</sqx-form-row>
|
|
}
|
|
|
|
@if (!language.isMaster) {
|
|
<sqx-form-row check for="isOptional" hint="languages.optionalHint" label="languages.optional" [prefix]="language.iso2Code">
|
|
<input class="form-check-input" id="{{ language.iso2Code }}_isOptional" formControlName="isOptional" type="checkbox" />
|
|
</sqx-form-row>
|
|
}
|
|
</div>
|
|
</form>
|
|
</div>
|
|
}
|
|
</div>
|
|
|