Changes to Timetracking

spaces/pages/timetracking.vue

@@ -1,27 +1,130 @@
-<script setup lang="ts">
+<script setup>
 definePageMeta({
   middleware: "auth"
 })
 
 const supabase = useSupabaseClient()
+const user = useSupabaseUser()
+const toast = useToast()
+console.log(user)
+
+const {times, projects} = storeToRefs(useDataStore())
+const {fetchTimes} = useDataStore()
+
+const timeInfo = ref({
+  user: "",
+  start: "",
+  end: null,
+  notes: null,
+  projectId: null
+})
+
+const runningTimeInfo = ref({
+
+})
+
+
+const startTime = async () => {
+  console.log("started")
+  timeInfo.value.user = user.value.id
+  timeInfo.value.start = new Date().toISOString()
+
+  const {data,error} = await supabase
+      .from("times")
+      .insert([timeInfo.value])
+      .select()
+
+  if(error) {
+    console.log(error)
+  } else if(data) {
+    timeInfo.value = data[0]
+    fetchTimes()
+  }
+
+  console.log(data)
+  console.log(error)
+
+}
+
+const stopStartedTime = async () => {
+  console.log(runningTimeInfo.value)
+
+  runningTimeInfo.value.end = new Date().toISOString()
+
+  const {data,error} = await supabase
+      .from("times")
+      .update(runningTimeInfo.value)
+      .eq('id',runningTimeInfo.value.id)
+      .select()
+  console.log(data)
+
+  if(error) {
+    console.log(error)
+  } else {
+    toast.add({title: "Zeit erfolgreich gestoppt"})
+    runningTimeInfo.value = {}
+    fetchTimes()
+  }
+}
+
+const selectStartedTime = () => {
+  runningTimeInfo.value = times.value.find(time => time.user == user.value.id && !time.end)
+}
+
+selectStartedTime()
 
-const times = (await supabase.from("times").select()).data
 </script>
 
 <template>
     <div>
-      <UButton class="controlButton" disabled>
+      <UButton
+          class="controlButton"
+          @click="startTime"
+          :disabled="runningTimeInfo.id"
+      >
         Start
       </UButton>
-      <UButton class="controlButton" disabled>
+      <UButton
+          class="controlButton"
+          @click="stopStartedTime"
+      >
         Stop
       </UButton>
-      <UButton class="controlButton" disabled>
-        Pause
-      </UButton>
 
 
-      {{times}}
+      <div>
+        Aktuelle gestarteter Eintrag:
+        {{runningTimeInfo}}
+
+        <UFormGroup
+          label="Notizen:"
+        >
+          <UTextarea
+            v-model="runningTimeInfo.notes"
+          />
+        </UFormGroup>
+
+        <UFormGroup
+          label="Projekt:"
+        >
+          <USelectMenu
+            :options="projects"
+            option-attribute="name"
+            value-attribute="id"
+            v-model="runningTimeInfo.projectId"
+          >
+            <template #label>
+              <span>{{ projects.find(project => project.id === runningTimeInfo.projectId) ? projects.find(project => project.id === runningTimeInfo.projectId).name : "" }}</span>
+            </template>
+          </USelectMenu>
+        </UFormGroup>
+
+      </div>
+
+
+      <UTable :rows="times"/>
+
+      {{timeInfo}}
 
     </div>
 </template>

spaces/stores/data.ts

@@ -43,6 +43,7 @@ export const useDataStore = defineStore('data', {
             await this.fetchProjects()
             await this.fetchDocuments()
             await this.fetchMovements()
+            await this.fetchTimes()
             await this.fetchSpaces()
             await this.fetchVehicles()
             this.loaded = true
@@ -100,6 +101,10 @@ export const useDataStore = defineStore('data', {
             // @ts-ignore
             this.vehicles = (await supabase.from("vehicles").select()).data
         },
+        async fetchTimes() {
+            // @ts-ignore
+            this.times = (await supabase.from("times").select()).data
+        },
         async fetchDocuments() {
             // @ts-ignore
             this.documents = (await supabase.from("documents").select()).data