restrutcured files

This commit is contained in:
Sascha Kühl 2025-03-31 15:55:12 +02:00
parent 983ca5a25a
commit f2cfe0c4e3
4 changed files with 147 additions and 187 deletions

View File

@ -1,8 +1,38 @@
<script setup lang="ts">
import {
IonButton,
IonBadge,
IonLabel,
IonList,
IonItem,
IonFooter,
IonCard,
IonCardHeader,
IonCardTitle,
IonCardContent,
IonContent,
IonHeader,
IonPage,
IonTitle,
IonToolbar
} from '@ionic/vue';
import {ref} from 'vue'
import {useRouter} from 'vue-router';
import {BullpenSessionService, bullpenSessionService} from "@/services/BullpenSessionService";
const router = useRouter();
const bps = ref<BullpenSessionService>(bullpenSessionService);
const gotoHome = () => {
router.push('/home');
};
</script>
<template>
<ion-page>
<ion-header :translucent="true">
<ion-toolbar>
<ion-title>Bullpen Stats for {{ bps.getPitcher().first_name }} {{ bps.getPitcher().last_name }}</ion-title>
<ion-title>Bullpen Stats for {{ bps.getPitcher().firstName }} {{ bps.getPitcher().lastName }}</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
@ -34,61 +64,6 @@
</ion-page>
</template>
<script lang="ts">
import {
IonButton,
IonBadge,
IonLabel,
IonList,
IonItem,
IonFooter,
IonCard,
IonCardHeader,
IonCardTitle,
IonCardContent,
IonContent,
IonHeader,
IonPage,
IonTitle,
IonToolbar
} from '@ionic/vue';
import {defineComponent, ref} from 'vue'
import {useRouter} from 'vue-router';
import {BullpenSessionService, bullpenSessionService} from "@/services/BullpenSessionService";
export default defineComponent({
name: 'BullpenStats',
components: {
IonButton,
IonBadge,
IonFooter,
IonLabel,
IonList,
IonItem,
IonPage,
IonCard,
IonCardHeader,
IonCardTitle,
IonCardContent,
IonContent,
IonHeader,
IonToolbar,
IonTitle,
},
setup() {
const router = useRouter();
const bps = ref<BullpenSessionService>(bullpenSessionService);
const gotoHome = () => {
router.push('/home');
}
return {bps, gotoHome};
}
});
</script>
<style scoped>
</style>
</style>

View File

