Skip to content

2
21_22-J 31
Commit 768cbb6f authored by Shivanthi Fernando's avatar Shivanthi Fernando
Browse files
Options

Merge branch 'home_page_ui_edit' into 'master' 

Changes in login and home page interface

See merge request !6
parents 1b2a8ffc efca2338
Hide whitespace changes
Inline Side-by-side
Showing with 185 additions and 52 deletions
ServiceStation_2022/settings.py
View file @ 768cbb6f
......@@ -48,7 +48,7 @@ ROOT_URLCONF = 'ServiceStation_2022.urls'
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [TEMPLATE_DIR,],
'DIRS': [TEMPLATE_DIR],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
......
ServiceStation_2022/urls.py
View file @ 768cbb6f
from django.contrib import admin
from django.urls import path,include
from django.urls import path, include
from django.contrib.auth.views import LogoutView,LoginView
urlpatterns = [
path('admin/', admin.site.urls),
path('Admin/',include('User.urls')),
path('Admin/', include('User.urls')),
]
templates/Admin/AdminHome.html
View file @ 768cbb6f
......@@ -6,11 +6,20 @@
<!-- Font special for pages-->
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i" rel="stylesheet">
<!-- Main CSS-->
<!-- ChartJs CDN-->
<script src="https://cdn.jsdelivr.net/npm/chart.js@3.7.0/dist/chart.min.js"></script>
<link href="{% static "css/main.css" %}"rel="stylesheet" media="all">
</head>
<div class=">
<style>
.my-card:hover{
transform: scale(1.1);
transition: 0.2s ease-in-out;
}
</style>
<!-- <div class=">
<div class="wrapper wrapper">
<div style="margin-left: 0px;" class="card card-5">
......@@ -21,9 +30,9 @@
<li {% if message.tags %} class=" {{ message.tags }} " {% endif %}> {{ message }} </li>
{% endfor %}
</ul>
{% endif %}
{% endif %} -->
<div class="card-heading">
<!--<div class="card-heading">
<h2 class="title"> SERVPORT</h2>
</div>
<div class="card-body">
......@@ -34,9 +43,102 @@
<br>
</div>
</div> -->
<div class="container">
<div class="row" style="margin-top: 70px;">
<div class="col-md-12">
<div class="card">
<div class="card-header bg-secondary text-white">
Statistics
</div>
<div class="card-body">
<div class="row">
<div class="col-md-4">
<a class="text-decoration-none text-dark">
<div class="card my-card shadow text-center p-3">
<h4>Service Bookings <i class="fas fa-car"></i> </h4>
<h3>500</h3>
</div>
</a>
</div>
<div class="col-md-4">
<a class="text-decoration-none text-dark">
<div class="card my-card shadow text-center p-3">
<h4>Employees <i class="fas fa-user"></i></i> </h4>
<h3>5</h3>
</div>
</a>
</div>
<div class="col-md-4">
<a class="text-decoration-none text-dark">
<div class="card my-card shadow text-center p-3">
<h4>Stock Quantity <i class="fas fa-shipping-fast"></i></i> </h4>
<h3>60</h3>
</div>
</a>
</div>
</div>
</div>
</div>
<div>
</div>
</div>
<div class="container">
<div class="row" style="margin-top: 20px;">
<div class="col-md-12">
<canvas id="myChart" height="100px"></canvas>
<script>
const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ['February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October'],
datasets: [{
label: 'Number of Service bookings',
data: [6, 15, 8, 5, 10, 6, 12, 9, 15],
backgroundColor: [
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(54, 162, 235, 0.2)'
],
borderColor: [
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)',
'rgba(54, 162, 235, 2)'
],
borderWidth: 1
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
}
}
});
</script>
</div>
</div>
</div>
</div><div class="alert alert-primary" role="alert" > © SERVPORT 2022 </div>
<div class="alert alert-primary fixed-bottom mb-0 text-center" style="background: #747578; border: none; color: white;" role="alert" > © SERVPORT 2022 </div>
</div>
{% endblock content %}
templates/Admin/AdminLogin.html
View file @ 768cbb6f
......@@ -22,54 +22,85 @@
<style>
body
{
background-image:url('{% static 'image/Sales-forecast.png'%}');
background-image:url('{% static 'image/vehicle_service.jpg'%}');
background-repeat:no-repeat;
background-size:100%;
}
</style>
<body>
.login_form
{
width: 400px;
height: 400px;
background: #CFD8DC;
color: #000;
top: 50%;
left: 50%;
position: absolute;
transform: translate(-50%, -50%);
box-sizing: border-box;
border-radius: 25px;
}
.login_text
{
margin-top: 75px;
text-align: center;
margin-bottom: 30px;
font-weight: bold;
color: #02111f;
}
.logo
{
height: 150px;
width: 150px;
position: absolute;
top: -20%;
left: calc(42% - 42px);
}
.login_btn
{
margin-left: 12%;
margin-right:12%;
margin-top: 7%;
background: #02111f;
color: #fff;
width: 300px;
border-radius: 25px;
text-align: center;
}
</style>
<div >
<div class="wrapper wrapper--w790">
<br><br><br>
<div class="card card-12">
<div class="card-heading">
<h2 class="title"> SERVPORT : LOGIN</h2>
</div>
<div class="card-body">
<body>
<div class="login_form">
<img src="/static/image/logo.png" class="logo">
<h1 class="login_text">LOGIN</h1>
<form method="post">
{% csrf_token %}
<table class="table table ">
{{form.as_table}}
{% csrf_token %}
<table class="table table ">
{{form.as_table}}
</table>
</table>
<input type="submit" value="LOGIN" class="btn btn--radius-2 btn-success"/>
<input type="submit" value="LOGIN" class="btn login_btn"/>
<br/><br/>
<br/><br/>
{% if messages %}
<div class="alert alert-danger" role="alert">
{% for message in messages %}
{% if message.tags %} {% endif %} {{ message }}
{% endfor %}
</div>
{% endif %}
</form>
</div>
</div>
<div class="alert alert-danger" role="alert">
{% for message in messages %}
{% if message.tags %} {% endif %} {{ message }}
{% endfor %}
</div>
{% endif %}
</form>
</div>
</div>
</div>
</div>
......
templates/Admin/Sidebar2.html
View file @ 768cbb6f
......@@ -51,7 +51,7 @@ body{
background-color: #f3f5f9;
}
.bg-danger {
background-color: #0062cc !important;
background-color: #747578 !important;
}
......@@ -63,7 +63,7 @@ body{
.wrapper .sidebar{
width: 200px;
height: 100%;
background: #178530;
background: #747578;
padding: 30px 0px;
position: fixed;
}
......@@ -92,7 +92,7 @@ body{
}
.wrapper .sidebar ul li:hover{
background-color: #7a7a7a;
background-color: #02111f;
}
.wrapper .sidebar ul li:hover a{
......@@ -157,9 +157,11 @@ body{
<body>
<nav class="navbar navbar-expand-lg navbar-light fixed-top bg-danger">
<a style="color:white;" class="navbar-brand" href="#"> &nbsp;<font face = "Comic sans MS" size ="5">SERVPORT </font></a>
<a style="color:white;" class="navbar-brand" href="#">
<img src="/static/image/logo.png" width="40" height="40" alt="">
<font face = "Comic sans MS" size ="5" class="">ServPort </font>
</a>
<div class="navbar-collapse collapse w-100 order-3 dual-collapse2">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
......@@ -176,15 +178,13 @@ body{
<ul>
<li><a style="text-decoration:none;" href="/Admin/AdminHome/"><i class="fas fa-desktop"></i>Home</a></li>
<li><a style="text-decoration:none;" href="#"><i class="fas fa-barcode"></i> Employee Efficiency </a>
<li><a style="text-decoration:none;" href="#"><i class="fas fa-barcode"></i> Employee Efficiency </a>
<li><a style="text-decoration:none;" href="/Admin/Employee_Data/"><i class="fas fa-paper-plane "></i> Employee Data </a>
<li><a style="text-decoration:none;" href="/Admin/EmployeeStatus_Update/"><i class="fas fa-upload"></i> Assign Employee </a>
</li>
<li><a style="text-decoration:none;" href="/Admin/Employee_Data/"><i class="fas fa-paper-plane "></i> Employee Data </a>
<li><a style="text-decoration:none;" href="/Admin/EmployeeStatus_Update/"><i class="fas fa-upload"></i> Assign Employee </a>
</li>
<li><a style="text-decoration:none;" href="/Admin/Forecasting/"><i class="fas fa-bullseye "></i> Demand Forecasting </a>
<li><a style="text-decoration:none;" href="/Admin/PurchaseHistory/"><i class="fas fa-cubes"></i> Purchase History </a>
<li><a style="text-decoration:none;" href="/Admin/PurchaseHistory/"><i class="fas fa-cubes"></i> Purchase History </a>
</ul>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment