jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Attempt some transition between app configure views

Browse Source
This commit is contained in:
Johannes Zellner
2025-03-06 16:54:30 +01:00
parent c7a924e83b
commit 263f68554e
4 changed files with 124 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
dashboard/src/views/AppConfigureView.vue
View File

@@ -210,23 +210,25 @@ onBeforeUnmount(() => {
<div class="configure-menu-item" @click="onSetView('uninstall')" :active="view === 'uninstall' ? true : null" v-if="app.accessLevel === 'admin'">{{ $t('app.uninstallTabTitle') }}</div>
</div>
<div class="configure-content">
<Info v-if="view === 'info'" :app="app"/>
<Display :app="app" v-if="view === 'display'"/>
<Location :app="app" v-if="view === 'location'"/>
<div v-if="view === 'proxy'"></div>
<Access :app="app" v-if="view === 'access'"/>
<Resources :app="app" v-if="view === 'resources'"/>
<div v-if="view === 'services'"></div>
<Storage :app="app" v-if="view === 'storage'"/>
<div v-if="view === 'graphs'"></div>
<Security :app="app" v-if="view === 'security'"/>
<Email :app="app" v-if="view === 'email'"/>
<Cron :app="app" v-if="view === 'cron'"/>
<Updates :app="app" v-if="view === 'updates'"/>
<Backups :app="app" v-if="view === 'backups'"/>
<Repair :app="app" v-if="view === 'repair'"/>
<Eventlog :app="app" v-if="view === 'eventlog'"/>
<Uninstall :app="app" v-if="view === 'uninstall'"/>
<Transition name="slide-fade" mode="out-in">
<Info v-if="view === 'info'" :app="app"/>
<Display v-else-if="view === 'display'" :app="app"/>
<Location v-else-if="view === 'location'" :app="app"/>
<div v-else-if="view === 'proxy'"></div>
<Access v-else-if="view === 'access'" :app="app"/>
<Resources v-else-if="view === 'resources'" :app="app"/>
<div v-else-if="view === 'services'"></div>
<Storage v-else-if="view === 'storage'" :app="app"/>
<div v-else-if="view === 'graphs'"></div>
<Security v-else-if="view === 'security'" :app="app"/>
<Email v-else-if="view === 'email'" :app="app"/>
<Cron v-else-if="view === 'cron'" :app="app"/>
<Updates v-else-if="view === 'updates'" :app="app"/>
<Backups v-else-if="view === 'backups'" :app="app"/>
<Repair v-else-if="view === 'repair'" :app="app"/>
<Eventlog v-else-if="view === 'eventlog'" :app="app"/>
<Uninstall v-else-if="view === 'uninstall'" :app="app"/>
</Transition>
</div>
</div>
</div>
@@ -235,6 +237,20 @@ onBeforeUnmount(() => {
<style scoped>
.slide-fade-enter-active {
transition: all 0.2s ease-out;
}
.slide-fade-leave-active {
transition: all 0.2s cubic-bezier(1, 0.5, 0.8, 1);
}
.slide-fade-enter-from,
.slide-fade-leave-to {
transform: translateX(20px);
opacity: 0;
}
.applink {
display: flex;
align-items: center;