WIP jordan
This commit is contained in:
121
app/components/quotes/auto/AcceptanceStep.vue
Normal file
121
app/components/quotes/auto/AcceptanceStep.vue
Normal file
@@ -0,0 +1,121 @@
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
AUTO_COVERAGE_PLANS,
|
||||
AUTO_MARCA_OPTIONS,
|
||||
AUTO_MODELO_OPTIONS,
|
||||
AUTO_QUOTE_CARRIERS,
|
||||
AUTO_SUB_RAMO_OPTIONS
|
||||
} from '~/data/auto-quote-intake'
|
||||
import type { AutoQuoteDraft, AutoQuoteMode, AutoQuoteSegment } from '~/types/auto-quote-intake'
|
||||
|
||||
const props = defineProps<{
|
||||
draft: AutoQuoteDraft
|
||||
quoteMode: AutoQuoteMode
|
||||
segment: AutoQuoteSegment
|
||||
}>()
|
||||
|
||||
function carrierName(id: string) {
|
||||
return AUTO_QUOTE_CARRIERS.find((c) => c.id === id)?.name ?? id
|
||||
}
|
||||
|
||||
function planLabel(id: string) {
|
||||
return AUTO_COVERAGE_PLANS.find((p) => p.id === id)?.label ?? id
|
||||
}
|
||||
|
||||
const segmentLabel: Record<AutoQuoteSegment, string> = {
|
||||
individual: 'Individual',
|
||||
corporate: 'Corporate',
|
||||
fleet: 'Fleet'
|
||||
}
|
||||
|
||||
const modeLabel: Record<AutoQuoteMode, string> = {
|
||||
single: 'Single quote',
|
||||
comparative_pdf: 'Comparative PDF'
|
||||
}
|
||||
|
||||
function optLabel(opts: { label: string; value: string }[], v: string) {
|
||||
if (!v) return '—'
|
||||
return opts.find((o) => o.value === v)?.label ?? v
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="space-y-6">
|
||||
<div>
|
||||
<p class="text-sm text-[var(--text-muted)]">Review and send quote requests to carrier quoting inboxes.</p>
|
||||
</div>
|
||||
|
||||
<div class="space-y-4 rounded-xl border border-[var(--sidebar-border)] bg-[var(--surface)] p-5 ring-1 ring-black/[0.04]">
|
||||
<div class="flex flex-wrap gap-x-6 gap-y-2 text-sm">
|
||||
<div>
|
||||
<span class="text-[var(--text-muted)]">Intent</span>
|
||||
<p class="font-medium text-[var(--text-primary)]">{{ modeLabel[quoteMode] }}</p>
|
||||
</div>
|
||||
<div>
|
||||
<span class="text-[var(--text-muted)]">Policy type</span>
|
||||
<p class="font-medium text-[var(--text-primary)]">{{ segmentLabel[segment] }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-[var(--sidebar-border)] pt-4">
|
||||
<p class="text-xs font-semibold uppercase tracking-wide text-[var(--text-muted)]">Client</p>
|
||||
<dl class="mt-2 grid gap-2 text-sm sm:grid-cols-2">
|
||||
<div>
|
||||
<dt class="text-[var(--text-muted)]">Name</dt>
|
||||
<dd class="font-medium text-[var(--text-primary)]">{{ draft.client.fullName || '—' }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-[var(--text-muted)]">Email</dt>
|
||||
<dd class="font-medium text-[var(--text-primary)]">{{ draft.client.email || '—' }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-[var(--text-muted)]">Phone</dt>
|
||||
<dd class="font-medium text-[var(--text-primary)]">{{ draft.client.phone || '—' }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-[var(--text-muted)]">ID</dt>
|
||||
<dd class="font-medium text-[var(--text-primary)]">{{ draft.client.documentId || '—' }}</dd>
|
||||
</div>
|
||||
<div v-if="draft.client.organizationName" class="sm:col-span-2">
|
||||
<dt class="text-[var(--text-muted)]">Organization</dt>
|
||||
<dd class="font-medium text-[var(--text-primary)]">{{ draft.client.organizationName }}</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-[var(--sidebar-border)] pt-4">
|
||||
<p class="text-xs font-semibold uppercase tracking-wide text-[var(--text-muted)]">Vehicle</p>
|
||||
<p class="mt-2 text-sm text-[var(--text-primary)]">
|
||||
{{ optLabel(AUTO_MARCA_OPTIONS, draft.vehicle.marca) }} {{ optLabel(AUTO_MODELO_OPTIONS, draft.vehicle.modelo) }}
|
||||
· Plate {{ draft.vehicle.placa || '—' }} · {{ draft.vehicle.year || '—' }}
|
||||
</p>
|
||||
<p class="mt-1 text-xs text-[var(--text-muted)]">
|
||||
Sub-line {{ optLabel(AUTO_SUB_RAMO_OPTIONS, draft.vehicle.subRamo) }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-[var(--sidebar-border)] pt-4">
|
||||
<p class="text-xs font-semibold uppercase tracking-wide text-[var(--text-muted)]">Carriers</p>
|
||||
<ul class="mt-2 list-inside list-disc text-sm text-[var(--text-primary)]">
|
||||
<li v-for="id in draft.solicit.carrierIds" :key="id">{{ carrierName(id) }}</li>
|
||||
<li v-if="draft.solicit.carrierIds.length === 0" class="list-none text-[var(--text-muted)]">None selected</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-[var(--sidebar-border)] pt-4">
|
||||
<p class="text-xs font-semibold uppercase tracking-wide text-[var(--text-muted)]">Plans</p>
|
||||
<ul class="mt-2 list-inside list-disc text-sm text-[var(--text-primary)]">
|
||||
<li v-for="id in draft.solicit.planIds" :key="id">{{ planLabel(id) }}</li>
|
||||
<li v-if="draft.solicit.planIds.length === 0" class="list-none text-[var(--text-muted)]">None selected</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<UAlert
|
||||
color="neutral"
|
||||
variant="soft"
|
||||
title="What happens next"
|
||||
description="We’ll send quote requests to each carrier’s registered quoting email (configured under Settings → Providers). For comparative quotes, coverage rows follow your selected plans; when you receive pricing by email, paste figures into the comparative view."
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user