Fixup all toplevel views to only have one child node and test with basic animation

This commit is contained in:
Johannes Zellner
2025-03-26 18:36:04 +01:00
parent ae68cc95bb
commit 830db36928
10 changed files with 254 additions and 236 deletions

View File

@@ -240,49 +240,49 @@ onMounted(async () => {
</script>
<template>
<InputDialog ref="inputDialog"/>
<Dialog ref="restoreDialog"
:title="$t('backups.restoreArchiveDialog.title')"
reject-style="secondary"
:reject-label="restoreBusy ? '' : $t('main.dialog.cancel')"
:confirm-label="$t(restoreNeedsOverwrite ? 'backups.restoreArchiveDialog.restoreActionOverwrite' : 'backups.restoreArchiveDialog.restoreAction')"
:confirm-busy="restoreBusy"
:confirm-active="!restoreBusy"
@confirm="onRestoreSubmit()"
>
<p v-html="$t('backups.restoreArchiveDialog.description', { appId: restoreManifest.id, fqdn: restoreFqdn, creationTime: prettyLongDate(restoreArchive.creationTime) })"></p>
<div class="text-danger" v-show="restoreError.generic">{{ restoreError.generic }}</div>
<div class="text-danger" v-show="restoreError.dnsInUse">{{ restoreError.dnsInUse }}</div>
<!-- <div ng-show="archiveRestore.error.location.fqdn === archiveRestore.subdomain + '.' + archiveRestore.domain.domain"><small>{{ archiveRestore.error.location.message }}</small></div> -->
<form @submit.prevent="onRestoreSubmit()" autocomplete="off">
<fieldset>
<FormGroup>
<label for="locationInput">{{ $t('app.cloneDialog.location') }}</label>
<InputGroup>
<TextInput id="locationInput" ref="locationInput" v-model="restoreLocation" style="flex-grow: 1;" />
<Dropdown v-model="restoreDomain" :options="domains" option-label="domain" option-key="domain" />
</InputGroup>
</FormGroup>
<FormGroup v-for="(domain, key) in restoreSecondaryDomains" :key="key">
<label :for="'secondaryDomainInput-' + key">{{ domain.title }}</label>
<small>{{ domain.description }}</small>
<InputGroup>
<TextInput :id="'secondaryDomainInput-' + key" v-model="domain.subdomain" :placeholder="$t('appstore.installDialog.locationPlaceholder')" style="flex-grow: 1;" />
<Dropdown v-model="domain.domain" :options="domains" option-label="domain" option-key="domain" />
</InputGroup>
</FormGroup>
<!-- <p class="text-small text-warning" ng-show="archiveRestore.domain.provider === 'noop' || archiveRestore.domain.provider === 'manual'" ng-bind-html="'appstore.installDialog.manualWarning' | tr:{ location: ((archiveRestore.subdomain ? archiveRestore.subdomain + '.' : '') + archiveRestore.domain.domain) }"></p> -->
<!-- <div class="has-error text-center" ng-show="archiveRestore.error.port">{{ archiveRestore.error.port }}</div> -->
<PortBindings v-model:tcp-ports="restoreTcpPorts" v-model:udp-ports="restoreUdpPorts" :error="restoreError"/>
</fieldset>
</form>
</Dialog>
<Section :title="$t('backups.archives.title')">
<InputDialog ref="inputDialog"/>
<Dialog ref="restoreDialog"
:title="$t('backups.restoreArchiveDialog.title')"
reject-style="secondary"
:reject-label="restoreBusy ? '' : $t('main.dialog.cancel')"
:confirm-label="$t(restoreNeedsOverwrite ? 'backups.restoreArchiveDialog.restoreActionOverwrite' : 'backups.restoreArchiveDialog.restoreAction')"
:confirm-busy="restoreBusy"
:confirm-active="!restoreBusy"
@confirm="onRestoreSubmit()"
>
<p v-html="$t('backups.restoreArchiveDialog.description', { appId: restoreManifest.id, fqdn: restoreFqdn, creationTime: prettyLongDate(restoreArchive.creationTime) })"></p>
<div class="text-danger" v-show="restoreError.generic">{{ restoreError.generic }}</div>
<div class="text-danger" v-show="restoreError.dnsInUse">{{ restoreError.dnsInUse }}</div>
<!-- <div ng-show="archiveRestore.error.location.fqdn === archiveRestore.subdomain + '.' + archiveRestore.domain.domain"><small>{{ archiveRestore.error.location.message }}</small></div> -->
<form @submit.prevent="onRestoreSubmit()" autocomplete="off">
<fieldset>
<FormGroup>
<label for="locationInput">{{ $t('app.cloneDialog.location') }}</label>
<InputGroup>
<TextInput id="locationInput" ref="locationInput" v-model="restoreLocation" style="flex-grow: 1;" />
<Dropdown v-model="restoreDomain" :options="domains" option-label="domain" option-key="domain" />
</InputGroup>
</FormGroup>
<FormGroup v-for="(domain, key) in restoreSecondaryDomains" :key="key">
<label :for="'secondaryDomainInput-' + key">{{ domain.title }}</label>
<small>{{ domain.description }}</small>
<InputGroup>
<TextInput :id="'secondaryDomainInput-' + key" v-model="domain.subdomain" :placeholder="$t('appstore.installDialog.locationPlaceholder')" style="flex-grow: 1;" />
<Dropdown v-model="domain.domain" :options="domains" option-label="domain" option-key="domain" />
</InputGroup>
</FormGroup>
<!-- <p class="text-small text-warning" ng-show="archiveRestore.domain.provider === 'noop' || archiveRestore.domain.provider === 'manual'" ng-bind-html="'appstore.installDialog.manualWarning' | tr:{ location: ((archiveRestore.subdomain ? archiveRestore.subdomain + '.' : '') + archiveRestore.domain.domain) }"></p> -->
<!-- <div class="has-error text-center" ng-show="archiveRestore.error.port">{{ archiveRestore.error.port }}</div> -->
<PortBindings v-model:tcp-ports="restoreTcpPorts" v-model:udp-ports="restoreUdpPorts" :error="restoreError"/>
</fieldset>
</form>
</Dialog>
<p v-html="$t('backups.archive.description')"></p>
<TableView :columns="columns" :model="archives" :busy="busy" @row-click="onInfo">