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

Add the full compliance mocks

Browse source
This commit is contained in:
Eli Ribble 2026-04-07 00:52:12 +00:00
parent 4faa7fa8c0
commit 6f677b5638
No known key found for this signature in database
19 changed files with 1473 additions and 1463 deletions
Download patch file Download diff file Expand all files Collapse all files

119
ts/rmo/content/compliance/Contact.vue Normal file
View file

@ -0,0 +1,119 @@
<template>
<div class="container-fluid px-3 py-3">
<HeaderCompliance :district="district" />
<!-- Progress Bar -->
<ProgressBarCompliance :step="6" />
<!-- Main Content -->
<main>
<h2 class="h4 mb-3">Contact information</h2>
<div class="benefit-box mb-4">
<p class="mb-0">
<i class="bi bi-info-circle"></i>
<strong>Why share your contact information?</strong><br />
<small>
Providing your contact information helps the District review your
response and coordinate with you if a visit is still needed. This
can save time and prevent unnecessary follow-up actions.
</small>
</p>
</div>
<form id="contact-form" method="POST" action="/compliance/contact">
<!-- Name -->
<div class="mb-3">
<label for="contact-name" class="form-label fw-semibold">
Name
<span class="optional-badge">(Optional)</span>
</label>
<input
type="text"
class="form-control"
id="contact-name"
name="name"
placeholder="Enter your name"
/>
</div>
<!-- Phone -->
<div class="mb-3">
<label for="contact-phone" class="form-label fw-semibold">
Phone Number
<span class="optional-badge">(Optional)</span>
</label>
<input
type="tel"
class="form-control"
id="contact-phone"
name="phone"
placeholder="(555) 123-4567"
/>
</div>
<!-- Can we text? -->
<div class="mb-3">
<div class="form-check">
<input
class="form-check-input"
type="checkbox"
id="can-text"
name="can_text"
value="yes"
/>
<label class="form-check-label" for="can-text">
You may send text messages to this number
</label>
</div>
<small class="text-muted ms-4 d-block mt-1">
Text messages allow for faster communication and updates
</small>
</div>
<!-- Email -->
<div class="mb-4">
<label for="contact-email" class="form-label fw-semibold">
Email Address
<span class="optional-badge">(Optional)</span>
</label>
<input
type="email"
class="form-control"
id="contact-email"
name="email"
placeholder="your.email@example.com"
/>
<div class="form-text">
We'll send you a confirmation and any updates about this request
</div>
</div>
<div class="alert alert-light border" role="alert">
<small class="text-muted">
<i class="bi bi-shield-check"></i>
Your contact information will only be used for this compliance
matter and will be kept confidential.
</small>
</div>
<!-- Navigation Buttons -->
<div class="d-flex gap-2 mt-4">
<RouterLink class="btn btn-outline-secondary" to="./permission">
Back
</RouterLink>
<RouterLink class="btn btn-primary flex-grow-1" to="process">
Continue
</RouterLink>
</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>