64 lines
3.4 KiB
HTML
64 lines
3.4 KiB
HTML
{{define "dashboard.html"}}
|
||
{{template "shell-start" .}}
|
||
<header class="page-head">
|
||
<div><p class="eyebrow">TEAM WORKSPACE</p><h1>Good day, {{.User.DisplayName}}</h1><p>Here’s your month at a glance.</p></div>
|
||
<div class="today-pill"><span>Today</span><strong>{{.TodayJalali}}</strong></div>
|
||
</header>
|
||
{{template "notice" .}}
|
||
<div class="dashboard-grid">
|
||
<section class="card presence-card">
|
||
<div class="presence-top">
|
||
<div><p class="eyebrow">TODAY’S PRESENCE</p><h2>{{if .Attendance}}{{if .Attendance.CheckOut}}Day complete{{else}}You’re checked in{{end}}{{else}}Ready when you are{{end}}</h2></div>
|
||
<span class="live-badge"><i></i> {{if and .Attendance (not .Attendance.CheckOut)}}ACTIVE{{else}}TODAY{{end}}</span>
|
||
</div>
|
||
{{if .Attendance}}
|
||
<div class="time-line">
|
||
<div><small>CHECKED IN</small><strong>{{timeHM .Attendance.CheckIn}}</strong></div>
|
||
<span></span>
|
||
<div><small>CHECKED OUT</small><strong>{{timeHM .Attendance.CheckOut}}</strong></div>
|
||
<div><small>LOCATION</small><strong>{{if eq .Attendance.Mode "remote"}}Remote{{else}}Office{{end}}</strong></div>
|
||
</div>
|
||
{{if not .Attendance.CheckOut}}
|
||
<form method="post" action="/attendance/check-out">
|
||
<input type="hidden" name="csrf" value="{{.CSRF}}">
|
||
<button class="button dark full">Check out</button>
|
||
</form>
|
||
{{end}}
|
||
{{else}}
|
||
<p class="muted">Start your day by choosing where you’re working.</p>
|
||
<div class="checkin-actions">
|
||
<form method="post" action="/attendance/check-in">
|
||
<input type="hidden" name="csrf" value="{{.CSRF}}"><input type="hidden" name="mode" value="office">
|
||
<button class="button primary">Check in at office</button>
|
||
</form>
|
||
<form method="post" action="/attendance/check-in">
|
||
<input type="hidden" name="csrf" value="{{.CSRF}}"><input type="hidden" name="mode" value="remote">
|
||
<button class="button secondary">Working remotely</button>
|
||
</form>
|
||
</div>
|
||
{{end}}
|
||
</section>
|
||
<section class="stats-grid">
|
||
<div class="stat card"><span class="stat-icon mint">✓</span><small>PRESENT DAYS</small><strong>{{.Stats.Present}}</strong><p>This month</p></div>
|
||
<div class="stat card"><span class="stat-icon blue">⌂</span><small>REMOTE DAYS</small><strong>{{.Stats.Remote}}</strong><p>This month</p></div>
|
||
<div class="stat card"><span class="stat-icon sand">☼</span><small>TIME OFF</small><strong>{{.Stats.Leave}}</strong><p>Approved days</p></div>
|
||
</section>
|
||
{{template "calendar.html" .}}
|
||
<section class="card recent-card">
|
||
<header class="section-head"><div><p class="eyebrow">RECENT ACTIVITY</p><h2>Your requests</h2></div><a href="/requests">View all →</a></header>
|
||
{{if .Requests}}
|
||
<div class="request-list compact">
|
||
{{range .Requests}}
|
||
<div class="request-row">
|
||
<span class="request-icon {{.Kind}}">{{if eq .Kind "remote"}}⌂{{else}}☼{{end}}</span>
|
||
<div><strong>{{kindLabel .Kind}}</strong><small>{{dateFA .StartDate}}{{if ne .StartDate .EndDate}} — {{dateFA .EndDate}}{{end}}</small></div>
|
||
<span class="badge {{.Status}}">{{statusLabel .Status}}</span>
|
||
</div>
|
||
{{end}}
|
||
</div>
|
||
{{else}}<div class="empty"><span>◌</span><p>No requests yet.</p><a href="/requests">Make a request</a></div>{{end}}
|
||
</section>
|
||
</div>
|
||
{{template "shell-end" .}}
|
||
{{end}}
|