@ -1,8 +1,46 @@
<script setup lang="ts">
import {defineComponent, ref} from "vue";
import {
IonContent,
IonHeader,
IonFooter,
IonToolbar,
IonTitle,
IonPage,
IonCard,
IonCardContent,
IonCardHeader,
IonCardTitle, IonButton,
IonGrid, IonRow, IonCol
} from "@ionic/vue";
import {BullpenSessionService, bullpenSessionService} from "@/services/BullpenSessionService";
import {useRouter} from "vue-router";
const router = useRouter();
const bps = ref<BullpenSessionService>(bullpenSessionService);
const finalizeAndNextPitch = () => {
bullpenSessionService.nextPitch();
router.push({ name: 'PreparePitch' });
}
const finalizeAndEndBullpen = () => {
bullpenSessionService.nextPitch();
bullpenSessionService.finishSession();
router.push({ name: 'BullpenStats' });
}
const setRealPitchArea = (hitArea: number) => {
bps.value.currentBullpenPitch().realPitchArea = hitArea;
};
</script>
<template>
<ion-page>
<ion-header :translucent="true">
<ion-toolbar>
<ion-title>Finalize Pitch for {{ bps.getPitcher().first_name }} {{ bps.getPitcher().last_name }}</ion-title>
<ion-title>Finalize Pitch for {{ bps.getPitcher().firstName }} {{ bps.getPitcher().lastName }}</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
@ -82,65 +120,6 @@
</ion-page>
</template>
<script lang="ts">
import {defineComponent, ref} from "vue";
import {
IonContent,
IonHeader,
IonFooter,
IonToolbar,
IonTitle,
IonPage,
IonCard,
IonCardContent,
IonCardHeader,
IonCardTitle, IonButton,
IonGrid, IonRow, IonCol
} from "@ionic/vue";
import {BullpenSessionService, bullpenSessionService} from "@/services/BullpenSessionService";
import {useRouter} from "vue-router";
export default defineComponent({
name: "FinalizePitch",
components: {
IonButton,
IonPage,
IonFooter,
IonContent,
IonHeader,
IonToolbar,
IonTitle,
IonCard,
IonCardContent,
IonCardHeader,
IonCardTitle,
IonGrid, IonRow, IonCol
},
setup() {
const router = useRouter();
const bps = ref<BullpenSessionService>(bullpenSessionService);
const finalizeAndNextPitch = () => {
bullpenSessionService.nextPitch();
router.push({ name: 'PreparePitch' });
}
const finalizeAndEndBullpen = () => {
bullpenSessionService.nextPitch();
bullpenSessionService.finishSession();
router.push({ name: 'BullpenStats' });
}
return {bps, finalizeAndNextPitch, finalizeAndEndBullpen};
},
methods: {
setRealPitchArea(hitArea: number) {
this.bps.currentBullpenPitch().realPitchArea = hitArea;
}
}
});
</script>
<style scoped>
.wasted {
fill: firebrick;
@ -177,4 +156,4 @@ export default defineComponent({
fill: white;
font-size: 30px;
}
</style>
</style>

View File

@ -1,12 +1,13 @@
<script setup lang="ts">
// import { ref } from 'vue';
import { ref } from 'vue';
import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonAvatar, IonButton, IonIcon } from '@ionic/vue';
import { playOutline, statsChartOutline, personOutline } from 'ionicons/icons';
import img from '../assets/groot.jpg'
// import userImage from '../assets/groot.jpg'
import {useRouter} from "vue-router";
const router = useRouter();
// const userImage = ref('../assets/groot.jpg'); // Replace with actual user image URL
const userImage = ref(null);
// const userImage = ref('../assets/groot.jpg');
const startBullpen = () => {
console.log('Starting bullpen session');
@ -35,7 +36,12 @@ const showProfile = () => {
<ion-content class="ion-padding">
<div class="user-container">
<ion-avatar class="user-avatar">
<img :src="img" alt="User Profile" class="avatar-frame" />
<template v-if="userImage">
<img :src="userImage" alt="User Profile" class="avatar-frame" />
</template>
<template v-else>
<ion-icon :icon="personOutline" class="avatar-placeholder" />
</template>
</ion-avatar>
</div>
@ -96,4 +102,4 @@ const showProfile = () => {
width: 100%;
justify-content: center;
}
</style>
</style>

View File

@ -1,66 +1,3 @@
<template>
<ion-page>
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
<ion-title>Login</ion-title>
</ion-toolbar>
</ion-header>
<ion-content class="ion-padding">
<form @submit="submit">
<ion-row>
<ion-col>
<ion-list>
<ion-item>
<ion-icon :icon="personOutline" class="icon-login"></ion-icon>
<ion-input name="user" v-model="email" v-bind="emailAttrs" type="text" required placeholder="Username"></ion-input>
</ion-item>
<br />
<ion-item>
<ion-icon :icon="lockClosedOutline" class="icon-login"></ion-icon>
<ion-input name="password" v-model="password" v-bind="passwordAttrs" type="password" required placeholder="Password"></ion-input>
</ion-item>
</ion-list>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-button :disabled="!meta.valid" type="submit" fill="solid" expand="full">
Login
</ion-button>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<pre>errors: {{ errors }}</pre>
</ion-col>
</ion-row>
</form>
</ion-content>
</ion-page>
</template>
<style scoped>
.login-logo {
padding: 20px 0;
min-height: 200px;
text-align: center;
}
.login-logo img {
max-width: 150px;
}
.list {
margin-bottom: 0;
}
</style>
<script setup lang="ts">
import { computed, ref, onMounted } from "vue";
import {
@ -139,4 +76,67 @@ const onLogin = () => {
console.log(error);
});
}
</script>
</script>
<template>
<ion-page>
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-menu-button></ion-menu-button>
</ion-buttons>
<ion-title>Login</ion-title>
</ion-toolbar>
</ion-header>
<ion-content class="ion-padding">
<form @submit="submit">
<ion-row>
<ion-col>
<ion-list>
<ion-item>
<ion-icon :icon="personOutline" class="icon-login"></ion-icon>
<ion-input name="user" v-model="email" v-bind="emailAttrs" type="text" required placeholder="Username"></ion-input>
</ion-item>
<br />
<ion-item>
<ion-icon :icon="lockClosedOutline" class="icon-login"></ion-icon>
<ion-input name="password" v-model="password" v-bind="passwordAttrs" type="password" required placeholder="Password"></ion-input>
</ion-item>
</ion-list>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<ion-button :disabled="!meta.valid" type="submit" fill="solid" expand="full">
Login
</ion-button>
</ion-col>
</ion-row>
<ion-row>
<ion-col>
<pre>errors: {{ errors }}</pre>
</ion-col>
</ion-row>
</form>
</ion-content>
</ion-page>
</template>
<style scoped>
.login-logo {
padding: 20px 0;
min-height: 200px;
text-align: center;
}
.login-logo img {
max-width: 150px;
}
.list {
margin-bottom: 0;
}
</style>