169 lines
4.4 KiB
TypeScript
169 lines
4.4 KiB
TypeScript
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 { VEHICLE_TYPES } from '../types/viaggi.types';
|
|
import { useUserStore } from 'app/src/store';
|
|
|
|
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 userStore = useUserStore()
|
|
const currentUserId = ref<string>(userStore.my._id);
|
|
|
|
// Computed
|
|
const userId = computed(() => route.params.id ? route.params.id.toString() : currentUserId.value);
|
|
|
|
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 vehicleType = VEHICLE_TYPES.find((vt) => vt.value === type);
|
|
return vehicleType ? vehicleType.icon : ' ';
|
|
};
|
|
|
|
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
|
|
};
|
|
}
|
|
});
|