156 lines
8.4 KiB
XML
156 lines
8.4 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
|
<templates xml:space="preserve">
|
|
|
|
<t t-name="fusion_clock.Dashboard">
|
|
<div class="o_action">
|
|
<div class="container-fluid py-3">
|
|
|
|
<!-- Header -->
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h2 class="mb-0">Fusion Clock Dashboard</h2>
|
|
<button class="btn btn-outline-primary" t-on-click="onRefresh">
|
|
<i class="fa fa-refresh"/> Refresh
|
|
</button>
|
|
</div>
|
|
|
|
<t t-if="state.loading">
|
|
<div class="text-center py-5">
|
|
<i class="fa fa-spinner fa-spin fa-2x"/>
|
|
<p class="mt-2">Loading dashboard...</p>
|
|
</div>
|
|
</t>
|
|
|
|
<t t-if="state.error">
|
|
<div class="alert alert-danger">
|
|
<t t-esc="state.error"/>
|
|
</div>
|
|
</t>
|
|
|
|
<t t-if="!state.loading and !state.error">
|
|
<!-- Summary Cards -->
|
|
<div class="row mb-4">
|
|
<div class="col-md-3 mb-3">
|
|
<div class="fclk-dash-card fclk-dash-card--total">
|
|
<div class="fclk-dash-card-icon">
|
|
<i class="fa fa-users"/>
|
|
</div>
|
|
<div class="fclk-dash-card-value"><t t-esc="state.total_employees"/></div>
|
|
<div class="fclk-dash-card-label">Total Employees</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3 mb-3">
|
|
<div class="fclk-dash-card fclk-dash-card--present">
|
|
<div class="fclk-dash-card-icon">
|
|
<i class="fa fa-check-circle"/>
|
|
</div>
|
|
<div class="fclk-dash-card-value"><t t-esc="state.present_count"/></div>
|
|
<div class="fclk-dash-card-label">Present Today</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3 mb-3">
|
|
<div class="fclk-dash-card fclk-dash-card--absent">
|
|
<div class="fclk-dash-card-icon">
|
|
<i class="fa fa-times-circle"/>
|
|
</div>
|
|
<div class="fclk-dash-card-value"><t t-esc="state.absent_count"/></div>
|
|
<div class="fclk-dash-card-label">Absent Today</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3 mb-3">
|
|
<div class="fclk-dash-card fclk-dash-card--late">
|
|
<div class="fclk-dash-card-icon">
|
|
<i class="fa fa-clock-o"/>
|
|
</div>
|
|
<div class="fclk-dash-card-value"><t t-esc="state.late_count"/></div>
|
|
<div class="fclk-dash-card-label">Late Today</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<!-- Currently Clocked In -->
|
|
<div class="col-md-8 mb-4">
|
|
<div class="card">
|
|
<div class="card-header d-flex justify-content-between align-items-center">
|
|
<h5 class="mb-0">Currently Clocked In</h5>
|
|
<span class="badge bg-success"><t t-esc="state.clocked_in.length"/> active</span>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
<t t-if="state.clocked_in.length === 0">
|
|
<div class="text-center py-4 text-muted">
|
|
No employees currently clocked in
|
|
</div>
|
|
</t>
|
|
<t t-else="">
|
|
<table class="table table-sm mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th>Employee</th>
|
|
<th>Clock-In</th>
|
|
<th>Location</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<t t-foreach="state.clocked_in" t-as="emp" t-key="emp_index">
|
|
<tr>
|
|
<td><t t-esc="emp.employee"/></td>
|
|
<td><t t-esc="emp.check_in"/></td>
|
|
<td><t t-esc="emp.location"/></td>
|
|
</tr>
|
|
</t>
|
|
</tbody>
|
|
</table>
|
|
</t>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Alerts Panel -->
|
|
<div class="col-md-4 mb-4">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">Alerts</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between align-items-center mb-3 cursor-pointer"
|
|
t-on-click="onViewActivityLogs">
|
|
<span><i class="fa fa-exclamation-circle text-warning me-2"/>Pending Reasons</span>
|
|
<span class="badge bg-warning"><t t-esc="state.pending_reasons"/></span>
|
|
</div>
|
|
<div class="d-flex justify-content-between align-items-center mb-3 cursor-pointer"
|
|
t-on-click="onViewCorrections">
|
|
<span><i class="fa fa-edit text-info me-2"/>Pending Corrections</span>
|
|
<span class="badge bg-info"><t t-esc="state.pending_corrections"/></span>
|
|
</div>
|
|
<div class="d-flex justify-content-between align-items-center cursor-pointer"
|
|
t-on-click="onViewPenalties">
|
|
<span><i class="fa fa-clock-o text-danger me-2"/>Late Today</span>
|
|
<span class="badge bg-danger"><t t-esc="state.late_count"/></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions -->
|
|
<div class="card mt-3">
|
|
<div class="card-header">
|
|
<h5 class="mb-0">Quick Actions</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<button class="btn btn-outline-primary w-100 mb-2" t-on-click="onViewAttendances">
|
|
<i class="fa fa-list me-1"/> View All Attendances
|
|
</button>
|
|
<button class="btn btn-outline-secondary w-100" t-on-click="onViewActivityLogs">
|
|
<i class="fa fa-history me-1"/> Activity Logs
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</t>
|
|
|
|
</div>
|
|
</div>
|
|
</t>
|
|
|
|
</templates>
|