93 lines
4.7 KiB
HTML
93 lines
4.7 KiB
HTML
<h2 mat-dialog-title>{{ menuId ? 'Editar' : 'Añadir' }} menú</h2>
|
|
|
|
<mat-dialog-content class="dialog-content">
|
|
<div class="form-container">
|
|
<!-- Formulario -->
|
|
<form [formGroup]="menuForm" (ngSubmit)="save()" class="menu-form">
|
|
<mat-form-field appearance="fill" class="form-field">
|
|
<mat-label>{{ 'labelMenuName' | translate }}</mat-label>
|
|
<input matInput formControlName="name" required>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="form-field">
|
|
<span matPrefix>{{baseUrl}}/menu/</span>
|
|
<mat-label>{{ 'publicUrl' | translate }}</mat-label>
|
|
<input matInput formControlName="publicUrl" name="description">
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="form-field" (click)="fileInput.click()"
|
|
style="cursor: pointer; margin-top: 15px;">
|
|
<mat-label>{{ 'uploadMenuFileHint' | translate }}</mat-label>
|
|
<input matInput [value]="selectedFile ? selectedFile.name : 'Ningún fichero seleccionado'" readonly
|
|
[placeholder]="'buttonSelectFile' | translate" style="cursor: pointer; pointer-events: none;" tabindex="-1">
|
|
<input hidden (change)="onFileSelected($event)" #fileInput type="file">
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="form-field">
|
|
<mat-label>{{ 'labelResolution' | translate }}</mat-label>
|
|
<mat-select formControlName="resolution" name="resolution">
|
|
<mat-option value="769">{{ 'resolution640x480x8' | translate }}</mat-option>
|
|
<mat-option value="771">{{ 'resolution800x600x8' | translate }}</mat-option>
|
|
<mat-option value="773">{{ 'resolution1024x768x8' | translate }}</mat-option>
|
|
<mat-option value="775">{{ 'resolution1280x1024x8' | translate }}</mat-option>
|
|
<mat-option value="784">{{ 'resolution640x480x16' | translate }}</mat-option>
|
|
<mat-option value="787">{{ 'resolution800x600x16' | translate }}</mat-option>
|
|
<mat-option value="791">{{ 'resolution1024x768x16' | translate }}</mat-option>
|
|
<mat-option value="794">{{ 'resolution1280x1024x16' | translate }}</mat-option>
|
|
<mat-option value="785">{{ 'resolution640x480x24' | translate }}</mat-option>
|
|
<mat-option value="788">{{ 'resolution800x600x24' | translate }}</mat-option>
|
|
<mat-option value="792">{{ 'resolution1024x768x24' | translate }}</mat-option>
|
|
<mat-option value="795">{{ 'resolution1280x1024x24' | translate }}</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field appearance="fill" class="form-field">
|
|
<mat-label>{{ 'labelComments' | translate }}</mat-label>
|
|
<input matInput formControlName="comments" name="comments">
|
|
</mat-form-field>
|
|
|
|
<mat-checkbox formControlName="isDefault" name="isDefault">
|
|
{{ 'labelDefaultMenu' | translate }}
|
|
</mat-checkbox>
|
|
|
|
</form>
|
|
|
|
<!-- Iframe o Editor HTML -->
|
|
@if (safeUrl || isEditingHtml) {
|
|
<div class="iframe-container">
|
|
|
|
<!-- Zona de Controles del Editor -->
|
|
<div class="editor-controls">
|
|
@if (isEditingHtml) {
|
|
<button type="button" class="ordinary-button edit-btn" (click)="cancelHtmlChanges()">
|
|
{{ 'buttonCancelEdit' | translate }}</button>
|
|
<button type="button" class="submit-button apply-btn" (click)="applyHtmlChanges()">
|
|
{{ 'buttonApplyChanges' | translate }}</button>
|
|
} @else if (safeUrl) {
|
|
<button type="button" class="ordinary-button edit-btn" (click)="toggleGlobalView()" title="Alternar vista">
|
|
<mat-icon>{{ isGlobalView ? 'zoom_in' : 'visibility' }}</mat-icon>
|
|
{{ isGlobalView ? 'Vista detalle' : 'Vista global' }}
|
|
</button>
|
|
<button type="button" class="ordinary-button edit-btn" (click)="editHtml()">
|
|
<mat-icon>edit</mat-icon> {{ 'buttonEditHtml' | translate }}</button>
|
|
}
|
|
</div>
|
|
|
|
<!-- Reproductor / Previsualizador o Editor -->
|
|
@if (isEditingHtml) {
|
|
<textarea class="html-editor" [(ngModel)]="htmlEditorContent" spellcheck="false"></textarea>
|
|
} @else if (safeUrl) {
|
|
<div class="iframe-wrapper" [ngClass]="{'global-view': isGlobalView, 'scroll-view': !isGlobalView}">
|
|
<iframe [src]="safeUrl" class="iframe" [ngClass]="{'global-view': isGlobalView, 'scroll-view': !isGlobalView}"></iframe>
|
|
</div>
|
|
}
|
|
|
|
</div>
|
|
}
|
|
</div>
|
|
</mat-dialog-content>
|
|
|
|
<mat-dialog-actions class="action-container">
|
|
<button class="ordinary-button" (click)="close()">{{ 'buttonCancel' | translate }}</button>
|
|
<button class="submit-button" (click)="save()">{{ 'labelSaveButton' | translate }}</button>
|
|
</mat-dialog-actions> |