Show empty aggregation map without service area
This commit is contained in:
parent
7f8491a1c2
commit
05a7bbb4e3
2 changed files with 53 additions and 50 deletions
46
ts/format.ts
46
ts/format.ts
|
|
@ -9,6 +9,21 @@ export function formatAddress(address?: Address): string {
|
|||
}
|
||||
return `${address.number} ${address.street}, ${address.locality}`;
|
||||
}
|
||||
export function formatBigNumber(n: number): string {
|
||||
// Convert the number to a string
|
||||
const numStr = n.toString();
|
||||
|
||||
// Add commas every three digits from the right
|
||||
let result = "";
|
||||
for (let i = 0; i < numStr.length; i++) {
|
||||
if (i > 0 && (numStr.length - i) % 3 === 0) {
|
||||
result += ",";
|
||||
}
|
||||
result += numStr[i];
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
export function formatDistance(meters: number | undefined) {
|
||||
if (meters === undefined || meters === null) {
|
||||
return "unknown";
|
||||
|
|
@ -39,7 +54,38 @@ export function formatRelativeTime(dateString: string): string {
|
|||
if (diffHours < 24) return `${diffHours} hour${diffHours > 1 ? "s" : ""} ago`;
|
||||
return `${diffDays} day${diffDays > 1 ? "s" : ""} ago`;
|
||||
}
|
||||
export function formatTimeRelative(t: Date): string {
|
||||
const now = new Date();
|
||||
const diffMs = now.getTime() - t.getTime();
|
||||
|
||||
const hours = diffMs / (1000 * 60 * 60);
|
||||
|
||||
if (hours > 0) {
|
||||
if (hours < 1) {
|
||||
const minutes = diffMs / (1000 * 60);
|
||||
return `${Math.floor(minutes)} minutes ago`;
|
||||
} else if (hours < 24) {
|
||||
return `${Math.floor(hours)} hours ago`;
|
||||
} else {
|
||||
const days = hours / 24;
|
||||
return `${Math.floor(days)} days ago`;
|
||||
}
|
||||
} else {
|
||||
if (hours < -24) {
|
||||
const days = hours / 24;
|
||||
return `in ${Math.floor(-1 * days)} days`;
|
||||
} else if (hours < -1) {
|
||||
return `in ${Math.floor(-1 * hours)} hours`;
|
||||
} else {
|
||||
const minutes = diffMs / (1000 * 60);
|
||||
if (minutes > -1) {
|
||||
const seconds = diffMs / 1000;
|
||||
return `in ${Math.floor(-1 * seconds)} seconds`;
|
||||
}
|
||||
return `in ${Math.floor(-1 * minutes)} minutes`;
|
||||
}
|
||||
}
|
||||
}
|
||||
export function shortAddress(a: Address | undefined): string {
|
||||
if (!a) return "unknown";
|
||||
return `${a.number} ${a.street}, ${a.locality}`;
|
||||
|
|
|
|||
|
|
@ -120,12 +120,8 @@
|
|||
<h3 class="section-title">Mosquito Activity Heatmap</h3>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<p v-if="session.user && dashboard.serviceArea.min.x === 0.0">
|
||||
No service area for this organization yet
|
||||
</p>
|
||||
<MapAggregate
|
||||
v-else
|
||||
:bounds="session.user?.organization.service_area"
|
||||
:bounds="mapBounds()"
|
||||
:markers="[]"
|
||||
:organizationId="dashboard.organization.id"
|
||||
:tegola="session.urls?.tegola ?? ''"
|
||||
|
|
@ -161,7 +157,9 @@
|
|||
<script setup lang="ts">
|
||||
import { onMounted, reactive } from "vue";
|
||||
import MapAggregate from "@/components/MapAggregate.vue";
|
||||
import { formatBigNumber, formatTimeRelative } from "@/format";
|
||||
import { useSessionStore } from "@/store/session";
|
||||
import type { Bounds } from "@/types";
|
||||
|
||||
const dashboard = reactive({
|
||||
counts: {
|
||||
|
|
@ -184,52 +182,11 @@ const dashboard = reactive({
|
|||
});
|
||||
const session = useSessionStore();
|
||||
onMounted(async () => {});
|
||||
function formatBigNumber(n: number): string {
|
||||
// Convert the number to a string
|
||||
const numStr = n.toString();
|
||||
|
||||
// Add commas every three digits from the right
|
||||
let result = "";
|
||||
for (let i = 0; i < numStr.length; i++) {
|
||||
if (i > 0 && (numStr.length - i) % 3 === 0) {
|
||||
result += ",";
|
||||
}
|
||||
result += numStr[i];
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
function formatTimeRelative(t: Date): string {
|
||||
const now = new Date();
|
||||
const diffMs = now.getTime() - t.getTime();
|
||||
|
||||
const hours = diffMs / (1000 * 60 * 60);
|
||||
|
||||
if (hours > 0) {
|
||||
if (hours < 1) {
|
||||
const minutes = diffMs / (1000 * 60);
|
||||
return `${Math.floor(minutes)} minutes ago`;
|
||||
} else if (hours < 24) {
|
||||
return `${Math.floor(hours)} hours ago`;
|
||||
} else {
|
||||
const days = hours / 24;
|
||||
return `${Math.floor(days)} days ago`;
|
||||
}
|
||||
} else {
|
||||
if (hours < -24) {
|
||||
const days = hours / 24;
|
||||
return `in ${Math.floor(-1 * days)} days`;
|
||||
} else if (hours < -1) {
|
||||
return `in ${Math.floor(-1 * hours)} hours`;
|
||||
} else {
|
||||
const minutes = diffMs / (1000 * 60);
|
||||
if (minutes > -1) {
|
||||
const seconds = diffMs / 1000;
|
||||
return `in ${Math.floor(-1 * seconds)} seconds`;
|
||||
}
|
||||
return `in ${Math.floor(-1 * minutes)} minutes`;
|
||||
}
|
||||
function mapBounds(): Bounds | undefined {
|
||||
if (session.user?.organization.service_area) {
|
||||
return session.user?.organization.service_area;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
function refreshData() {
|
||||
console.log("fake refresh");
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue