44 lines
941 B
Vue
44 lines
941 B
Vue
<script setup>
|
|
import { computed } from 'vue';
|
|
|
|
const route = useRoute();
|
|
|
|
const {data:car} = await useFetchCar(route.params.id);
|
|
|
|
|
|
const {toTitleCase} = useUtilities();
|
|
const {cars} = useCars();
|
|
|
|
useHead({
|
|
title :toTitleCase(route.params.name )
|
|
});
|
|
|
|
// const car = computed(() => {
|
|
// return cars.find((_) => {
|
|
// return _.id === parseInt(route.params.id)
|
|
// });
|
|
// });
|
|
|
|
|
|
if (!car.value) {
|
|
throw createError({
|
|
statusCode: 404,
|
|
message: `Car with ID ${route.params.id} not found`
|
|
});
|
|
}
|
|
|
|
|
|
definePageMeta({
|
|
layout: "custom"
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="car">
|
|
<CarDetailHero :car="car"/>
|
|
<CarDetailAttributes :features="car.features"/>
|
|
<CarDetailDescription :description="car.description"/>
|
|
<CarDetailContact/>
|
|
</div>
|
|
</template> |