Skip to content
Snippets Groups Projects
Commit 2293c97c authored by Aldrich Valentino Halim's avatar Aldrich Valentino Halim
Browse files

dashboard splited into 3 pages, need refactoring in other pages

parent 5f99589b
1 merge request!42Projekers - 13515051 - Girvandi Ilyas
Hide whitespace changes
Inline Side-by-side
css/dashboard.css
+ 4
− 6
View file @ 2293c97c
......@@ -7,7 +7,6 @@
display: inline-block;
vertical-align: top;
}
.logout-panel {
font-size: initial;
text-align: right;
......@@ -17,7 +16,10 @@
width: 100%;
font-size: 0;
}
.menu a {
color: #000;
text-decoration: none;
}
.submenu {
background-color: #FFF;
padding: 15px;
......@@ -54,10 +56,6 @@
color: #FFF;
}
.order-wrapper, .history-wrapper {
display: none;
}
.sub-header {
font-size: 0;
margin: 20px 0;
......
js/dashboard.js
+ 17
− 10
View file @ 2293c97c
function order_clicked() {
document.getElementById('history').classList.remove('selected');
document.getElementsByClassName('history-wrapper')[0].style.display = 'none';
document.getElementById('profile').classList.remove('selected');
document.getElementsByClassName('profile-wrapper')[0].style.display = 'none';
document.getElementById('order').classList.add('selected');
document.getElementsByClassName('order-wrapper')[0].style.display = 'block';
}
function history_clicked() {
document.getElementById('profile').classList.remove('selected');
document.getElementsByClassName('profile-wrapper')[0].style.display = 'none';
document.getElementById('order').classList.remove('selected');
document.getElementsByClassName('order-wrapper')[0].style.display = 'none';
document.getElementById('history').classList.add('selected');
document.getElementsByClassName('history-wrapper')[0].style.display = 'block';
}
function profile_clicked() {
document.getElementById('history').classList.remove('selected');
document.getElementsByClassName('history-wrapper')[0].style.display = 'none';
document.getElementById('order').classList.remove('selected');
document.getElementsByClassName('order-wrapper')[0].style.display = 'none';
document.getElementById('profile').classList.add('selected');
document.getElementsByClassName('profile-wrapper')[0].style.display = 'block';
}
function driverHistoryClicked() {
document.getElementById('previous-order').classList.remove('selected-order');
......@@ -29,4 +20,20 @@ function driverHistoryClicked() {
function previousOrderClicked() {
document.getElementById('driver-history').classList.remove('selected-order');
document.getElementById('previous-order').classList.add('selected-order');
}
\ No newline at end of file
}
function getUsername(){
var id = sessionid;
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
var result = xmlhttp.responseXML;
//Get User's data
var name = result.getElementsByTagName('name')[0].childNodes[0].nodeValue;
document.getElementById('username').innerHTML = 'Hello, ' + name + '!';
}
};
xmlhttp.open('GET', '../controller/profile.php?id=' + id, true);
xmlhttp.send();
}
view/header.php 0 → 100644
+ 12
− 0
View file @ 2293c97c
<div class="header">
<div class="logo"><img src="../img/logo.png" /></div>
<div class="logout-panel">
<div id="username"></div>
<a href="index.php">Logout</a>
</div>
</div>
<div class="menu">
<a href="order.php?id=<?php echo $_GET['id']; ?>" class="submenu" id="order" onclick="order_clicked()">ORDER</a>
<a href="history.php?id=<?php echo $_GET['id']; ?>" class="submenu" id="history" onclick="history_clicked(); getAllTransaction(1)">HISTORY</a>
<a href="profile.php?id=<?php echo $_GET['id']; ?>" class="submenu selected" id="profile" onclick="getUserProfile(); profile_clicked();">PROFILE</a>
</div>
\ No newline at end of file
view/history.php 0 → 100644
+ 36
− 0
View file @ 2293c97c
<html>
<head>
<title>User Dashboard</title>
<link href="../css/primary.css" type="text/css" rel="stylesheet" />
<link href="../css/dashboard.css" type="text/css" rel="stylesheet" />
<link href="../css/history.css" type="text/css" rel="stylesheet" />
<link href="../css/order.css" type="text/css" rel="stylesheet" />
<script>
//send session id to JS files
var sessionid = "<?php echo $_GET['id']; ?>";
</script>
<script src="../js/dashboard.js"></script>
<script src="../js/profile.js"></script>
<script src="../js/history.js"></script>
<script src="../js/order.js"></script>
</head>
<body onpageshow="getUsername(); history_clicked(); getAllTransaction(1);">
<div class="container">
<?php include "header.php"; ?>
<section class="history-wrapper">
<div class="sub-header">
<div class="sub-header-heading"><h1>TRANSACTION HISTORY</h1></div>
</div>
<div class="menu">
<div class="submenu-two" id="previous-order" onclick="getAllTransaction(0); previousOrderClicked()">
MY PREVIOUS ORDER</div>
<div class="submenu-two selected-order" id="driver-history" onclick="getAllTransaction(1); driverHistoryClicked()">
DRIVER HISTORY</div>
</div>
<div class="driver-info" id="driver-info"></div>
</section>
</div>
</body>
</html>
\ No newline at end of file
view/order.php
+ 59
− 36
View file @ 2293c97c
<div class="sub-header">
<div class="sub-header-heading"><h1>MAKE AN ORDER</h1></div>
</div>
<div class="order-progress">
<div class="select-destination order-count"><div class="counter">1</div>Select Destination</div>
<div class="select-driver"><div class="counter">2</div>Select Driver</div>
<div class="complete-order"><div class="counter">3</div>Complete Order</div>
</div>
<div>
<form action="../controller/orderController.php" method="post">
<div class="first-page">
<div class="input-box">
<label>Picking Point</label><input type="text" name="pickup" id="pickup" placeholder="Pickup Point"/>
</div>
<div class="input-box">
<label>Destination</label><input type="text" name="destination" id="destination" placeholder="Destination Point"/>
</div>
<div class="input-box">
<label>Preferred Driver</label><input type="text" name="preferred-driver" id="preferred-driver" placeholder="(optional)" value=""/>
</div>
<html>
<head>
<title>User Dashboard</title>
<link href="../css/primary.css" type="text/css" rel="stylesheet" />
<link href="../css/dashboard.css" type="text/css" rel="stylesheet" />
<link href="../css/history.css" type="text/css" rel="stylesheet" />
<link href="../css/order.css" type="text/css" rel="stylesheet" />
<script>
//send session id to JS files
var sessionid = "<?php echo $_GET['id']; ?>";
</script>
<script src="../js/dashboard.js"></script>
<script src="../js/order.js"></script>
</head>
<body onpageshow="getUsername(); order_clicked();">
<div class="container">
<?php include "header.php"; ?>
<section class="order-wrapper">
<div class="sub-header">
<div class="sub-header-heading"><h1>MAKE AN ORDER</h1></div>
</div>
<div class="order-progress">
<div class="select-destination order-count"><div class="counter">1</div>Select Destination</div>
<div class="select-driver"><div class="counter">2</div>Select Driver</div>
<div class="complete-order"><div class="counter">3</div>Complete Order</div>
</div>
<div>
<form action="../controller/orderController.php" method="post">
<div class="first-page">
<div class="input-box">
<label>Picking Point</label><input type="text" name="pickup" id="pickup" placeholder="Pickup Point"/>
</div>
<div class="input-box">
<label>Destination</label><input type="text" name="destination" id="destination" placeholder="Destination Point"/>
</div>
<div class="input-box">
<label>Preferred Driver</label><input type="text" name="preferred-driver" id="preferred-driver" placeholder="(optional)" value=""/>
</div>
</div>
<div class="next-page"><div id="next-page" onclick="nextPage(); getDriver();">NEXT</div></div>
<div class="next-page"><div id="next-page" onclick="nextPage(); getDriver();">NEXT</div></div>
<div class="second-page"></div>
<div class="second-page"></div>
<div class="third-page">
<h1>HOW WAS IT?</h1>
<div class="selected-driver" id="selected-driver"></div>
<input type="hidden" id="driverId" name="driverId" />
<input type="hidden" id="userId" name="userId" />
<input type="radio" id="rating" name="rating" value="1" />1
<input type="radio" id="rating" name="rating" value="2" />2
<input type="radio" id="rating" name="rating" value="3" />3
<input type="radio" id="rating" name="rating" value="4" />4
<input type="radio" id="rating" name="rating" value="5" />5
<textarea rows="3" placeholder="Leave your comment here!" name="comment" id="comment"></textarea>
<div class="submit-button"><input type="submit" value="COMPLETE!" /></div>
<div class="third-page">
<h1>HOW WAS IT?</h1>
<div class="selected-driver" id="selected-driver"></div>
<input type="hidden" id="driverId" name="driverId" />
<input type="hidden" id="userId" name="userId" />
<input type="radio" id="rating" name="rating" value="1" />1
<input type="radio" id="rating" name="rating" value="2" />2
<input type="radio" id="rating" name="rating" value="3" />3
<input type="radio" id="rating" name="rating" value="4" />4
<input type="radio" id="rating" name="rating" value="5" />5
<textarea rows="3" placeholder="Leave your comment here!" name="comment" id="comment"></textarea>
<div class="submit-button"><input type="submit" value="COMPLETE!" /></div>
</div>
</form>
</div>
</section>
</div>
</body>
</html>
</form>
</div>
\ No newline at end of file
view/profile.php 0 → 100644
+ 47
− 0
View file @ 2293c97c
<html>
<head>
<title>User Dashboard</title>
<link href="../css/primary.css" type="text/css" rel="stylesheet" />
<link href="../css/dashboard.css" type="text/css" rel="stylesheet" />
<link href="../css/history.css" type="text/css" rel="stylesheet" />
<link href="../css/order.css" type="text/css" rel="stylesheet" />
<script>
//send session id to JS files
var sessionid = "<?php echo $_GET['id']; ?>";
</script>
<script src="../js/dashboard.js"></script>
<script src="../js/profile.js"></script>
<script src="../js/history.js"></script>
<script src="../js/order.js"></script>
</head>
<body onpageshow="getUserProfile(); profile_clicked();">
<div class="container">
<?php include "header.php"; ?>
<section class="profile-wrapper">
<div class="sub-header">
<div class="sub-header-heading"><h1>MY PROFILE</h1></div>
<div class="edit-icon">
<a href="../view/edit-profile.php?id=<?php echo $_GET['id'] ?>"><img src="../img/pencil.png" /></a>
</div>
</div>
<div class="user-profile">
<div id="user-image"></div>
<h1 id="profile-username"></h1>
<div id="name"></div>
<div id="driver"></div>
<div id="driver-stats"></div>
<img src="../img/mail.png" /><div id="email"></div><br />
<img src="../img/phone.png" /><div id="phone"></div><br />
</div>
<div class="sub-header" id="preferred-location">
<div class="sub-header-heading"><h1>PREFERRED LOCATION</h1></div>
<div class="edit-icon">
<a href="../view/edit-prefered-locations.php"><img src="../img/pencil.png" /></a>
</div>
</div>
<div class="user-location"><ul id="user-location"></ul></div>
</section>
</div>
</body>
</html>
\ No newline at end of file
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