legonzaur/better-mreso
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip: use pinia

Browse Source
This commit is contained in:
legonzaur
2026-07-05 16:25:54 +02:00
parent 6fa15f2ef3
commit d345ea9ec3
9 changed files with 229 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/map/clusters.client.vue
+3 -1
View File
@@ -55,7 +55,9 @@ async function clusterClick(e: FeatureCollection) {
}
new Popup()
.setLngLat(coordinates)
.setHTML(`This cluster contains ${data.features.length} stops`)
.setHTML(
`Cluster code : ${feature.properties.code}<br/>This cluster contains ${data.features.length} stops`,
)
.addTo(map.map);
}
app/components/map/map.client.vue
-40
View File
@@ -13,24 +13,6 @@
/>
</MglMap>
</ClientOnly>
<div v-if="routesRequest.data.value" id="lineSelector">
<div
v-for="route of routesRequest.data.value"
:key="route.id"
:class="{
selected: selectedRoutes.includes(route.id),
lineLabel: true,
}"
:style="{
background: '#' + route.color,
color: '#' + route.textColor,
}"
@click="selectRoute(route.id)"
>
{{ route.type }} : {{ route.shortName }}
</div>
</div>
</template>
<script setup lang="ts">
@@ -69,28 +51,6 @@ const transport_lines = computed(() => linesRequest.data.value?.features ?? []);
const routesRequest = await useFetch<Route[]>("/routes.json");
// Selected routes with lines
const routeWithLines = computed(() => {
const shownLines: { route: Route; line: Feature<MultiLineString> }[] = [];
for (const routeId of selectedRoutes.value) {
const route = routesRequest.data.value?.find((r) => r.id == routeId);
if (!route) {
continue;
}
const line = transport_lines.value.find(
(f) => routeId == f.properties?.id.replace("_", ":"),
);
if (!line) {
continue;
}
shownLines.push({
route,
line,
});
}
return shownLines;
});
async function selectRoute(routeId: string) {
if (!map.map) {
console.error("Map is not yet initialized ! aborting");
app/components/sidebar.vue/container.vue
+19
View File
@@ -0,0 +1,19 @@
<template>
<div v-if="routesRequest.data.value" id="lineSelector">
<div
v-for="route of routesRequest.data.value"
:key="route.id"
:class="{
selected: selectedRoutes.includes(route.id),
lineLabel: true,
}"
:style="{
background: '#' + route.color,
color: '#' + route.textColor,
}"
@click="selectRoute(route.id)"
>
{{ route.type }} : {{ route.shortName }}
</div>
</div>
</template>
app/pages/map.vue
+4 -1
View File
@@ -1,3 +1,6 @@
<template>
<Map />
<main>
<SidebarContainer />
<Map />
</main>
</template>
app/stores/mreso.ts
+46
View File
@@ -0,0 +1,46 @@
import type { Feature, FeatureCollection, MultiLineString, Point } from "geojson";
export const useMresoStore = defineStore("mresoStore", {
state: () => ({
routes: [] as Route[],
lines: {} as FeatureCollection<MultiLineString>,
clusters: {} as FeatureCollection<Point>,
stops: {} as FeatureCollection<Point>,
selectedRoutesId: [] as string[]
}),
actions: {
async fetch() {
// const infos = await $fetch("https://api.nuxt.com/modules/pinia");
// this.name = infos.name;
// this.description = infos.description;
},
},
getters: {
routesById(state) {
return Object.fromEntries(state.routes.map((r)=>[r.id, r]))
},
linesById(state) {
return Object.fromEntries(state.lines.features.map((l)=>[l.properties!.id, l]))
},
shownLines() {
const shownLines: { route: Route; line: Feature<MultiLineString> }[] = [];
for (const routeId of this.selectedRoutesId) {
const route = this.routesById[routeId];
if (!route) {
continue;
}
const line = this.linesById[routeId.replace(":","_")]
if (!line) {
continue;
}
shownLines.push({
route,
line,
});
}
return shownLines;
},
}
}
});
nuxt.config.ts
+1 -1
View File
@@ -2,7 +2,7 @@
export default defineNuxtConfig({
compatibilityDate: "2025-07-15",
devtools: { enabled: true },
modules: ["@nuxt/eslint", "nuxt-maplibre"],
modules: ["@nuxt/eslint", "nuxt-maplibre", "@pinia/nuxt"],
vite: {
optimizeDeps: {
// noDiscovery: true,
package-lock.json
Generated
+152
View File
@@ -8,10 +8,12 @@
"hasInstallScript": true,
"dependencies": {
"@nuxt/eslint": "^1.16.0",
"@pinia/nuxt": "^0.11.3",
"@types/geojson": "^7946.0.16",
"eslint": "^10.6.0",
"nuxt": "^4.4.8",
"nuxt-maplibre": "^1.2.2",
"pinia": "^3.0.4",
"vue": "^3.5.38",
"vue-router": "^5.1.0"
}
@@ -3471,6 +3473,21 @@
"url": "https://opencollective.com/parcel"
}
},
"node_modules/@pinia/nuxt": {
"version": "0.11.3",
"resolved": "https://registry.npmjs.org/@pinia/nuxt/-/nuxt-0.11.3.tgz",
"integrity": "sha512-7WVNHpWx4qAEzOlnyrRC88kYrwnlR/PrThWT0XI1dSNyUAXu/KBv9oR37uCgYkZroqP5jn8DfzbkNF3BtKvE9w==",
"license": "MIT",
"dependencies": {
"@nuxt/kit": "^4.2.0"
},
"funding": {
"url": "https://github.com/sponsors/posva"
},
"peerDependencies": {
"pinia": "^3.0.4"
}
},
"node_modules/@pkgjs/parseargs": {
"version": "0.11.0",
"resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
@@ -6231,6 +6248,21 @@
"integrity": "sha512-UaXxwISYJPTr9hwQxMFYZ7kNhSXboMXP+Z3TRX6f1/NyaGPfuNUZOWP1pUEb75B2HjfklIYLVRfWiFZJyC6Npg==",
"license": "MIT"
},
"node_modules/copy-anything": {
"version": "4.0.5",
"resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-4.0.5.tgz",
"integrity": "sha512-7Vv6asjS4gMOuILabD3l739tsaxFQmC+a7pLZm02zyvs8p977bL3zEgq3yDk5rn9B0PbYgIv++jmHcuUab4RhA==",
"license": "MIT",
"dependencies": {
"is-what": "^5.2.0"
},
"engines": {
"node": ">=18"
},
"funding": {
"url": "https://github.com/sponsors/mesqueeb"
}
},
"node_modules/core-js-compat": {
"version": "3.49.0",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.49.0.tgz",
@@ -8485,6 +8517,18 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/is-what": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/is-what/-/is-what-5.5.0.tgz",
"integrity": "sha512-oG7cgbmg5kLYae2N5IVd3jm2s+vldjxJzK1pcu9LfpGuQ93MQSzo0okvRna+7y5ifrD+20FE8FvjusyGaz14fw==",
"license": "MIT",
"engines": {
"node": ">=18"
},
"funding": {
"url": "https://github.com/sponsors/mesqueeb"
}
},
"node_modules/is-wsl": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-3.1.1.tgz",
@@ -9324,6 +9368,12 @@
"node": ">= 18"
}
},
"node_modules/mitt": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
"integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==",
"license": "MIT"
},
"node_modules/mlly": {
"version": "1.8.2",
"resolved": "https://registry.npmjs.org/mlly/-/mlly-1.8.2.tgz",
@@ -10574,6 +10624,81 @@
"url": "https://github.com/sponsors/jonschlinkert"
}
},
"node_modules/pinia": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/pinia/-/pinia-3.0.4.tgz",
"integrity": "sha512-l7pqLUFTI/+ESXn6k3nu30ZIzW5E2WZF/LaHJEpoq6ElcLD+wduZoB2kBN19du6K/4FDpPMazY2wJr+IndBtQw==",
"license": "MIT",
"dependencies": {
"@vue/devtools-api": "^7.7.7"
},
"funding": {
"url": "https://github.com/sponsors/posva"
},
"peerDependencies": {
"typescript": ">=4.5.0",
"vue": "^3.5.11"
},
"peerDependenciesMeta": {
"typescript": {
"optional": true
}
}
},
"node_modules/pinia/node_modules/@vue/devtools-api": {
"version": "7.7.10",
"resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-7.7.10.tgz",
"integrity": "sha512-KxtEpUOOpFz/qOGRrAwA36QF7DqIA+FXgCYit9mk9wjbaZt0sXOFz81ElOZtKA4HbWHUdwNjZHBFsFFyp5BZiA==",
"license": "MIT",
"dependencies": {
"@vue/devtools-kit": "^7.7.10"
}
},
"node_modules/pinia/node_modules/@vue/devtools-kit": {
"version": "7.7.10",
"resolved": "https://registry.npmjs.org/@vue/devtools-kit/-/devtools-kit-7.7.10.tgz",
"integrity": "sha512-3WNi2Kq4tbpVbmhml7RiphmAt0279oh3fKNeWMQIrltfX8Q91b4i5PL8DtyNKdwmcsGrV4fg+erwWOmD05CLIw==",
"license": "MIT",
"dependencies": {
"@vue/devtools-shared": "^7.7.10",
"birpc": "^2.3.0",
"hookable": "^5.5.3",
"mitt": "^3.0.1",
"perfect-debounce": "^1.0.0",
"speakingurl": "^14.0.1",
"superjson": "^2.2.2"
}
},
"node_modules/pinia/node_modules/@vue/devtools-shared": {
"version": "7.7.10",
"resolved": "https://registry.npmjs.org/@vue/devtools-shared/-/devtools-shared-7.7.10.tgz",
"integrity": "sha512-wOPslzB8vTvpxwdaOcR2qAbwmuSP0L+rhpoC6Cf56V3Jip+HWb7PQQXOUPgBNQARpXsbQX/+mvi8kKucmBGRwQ==",
"license": "MIT",
"dependencies": {
"rfdc": "^1.4.1"
}
},
"node_modules/pinia/node_modules/birpc": {
"version": "2.9.0",
"resolved": "https://registry.npmjs.org/birpc/-/birpc-2.9.0.tgz",
"integrity": "sha512-KrayHS5pBi69Xi9JmvoqrIgYGDkD6mcSe/i6YKi3w5kekCLzrX4+nawcXqrj2tIp50Kw/mT/s3p+GVK0A0sKxw==",
"license": "MIT",
"funding": {
"url": "https://github.com/sponsors/antfu"
}
},
"node_modules/pinia/node_modules/hookable": {
"version": "5.5.3",
"resolved": "https://registry.npmjs.org/hookable/-/hookable-5.5.3.tgz",
"integrity": "sha512-Yc+BQe8SvoXH1643Qez1zqLRmbA5rCL+sSmk6TVos0LWVfNIB7PGncdlId77WzLGSIB5KaWgTaNTs2lNVEI6VQ==",
"license": "MIT"
},
"node_modules/pinia/node_modules/perfect-debounce": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/perfect-debounce/-/perfect-debounce-1.0.0.tgz",
"integrity": "sha512-xCy9V055GLEqoFaHoC1SoLIaLmWctgCUaBaWxDZ7/Zx4CTyX7cJQLJOok/orfjZAh9kEYpjJa4d0KcJmCbctZA==",
"license": "MIT"
},
"node_modules/pkg-types": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-2.3.1.tgz",
@@ -11422,6 +11547,12 @@
"node": ">=0.10.0"
}
},
"node_modules/rfdc": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz",
"integrity": "sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==",
"license": "MIT"
},
"node_modules/rolldown": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.1.4.tgz",
@@ -11882,6 +12013,15 @@
"integrity": "sha512-CWLcCCH7VLu13TgOH+r8p1O/Znwhqv/dbb6lqWy67G+pT1kHmeD/+V36AVb/vq8QMIQwVShJ6Ssl5FPh0fuSdw==",
"license": "CC0-1.0"
},
"node_modules/speakingurl": {
"version": "14.0.1",
"resolved": "https://registry.npmjs.org/speakingurl/-/speakingurl-14.0.1.tgz",
"integrity": "sha512-1POYv7uv2gXoyGFpBCmpDVSNV74IfsWlDW216UPjbWufNf+bSU6GdbDsxdcxtfwb4xlI3yxzOTKClUosxARYrQ==",
"license": "BSD-3-Clause",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/srvx": {
"version": "0.11.21",
"resolved": "https://registry.npmjs.org/srvx/-/srvx-0.11.21.tgz",
@@ -12104,6 +12244,18 @@
"postcss": "^8.5.15"
}
},
"node_modules/superjson": {
"version": "2.2.6",
"resolved": "https://registry.npmjs.org/superjson/-/superjson-2.2.6.tgz",
"integrity": "sha512-H+ue8Zo4vJmV2nRjpx86P35lzwDT3nItnIsocgumgr0hHMQ+ZGq5vrERg9kJBo5AWGmxZDhzDo+WVIJqkB0cGA==",
"license": "MIT",
"dependencies": {
"copy-anything": "^4"
},
"engines": {
"node": ">=16"
}
},
"node_modules/supports-color": {
"version": "10.2.2",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-10.2.2.tgz",
package.json
+2
View File
@@ -11,10 +11,12 @@
},
"dependencies": {
"@nuxt/eslint": "^1.16.0",
"@pinia/nuxt": "^0.11.3",
"@types/geojson": "^7946.0.16",
"eslint": "^10.6.0",
"nuxt": "^4.4.8",
"nuxt-maplibre": "^1.2.2",
"pinia": "^3.0.4",
"vue": "^3.5.38",
"vue-router": "^5.1.0"
}
public/stops.json
+1
View File
File diff suppressed because one or more lines are too long