diff --git a/ts/components/ReviewPoolColumnDetail.vue b/ts/components/ReviewPoolColumnDetail.vue
index 7f101990..26e4574c 100644
--- a/ts/components/ReviewPoolColumnDetail.vue
+++ b/ts/components/ReviewPoolColumnDetail.vue
@@ -35,7 +35,7 @@
@@ -47,10 +47,10 @@
@@ -63,10 +63,10 @@
@@ -78,10 +78,10 @@
@@ -121,7 +122,8 @@
v-model="siteResident.name"
:class="{
'border-warning':
- siteResident.name !== selectedTask.pool?.site.resident?.name,
+ siteResident.name !==
+ (selectedTask.pool?.site.resident?.name ?? ''),
}"
/>
@@ -156,30 +158,30 @@
import { computed, ref, watch } from "vue";
import MapLocator from "@/components/MapLocator.vue";
import MapProxiedArcgisTile from "@/components/MapProxiedArcgisTile.vue";
-import { formatAddress } from "@/format";
import { useSessionStore } from "@/store/session";
import type { MapClickEvent, Marker } from "@/types";
import { Bounds, Contact, Pool, ReviewTask, User } from "@/type/api";
import type { Location } from "@/type/api";
import { Camera } from "@/type/map";
+export interface ReviewTaskPoolForm {
+ address: string;
+ condition: string;
+ location: Location;
+ owner: string;
+ resident: string;
+}
interface Props {
loading: boolean;
mapBounds?: Bounds;
mapFlyoverCamera: Camera;
mapMarkers: Marker[];
- newPoolCondition: string;
- newPoolLocation: Location;
+ modelValue: ReviewTaskPoolForm;
selectedTask?: ReviewTask;
}
const mapCamera = ref(new Camera());
const _mapFlyoverCamera = ref(new Camera());
const props = defineProps();
-const poolCondition = ref("unknown");
-const poolLocation = ref({
- latitude: 0,
- longitude: 0,
-});
const siteOwner = ref(new Contact());
const siteResident = ref(new Contact());
const session = useSessionStore();
diff --git a/ts/view/review/Pool.vue b/ts/view/review/Pool.vue
index 250f294a..0299ba6c 100644
--- a/ts/view/review/Pool.vue
+++ b/ts/view/review/Pool.vue
@@ -79,9 +79,8 @@ body {
:mapBounds="mapBounds || undefined"
:mapFlyoverCamera="mapFlyoverCamera"
:mapMarkers="mapMarkers"
- :newPoolCondition="newPoolCondition"
- :newPoolLocation="newPoolLocation"
:selectedTask="selectedTask"
+ v-model="reviewForm"
/>
@@ -103,8 +102,11 @@ import { useSessionStore } from "@/store/session";
import maplibregl from "maplibre-gl";
import ThreeColumn from "@/components/layout/ThreeColumn.vue";
import ReviewPoolColumnAction from "@/components/ReviewPoolColumnAction.vue";
-import ReviewPoolColumnDetail from "@/components/ReviewPoolColumnDetail.vue";
+import ReviewPoolColumnDetail, {
+ ReviewTaskPoolForm,
+} from "@/components/ReviewPoolColumnDetail.vue";
import ReviewPoolColumnList from "@/components/ReviewPoolColumnList.vue";
+import { formatAddress } from "@/format";
import type { Changes } from "@/types";
import { Bounds, Contact, Location, ReviewTask } from "@/type/api";
import { Camera } from "@/type/map";
@@ -148,21 +150,31 @@ const props = withDefaults(defineProps(), {
});
// State
+const error = ref(null);
+const loading = ref(true);
+const mapBounds = ref(null);
const mapFlyoverCamera = ref(new Camera());
const newPoolCondition = ref("");
const newPoolLocation = ref({ latitude: 0, longitude: 0 });
const newOwnerName = ref("");
const newResidentName = ref("");
-const error = ref(null);
-const loading = ref(true);
-const mapBounds = ref(null);
+const poolLocation = ref({
+ latitude: 0,
+ longitude: 0,
+});
+const reviewForm = ref({
+ address: "",
+ condition: "",
+ location: new Location(),
+ owner: "",
+ resident: "",
+});
const selectedTaskID = ref(null);
+const session = useSessionStore();
+const storeReviewTask = useStoreReviewTask();
const submitting = ref(false);
const totalPending = ref(0);
-const storeReviewTask = useStoreReviewTask();
-const session = useSessionStore();
-
// Refs for map components
const mapMultipoint = ref(null);
const mapTile = ref(null);
@@ -253,11 +265,18 @@ function selectTask(id: number): void {
return;
}
console.log("selecting task", id, task);
- mapFlyoverCamera.value = new Camera(pool.location, 15);
+ mapFlyoverCamera.value = new Camera(pool.location, 20);
newPoolCondition.value = pool.condition;
newPoolLocation.value = pool.location;
newOwnerName.value = pool.site.owner?.name ?? "";
newResidentName.value = pool.site.resident?.name ?? "";
+ reviewForm.value = {
+ address: formatAddress(task.address),
+ condition: pool.condition,
+ location: pool.location,
+ owner: pool.site.owner?.name ?? "",
+ resident: pool.site.resident?.name ?? "",
+ };
// Update map
updateMap(task);