563 lines
33 KiB
HTML
563 lines
33 KiB
HTML
{% extends 'base.html' %}
|
|
{% load static %}
|
|
{% block content %}
|
|
|
|
<div class="page-wrapper">
|
|
<!-- HEADER MOBILE-->
|
|
<header class="header-mobile d-block d-lg-none">
|
|
<div class="header-mobile__bar">
|
|
<div class="container-fluid">
|
|
<div class="header-mobile-inner"
|
|
<a class="logo" href="index.html">
|
|
<img src="{% static 'images/icon/logo.png' %}" alt="King Dental" />
|
|
</a>
|
|
<button class="hamburger hamburger--slider" type="button">
|
|
<span class="hamburger-box">
|
|
<span class="hamburger-inner"></span>
|
|
</span>
|
|
</button>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<nav class="navbar-mobile">
|
|
<div class="container-fluid">
|
|
{% if request.user.is_authenticated %}
|
|
<ul class="navbar-mobile__list list-unstyled">
|
|
{% comment %} <li class="has-sub">
|
|
<a class="js-arrow" href="#">
|
|
<i class="fas fa-tachometer-alt"></i>Dashboard</a>
|
|
<ul class="navbar-mobile-sub__list list-unstyled js-sub-list">
|
|
<li>
|
|
<a href="index.html">Dashboard 1</a>
|
|
</li>
|
|
<li>
|
|
<a href="index2.html">Dashboard 2</a>
|
|
</li>
|
|
<li>
|
|
<a href="index3.html">Dashboard 3</a>
|
|
</li>
|
|
<li>
|
|
<a href="index4.html">Dashboard 4</a>
|
|
</li>
|
|
</ul>
|
|
</li> {% endcomment %}
|
|
<li>
|
|
<a href="chart.html">
|
|
<i class="fas fa-chart-bar"></i>Patients List</a>
|
|
</li>
|
|
{% comment %} <li>
|
|
<a href="table.html">
|
|
<i class="fas fa-table"></i>Tables</a>
|
|
</li>
|
|
<li>
|
|
<a href="form.html">
|
|
<i class="far fa-check-square"></i>Forms</a>
|
|
</li>
|
|
<li>
|
|
<a href="calendar.html">
|
|
<i class="fas fa-calendar-alt"></i>Calendar</a>
|
|
</li>
|
|
<li>
|
|
<a href="map.html">
|
|
<i class="fas fa-map-marker-alt"></i>Maps</a>
|
|
</li>
|
|
<li class="has-sub">
|
|
<a class="js-arrow" href="#">
|
|
<i class="fas fa-copy"></i>Pages</a>
|
|
<ul class="navbar-mobile-sub__list list-unstyled js-sub-list">
|
|
<li>
|
|
<a href="login.html">Login</a>
|
|
</li>
|
|
<li>
|
|
<a href="register.html">Register</a>
|
|
</li>
|
|
<li>
|
|
<a href="forget-pass.html">Forget Password</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="has-sub">
|
|
<a class="js-arrow" href="#">
|
|
<i class="fas fa-desktop"></i>UI Elements</a>
|
|
<ul class="navbar-mobile-sub__list list-unstyled js-sub-list">
|
|
<li>
|
|
<a href="button.html">Button</a>
|
|
</li>
|
|
<li>
|
|
<a href="badge.html">Badges</a>
|
|
</li>
|
|
<li>
|
|
<a href="tab.html">Tabs</a>
|
|
</li>
|
|
<li>
|
|
<a href="card.html">Cards</a>
|
|
</li>
|
|
<li>
|
|
<a href="alert.html">Alerts</a>
|
|
</li>
|
|
<li>
|
|
<a href="progress-bar.html">Progress Bars</a>
|
|
</li>
|
|
<li>
|
|
<a href="modal.html">Modals</a>
|
|
</li>
|
|
<li>
|
|
<a href="switch.html">Switchs</a>
|
|
</li>
|
|
<li>
|
|
<a href="grid.html">Grids</a>
|
|
</li>
|
|
<li>
|
|
<a href="fontawesome.html">Fontawesome Icon</a>
|
|
</li>
|
|
<li>
|
|
<a href="typo.html">Typography</a>
|
|
</li>
|
|
</ul>
|
|
</li> {% endcomment %}
|
|
</ul>
|
|
{% endif %}
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
<!-- END HEADER MOBILE-->
|
|
|
|
<!-- MENU SIDEBAR-->
|
|
|
|
<aside class="menu-sidebar d-none d-lg-block">
|
|
<div class="logo">
|
|
<a href="#">
|
|
<img src="{% static 'images/icon/logo.png' %}" alt="King Dental" />
|
|
</a>
|
|
</div>
|
|
{% if request.user.is_authenticated %}
|
|
<div class="menu-sidebar__content js-scrollbar1">
|
|
<nav class="navbar-sidebar">
|
|
<ul class="list-unstyled navbar__list">
|
|
{% comment %} <li class="has-sub">
|
|
<a class="js-arrow" href="#">
|
|
<i class="fas fa-tachometer-alt"></i>Dashboard</a>
|
|
<ul class="list-unstyled navbar__sub-list js-sub-list">
|
|
<li>
|
|
<a href="index.html">Dashboard 1</a>
|
|
</li>
|
|
<li>
|
|
<a href="index2.html">Dashboard 2</a>
|
|
</li>
|
|
<li>
|
|
<a href="index3.html">Dashboard 3</a>
|
|
</li>
|
|
<li>
|
|
<a href="index4.html">Dashboard 4</a>
|
|
</li>
|
|
</ul>
|
|
</li> {% endcomment %}
|
|
<li class="au-breadcrumb__list active">
|
|
<a href="{% url 'home' %}">
|
|
<i class="fas fa-wheelchair" active></i>Patients List</a>
|
|
</li>
|
|
<li >
|
|
<a class="js-arrow" href="{% url 'detect_list' %}">
|
|
<i class="zmdi zmdi-developer-board"></i>Detected List
|
|
</a>
|
|
|
|
</li>
|
|
{% comment %} <li>
|
|
<a href="table.html">
|
|
<i class="fas fa-table"></i>Tables</a>
|
|
</li>
|
|
<li>
|
|
<a href="form.html">
|
|
<i class="far fa-check-square"></i>Forms</a>
|
|
</li>
|
|
<li>
|
|
<a href="calendar.html">
|
|
<i class="fas fa-calendar-alt"></i>Calendar</a>
|
|
</li>
|
|
<li>
|
|
<a href="map.html">
|
|
<i class="fas fa-map-marker-alt"></i>Maps</a>
|
|
</li>
|
|
<li class="active has-sub">
|
|
<a class="js-arrow" href="#">
|
|
<i class="fas fa-copy"></i>Pages</a>
|
|
<ul class="list-unstyled navbar__sub-list js-sub-list">
|
|
<li>
|
|
<a href="login.html">Login</a>
|
|
</li>
|
|
<li>
|
|
<a href="register.html">Register</a>
|
|
</li>
|
|
<li>
|
|
<a href="forget-pass.html">Forget Password</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="has-sub">
|
|
<a class="js-arrow" href="#">
|
|
<i class="fas fa-desktop"></i>UI Elements</a>
|
|
<ul class="list-unstyled navbar__sub-list js-sub-list">
|
|
<li>
|
|
<a href="button.html">Button</a>
|
|
</li>
|
|
<li>
|
|
<a href="badge.html">Badges</a>
|
|
</li>
|
|
<li>
|
|
<a href="tab.html">Tabs</a>
|
|
</li>
|
|
<li>
|
|
<a href="card.html">Cards</a>
|
|
</li>
|
|
<li>
|
|
<a href="alert.html">Alerts</a>
|
|
</li>
|
|
<li>
|
|
<a href="progress-bar.html">Progress Bars</a>
|
|
</li>
|
|
<li>
|
|
<a href="modal.html">Modals</a>
|
|
</li>
|
|
<li>
|
|
<a href="switch.html">Switchs</a>
|
|
</li>
|
|
<li>
|
|
<a href="grid.html">Grids</a>
|
|
</li>
|
|
<li>
|
|
<a href="fontawesome.html">Fontawesome Icon</a>
|
|
</li>
|
|
<li>
|
|
<a href="typo.html">Typography</a>
|
|
</li>
|
|
</ul>
|
|
</li> {% endcomment %}
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
{% endif %}
|
|
</aside>
|
|
|
|
<!-- END MENU SIDEBAR-->
|
|
|
|
<!-- PAGE CONTAINER-->
|
|
<div class="page-container">
|
|
<!-- HEADER DESKTOP-->
|
|
<header class="header-desktop">
|
|
<div class="section__content section__content--p30">
|
|
<div class="container-fluid">
|
|
<div class="header-wrap">
|
|
<form class="form-header" action="{% url 'patient_search' %}" method="GET">
|
|
{% csrf_token %}
|
|
<input class="au-input au-input--xl" type="text" name="query" placeholder="Search for patient name or national ID" />
|
|
<button class="au-btn--submit" type="submit">
|
|
<i class="zmdi zmdi-search"></i>
|
|
</button>
|
|
</form>
|
|
|
|
|
|
<div class="header-button">
|
|
{% comment %}<div class="noti-wrap">
|
|
<div class="noti__item js-item-menu">
|
|
<i class="zmdi zmdi-comment-more"></i>
|
|
<span class="quantity">1</span>
|
|
<div class="mess-dropdown js-dropdown">
|
|
<div class="mess__title">
|
|
<p>You have 2 news message</p>
|
|
</div>
|
|
<div class="mess__item">
|
|
<div class="image img-cir img-40">
|
|
<img src="{% static 'images/icon/avatar-06.jpg' %}" alt="Michelle Moreno" />
|
|
</div>
|
|
<div class="content">
|
|
<h6>Michelle Moreno</h6>
|
|
<p>Have sent a photo</p>
|
|
<span class="time">3 min ago</span>
|
|
</div>
|
|
</div>
|
|
<div class="mess__item">
|
|
<div class="image img-cir img-40">
|
|
<img src="{% static 'images/icon/avatar-04.jpg' %}" alt="Diane Myers" />
|
|
</div>
|
|
<div class="content">
|
|
<h6>Diane Myers</h6>
|
|
<p>You are now connected on message</p>
|
|
<span class="time">Yesterday</span>
|
|
</div>
|
|
</div>
|
|
<div class="mess__footer">
|
|
<a href="#">View all messages</a>
|
|
</div>
|
|
</div>
|
|
</div> {% endcomment %}
|
|
|
|
|
|
{% comment %} <div class="noti__item js-item-menu">
|
|
<i class="zmdi zmdi-email"></i>
|
|
<span class="quantity">1</span>
|
|
<div class="email-dropdown js-dropdown">
|
|
<div class="email__title">
|
|
<p>You have 3 New Emails</p>
|
|
</div>
|
|
<div class="email__item">
|
|
<div class="image img-cir img-40">
|
|
<img src="{% static 'images/icon/avatar-06.jpg' %}" alt="Cynthia Harvey" />
|
|
</div>
|
|
<div class="content">
|
|
<p>Meeting about new dashboard...</p>
|
|
<span>Cynthia Harvey, 3 min ago</span>
|
|
</div>
|
|
</div>
|
|
<div class="email__item">
|
|
<div class="image img-cir img-40">
|
|
<img src="{% static 'images/icon/avatar-05.jpg'}" alt="Cynthia Harvey" />
|
|
</div>
|
|
<div class="content">
|
|
<p>Meeting about new dashboard...</p>
|
|
<span>Cynthia Harvey, Yesterday</span>
|
|
</div>
|
|
</div>
|
|
<div class="email__item">
|
|
<div class="image img-cir img-40">
|
|
<img src="images/icon/avatar-04.jpg" alt="Cynthia Harvey" />
|
|
</div>
|
|
<div class="content">
|
|
<p>Meeting about new dashboard...</p>
|
|
<span>Cynthia Harvey, April 12,,2018</span>
|
|
</div>
|
|
</div>
|
|
<div class="email__footer">
|
|
<a href="#">See all emails</a>
|
|
</div>
|
|
</div>
|
|
</div> {% endcomment %}
|
|
|
|
|
|
{% comment %} <div class="noti__item js-item-menu">
|
|
<i class="zmdi zmdi-notifications"></i>
|
|
<span class="quantity">3</span>
|
|
<div class="notifi-dropdown js-dropdown">
|
|
<div class="notifi__title">
|
|
<p>You have 3 Notifications</p>
|
|
</div>
|
|
<div class="notifi__item">
|
|
<div class="bg-c1 img-cir img-40">
|
|
<i class="zmdi zmdi-email-open"></i>
|
|
</div>
|
|
<div class="content">
|
|
<p>You got a email notification</p>
|
|
<span class="date">April 12, 2018 06:50</span>
|
|
</div>
|
|
</div>
|
|
<div class="notifi__item">
|
|
<div class="bg-c2 img-cir img-40">
|
|
<i class="zmdi zmdi-account-box"></i>
|
|
</div>
|
|
<div class="content">
|
|
<p>Your account has been blocked</p>
|
|
<span class="date">April 12, 2018 06:50</span>
|
|
</div>
|
|
</div>
|
|
<div class="notifi__item">
|
|
<div class="bg-c3 img-cir img-40">
|
|
<i class="zmdi zmdi-file-text"></i>
|
|
</div>
|
|
<div class="content">
|
|
<p>You got a new file</p>
|
|
<span class="date">April 12, 2018 06:50</span>
|
|
</div>
|
|
</div>
|
|
<div class="notifi__footer">
|
|
<a href="#">All notifications</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> {% endcomment %}
|
|
|
|
{% if request.user.is_authenticated %}
|
|
<div class="account-wrap">
|
|
<div class="account-item clearfix js-item-menu">
|
|
<div class="image">
|
|
<img src="{% static 'images/icon/avatar-01.jpg' %}" alt="John Doe" />
|
|
</div>
|
|
<div class="content">
|
|
<a class="js-acc-btn" href="#">{{ request.user.username }}</a>
|
|
</div>
|
|
<div class="account-dropdown js-dropdown">
|
|
<div class="info clearfix">
|
|
<div class="image">
|
|
<a href="#">
|
|
<img src="{% static 'images/icon/avatar-01.jpg' %}" alt="John Doe" />
|
|
</a>
|
|
</div>
|
|
<div class="content">
|
|
<h5 class="name">
|
|
<a href="#">{{ request.user.username }}</a>
|
|
</h5>
|
|
<span class="email">{{ request.user.email }}</span>
|
|
</div>
|
|
</div>
|
|
{% comment %} <div class="account-dropdown__body">
|
|
<div class="account-dropdown__item">
|
|
<a href="#">
|
|
<i class="zmdi zmdi-account"></i>Account</a>
|
|
</div>
|
|
<div class="account-dropdown__item">
|
|
<a href="#">
|
|
<i class="zmdi zmdi-settings"></i>Setting</a>
|
|
</div>
|
|
<div class="account-dropdown__item">
|
|
<a href="#">
|
|
<i class="zmdi zmdi-money-box"></i>Billing</a>
|
|
</div>
|
|
</div> {% endcomment %}
|
|
<div class="account-dropdown__footer">
|
|
<a href="{% url 'user_logout' %}">
|
|
<i class="zmdi zmdi-power"></i>Logout</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{%else%}
|
|
|
|
<div class="account-wrap">
|
|
<div class="account-item clearfix">
|
|
<a class="zmdi zmdi-account mr-2 " href="{% url 'user_login' %}"> Login</a>
|
|
<span> | </span>
|
|
<a class="zmdi zmdi-account ml-2" href="{% url 'user_register' %}"> Register</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</header>
|
|
<!-- END HEADER DESKTOP-->
|
|
|
|
<!-- MAIN CONTENT-->
|
|
<!-- MAIN CONTENT-->
|
|
{% if request.user.is_authenticated %}
|
|
<div class="main-content">
|
|
<div class="section__content section__content--p30 ">
|
|
<div class="container-fluid">
|
|
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<!-- DATA TABLE -->
|
|
<h3 class="title-5 m-b-35">Patients List</h3>
|
|
<div class="table-data__tool">
|
|
<div class="table-data__tool-left">
|
|
{% comment %} <div class="rs-select2--light rs-select2--md">
|
|
<select class="js-select2" name="property">
|
|
<option selected="selected">All Properties</option>
|
|
<option value="">Option 1</option>
|
|
<option value="">Option 2</option>
|
|
</select>
|
|
<div class="dropDownSelect2"></div>
|
|
</div>
|
|
<div class="rs-select2--light rs-select2--sm">
|
|
<select class="js-select2" name="time">
|
|
<option selected="selected">Today</option>
|
|
<option value="">3 Days</option>
|
|
<option value="">1 Week</option>
|
|
</select>
|
|
<div class="dropDownSelect2"></div>
|
|
</div>
|
|
<button class="au-btn-filter">
|
|
<i class="zmdi zmdi-filter-list"></i>filters</button> {% endcomment %}
|
|
</div>
|
|
<div class="table-data__tool-right">
|
|
<button class="au-btn au-btn-icon au-btn--green au-btn--small" onclick="location.href='{% url 'patient_create' %}';">
|
|
<i class="zmdi zmdi-plus"></i>add item</button>
|
|
{% comment %} <div class="rs-select2--dark rs-select2--sm rs-select2--dark2">
|
|
<select class="js-select2" name="type">
|
|
<option selected="selected">Export</option>
|
|
<option value="">Option 1</option>
|
|
<option value="">Option 2</option>
|
|
</select>
|
|
<div class="dropDownSelect2"></div>
|
|
</div> {% endcomment %}
|
|
</div>
|
|
</div>
|
|
<div class="table-responsive table-responsive-data2">
|
|
<table class="table table-data2">
|
|
<thead>
|
|
<tr>
|
|
<th>
|
|
<label class="au-checkbox">
|
|
<input type="checkbox">
|
|
<span class="au-checkmark"></span>
|
|
</label>
|
|
</th>
|
|
<th>name</th>
|
|
<th>National ID</th>
|
|
<th>Date</th>
|
|
<th>image</th>
|
|
<th>description</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for patient in patients %}
|
|
|
|
<tr class="tr-shadow">
|
|
<td>
|
|
<label class="au-checkbox">
|
|
<input type="checkbox">
|
|
<span class="au-checkmark"></span>
|
|
</label>
|
|
</td>
|
|
<td>{{ patient.name }}</td>
|
|
<td>
|
|
{% comment %} <span class="block-email">lori@example.com</span> {% endcomment %}
|
|
{{patient.nationalID}}
|
|
</td>
|
|
<td>{{patient.created_at}}</td>
|
|
|
|
|
|
<td class="table-tooth-image">
|
|
<img src="/{{ patient.image }}" />
|
|
</td>
|
|
|
|
<td>{{ patient.description }}</td>
|
|
<td>
|
|
<div class="table-data-feature">
|
|
|
|
<button class="item" data-toggle="tooltip" data-placement="top" title="Edit" onclick="location.href='{% url 'patient_update' patient.id %}';">
|
|
<i class="zmdi zmdi-edit"></i>
|
|
</button>
|
|
<button class="item" data-toggle="tooltip" data-placement="top" title="Delete" onclick="location.href='{% url 'patient_delete' patient.id %}';">
|
|
<i class="zmdi zmdi-delete"></i>
|
|
</button>
|
|
<button class="item" data-toggle="tooltip" data-placement="top" title="Detect" onclick="location.href='{% url 'patient_detect' patient.id %}';">
|
|
<i class="zmdi zmdi-developer-board"></i>
|
|
</button>
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr class="spacer"></tr>
|
|
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<!-- END DATA TABLE -->
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
<!-- END PAGE CONTAINER-->
|
|
|
|
</div>
|
|
|
|
{% endblock content %} |