150 lines
6.2 KiB
Vue
150 lines
6.2 KiB
Vue
<script setup lang="ts">
|
|
import { LIFE_COVERAGE_PLANS, LIFE_QUOTE_CARRIERS } from '~/data/life-quote-intake'
|
|
import type { LifeQuoteDraft, LifeQuoteMode, LifeQuoteSegment } from '~/types/life-quote-intake'
|
|
|
|
const props = defineProps<{
|
|
draft: LifeQuoteDraft
|
|
quoteMode: LifeQuoteMode
|
|
segment: LifeQuoteSegment
|
|
}>()
|
|
|
|
const { quoteRequestEmailEnabled } = useQuoteRequestEmailEnabled()
|
|
|
|
function carrierName(id: string) {
|
|
return LIFE_QUOTE_CARRIERS.find((c) => c.id === id)?.name ?? id
|
|
}
|
|
|
|
function planLabel(id: string) {
|
|
return LIFE_COVERAGE_PLANS.find((p) => p.id === id)?.label ?? id
|
|
}
|
|
|
|
const segmentLabel: Record<LifeQuoteSegment, string> = {
|
|
individual: 'Individual',
|
|
corporate_keyman: 'Corporate / Key person',
|
|
group: 'Group'
|
|
}
|
|
|
|
const modeLabel: Record<LifeQuoteMode, string> = {
|
|
single: 'Single quote',
|
|
comparative_pdf: 'Comparative PDF'
|
|
}
|
|
|
|
function formatAmount(val: string) {
|
|
const n = Number(val)
|
|
if (!n) return val || '—'
|
|
return '$' + n.toLocaleString()
|
|
}
|
|
|
|
function termLabel(val: string) {
|
|
if (val === 'whole') return 'Whole life'
|
|
return val ? `${val} years` : '—'
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="space-y-6">
|
|
<div>
|
|
<p class="text-sm text-[var(--text-muted)]">Review the life quote request before sending or saving.</p>
|
|
</div>
|
|
|
|
<UAlert
|
|
v-if="!quoteRequestEmailEnabled"
|
|
color="warning"
|
|
variant="soft"
|
|
title="Provider emails are turned off"
|
|
description="Settings -> Quote requests: outbound emails disabled. This run saves the request locally (or uses table / AI pricing when connected) without emailing carriers."
|
|
/>
|
|
|
|
<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)]">Insured person</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 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)]">Age & health</p>
|
|
<dl class="mt-2 grid gap-2 text-sm sm:grid-cols-3">
|
|
<div>
|
|
<dt class="text-[var(--text-muted)]">Age</dt>
|
|
<dd class="font-medium text-[var(--text-primary)]">{{ draft.life.age || '—' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-[var(--text-muted)]">Gender</dt>
|
|
<dd class="font-medium text-[var(--text-primary)]">{{ draft.life.gender || '—' }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="text-[var(--text-muted)]">Smoker</dt>
|
|
<dd class="font-medium text-[var(--text-primary)]">{{ draft.life.smoker ? 'Yes' : 'No' }}</dd>
|
|
</div>
|
|
<div v-if="draft.life.preexistingConditions" class="sm:col-span-3">
|
|
<dt class="text-[var(--text-muted)]">Preexisting conditions</dt>
|
|
<dd class="font-medium text-[var(--text-primary)]">{{ draft.life.preexistingDetails || 'Yes (no details provided)' }}</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)]">Coverage</p>
|
|
<p class="mt-2 text-sm text-[var(--text-primary)]">
|
|
{{ formatAmount(draft.life.coverageAmount) }} · {{ termLabel(draft.life.coverageTerm) }}
|
|
</p>
|
|
<p v-if="draft.life.beneficiaryName" class="mt-1 text-sm text-[var(--text-muted)]">
|
|
Beneficiary: {{ draft.life.beneficiaryName }}
|
|
<span v-if="draft.life.beneficiaryRelationship"> ({{ draft.life.beneficiaryRelationship }})</span>
|
|
</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="
|
|
quoteRequestEmailEnabled
|
|
? 'We can queue emails to each carrier\'s quoting address on file (Settings -> Providers), unless your tenant uses published tables or AI instead.'
|
|
: 'No outbound provider emails for this tenant — capture the request here and price via tables, APIs, or agentic workflows.'
|
|
"
|
|
/>
|
|
</div>
|
|
</template>
|