MicrocontrollerCD/UpdaterApp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

vue component content order

Browse Source
This commit is contained in:
chopster44
2025-12-17 18:43:07 +00:00
parent a605ffbd76
commit e95e955663
2 changed files with 49 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/components/HomeCard.vue
View File

@@ -1,26 +1,3 @@
<template>
<ion-card>
<ion-card-header class="two-column">
<div class="header-column">
<ion-card-title>HOME</ion-card-title>
<ion-card-title>Board</ion-card-title>
<ion-card-subtitle>{{ version }}</ion-card-subtitle>
</div>
<div style="flex-grow: 1"></div>
<div>
<ion-button @click="disconnect">Disconnect</ion-button>
</div>
</ion-card-header>
<ion-card-content>
<ion-button @click="update" v-if="showUpdater">Update</ion-button>
<br>
<ion-button @click="openArchive">View older versions</ion-button>
<br>
<ion-button @click="settings">Settings</ion-button>
</ion-card-content>
</ion-card>
</template>
<script setup lang="ts"> <script setup lang="ts">
import useArchiveStore from "@/stores/archive"; import useArchiveStore from "@/stores/archive";
import updater from "@/utils/updater"; import updater from "@/utils/updater";
@@ -57,6 +34,30 @@ onBeforeMount(async () => {
}); });
</script> </script>
<template>
<ion-card>
<ion-card-header class="two-column">
<div class="header-column">
<ion-card-title>HOME</ion-card-title>
<ion-card-title>Board</ion-card-title>
<ion-card-subtitle>{{ version }}</ion-card-subtitle>
</div>
<div style="flex-grow: 1"></div>
<div>
<ion-button @click="disconnect">Disconnect</ion-button>
</div>
</ion-card-header>
<ion-card-content>
<ion-button @click="update" v-if="showUpdater">Update</ion-button>
<br>
<ion-button @click="openArchive">View older versions</ion-button>
<br>
<ion-button @click="settings">Settings</ion-button>
</ion-card-content>
</ion-card>
</template>
<style scoped> <style scoped>
.two-column { .two-column {

50
src/views/HomePage.vue
View File

@@ -1,28 +1,3 @@
<template>
<ion-page>
<ion-header :translucent="true">
<ion-toolbar>
<ion-title>Updater</ion-title>
</ion-toolbar>
</ion-header>
<ion-content :fullscreen="true">
<ion-header collapse="condense">
<ion-toolbar>
<ion-title size="large">Updater</ion-title>
</ion-toolbar>
</ion-header>
<home-card v-if="shownCard == 1" @archive="showArchive" @disconnect="disconnect" @update="showDetails" @settings="showSettings"></home-card>
<scan-card v-else-if="shownCard == 0" @connect="goHome"></scan-card>
<details-card v-else-if="shownCard == 2" @back="goBack" @choose="showFlash" @disconnect="disconnect"></details-card>
<archive-card v-else-if="shownCard == 3" @back="goBack" @details="showDetails" @disconnect="disconnect"></archive-card>
<flash-card v-else-if="shownCard == 4" @back="goBack" @home="goHome"></flash-card>
<settings-card v-else-if="shownCard == 5" @back="goBack" @disconnect="disconnect"></settings-card>
</ion-content>
</ion-page>
</template>
<script setup lang="ts"> <script setup lang="ts">
import { IonContent, IonHeader, IonPage, IonTitle, IonToolbar } from '@ionic/vue'; import { IonContent, IonHeader, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
import HomeCard from "@/components/HomeCard.vue"; import HomeCard from "@/components/HomeCard.vue";
@@ -80,6 +55,31 @@ async function disconnect() {
} }
</script> </script>
<template>
<ion-page>
<ion-header :translucent="true">
<ion-toolbar>
<ion-title>Updater</ion-title>
</ion-toolbar>
</ion-header>
<ion-content :fullscreen="true">
<ion-header collapse="condense">
<ion-toolbar>
<ion-title size="large">Updater</ion-title>
</ion-toolbar>
</ion-header>
<home-card v-if="shownCard == 1" @archive="showArchive" @disconnect="disconnect" @update="showDetails" @settings="showSettings"></home-card>
<scan-card v-else-if="shownCard == 0" @connect="goHome"></scan-card>
<details-card v-else-if="shownCard == 2" @back="goBack" @choose="showFlash" @disconnect="disconnect"></details-card>
<archive-card v-else-if="shownCard == 3" @back="goBack" @details="showDetails" @disconnect="disconnect"></archive-card>
<flash-card v-else-if="shownCard == 4" @back="goBack" @home="goHome"></flash-card>
<settings-card v-else-if="shownCard == 5" @back="goBack" @disconnect="disconnect"></settings-card>
</ion-content>
</ion-page>
</template>
<style scoped> <style scoped>
#container { #container {
text-align: center; text-align: center;