Some Changes

components/EntityList.vue

@@ -115,6 +115,9 @@ const filteredRows = computed(() => {
    @click="router.push(`/mobile/standardEntity/${type}/create`)"
   />
   <UDashboardNavbar :title="dataType.label" :badge="filteredRows.length">
+    <template #toggle>
+      <div v-if="platform === 'mobile'"></div>
+    </template>
     <template #right>
       <UInput
           id="searchinput"

components/mobile/FloatingActionButton.vue

@@ -14,6 +14,10 @@ const props = defineProps({
   color: {
     type: String,
     default: 'primary'
+  },
+  pos: {
+    type: Number,
+    default: 0
   }
 })
 
@@ -29,6 +33,8 @@ const emit = defineEmits(['click'])
       :variant="props.variant"
       :color="props.color"
       @click="emit('click')"
+      :style="`bottom: ${10 + props.pos * 5}vh;`"
+      class="bg-white dark:bg-gray-950"
   />
 </template>
 
@@ -36,6 +42,6 @@ const emit = defineEmits(['click'])
 #fab {
   position: fixed;
   right: 15px;
-  bottom: 10vh;
+  z-index: 5;
 }
 </style>

layouts/mobile.vue

@@ -148,7 +148,7 @@ const footerLinks = [/*{
       </UDashboardPanel>
     </UDashboardPage>
 
-    <div class="mobileFooter">
+    <div class="mobileFooter bg-white dark:bg-gray-950">
       <UButton
         icon="i-heroicons-home"
         to="/mobile/"
@@ -233,7 +233,6 @@ const footerLinks = [/*{
   flex-direction: row;
   justify-content: space-between;
   padding: 1em;
-  background-color: white;
 }
 
 .mobileFooter > a {

pages/workingtimes/index.vue

@@ -1,6 +1,9 @@
 <script setup>
 import dayjs from "dayjs";
 import customParseFormat from "dayjs/plugin/customParseFormat"
+import {useCapacitor} from "~/composables/useCapacitor.js";
+import {setPageLayout} from "#app";
+import FloatingActionButton from "~/components/mobile/FloatingActionButton.vue";
 
 dayjs.extend(customParseFormat)
 
@@ -14,11 +17,18 @@ const supabase = useSupabaseClient()
 const router = useRouter()
 const route = useRoute()
 
+const platform = useCapacitor().getIsPhone() ? "mobile" : "default"
+
+
 const filterUser = ref(profileStore.activeProfile.id || "")
 
 const workingtimes = ref([])
 
 const setupPage = async () => {
+  if(platform === "mobile") {
+    setPageLayout("mobile")
+  }
+
   if(route.query) {
     if(route.query.profile) filterUser.value = route.query.profile
   }
@@ -71,43 +81,35 @@ const itemInfo = ref({
 const columns = [
   {
     key:"state",
-    label: "Status",
+    label: "Status"
-    sortable:true
   },
   {
     key: "approved",
-    label: "Genehmigt",
+    label: "Genehmigt"
-    sortable:true
   },
   {
     key: "profile",
-    label: "Mitarbeiter",
+    label: "Mitarbeiter"
-    sortable:true
   },
   {
     key: "date",
-    label: "Datum",
+    label: "Datum"
-    sortable:true
   },
   {
     key:"startDate",
-    label:"Start",
+    label:"Start"
-    sortable:true
   },
   {
     key: "endDate",
-    label: "Ende",
+    label: "Ende"
-    sortable:true
   },
   {
     key: "duration",
-    label: "Dauer",
+    label: "Dauer"
-    sortable:true
   },
   {
     key: "notes",
-    label: "Notizen",
+    label: "Notizen"
-    sortable:true
   }
 ]
 
@@ -155,7 +157,21 @@ const setEndDate = (row) => {
 </script>
 
 <template>
-  <UDashboardNavbar title="Anwesenheiten">
+  <FloatingActionButton
+      :label="`+ Anwesenheit`"
+      variant="outline"
+      v-if="platform === 'mobile'"
+      @click="router.push(`/workingtimes/create`)"
+      :pos="0"
+  />
+  <FloatingActionButton
+      :label="`Auswertung`"
+      variant="outline"
+      v-if="platform === 'mobile'"
+      @click="router.push(`/workingtimes/evaluate/${profileStore.activeProfile.id}`)"
+      :pos="1"
+  />
+  <UDashboardNavbar title="Anwesenheiten" v-if="platform !== 'mobile'">
     <template #right>
       <UButton
           @click="router.push(`/workingtimes/edit?profile=${filterUser}`)"
@@ -164,7 +180,12 @@ const setEndDate = (row) => {
       </UButton>
     </template>
   </UDashboardNavbar>
-  <UDashboardToolbar>
+  <UDashboardNavbar title="Anwesenheiten" v-else>
+    <template #toggle>
+      <div></div>
+    </template>
+  </UDashboardNavbar>
+  <UDashboardToolbar v-if="platform !== 'mobile'">
     <template #left>
 
       <USelectMenu