Fixed marker ts error

This commit is contained in:
Alexis
2025-09-03 20:48:22 +02:00
parent 08d1489631
commit bce99cd307
3 changed files with 25 additions and 13 deletions

View File

@@ -21,7 +21,7 @@ const popupOffset = [0, iconSize.value[0] * -0.66]
{{ marker.title }} {{ marker.title }}
</h2> </h2>
<p v-html="marker.reviews?.[0].text" /> <p v-html="marker.reviews?.[0]!!.text" />
</div> </div>
</LPopup> </LPopup>
@@ -48,21 +48,21 @@ const popupOffset = [0, iconSize.value[0] * -0.66]
<div <div
class="absolute -top-2 -right-2 size-5 text-center grid place-items-center rounded-full text-[0.65rem] font-bold tracking-[-0.075em]" class="absolute -top-2 -right-2 size-5 text-center grid place-items-center rounded-full text-[0.65rem] font-bold tracking-[-0.075em]"
:class="{ :class="{
'text-white bg-red-500': marker.reviews?.[0].grade! <= 1.5, 'text-white bg-red-500': marker.reviews?.[0]!.grade! <= 1.5,
'text-black bg-amber-400': marker.reviews?.[0].grade! > 1.5 && marker.reviews?.[0].grade! <= 2.5, 'text-black bg-amber-400': marker.reviews?.[0]!.grade! > 1.5 && marker.reviews?.[0]!.grade! <= 2.5,
'text-black bg-lime-400': marker.reviews?.[0].grade! > 2.5 && marker.reviews?.[0].grade! < 4.0, 'text-black bg-lime-400': marker.reviews?.[0]!.grade! > 2.5 && marker.reviews?.[0]!.grade! < 4.0,
'text-black bg-green-400': marker.reviews?.[0].grade! > 2.5 && marker.reviews?.[0].grade! < 4.7, 'text-black bg-green-400': marker.reviews?.[0]!.grade! > 2.5 && marker.reviews?.[0]!.grade! < 4.7,
'text-black bg-sky-400': marker.reviews?.[0].grade! >= 4.7 'text-black bg-sky-400': marker.reviews?.[0]!.grade! >= 4.7
}"> }">
{{ marker.reviews?.[0].grade }} {{ marker.reviews?.[0]!.grade }}
</div> </div>
<div class="absolute -z-10 -inset-0.5 rounded-full" :class="{ <div class="absolute -z-10 -inset-0.5 rounded-full" :class="{
'bg-red-500': marker.reviews?.[0].grade! <= 1.5, 'bg-red-500': marker.reviews?.[0]!.grade! <= 1.5,
'bg-amber-400': marker.reviews?.[0].grade! > 1.5 && marker.reviews?.[0].grade! <= 2.5, 'bg-amber-400': marker.reviews?.[0]!.grade! > 1.5 && marker.reviews?.[0]!.grade! <= 2.5,
'bg-lime-400': marker.reviews?.[0].grade! > 2.5 && marker.reviews?.[0].grade! < 4.0, 'bg-lime-400': marker.reviews?.[0]!.grade! > 2.5 && marker.reviews?.[0]!.grade! < 4.0,
'bg-green-400': marker.reviews?.[0].grade! > 2.5 && marker.reviews?.[0].grade! < 4.7, 'bg-green-400': marker.reviews?.[0]!.grade! > 2.5 && marker.reviews?.[0]!.grade! < 4.7,
'bg-sky-400': marker.reviews?.[0].grade! >= 4.7 'bg-sky-400': marker.reviews?.[0]!.grade! >= 4.7
}" /> }" />
</LIcon> </LIcon>
</LMarker> </LMarker>

View File

@@ -1,7 +1,7 @@
import type { PointTuple } from "leaflet" import type { PointTuple } from "leaflet"
export type MarkerType = "restaurant" | "bar" | "bakery" | "tea-shop" | "coffee-shop" | "ice-cream" export type MarkerType = "restaurant" | "bar" | "bakery" | "tea-shop" | "coffee-shop" | "ice-cream"
export type FoodType = "mixed" | "asian" | "vegetarian" | "italian" | "fast-food" | "street-food" | "burgers" | "seafood" | "creperie" | "eastern" export type FoodType = "mixed" | "asian" | "creole" | "vegetarian" | "italian" | "fast-food" | "street-food" | "burgers" | "seafood" | "creperie" | "eastern"
export interface ReviewMarker { export interface ReviewMarker {
coords: PointTuple coords: PointTuple

View File

@@ -143,6 +143,18 @@ const markers: ReviewMarker[] = [
} }
] ]
}, },
{
title: "Black Temple Food",
coords: [48.11434262064451, -1.6816647295465943],
type: "restaurant",
food: "creole",
reviews: [
{
grade: 4.0,
text: "Bonnes frites de patates douces et les empanadas sont bons ; leurs photos sont plus anciennes et ne montrent pas les bonnes quantités."
}
]
},
{ {
title: "Côté Sushi", title: "Côté Sushi",
coords: [48.11324625619256, -1.6800305422199695], coords: [48.11324625619256, -1.6800305422199695],