Removed debug logging, reload restaurants on login and fixed leaflet marker icons.

main
Eloi Zalczer 2024-06-19 10:45:59 +02:00
parent b25d8dd7bd
commit 5e5e7943a3
13 changed files with 15 additions and 27 deletions

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" /> <link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue</title> <title>DOXFOOD</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 696 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 618 B

View File

@ -27,7 +27,6 @@ const text = computed(() => {
if (model.value === undefined || model.value === null) { if (model.value === undefined || model.value === null) {
return "0"; return "0";
} }
console.log(model.value);
return `${round(model.value, 1)}`; return `${round(model.value, 1)}`;
}); });

View File

@ -7,6 +7,8 @@ import LatLng from "../models/map";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
import { useRestaurantsStore } from "../stores/restaurants"; import { useRestaurantsStore } from "../stores/restaurants";
L.Icon.Default.imagePath = "icon/";
const map = ref<L.Map | null>(null); const map = ref<L.Map | null>(null);
const { restaurants } = storeToRefs(useRestaurantsStore()); const { restaurants } = storeToRefs(useRestaurantsStore());
@ -50,17 +52,14 @@ onMounted(() => {
watch( watch(
() => props.highlighted, () => props.highlighted,
(newval, oldval) => { (newval, oldval) => {
console.log(markers.value);
if (oldval != null) { if (oldval != null) {
var old = markers.value.get(oldval); var old = markers.value.get(oldval);
console.log("old", old, oldval);
if (old.isPopupOpen()) { if (old.isPopupOpen()) {
old.closePopup(); old.closePopup();
} }
} }
if (newval != null) { if (newval != null) {
var marker = markers.value.get(newval); var marker = markers.value.get(newval);
console.log("new", marker, newval);
if (!marker.isPopupOpen()) { if (!marker.isPopupOpen()) {
marker.openPopup(); marker.openPopup();
} }

View File

@ -41,7 +41,6 @@ const hovered = ref<Restaurant | null>();
function onMouseOver(e) { function onMouseOver(e) {
const row = e.target?._DT_CellIndex?.row; const row = e.target?._DT_CellIndex?.row;
console.log("row", row);
if (row !== undefined && props.data !== undefined) { if (row !== undefined && props.data !== undefined) {
if (hovered.value != props.data[row]) { if (hovered.value != props.data[row]) {
@ -51,7 +50,6 @@ function onMouseOver(e) {
} else { } else {
if (hovered.value !== null) { if (hovered.value !== null) {
emit("restaurantHovered", null); emit("restaurantHovered", null);
console.log("hovered");
} }
hovered.value = null; hovered.value = null;
} }

View File

@ -15,13 +15,11 @@ async function load(restaurantId: string) {
expand: "user", expand: "user",
sort: "-created", sort: "-created",
}); });
console.log(reviews.value);
} }
watch( watch(
() => props.restaurant, () => props.restaurant,
async (newval, oldval) => { async (newval, oldval) => {
console.log("fetch");
if (props.restaurant === undefined) { if (props.restaurant === undefined) {
reviews.value = []; reviews.value = [];
} else { } else {

View File

@ -1,9 +1,10 @@
import { defineStore } from "pinia"; import { defineStore } from "pinia";
import { pb } from "../pocketbase"; import { currentUser, pb } from "../pocketbase";
import { average } from "../utils/math"; import { average } from "../utils/math";
import Restaurant from "../models/restaurant"; import Restaurant from "../models/restaurant";
import _ from "lodash"; import _ from "lodash";
import { watch } from "vue";
export const useRestaurantsStore = defineStore("restaurants", { export const useRestaurantsStore = defineStore("restaurants", {
state: () => ({ state: () => ({
@ -44,11 +45,15 @@ export const useRestaurantsStore = defineStore("restaurants", {
await this.load(); await this.load();
pb.collection("restaurants").subscribe("*", async (e) => { pb.collection("restaurants").subscribe("*", async (e) => {
this.load(); await this.load();
}); });
pb.collection("reviews").subscribe("*", async (e) => { pb.collection("reviews").subscribe("*", async (e) => {
this.load(); await this.load();
});
watch(currentUser, async (newUser, oldUser) => {
await this.load();
}); });
}, },
}, },

View File

@ -1,15 +1,11 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref } from "vue"; import { ref } from "vue";
import { pb } from "../pocketbase";
import RestaurantsTable from "../components/RestaurantsTable.vue"; import RestaurantsTable from "../components/RestaurantsTable.vue";
import RestaurantsMap from "../components/RestaurantsMap.vue"; import RestaurantsMap from "../components/RestaurantsMap.vue";
import ReviewsDrawer from "../components/ReviewsDrawer.vue"; import ReviewsDrawer from "../components/ReviewsDrawer.vue";
import { average } from "../utils/math";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
import { useRestaurantsStore } from "../stores/restaurants"; import { useRestaurantsStore } from "../stores/restaurants";
const data = ref<Object[]>([]);
const drawer = ref<typeof ReviewsDrawer>(); const drawer = ref<typeof ReviewsDrawer>();
const table = ref<typeof RestaurantsTable>(); const table = ref<typeof RestaurantsTable>();
@ -28,7 +24,6 @@ function onRestaurantHovered(id: string) {
} }
function onDrawerClosed() { function onDrawerClosed() {
console.log("closed");
table.value?.deselectAll(); table.value?.deselectAll();
} }
</script> </script>

View File

@ -15,17 +15,13 @@ async function login() {
return; return;
} }
await pb.collection("users").authWithPassword(username.value, password.value); await pb.collection("users").authWithPassword(username.value!, password.value!);
} }
</script> </script>
<template> <template>
<p v-if="currentUser">Signed in as {{ currentUser.username }}</p> <p v-if="currentUser">Signed in as {{ currentUser.username }}</p>
<form <form v-else class="flex flex-col place-content-center items-center h-full" @submit.prevent="">
v-else
class="flex flex-col place-content-center items-center h-full"
@submit.prevent=""
>
<div class="flex flex-row flex-nowrap"> <div class="flex flex-row flex-nowrap">
<div class="mx-5 my-4 w-full"> <div class="mx-5 my-4 w-full">
<label class="form-label"> Username </label> <label class="form-label"> Username </label>
@ -40,8 +36,6 @@ async function login() {
</div> </div>
<button @click="login" :disabled="!valid">Log In</button> <button @click="login" :disabled="!valid">Log In</button>
<p> <p>New to DOXFOOD ? <RouterLink to="/signup">Create an account !</RouterLink></p>
New to DOXFOOD ? <RouterLink to="/signup">Create an account !</RouterLink>
</p>
</form> </form>
</template> </template>