software-engineering/policy-ui
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP jordan

Browse Source
This commit is contained in:
Jordan Weingarten
2026-04-16 11:11:44 -05:00
parent ff2d7b18b5
commit 67482f6629
163 changed files with 50627 additions and 728 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
app/pages/workstation/facturacion.vue Normal file
View File

@@ -0,0 +1,114 @@
<script setup lang="ts">
usePageTitle('Facturación')
</script>
<template>
<div class="fac-page">
<div class="flex flex-wrap items-start justify-between gap-4">
<div>
<h1 class="mt-1 text-2xl font-semibold tracking-tight text-[var(--text-primary)]">Facturación</h1>
<p class="mt-2 max-w-2xl text-[14px] leading-relaxed text-[var(--text-muted)]">
Invoicing workflow for the brokerage. Generate, track, and manage invoices tied to policies, commissions, and client accounts. Integrates with carrier billing and AR to keep financials in sync.
</p>
</div>
<span
class="inline-flex items-center rounded-full px-3 py-1 text-[11px] font-semibold uppercase tracking-wider"
style="background: rgba(1, 105, 111, 0.06); color: #01696f;"
>Coming soon</span>
</div>
<!-- Feature preview -->
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
<div class="fac-card">
<div class="fac-icon" style="background: rgba(1,105,111,0.08); color: #01696f;">
<UIcon name="i-heroicons-document-text" style="width: 20px; height: 20px;" />
</div>
<h3 class="fac-card-title">Invoice generation</h3>
<p class="fac-card-desc">Create invoices from bound policies, endorsements, or manual entries. Auto-populate client data, premium breakdowns, and tax fields.</p>
</div>
<div class="fac-card">
<div class="fac-icon" style="background: rgba(124,58,237,0.08); color: #7c3aed;">
<UIcon name="i-heroicons-arrow-path" style="width: 20px; height: 20px;" />
</div>
<h3 class="fac-card-title">Recurring billing</h3>
<p class="fac-card-desc">Schedule monthly, quarterly, or annual invoices for policies with installment plans. Automatic reminders on upcoming due dates.</p>
</div>
<div class="fac-card">
<div class="fac-icon" style="background: rgba(194,123,26,0.08); color: #c27b1a;">
<UIcon name="i-heroicons-banknotes" style="width: 20px; height: 20px;" />
</div>
<h3 class="fac-card-title">Payment tracking</h3>
<p class="fac-card-desc">Record payments against invoices, mark partial payments, and flag overdue balances. Ties into the collections workstation.</p>
</div>
<div class="fac-card">
<div class="fac-icon" style="background: rgba(15,123,95,0.08); color: #0f7b5f;">
<UIcon name="i-heroicons-building-office-2" style="width: 20px; height: 20px;" />
</div>
<h3 class="fac-card-title">Carrier reconciliation</h3>
<p class="fac-card-desc">Match brokerage invoices to carrier statements. Surface discrepancies between what was billed and what was remitted.</p>
</div>
<div class="fac-card">
<div class="fac-icon" style="background: rgba(193,56,56,0.08); color: #c13838;">
<UIcon name="i-heroicons-document-arrow-down" style="width: 20px; height: 20px;" />
</div>
<h3 class="fac-card-title">PDF & export</h3>
<p class="fac-card-desc">Generate branded PDF invoices, export batches to CSV for accounting software, or integrate via API with ERP systems.</p>
</div>
<div class="fac-card">
<div class="fac-icon" style="background: rgba(190,24,93,0.08); color: #be185d;">
<UIcon name="i-heroicons-chart-bar" style="width: 20px; height: 20px;" />
</div>
<h3 class="fac-card-title">Billing analytics</h3>
<p class="fac-card-desc">Aging reports, collection rates by client segment, revenue recognition dashboards, and commission payout summaries.</p>
</div>
</div>
</div>
</template>
<style scoped>
.fac-page {
display: flex;
flex-direction: column;
gap: 24px;
max-width: 64rem;
margin: 0 auto;
padding-bottom: 3rem;
}
.fac-card {
border-radius: 12px;
border: 1px solid rgba(0,0,0,0.06);
background: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,0.03);
padding: 24px;
display: flex;
flex-direction: column;
gap: 10px;
transition: all 200ms ease;
}
.fac-card:hover {
box-shadow: 0 4px 12px rgba(0,0,0,0.06);
border-color: rgba(1,105,111,0.15);
}
.fac-icon {
display: flex;
align-items: center;
justify-content: center;
width: 36px; height: 36px;
border-radius: 10px;
}
.fac-card-title {
font-size: 15px;
font-weight: 600;
color: var(--text-primary);
}
.fac-card-desc {
font-size: 13px;
line-height: 1.5;
color: var(--text-muted);
}
</style>