List Files | Just Commands | Repo | Logs

← back | Copy

<template>
  <BaseLayout title="Start Session">
    <ion-grid :fixed="true">
      <ion-row>
        <ion-col>
          <ion-button @click="startSession"> Start Session </ion-button>
          <p>
            Starting a new session will remove any current session data. Make
            sure that you are not already currently in a session
          </p>
          <p>
            Click "Start Session" will also navigate to the "Problem Selection"
            screen, where you can select what kind of problem you are
            diagnosing. If you are going to diagnose multiple problems, you can
            click "View Session" at any point to select additional problems.
          </p>
        </ion-col>
      </ion-row>
    </ion-grid>
  </BaseLayout>
</template>

<script setup lang="ts">
import { onMounted, ref } from "vue";
import { IonButton, IonGrid, IonRow, IonCol } from "@ionic/vue";
import BaseLayout from "@/components/BaseLayout.vue";
import { useSessionStore } from "@/stores/session";
import { useRouter } from "vue-router";

const sessionStore = useSessionStore();
const router = useRouter();

const startSession = () => {
  sessionStore.clear();
  router.push("/problems/select");
};

onMounted(async () => {
  await sessionStore.load();
});
</script>