- Parte 3 : Viaggi

- Chat

src/modules/viaggi/pages/DriverProfilePage.ts

@@ -0,0 +1,172 @@
+import { ref, computed, onMounted, defineComponent } from 'vue';
+import { useRouter, useRoute } from 'vue-router';
+import { useQuasar } from 'quasar';
+import { useDriverProfile } from '../composables/useDriverProfile';
+import { useChat } from '../composables/useChat';
+import RideCard from '../components/ride/RideCard.vue';
+import FeedbackList from '../components/feedback/FeedbackList.vue';
+import type { DriverPublicProfile } from '../types';
+
+export default defineComponent({
+  name: 'DriverProfilePage',
+
+  components: {
+    RideCard,
+    FeedbackList
+  },
+
+  setup() {
+    const router = useRouter();
+    const route = useRoute();
+    const $q = useQuasar();
+
+    const {
+      driverProfile: profile,
+      loading,
+      error,
+      fetchDriverProfile,
+      formatMemberSince,
+      getBadgeIcon
+    } = useDriverProfile();
+
+    const { getOrCreateDirectChat } = useChat();
+
+    // Refs
+    const ridesSection = ref<HTMLElement | null>(null);
+    const currentUserId = ref(''); // TODO: Get from auth
+
+    // Computed
+    const userId = computed(() => route.params.id as string);
+
+    const isOwnProfile = computed(() => userId.value === currentUserId.value);
+
+    const userName = computed(() => {
+      if (!profile.value?.user) return 'Utente';
+      const user = profile.value.user;
+      if (user.name) {
+        return `${user.name} ${user.surname || ''}`.trim();
+      }
+      return user.username || 'Utente';
+    });
+
+    const userInitials = computed(() => {
+      return userName.value
+        .split(' ')
+        .map(n => n[0])
+        .join('')
+        .toUpperCase()
+        .slice(0, 2);
+    });
+
+    const memberSince = computed(() => {
+      if (!profile.value?.user.driverProfile?.memberSince) return '';
+      return formatMemberSince(profile.value.user.driverProfile.memberSince);
+    });
+
+    // Methods
+    const goBack = () => router.back();
+
+    const goToProfile = (profileUserId: string) => {
+      if (profileUserId !== userId.value) {
+        router.push(`/viaggi/profilo/${profileUserId}`);
+      }
+    };
+
+    const goToRide = (rideId: string) => {
+      router.push(`/viaggi/ride/${rideId}`);
+    };
+
+    const contactUser = async () => {
+      try {
+        const response = await getOrCreateDirectChat(userId.value);
+        if (response?.data) {
+          router.push(`/viaggi/chat/${response.data._id}`);
+        }
+      } catch (error: any) {
+        $q.notify({ type: 'negative', message: error.data?.message || error.message });
+      }
+    };
+
+    const scrollToRides = () => {
+      ridesSection.value?.scrollIntoView({ behavior: 'smooth' });
+    };
+
+    const editProfile = () => {
+      router.push('/viaggi/profilo/modifica');
+    };
+
+    const viewAllReviews = () => {
+      router.push(`/viaggi/recensioni/${userId.value}`);
+    };
+
+    const getStarIcon = (star: number, rating: number): string => {
+      if (star <= Math.floor(rating)) return 'star';
+      if (star === Math.ceil(rating) && rating % 1 >= 0.5) return 'star_half';
+      return 'star_outline';
+    };
+
+    const getVehicleIcon = (type?: string): string => {
+      const icons: Record<string, string> = {
+        auto: '🚗',
+        moto: '🏍️',
+        furgone: '🚐',
+        minibus: '🚌',
+        altro: '🚙'
+      };
+      return icons[type || 'auto'] || '🚗';
+    };
+
+    const formatBadgeName = (name: string): string => {
+      return name
+        .split('_')
+        .map(word => word.charAt(0).toUpperCase() + word.slice(1))
+        .join(' ');
+    };
+
+    const getCategoryLabel = (key: string): string => {
+      const labels: Record<string, string> = {
+        punctuality: 'Puntualità',
+        cleanliness: 'Pulizia',
+        communication: 'Comunicazione',
+        driving: 'Guida',
+        respect: 'Rispetto',
+        reliability: 'Affidabilità'
+      };
+      return labels[key] || key;
+    };
+
+    // Lifecycle
+    onMounted(async () => {
+      await fetchDriverProfile(userId.value);
+    });
+
+    return {
+      // State
+      profile,
+      loading,
+      error,
+      ridesSection,
+      currentUserId,
+
+      // Computed
+      isOwnProfile,
+      userName,
+      userInitials,
+      memberSince,
+
+      // Methods
+      goBack,
+      goToProfile,
+      goToRide,
+      contactUser,
+      scrollToRides,
+      editProfile,
+      viewAllReviews,
+      getStarIcon,
+      getVehicleIcon,
+      getBadgeIcon,
+      formatBadgeName,
+      getCategoryLabel
+    };
+  }
+});