@zap-wunschlachen/wl-shared-components 1.0.5 → 1.0.7

package/App.vue

@@ -2,11 +2,11 @@
   <div class="app">
     <div class="element-container">
       <div style="height:100%; width: 100%; display: flex; flex-direction: column; gap: 20px;">
-        <Card :appointment="value0" :appointmentTypes="appointmentTypes" :dentist-image-src="value0.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
-        <Card disabled :appointment="value1" :appointmentTypes="appointmentTypes" :dentist-image-src="value1.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
-        <Card :appointment="value2" :appointmentTypes="appointmentTypes" :dentist-image-src="value2.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
-        <Card :appointment="value3" :appointmentTypes="appointmentTypes" :dentist-image-src="value3.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
-        <Card duplicate-treatment-datetime disabled :appointment="value4" :appointmentTypes="appointmentTypes" :dentist-image-src="value4.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
+        <Card :appointment="value0"  :dentist-image-src="value0.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
+        <Card disabled :appointment="value1"  :dentist-image-src="value1.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
+        <Card :appointment="value2"  :dentist-image-src="value2.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
+        <Card :appointment="value3"  :dentist-image-src="value3.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
+        <Card duplicate-treatment-datetime disabled :appointment="value4"  :dentist-image-src="value4.dentist.imageSrc" @confirm="onConfirmed" @cancel="onCancelled" @reschedule="onRescheduled" />
       </div>
      </div>
   </div>
@@ -123,49 +123,6 @@ const value4 = ref<AppointmentData>({
   address: "Musterstraße 1, 12345 Musterstadt",
   district: "Musterstadt-Mitte"
 });
-
-const appointmentTypes = ref([
-  {
-    id: 0,
-    icon: 'simple',
-    title: 'Simple',
-    content: '1 Patient <br>1 Behandler <br>1 Behandlungen',
-    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
-    additionalClass: "hidden"
-  },
-  {
-    id: 1,
-    icon: 'multitermin',
-    title: 'Multitermin',
-    content: '1 Patient <br>1 Behandler <br>2 Behandlungen',
-    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
-    additionalClass: ""
-  },
-  {
-    id: 2,
-    icon: 'supervision',
-    title: 'Supervision',
-    content: '1 Patient <br>2 Behandler <br> 1 Behandlungen',
-    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
-    additionalClass: ""
-  },
-  {
-    id: 3,
-    icon: 'doppeltermin',
-    title: 'Doppeltermin',
-    content: '2 Patienten <br> 1 Behandler <br> 1 Behandlungen',
-    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
-    additionalClass: ""
-  },
-  {
-    id: 4,
-    icon: 'kombitermin',
-    title: 'Kombitermin',
-    content: '1 Patient <br> 2 Behandler <br> 2 Behandlungen',
-    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
-    additionalClass: ""
-  },
-]);
 </script>
 
 <style scoped>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zap-wunschlachen/wl-shared-components",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/components/Appointment/Card/Card.vue

@@ -47,9 +47,10 @@
 
 <script setup lang="ts">
 import { format } from 'date-fns'
-import IconsAdvanceAppointments from '/src/components/Icons/AdvanceAppointments.vue';
+import IconsAdvanceAppointments from '@/components/Icons/AdvanceAppointments.vue';
 import { de } from 'date-fns/locale'
 import type { AppointmentData } from '@/types'
+import { appointmentTypes } from '@/utils/General'
 import Details from './Details.vue'
 import Actions from './Actions.vue'
 import { computed } from 'vue'
@@ -63,7 +64,6 @@ const props = defineProps<{
     dentistImageSrc?: string,
     disabled?: boolean,
     duplicateTreatmentDatetime?: boolean,
-    appointmentTypes: Array<{ id: number, icon: string, title: string }>
 }>();
 
 const treatmentDate = computed(() => {
@@ -74,15 +74,8 @@ const treatmentTime = computed(() => {
     return format(props.appointment ? new Date(props.appointment.start) : new Date(), 'HH:mm')
 })
 
-console.log('Rendering Card for appointment:', props.appointment);
-console.log('Disabled state:', props.disabled);
-console.log('Appointment Link:', props.appointmentLink);
-console.log('Dentist Image Src:', props.dentistImageSrc);
-console.log('Duplicate Treatment Datetime:', props.duplicateTreatmentDatetime);
-
-
 const getAppointmentType = computed(() => {
-    return props.appointmentTypes.find(item => item.id === props.appointment?.type)
+    return appointmentTypes.find(item => item.id === props.appointment?.type)
 })
 </script>
 

package/src/utils/General.ts

@@ -0,0 +1,42 @@
+export const appointmentTypes = [
+  {
+    id: 0,
+    icon: 'simple',
+    title: 'Simple',
+    content: '1 Patient <br>1 Behandler <br>1 Behandlungen',
+    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
+    additionalClass: "hidden"
+  },
+  {
+    id: 1,
+    icon: 'multitermin',
+    title: 'Multitermin',
+    content: '1 Patient <br>1 Behandler <br>2 Behandlungen',
+    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
+    additionalClass: ""
+  },
+  {
+    id: 2,
+    icon: 'supervision',
+    title: 'Supervision',
+    content: '1 Patient <br>2 Behandler <br> 1 Behandlungen',
+    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
+    additionalClass: ""
+  },
+  {
+    id: 3,
+    icon: 'doppeltermin',
+    title: 'Doppeltermin',
+    content: '2 Patienten <br> 1 Behandler <br> 1 Behandlungen',
+    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
+    additionalClass: ""
+  },
+  {
+    id: 4,
+    icon: 'kombitermin',
+    title: 'Kombitermin',
+    content: '1 Patient <br> 2 Behandler <br> 2 Behandlungen',
+    description: 'Hier steht Text zu der Termin option die ungefähr so lang ist.',
+    additionalClass: ""
+  },
+];