From 5842b6251d7c34ca2564c342d42ee9389f4fc82c Mon Sep 17 00:00:00 2001 From: Eli Ribble Date: Fri, 3 Apr 2026 18:28:41 +0000 Subject: [PATCH] Add district header on root page --- html/template/rmo/status.html | 113 ---------------------------------- resource/district.go | 2 + ts/rmo/App.vue | 15 ++++- ts/rmo/content/Home.vue | 10 +-- ts/rmo/router.ts | 32 ++++++++-- ts/rmo/store/district.ts | 48 +++++++++++++++ ts/rmo/type.ts | 5 ++ ts/rmo/view/district/Home.vue | 31 ++++++++-- vite/rmo/main.ts | 3 + vite/sync/main.ts | 22 ------- 10 files changed, 124 insertions(+), 157 deletions(-) create mode 100644 ts/rmo/store/district.ts create mode 100644 ts/rmo/type.ts diff --git a/html/template/rmo/status.html b/html/template/rmo/status.html index 89ca1c29..fcf779dc 100644 --- a/html/template/rmo/status.html +++ b/html/template/rmo/status.html @@ -187,117 +187,4 @@ document.addEventListener('DOMContentLoaded', onLoad); {{ else }} {{ template "rmo/component/header-district.html" .District }} {{ end }} -
- -
-
-
-
- -
-
- - - -
-
-
- - -
- -
- - -
-
-
-
-
- - -
-
-
Reports Map
-
-
-
- -
-
-
- - -
-
-
- Reports Near You -
- - Reports Found -
-
-
- -
-
-
-
{{ end }} diff --git a/resource/district.go b/resource/district.go index 3ab5fe5e..8b36e982 100644 --- a/resource/district.go +++ b/resource/district.go @@ -14,6 +14,7 @@ type districtR struct { type district struct { Name string `json:"name"` + Slug string `json:"slug"` URLLogo string `json:"url_logo"` } @@ -40,6 +41,7 @@ func (res *districtR) List(ctx context.Context, r *http.Request, query QueryPara } districts = append(districts, &district{ Name: org.Name(), + Slug: slug, URLLogo: logo, }) } diff --git a/ts/rmo/App.vue b/ts/rmo/App.vue index 2f1b5e13..6338b4c3 100644 --- a/ts/rmo/App.vue +++ b/ts/rmo/App.vue @@ -5,10 +5,13 @@ + diff --git a/ts/rmo/router.ts b/ts/rmo/router.ts index ce67270b..2e2e83b9 100644 --- a/ts/rmo/router.ts +++ b/ts/rmo/router.ts @@ -1,18 +1,38 @@ import { createRouter, createWebHistory } from "vue-router"; import type { RouteRecordRaw } from "vue-router"; -import Home from "@/rmo/view/Home.vue"; -import Nuisance from "@/rmo/view/Nuisance.vue"; +import HomeBase from "@/rmo/view/Home.vue"; +import HomeDistrict from "@/rmo/view/district/Home.vue"; +import NuisanceBase from "@/rmo/view/Nuisance.vue"; +//import * as NuisanceDistrict from "@/rmo/view/district/Nuisance.vue"; +import Status from "@/rmo/view/Status.vue"; import Water from "@/rmo/view/Water.vue"; const routes: RouteRecordRaw[] = [ { path: "/", - name: "Home", - component: Home, + name: "HomeBase", + component: HomeBase, }, { path: "/nuisance", - name: "Nuisance", - component: Nuisance, + name: "NuisanceBase", + component: NuisanceBase, + }, + { + path: "/district/:slug", + name: "HomeDistrict", + component: HomeDistrict, + props: true, + }, + /*{ + path: "/district/{slug}/nuisance", + name: "NuisanceDistrict", + component: NuisanceDistrict, + props: true, + },*/ + { + path: "/status", + name: "Status", + component: Status, }, { path: "/water", diff --git a/ts/rmo/store/district.ts b/ts/rmo/store/district.ts new file mode 100644 index 00000000..27fa427c --- /dev/null +++ b/ts/rmo/store/district.ts @@ -0,0 +1,48 @@ +import { ref } from "vue"; +import { defineStore } from "pinia"; +import { District } from "@/rmo/type"; + +export const useDistrictStore = defineStore("district", () => { + const districts = ref(null); + const error = ref(null); + const loading = ref(false); + const ongoingFetch = ref | null>(null); + + async function fetchDistricts(): Promise { + loading.value = true; + error.value = null; + + try { + const response = await fetch("/api/district"); + if (!response.ok) throw new Error("Failed to fetch districts"); + + const data: District[] = await response.json(); + districts.value = data; + return data; + } catch (e) { + error.value = e instanceof Error ? e.message : "an error ocurred"; + console.error("Error fetching districts:", e); + throw new Error(error.value); + } finally { + loading.value = false; + } + } + async function get(): Promise { + if (districts.value != null) { + return districts.value; + } + + if (ongoingFetch.value !== null) { + return ongoingFetch.value; + } + + const s = await fetchDistricts(); + districts.value = s; + ongoingFetch.value = null; + return s; + } + return { + error, + get, + }; +}); diff --git a/ts/rmo/type.ts b/ts/rmo/type.ts new file mode 100644 index 00000000..35632c6e --- /dev/null +++ b/ts/rmo/type.ts @@ -0,0 +1,5 @@ +export interface District { + name: string; + slug: string; + url_logo: string; +} diff --git a/ts/rmo/view/district/Home.vue b/ts/rmo/view/district/Home.vue index a1fc10ef..89ee7261 100644 --- a/ts/rmo/view/district/Home.vue +++ b/ts/rmo/view/district/Home.vue @@ -1,3 +1,12 @@ + @@ -35,11 +44,21 @@ diff --git a/vite/rmo/main.ts b/vite/rmo/main.ts index 5db1862c..d0f531cd 100644 --- a/vite/rmo/main.ts +++ b/vite/rmo/main.ts @@ -1,5 +1,6 @@ import { createApp } from "vue"; import { createHead } from "@vueuse/head"; +import { createPinia } from "pinia"; import "@/gen/custom-icons.scss"; import "@/style/rmo.scss"; import router from "@/rmo/router"; @@ -7,7 +8,9 @@ import App from "@/rmo/App.vue"; const app = createApp(App); const head = createHead(); +const pinia = createPinia(); app.use(head); +app.use(pinia); app.use(router); app.mount("#app"); diff --git a/vite/sync/main.ts b/vite/sync/main.ts index c3f82c17..4ef1f9a9 100644 --- a/vite/sync/main.ts +++ b/vite/sync/main.ts @@ -24,28 +24,6 @@ document.addEventListener("DOMContentLoaded", () => { } }); }); -document.addEventListener("init", () => { - const user = { - display_name: "", - initials: "", - notifications: [], - notification_counts: { - communication: 0, - home: 0, - review: 0, - }, - organization: { - name: "", - }, - role: "", - username: "", - }; -}); -interface GreetingComponent { - message: string; - name: string; - updateMessage(): void; -} const pinia = createPinia(); const app = createApp(App);