180 lines
7.6 KiB
Vue
180 lines
7.6 KiB
Vue
<script setup lang="ts">
|
|
usePageTitle('Settings')
|
|
|
|
const { isSuperAdmin } = useSuperAdmin()
|
|
const sidebarFeatures = useSidebarFeatures()
|
|
|
|
const cards = computed(() => {
|
|
const base: { to: string; title: string; description: string; icon: string }[] = []
|
|
|
|
if (isSuperAdmin.value) {
|
|
base.push({
|
|
to: '/settings/organization',
|
|
title: 'Organization',
|
|
description: 'Company legal name, logo in the chrome, and PDF report headers — tenant-wide (superadmin only).',
|
|
icon: 'i-heroicons-building-library'
|
|
})
|
|
}
|
|
|
|
base.push(
|
|
{
|
|
to: '/settings/agents',
|
|
title: 'Agents & commissions',
|
|
description: 'Manage producer credentials, commission schedules, and cashflow-based compensation.',
|
|
icon: 'i-heroicons-user-group'
|
|
},
|
|
{
|
|
to: '/settings/referral-channels',
|
|
title: 'Referral channels',
|
|
description: 'Manage referral sources — people, companies, digital campaigns, events, and partnerships that generate leads.',
|
|
icon: 'i-heroicons-link'
|
|
},
|
|
{
|
|
to: '/settings/providers',
|
|
title: 'Providers & carriers',
|
|
description: 'Carrier directory, templates, and status.',
|
|
icon: 'i-heroicons-building-office-2'
|
|
},
|
|
{
|
|
to: '/settings/permissions',
|
|
title: 'Permissions',
|
|
description: 'Roles and SEGUROS permission matrix (seed data until API).',
|
|
icon: 'i-heroicons-shield-check'
|
|
},
|
|
{
|
|
to: '/settings/forms',
|
|
title: 'Forms library',
|
|
description: 'Master catalog of carrier PDFs and routing metadata.',
|
|
icon: 'i-heroicons-document-duplicate'
|
|
},
|
|
{
|
|
to: '/settings/quote-requests',
|
|
title: 'Quote requests',
|
|
description: 'Toggle whether quote flows describe outbound emails to carrier quoting addresses.',
|
|
icon: 'i-heroicons-envelope'
|
|
},
|
|
{
|
|
to: '/settings/customer-attention',
|
|
title: 'Customer Attention',
|
|
description: 'Service tiers and scoring rules to auto-classify customers by value and engagement.',
|
|
icon: 'i-heroicons-star'
|
|
},
|
|
{
|
|
to: '/settings/profile-layouts',
|
|
title: 'Profile Layouts',
|
|
description: 'Configure which customer profile sections appear and in what order based on your role.',
|
|
icon: 'i-heroicons-rectangle-group'
|
|
},
|
|
{
|
|
to: '/settings/alerts',
|
|
title: 'Alerts & Notifications',
|
|
description: 'Configure automated email alerts for renewals, cancellations, late payments, and custom triggers.',
|
|
icon: 'i-heroicons-bell-alert'
|
|
},
|
|
{
|
|
to: '/settings/support-routing',
|
|
title: 'Support Routing',
|
|
description: 'Configure 3-tier routing rules for incoming support requests — auto-routing, keyword classification, and open pool settings.',
|
|
icon: 'i-heroicons-arrow-path-rounded-square'
|
|
}
|
|
)
|
|
|
|
return base
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="mx-auto max-w-4xl space-y-8">
|
|
<div>
|
|
<h1 class="mt-1 text-2xl font-semibold tracking-tight text-[var(--text-primary)]">Software configuration</h1>
|
|
<p class="mt-2 max-w-2xl text-[14px] leading-relaxed text-[var(--text-muted)]">
|
|
Carriers, forms, permissions, and tenant organization (superadmin). Your personal theme and profile live under
|
|
<NuxtLink to="/account" class="font-medium text-[var(--brand)] underline-offset-2 hover:underline">Account</NuxtLink>.
|
|
</p>
|
|
</div>
|
|
|
|
<UAlert
|
|
v-if="!isSuperAdmin"
|
|
color="neutral"
|
|
variant="soft"
|
|
title="Organization settings are restricted"
|
|
description="Company logo and legal name are changed by a tenant superadmin. In development, superadmin UI defaults on unless localStorage policy-ui.superadmin is set to 0."
|
|
/>
|
|
|
|
<div class="grid gap-4 sm:grid-cols-2">
|
|
<NuxtLink
|
|
v-for="c in cards"
|
|
:key="c.to"
|
|
:to="c.to"
|
|
class="app-card app-card-interactive group p-5"
|
|
>
|
|
<div class="flex items-start gap-4">
|
|
<div class="inline-flex rounded-lg bg-[var(--brand-soft)] p-2 text-[var(--brand)] ring-1 ring-[var(--brand)]/10">
|
|
<UIcon :name="c.icon" class="h-6 w-6" />
|
|
</div>
|
|
<div>
|
|
<p class="font-semibold text-[var(--text-primary)] group-hover:text-[var(--brand)]">{{ c.title }}</p>
|
|
<p class="mt-1 text-sm text-[var(--text-muted)]">{{ c.description }}</p>
|
|
</div>
|
|
</div>
|
|
</NuxtLink>
|
|
</div>
|
|
|
|
<!-- Sidebar modules -->
|
|
<div>
|
|
<h2 class="text-lg font-semibold text-[var(--text-primary)]">Sidebar modules</h2>
|
|
<p class="mt-1 text-[13px] text-[var(--text-muted)]">Show or hide optional sections in the navigation sidebar.</p>
|
|
<div class="mt-4 flex flex-col gap-3">
|
|
<label class="app-card flex flex-col gap-3 p-4">
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-center gap-3">
|
|
<UIcon name="i-heroicons-inbox-stack" class="h-5 w-5 text-[var(--text-muted)]" />
|
|
<div>
|
|
<p class="text-[14px] font-medium text-[var(--text-primary)]">Workstations</p>
|
|
<p class="text-[12px] text-[var(--text-muted)]">Specialized task queues for collectivos, claims, renewals, collections, and billing.</p>
|
|
</div>
|
|
</div>
|
|
<USwitch :model-value="sidebarFeatures.showWorkstations" @update:model-value="sidebarFeatures.showWorkstations = $event" />
|
|
</div>
|
|
<div class="flex items-center gap-2 pl-8 text-[11px] text-[var(--text-muted)]">
|
|
<UIcon name="i-heroicons-eye" style="width: 12px; height: 12px;" />
|
|
<span>Adds: Collectivos, Facturacion, Claims Queue, Renewals Queue, Collections Queue</span>
|
|
</div>
|
|
</label>
|
|
<label class="app-card flex flex-col gap-3 p-4">
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-center gap-3">
|
|
<UIcon name="i-heroicons-sparkles" class="h-5 w-5 text-[var(--text-muted)]" />
|
|
<div>
|
|
<p class="text-[14px] font-medium text-[var(--text-primary)]">AI Tools</p>
|
|
<p class="text-[12px] text-[var(--text-muted)]">AI-powered assistants for sales, policy comparison, email drafting, and case support.</p>
|
|
</div>
|
|
</div>
|
|
<USwitch :model-value="sidebarFeatures.showAiTools" @update:model-value="sidebarFeatures.showAiTools = $event" />
|
|
</div>
|
|
<div class="flex items-center gap-2 pl-8 text-[11px] text-[var(--text-muted)]">
|
|
<UIcon name="i-heroicons-eye" style="width: 12px; height: 12px;" />
|
|
<span>Adds: Sales Factory, Policy Advisor, Email Writer, Case Support</span>
|
|
</div>
|
|
</label>
|
|
<label class="app-card flex flex-col gap-3 p-4">
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-center gap-3">
|
|
<UIcon name="i-heroicons-signal" class="h-5 w-5 text-[var(--text-muted)]" />
|
|
<div>
|
|
<p class="text-[14px] font-medium text-[var(--text-primary)]">Leads Hub</p>
|
|
<p class="text-[12px] text-[var(--text-muted)]">Centralized lead management with API integrations for Google, Facebook, Instagram, and custom campaigns.</p>
|
|
</div>
|
|
</div>
|
|
<USwitch :model-value="sidebarFeatures.showLeadsHub" @update:model-value="sidebarFeatures.showLeadsHub = $event" />
|
|
</div>
|
|
<div class="flex items-center gap-2 pl-8 text-[11px] text-[var(--text-muted)]">
|
|
<UIcon name="i-heroicons-eye" style="width: 12px; height: 12px;" />
|
|
<span>Adds: Leads Hub under Customer Service sidebar group</span>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|