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

Figure out router pattern for compliance steps

Browse source
This commit is contained in:
Eli Ribble 2026-04-07 00:04:40 +00:00
parent 20614acb86
commit 4faa7fa8c0
No known key found for this signature in database
8 changed files with 132 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

58
ts/rmo/content/compliance/Address.vue Normal file
View file

@ -0,0 +1,58 @@
<template>
<div class="container-fluid px-3 py-3">
<HeaderCompliance :district="district" />
<!-- Progress Bar -->
<ProgressBarCompliance :step="2" />
<main>
<h2 class="h4 mb-3">Confirm the property address</h2>
<p class="text-muted mb-4">
Please enter the address so we can match your response with our records.
</p>
<form id="address-form" method="POST" action="/compliance/address">
<div class="mb-4">
<label for="address-input" class="form-label fw-semibold">
Property Address
</label>
<input
type="text"
class="form-control form-control-lg"
id="address-input"
name="address"
placeholder="Start typing your address..."
autocomplete="off"
data-autocomplete="true"
required
/>
<div class="form-text">
Begin typing and select your address from the suggestions
</div>
</div>
<!-- Map Placeholder -->
<div class="mb-4">
<label class="form-label fw-semibold">Location Preview</label>
<div class="map-placeholder" id="map-container">
<span>Map will appear here after address is selected</span>
</div>
</div>
<!-- Navigation Buttons -->
<div class="d-flex gap-2 mt-4">
<a class="btn btn-outline-secondary" href="../compliance"> Back </a>
<a class="btn btn-primary flex-grow-1" href="concern"> Continue </a>
</div>
</form>
</main>
</div>
</template>
<script setup lang="ts">
import type { District } from "@/type/api";
import HeaderCompliance from "@/rmo/components/HeaderCompliance.vue";
import ProgressBarCompliance from "@/rmo/components/ProgressBarCompliance.vue";
interface Props {
district: District;
}
const props = defineProps<Props>();
</script>

20
ts/rmo/content/compliance/Intro.vue
View file

@ -1,22 +1,7 @@
<template>
<div class="container-fluid px-3 py-3">
<HeaderCompliance :district="district" />
<!-- Progress Bar -->
<div class="mb-4">
<div class="d-flex justify-content-between align-items-center mb-2">
<span class="small text-muted">Step 1 of 8</span>
</div>
<div class="progress" style="height: 8px">
<div
class="progress-bar"
role="progressbar"
style="width: 12%"
aria-valuenow="12"
aria-valuemin="0"
aria-valuemax="100"
></div>
</div>
</div>
<ProgressBarCompliance :step="2" />
<!-- Main Content -->
<main>
@ -35,7 +20,7 @@
</div>
<div class="d-grid mt-4">
<RouterLink class="btn btn-primary btn-lg" to="./address">
<RouterLink class="btn btn-primary btn-lg" to="./compliance/address">
Get Started</RouterLink
>
</div>
@ -45,6 +30,7 @@
<script setup lang="ts">
import type { District } from "@/type/api";
import HeaderCompliance from "@/rmo/components/HeaderCompliance.vue";
import ProgressBarCompliance from "@/rmo/components/ProgressBarCompliance.vue";
interface Props {
district: District;
}