91 lines
3.2 KiB
Vue
91 lines
3.2 KiB
Vue
<script setup lang="ts">
|
||
import { HEALTH_COVERAGE_PLANS, HEALTH_QUOTE_CARRIERS } from '~/data/health-quote-intake'
|
||
import type { HealthQuoteDraft, HealthQuoteMode } from '~/types/health-quote-intake'
|
||
|
||
const props = defineProps<{
|
||
draft: HealthQuoteDraft
|
||
quoteMode: HealthQuoteMode
|
||
}>()
|
||
|
||
function setCarrier(id: string, checked: boolean) {
|
||
const xs = props.draft.solicit.carrierIds
|
||
if (checked && !xs.includes(id)) xs.push(id)
|
||
if (!checked) {
|
||
const i = xs.indexOf(id)
|
||
if (i !== -1) xs.splice(i, 1)
|
||
}
|
||
}
|
||
|
||
function carrierChecked(id: string) {
|
||
return props.draft.solicit.carrierIds.includes(id)
|
||
}
|
||
|
||
function setPlan(id: string, checked: boolean) {
|
||
const xs = props.draft.solicit.planIds
|
||
if (checked && !xs.includes(id)) xs.push(id)
|
||
if (!checked) {
|
||
const i = xs.indexOf(id)
|
||
if (i !== -1) xs.splice(i, 1)
|
||
}
|
||
}
|
||
|
||
function planChecked(id: string) {
|
||
return props.draft.solicit.planIds.includes(id)
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<div class="space-y-6">
|
||
<div>
|
||
<p class="text-sm text-[var(--text-muted)]">
|
||
Choose carriers and product shells to request. Quoting contacts live per provider in Settings.
|
||
</p>
|
||
<UAlert
|
||
v-if="quoteMode === 'comparative_pdf'"
|
||
color="info"
|
||
variant="soft"
|
||
class="mt-4"
|
||
title="Comparative quote"
|
||
description="We’ll align columns to your selected plan mix. Enter premiums from email, rate tables, or AI-assisted pricing when available."
|
||
/>
|
||
<UAlert v-else color="neutral" variant="soft" class="mt-4" title="Single quote" description="We’ll package one request per carrier with the same subscriber and coverage intent." />
|
||
</div>
|
||
|
||
<div class="rounded-xl border border-[var(--sidebar-border)] bg-[var(--surface)] p-4 ring-1 ring-black/[0.04]">
|
||
<p class="text-xs font-semibold uppercase tracking-wide text-[var(--text-muted)]">Carriers</p>
|
||
<ul class="mt-3 divide-y divide-[var(--sidebar-border)]">
|
||
<li
|
||
v-for="c in HEALTH_QUOTE_CARRIERS"
|
||
:key="c.id"
|
||
class="flex flex-wrap items-start justify-between gap-3 py-3 first:pt-0"
|
||
>
|
||
<UCheckbox
|
||
:model-value="carrierChecked(c.id)"
|
||
:label="c.name"
|
||
@update:model-value="(v: boolean) => setCarrier(c.id, v)"
|
||
/>
|
||
<span class="text-xs text-[var(--text-muted)]">{{ c.detail }}</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="rounded-xl border border-[var(--sidebar-border)] bg-[var(--surface)] p-4 ring-1 ring-black/[0.04]">
|
||
<p class="text-xs font-semibold uppercase tracking-wide text-[var(--text-muted)]">Plans / benefit shells</p>
|
||
<ul class="mt-3 space-y-3">
|
||
<li
|
||
v-for="p in HEALTH_COVERAGE_PLANS"
|
||
:key="p.id"
|
||
class="flex flex-col gap-1 rounded-lg border border-[var(--sidebar-border)]/80 bg-[var(--page-bg)]/50 p-3 sm:flex-row sm:items-center sm:justify-between"
|
||
>
|
||
<UCheckbox
|
||
:model-value="planChecked(p.id)"
|
||
:label="p.label"
|
||
@update:model-value="(v: boolean) => setPlan(p.id, v)"
|
||
/>
|
||
<span class="text-xs text-[var(--text-muted)] sm:text-right">{{ p.hint }}</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</template>
|