516 lines
16 KiB
HTML
516 lines
16 KiB
HTML
{% extends 'base.html' %}
|
|
|
|
{% load static %}
|
|
|
|
{% block title %}POS - Kitchen Order{% endblock %}
|
|
|
|
{% block js %}
|
|
<script src="{% static 'js/demo/pos-header.demo.js' %}"></script>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- BEGIN pos -->
|
|
<div class="pos pos-with-header" id="pos">
|
|
<!-- BEGIN pos-header -->
|
|
<div class="pos-header">
|
|
<div class="logo">
|
|
<a href="{% url 'ColorAdminApp:index' %}">
|
|
<div class="logo-img"><i class="fa fa-bowl-rice fs-2"></i></div>
|
|
<div class="logo-text">Pine & Dine</div>
|
|
</a>
|
|
</div>
|
|
<div class="time" id="time">00:00</div>
|
|
<div class="nav">
|
|
<div class="nav-item">
|
|
<a href="{% url 'ColorAdminApp:posCounterCheckout' %}" class="nav-link">
|
|
<i class="far fa-credit-card nav-icon"></i>
|
|
</a>
|
|
</div>
|
|
<div class="nav-item">
|
|
<a href="{% url 'ColorAdminApp:posKitchenOrder' %}" class="nav-link">
|
|
<i class="far fa-clock nav-icon"></i>
|
|
</a>
|
|
</div>
|
|
<div class="nav-item">
|
|
<a href="{% url 'ColorAdminApp:posTableBooking' %}" class="nav-link">
|
|
<i class="far fa-calendar-check nav-icon"></i>
|
|
</a>
|
|
</div>
|
|
<div class="nav-item">
|
|
<a href="{% url 'ColorAdminApp:posMenuStock' %}" class="nav-link">
|
|
<i class="fa fa-chart-pie nav-icon"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END pos-header -->
|
|
|
|
<!-- BEGIN pos-content -->
|
|
<div class="pos-content">
|
|
<div class="pos-task-row">
|
|
<div class="pos-task">
|
|
<div class="pos-task-info">
|
|
<div class="table-no">
|
|
Table <b>05</b>
|
|
</div>
|
|
<div class="order-no">
|
|
Order No: #9049
|
|
</div>
|
|
<div class="order-type">
|
|
<span class="badge bg-success">Dine-in</span>
|
|
</div>
|
|
<div class="time-pass" data-start-time="3">
|
|
07:13 time
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-body">
|
|
<div class="pos-task-completed">
|
|
Completed: <b>(1/3)</b>
|
|
</div>
|
|
<div class="pos-task-product-row">
|
|
<div class="pos-task-product">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-2.jpg' %});"></div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Pork Burger</div>
|
|
<div class="desc">
|
|
- large size<br />
|
|
- extra cheese<br />
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-14.jpg' %});"></div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Macarons</div>
|
|
<div class="desc">
|
|
- serve after dishes
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-8.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Vita C Detox Juice</div>
|
|
<div class="desc">
|
|
- large size<br />
|
|
- less ice<br />
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task">
|
|
<div class="pos-task-info">
|
|
<div class="table-no">
|
|
Table <b>14</b>
|
|
</div>
|
|
<div class="order-no">
|
|
Order No: #9047
|
|
</div>
|
|
<div class="order-type">
|
|
<span class="badge bg-success">Dine-in</span>
|
|
</div>
|
|
<div class="time-pass" data-start-time="3">
|
|
<span class="text-danger">12:13</span> time
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-body">
|
|
<div class="pos-task-completed">
|
|
Completed: <b>(3/4)</b>
|
|
</div>
|
|
<div class="pos-task-product-row">
|
|
<div class="pos-task-product">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-11.jpg' %});"></div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Baked chicken wing</div>
|
|
<div class="desc">
|
|
- 6 pieces<br />
|
|
- honey source<br />
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-12.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Veggie Spaghetti</div>
|
|
<div class="desc">
|
|
- size: large <br />
|
|
- spicy level: light
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-7.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Coffee Latte</div>
|
|
<div class="desc">
|
|
- no sugar<br />
|
|
- more cream<br />
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-1.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Grill Chicken Chop</div>
|
|
<div class="desc">
|
|
- ala carte
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task">
|
|
<div class="pos-task-info">
|
|
<div class="table-no">
|
|
Table <b>17</b>
|
|
</div>
|
|
<div class="order-no">
|
|
Order No: #9046
|
|
</div>
|
|
<div class="order-type">
|
|
<span class="badge bg-gray-500">Dine-in</span>
|
|
</div>
|
|
<div class="time-pass" data-start-time="3">
|
|
All dish served<br />12:30 total time
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-body">
|
|
<div class="pos-task-completed">
|
|
Completed: <b>(3/3)</b>
|
|
</div>
|
|
<div class="pos-task-product-row">
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-2.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Pork Burger</div>
|
|
<div class="desc">
|
|
- large size<br />
|
|
- extra cheese<br />
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-10.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Mushroom soup</div>
|
|
<div class="desc">
|
|
- ala carte<br />
|
|
- more cheese<br />
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-8.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Vita C Detox Juice</div>
|
|
<div class="desc">
|
|
- large size<br />
|
|
- less ice<br />
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task">
|
|
<div class="pos-task-info">
|
|
<div class="table-no">
|
|
Table <b>18</b>
|
|
</div>
|
|
<div class="order-no">
|
|
Order No: #9045
|
|
</div>
|
|
<div class="order-type">
|
|
<span class="badge bg-gray-500">Dine-in</span>
|
|
</div>
|
|
<div class="time-pass" data-start-time="3">
|
|
All dish served<br />12:30 total time
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-body">
|
|
<div class="pos-task-completed">
|
|
Completed: <b>(2/2)</b>
|
|
</div>
|
|
<div class="pos-task-product-row">
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-13.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Vanilla Ice Cream</div>
|
|
<div class="desc">
|
|
- ala carte
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-9.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Pancake</div>
|
|
<div class="desc">
|
|
- ala carte
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task">
|
|
<div class="pos-task-info">
|
|
<div class="table-no">
|
|
Table <b>02</b>
|
|
</div>
|
|
<div class="order-no">
|
|
Order No: #9045
|
|
</div>
|
|
<div class="order-type">
|
|
<span class="badge bg-gray-500">Take Away</span>
|
|
</div>
|
|
<div class="time-pass" data-start-time="3">
|
|
All dish served<br />22:28 total time
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-body">
|
|
<div class="pos-task-completed">
|
|
Completed: <b>(3/3)</b>
|
|
</div>
|
|
<div class="pos-task-product-row">
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-4.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Vegan Salad Bowl®</div>
|
|
<div class="desc">
|
|
- ala carte
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-6.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Avocado Shake</div>
|
|
<div class="desc">
|
|
- ala carte
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product completed">
|
|
<div class="pos-task-product-img">
|
|
<div class="cover" style="background-image: url({% static 'img/pos/product-5.jpg' %});"></div>
|
|
<div class="caption">
|
|
<div>Completed</div>
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-info">
|
|
<div class="info">
|
|
<div class="title">Hawaiian Pizza®</div>
|
|
<div class="desc">
|
|
- ala carte
|
|
</div>
|
|
</div>
|
|
<div class="qty">
|
|
x1
|
|
</div>
|
|
</div>
|
|
<div class="pos-task-product-action">
|
|
<a href="#" class="btn btn-success disabled">Complete</a>
|
|
<a href="#" class="btn btn-outline-inverse disabled">Cancel</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END pos-content -->
|
|
</div>
|
|
<!-- END pos -->
|
|
|
|
{% endblock %} |