Josse Colpaert
8b957b7e85
We changed the naming of posbox to IoT Box everywhere and renewed the web interface using jinja2 templates in separate html files. A separate configuration for the server and the IoT Box name was added and it shows drivers for both pos and iot. The interface also needs a step to step wizard that is launched when the access point is active for simplified configuration. Thanks to qle and Deep Patel.
76 lines
3.0 KiB
HTML
76 lines
3.0 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="cache-control" content="no-cache" />
|
|
<meta http-equiv="pragma" content="no-cache" />
|
|
<title class="origin">{{ title or "Odoo's IoTBox" }}</title>
|
|
<script class="origin" type="text/javascript" src="/web/static/lib/jquery/jquery.js"></script>
|
|
<link class="origin" rel="stylesheet" href="/web/static/lib/bootstrap/css/bootstrap.css">
|
|
<script class="origin" type="text/javascript" src="/web/static/lib/bootstrap/js/bootstrap.min.js"></script>
|
|
<link rel="stylesheet" type="text/css" href="/web/static/lib/fontawesome/css/font-awesome.css"/>
|
|
<script type="text/javascript" class="origin">
|
|
{{ cust_js|safe }}
|
|
</script>
|
|
<style class="origin">
|
|
html, body {
|
|
height: 100%;
|
|
}
|
|
</style>
|
|
<style>
|
|
body {
|
|
background: linear-gradient(to right bottom, #77717e, #c9a8a9);
|
|
height: 100vh;
|
|
}
|
|
.pos-display-status {
|
|
padding: 10px 20px;
|
|
background: rgba(0, 0, 0, 0.17);
|
|
border: 1px solid rgba(0, 0, 0, 0.06);
|
|
box-shadow: 1px 1px 0px 0px rgba(60, 60, 60, 0.4);
|
|
color: #fff;
|
|
border-radius: 8px;
|
|
width: 500px;
|
|
position: absolute;
|
|
right: 20px;
|
|
bottom: 20px;
|
|
}
|
|
.info-text {
|
|
font-size: 15px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="text-center pt-5">
|
|
<img style="width: 150px;" src="/web/static/src/img/logo_inverse_white_206px.png">
|
|
<p class="mt-3" style="color: #fff;font-size: 30px;">IoTBox</p>
|
|
</div>
|
|
<div class="pos-display-status">
|
|
<h4 class="text-center mb-3">POS Client display</h4>
|
|
<table class="table table-hover table-sm">
|
|
<thead>
|
|
<tr>
|
|
<th>Interface</th>
|
|
<th>IP</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for display_iface in display_ifaces -%}
|
|
<tr>
|
|
<td><i class="fa fa-{{ display_iface.icon }}"></i></td>
|
|
<td>{{ display_iface.addr }}</td>
|
|
</tr>
|
|
{%- endfor %}
|
|
</tbody>
|
|
</table>
|
|
<p class="mb-2 info-text">
|
|
<i class="fa fa-info-circle mr-1"></i>The customer cart will be displayed here once a Point of Sale session is started.
|
|
</p>
|
|
<p class="mb-2 info-text">
|
|
<i class="fa fa-info-circle mr-1"></i>Odoo version 11 or above is required.
|
|
</p>
|
|
<div class="error-message alert alert-danger mb-2 d-none" role="alert" />
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|