104 lines
4.7 KiB
HTML
104 lines
4.7 KiB
HTML
<section class="overview-panel">
|
|
<div class="section-header">
|
|
<div>
|
|
<h2>Appointment Intelligence</h2>
|
|
<p>Enterprise-level visibility into your care journey</p>
|
|
</div>
|
|
<button class="cta" (click)="goTo('appointments')">
|
|
Manage appointments
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M5 12H19M19 12L12 5M19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="stats-grid">
|
|
<div class="stat-card primary">
|
|
<div class="stat-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M8 2V6M16 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<div class="stat-content">
|
|
<p>Total Appointments</p>
|
|
<h3>{{ totalAppointments }}</h3>
|
|
</div>
|
|
</div>
|
|
<div class="stat-card success">
|
|
<div class="stat-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M9 14L11 16L15 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<div class="stat-content">
|
|
<p>Upcoming</p>
|
|
<h3>{{ upcomingCount }}</h3>
|
|
</div>
|
|
</div>
|
|
<div class="stat-card info">
|
|
<div class="stat-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M20 6L9 17L4 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<div class="stat-content">
|
|
<p>Completed</p>
|
|
<h3>{{ completedCount }}</h3>
|
|
</div>
|
|
</div>
|
|
<div class="stat-card warning">
|
|
<div class="stat-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M18 6L6 18M6 6L18 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<div class="stat-content">
|
|
<p>Cancelled</p>
|
|
<h3>{{ cancelledCount }}</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="quick-actions">
|
|
<article class="action-card" (click)="goTo('appointments')">
|
|
<div class="action-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M8 2V6M16 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h4>View Appointments</h4>
|
|
<p>Manage confirmed, pending, and past visits</p>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="action-card" (click)="goTo('doctors')">
|
|
<div class="action-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M20 21V19C20 17.9391 19.5786 16.9217 18.8284 16.1716C18.0783 15.4214 17.0609 15 16 15H8C6.93913 15 5.92172 15.4214 5.17157 16.1716C4.42143 16.9217 4 17.9391 4 19V21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<path d="M12 11C14.2091 11 16 9.20914 16 7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7C8 9.20914 9.79086 11 12 11Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<path d="M12 14V22M8 18H16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h4>Find Doctors</h4>
|
|
<p>Browse enterprise verified care teams</p>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="action-card" (click)="goTo('profile')">
|
|
<div class="action-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M20 21V19C20 17.9391 19.5786 16.9217 18.8284 16.1716C18.0783 15.4214 17.0609 15 16 15H8C6.93913 15 5.92172 15.4214 5.17157 16.1716C4.42143 16.9217 4 17.9391 4 19V21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<path d="M12 11C14.2091 11 16 9.20914 16 7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7C8 9.20914 9.79086 11 12 11Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<h4>My Profile</h4>
|
|
<p>Keep personal and clinical data current</p>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</section>
|
|
|