64 lines
3.2 KiB
XML
64 lines
3.2 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
|
<odoo>
|
|
|
|
<!-- Kiosk Page Template -->
|
|
<template id="kiosk_page" name="Fusion Clock Kiosk">
|
|
<t t-call="web.frontend_layout">
|
|
<t t-set="no_header" t-value="True"/>
|
|
<t t-set="no_footer" t-value="True"/>
|
|
<div id="fclk-kiosk" class="container-fluid vh-100 d-flex flex-column align-items-center justify-content-center"
|
|
style="background: var(--o-main-bg-color, #f8f9fa);"
|
|
t-att-data-pin-required="'true' if pin_required else 'false'">
|
|
|
|
<!-- Header -->
|
|
<div class="text-center mb-4">
|
|
<h1 style="font-size: 2.5rem;">Fusion Clock</h1>
|
|
<p class="text-muted" style="font-size: 1.2rem;">Kiosk Mode</p>
|
|
<div id="fclk-kiosk-time" style="font-size: 3rem; font-weight: 300;"></div>
|
|
</div>
|
|
|
|
<!-- Search / PIN Entry -->
|
|
<div class="card shadow-sm" style="width: 100%; max-width: 500px;">
|
|
<div class="card-body p-4">
|
|
|
|
<!-- Step 1: Search Employee -->
|
|
<div id="fclk-kiosk-search">
|
|
<label class="form-label fw-bold">Employee Name</label>
|
|
<input type="text" id="fclk-kiosk-query" class="form-control form-control-lg mb-3"
|
|
placeholder="Type your name..." autocomplete="off"/>
|
|
<div id="fclk-kiosk-results" class="list-group mb-3" style="max-height: 300px; overflow-y: auto;"></div>
|
|
</div>
|
|
|
|
<!-- Step 2: PIN (if required) -->
|
|
<div id="fclk-kiosk-pin" style="display: none;">
|
|
<h4 id="fclk-kiosk-emp-name" class="text-center mb-3"></h4>
|
|
<t t-if="pin_required">
|
|
<label class="form-label fw-bold">Enter PIN</label>
|
|
<input type="password" id="fclk-kiosk-pin-input" class="form-control form-control-lg text-center mb-3"
|
|
maxlength="6" placeholder="------"/>
|
|
</t>
|
|
<div class="d-grid gap-2">
|
|
<button id="fclk-kiosk-clock-btn" class="btn btn-lg btn-primary">
|
|
Clock In / Out
|
|
</button>
|
|
<button id="fclk-kiosk-back-btn" class="btn btn-outline-secondary">
|
|
Back
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Step 3: Result -->
|
|
<div id="fclk-kiosk-result" style="display: none;">
|
|
<div id="fclk-kiosk-result-msg" class="text-center py-4" style="font-size: 1.3rem;"></div>
|
|
</div>
|
|
|
|
<!-- Error message -->
|
|
<div id="fclk-kiosk-error" class="alert alert-danger mt-3" style="display: none;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</t>
|
|
</template>
|
|
|
|
</odoo>
|