feat(fe): added header

ToDo: connect clock to shows, style corrections

resources/js/components/header/Clock.vue

@@ -20,7 +20,7 @@ const items = [
     {
       id: 3,
       name: "Musichetta buffa",
-      type: "jingle",
+      type: "show",
       when: "12:10"
     },
   ];

resources/js/components/header/Timer.vue

@@ -1,13 +1,23 @@
 <script setup lang="ts">
-import axios from "axios";
 import {useAuthStore} from "@/stores/auth.store.ts";
+import {computed, ref} from "vue";
 
 const auth = useAuthStore();
+const timezone = auth.userData.timezone;
 
+const time = ref(new Date().toLocaleString("it-IT", {timeZone: timezone}));
+
+setInterval(() => {
+  time.value = new Date().toLocaleString("it-IT", {timeZone: timezone});
+}, 1000)
 </script>
 
 <template>
-
+  <div class="timer">
+    <span>
+      {{ time }}
+    </span>
+  </div>
 </template>
 
 <style scoped>

resources/js/components/header/partials/ClockContent.vue

@@ -3,6 +3,9 @@ const props = defineProps([
     'item'
 ]);
 
+/**
+ * Get Show/Spot icon
+ */
 const icon = () => {
   switch (props.item.type) {
     case 'show':
@@ -11,9 +14,6 @@ const icon = () => {
     case 'ad':
       return 'mdi-advertisements';
       break;
-    case 'jingle':
-      return 'mdi-music';
-      break;
   }
 }
 </script>