Gleipnir/nidus-sync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add district-styled pages for all 3 main RMO pages

Browse source
This commit is contained in:
Eli Ribble 2026-04-03 18:50:23 +00:00
parent c0e414bdc3
commit 51fe851c5a
No known key found for this signature in database
15 changed files with 1268 additions and 1089 deletions
Download patch file Download diff file Expand all files Collapse all files

37
ts/rmo/view/district/Home.vue
View file

@ -8,36 +8,10 @@
}
</style>
<template>
<Home>
<Home :slug="slug">
<template #header>
<!-- Introduction Section -->
<template v-if="district">
<section class="py-5 bg-primary text-white">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10">
<h2 class="text-center mb-4">Report a Mosquito Problem</h2>
<p class="lead text-center">
Submit a report to help reduce mosquito activity in your
neighborhood.
</p>
<p class="lead text-center">
Report Mosquitoes Online works with local mosquito control
agencies to receive public reports.
</p>
<p class="lead text-center">
For this area, mosquito control services are provided by
</p>
<h3 class="text-center">{{ district.name }}</h3>
<img class="district-logo" :src="district.url_logo" />
</div>
</div>
</div>
</section>
</template>
<template v-else>
<p>loading district...</p>
</template>
<HeaderDistrict :district="district" />
</template>
</Home>
</template>
@ -48,6 +22,7 @@ import { computedAsync } from "@vueuse/core";
import Home from "@/rmo/content/Home.vue";
import type { District } from "@/rmo/type";
import { useDistrictStore } from "@/rmo/store/district";
import HeaderDistrict from "@/components/HeaderDistrict.vue";
interface Props {
slug: string;
@ -55,10 +30,8 @@ interface Props {
const props = defineProps<Props>();
const districtStore = useDistrictStore();
const district = computedAsync(async (): Promise<District | null> => {
const district = computedAsync(async (): Promise<District | undefined> => {
const districts = await districtStore.get();
return (
districts.find((district: District) => district.slug == props.slug) || null
);
return districts.find((district: District) => district.slug == props.slug);
});
</script>