Documente Academic
Documente Profesional
Documente Cultură
ACKNOWLEDGEMENT
life that was given to us. He, who has blessed and
times of our needs, and for all the support that was given
to us.
study.
the support, and guidance, that he has provided us, and for
subject matter.
our life in the past, present, and future. You will always
TABLE OF CONTENTS
Title Page i
Approval Sheet ii
Acknowledgment iii
Table of Contents iv
List of Tables vi
List of Figures vi
Abstract vii
I.INTRODUCTION
Conceptual Framework 6
II.METHODS
Research Design 18
ANGELES CAMPUS v
Research Instruments 23
III.RESULTS
Data Presentation 26
IT Professionals Evaluation 35
IV.DISCUSSIONS
Summary 39
Conclusions 43
Recommendations 44
References 46
LIST OF TABLES
Officers 34
LIST OF FIGURES
ABSTRACT
INTRODUCTION
2015).
2.5 billion smart phone users by the year 2019, and in China
phone users in the said country, and this will still rise to
40% by the year 2021. These statistics shows how large the
(Harper, 2017).
ANGELES CAMPUS 3
took to travel the world 100 years ago. She mentioned in her
will take about 40 days, however now, it will only take less
regard for the life and limb of passengers and other road
(Laurel, 2017).
And on the year 2016, there has been 109,322 road crashes,
regulations.
passes daily.
using the admin web panel if there are any major traffic,
vicinity.
CONCEPTUAL FRAMEWORK
The image of the man who had not followed the road rules and
the system. Aside from that, survey and interviews were also
specified users.
ANGELES CAMPUS 8
fulfilled.
the users.
application.
their eTicket.
CDC Traffic & Safety Department. The CDC Traffic & Safety
and even the law of right of way. Aside from that, Drivers
will now have a medium that will allow them to check if they
Zone.
examinations.
that will enable users to view and review the necessary road
it’s only accessible by the admin, and web panel will serve
different violations.
the registered user will need to check the eTicket and the
only that, but this will also provide the reader a bird’s
type, and based from the research study, it’s proven that
rules.
MCFP President, Atoy Sta. Cruz, “Out of 9,000 who took the
ANGELES CAMPUS 15
drivers.
application.
country.
ANGELES CAMPUS 18
Chapter II
METHODS
procedures.
ANGELES CAMPUS 19
RESEARCH DESIGN
about “what” people think, but also answers the “why” they
think so.
followed.
SDLC. The system design is based on the data that has been
consists of PHP, HTML, CSS, Vue Js, Axios and MySql for the
to the client.
model.
the researcher.
and student permit holders. Aside from the sample size, the
Department.
RESEARCH INSTRUMENTS
system. There are two (2) sets of survey form, one for Users
& CDC Traffic and Safety department officers, and one for IT
professionals.
conducted.
P = F * 100
---------
Where:
P = Percentage
F = Frequency
N = Total population
Σwx
WM = -----
ANGELES CAMPUS 27
Σw
Where:
WM = Weighted Mean
x = Number of respondents
Chapter III
RESULTS
DATA PRESENTATION
(Excellent).
information.
information.
the pop quiz, and 26.67% felt Very Good (Scale: 4) about it.
ANGELES CAMPUS 30
Professional drivers.
performance?
Table 2
CRITERIA RATING
Functionality 1 - The application is working
4.57
properly on android devices.
Functionality 2 - The application was able to
4.83
provide the desired road rules information.
Functionality 3 - The application allows users to
4.67
play the pop quiz game.
Functionality 4 - The application allows users to
4.77
register and log in.
Usability 1 - The application is easy to use. 4.83
professional drivers.
Total: 4.78
drivers and non-drivers was used. The table below lists the
Table 3
officers
CRITERIA RATING
Functionality 1 - The application is working
5.00
properly on android devices.
Functionality 2 - The application was able to
4.33
provide the desired road rules information.
Functionality 3 - The application allows users to
4.83
play the pop quiz game.
Functionality 4 - The application allows users to
4.83
register and log in.
Usability 1 - The application is easy to use. 5.00
professional drivers.
Total: 4.87
ANGELES CAMPUS 38
IT Professionals Evaluation
Assurance.
The table below will provide the overall rating for each
Table 4
CRITERIA RATING
FUNCTIONAL SUITABILITY - Functional Completeness -
3.4
Functionality covers the required tasks
FUNCTIONAL SUITABILITY - Functional Correctness - 3.6
ANGELES CAMPUS 39
objectives
PERFORMANCE EFFICIENCY - Time Behavior - Response and
specific functionality
PERFORMANCE EFFICIENCY - Resource Utilization -
the user
PERFORMANCE EFFICIENCY - Capacity – Limitations like
the system
ANGELES CAMPUS 40
or software faults
RELIABILITY - Recoverability - In the event of an
state
ANGELES CAMPUS 41
data
MAINTAINABILITY - Modularity – System failure of one
computer program
MAINTAINABILITY - Reusability – Data from another
part of the system are easily shared with other units 3.4
or entities
MAINTAINABILITY - Analyzability – Errors or failures
environment
PORTABILITY - Replaceability – System can replace
environment
Total 3.73
Chapter IV
DISCUSSIONS
SUMMARY
driver, and CDC Traffic & Safety officer (See Appendix C),
and signage. As per Mr. Laus, the CDC Traffic & Safety
and markings.
needs.
Figure 3.4.1).
ANGELES CAMPUS 45
(Scale: 4).
CONCLUSIONS
the following:
and regulations.
ANGELES CAMPUS 48
environment.
RECOMMENDATIONS
message the CDC Office and Admin staff for any traffic and
REFERENCES
https://www.huffingtonpost.com/darcy-brishon-
carter/technological-advancement_1_b_8974544.html
http://www.klientsolutech.com/examples-of-how-technology-
has-changed-our-lives/
https://www.zonealarm.com/blog/2015/02/the-advantages-and-
disadvantages-of-the-internet/
ANGELES CAMPUS 51
from https://www.techwalla.com/articles/importance-of-
mobile-phones
https://www.statista.com/statistics/330695/number-of-
smartphone-users-worldwide/
spend-85-of-time-on-smartphones-in-apps-but-only-5-apps-see-
heavy-use/
powered-cars-4066248
https://www.onlineautodealered.com/blog/Current-trends-in-
electric-cars
https://www.dailymail.co.uk/sciencetech/article-
3385856/What-difference-century-makes-Maps-reveal-long-
takes-travel-world-1914-2016.html
to-become-a-better-driver-1596820145
https://opinion.inquirer.net/68089/most-filipino-drivers-
dont-have-needed-knowledge-on-driving
https://www.wheninmanila.com/13-filipino-driving-habits-
that-drive-everyone-crazy/
https://www.topgear.com.ph/features/feature-articles/simple-
traffic-rules-filipinos-forget-to-follow-a00013-20171121
Philippines
https://www.rappler.com/move-ph/issues/road-safety/166151-
road-crashes-philippines-awareness-safety
in Metro Manila
https://www.rappler.com/move-ph/issues/road-safety/165556-
road-crashes-causes-metro-manila-human-error
https://newsinfo.inquirer.net/1041442/did-you-know-66030-
road-accidents-recorded-in-metro-manila
motorcycle riders
https://news.abs-cbn.com/news/05/22/18/pnp-hpg-eyes-
mandatory-training-for-motorcycle-riders
for 2018
https://www.teensafe.com/distracted-driving/100-distracted-
driving-facts-and-statistics-2018/
Problem
https://www.dmv.org/distracted-driving.php#The-Extent-of-
the-Problem
ANGELES CAMPUS 55
https://www.safekids.org/press-release/number-one-killer-
teens-motor-vehicle-crashes
Factors
http://dx.doi.org/10.7708/ijtte.2013.3(2).06
http://engineeringjournal.info/index.php/AJIRSET/article/vie
w/27/24
on Android System
https://doi.org/10.1016/j.sbspro.2015.04.559
ANGELES CAMPUS 56
Ticketing System
https://pdfs.semanticscholar.org/06d2/677683c8d7ec6a79db3318
216207e29cb430.pdf?_ga=2.216963477.2098397634.1579533040-
1359842089.1579533040
Research?
https://www.sisinternational.com/what-is-qualitative-
research/
https://research-methodology.net/research-
methods/qualitative-research/interviews/
https://whatis.techtarget.com/definition/survey-research
https://explorable.com/convenience-sampling
ANGELES CAMPUS 58
Appendix A
Cover Letter
ANGELES CAMPUS 59
Appendix B
Interview Guide
Occupation: _________________
Questionnaire:
ongoing issue?
Appendix C
Interview Transcript
Driver: I’m Felman Besa, and I’m a PUJ driver, driving under
2nd year BSIT student. It’s nice to meet you sir. By the
Researcher: Oh, sorry to hear that sir, can you tell us what
happened?
to our question sir, our 2nd question is, what do you think
vehicular accidents?
Driver: Well, because there are drivers who only learned how
only that, there are drivers, who does not follow rules, and
driving?
Driver: Well for one, like I told you, a lot of drivers are
lot of them that does not know the road rules, or even the
pavement markings! You see these are the reasons why there
rules.
the case, what do you think the best way to solve this
ongoing issue?
that this study and the proposed system will be useful and
drivers who are going in and out of clark. Anyway sir, thank
Driver: No problem!
Interview Transcript
regulation?
rest of our group. If you don’t mind, may I know your name
sir?
Aspiring Driver: Oh no, I have not, and I’m planning not to.
Researcher: That’s great. But I’m sure that you are aware
Aspiring Driver: Honestly, I’m not too sure. But from what I
Researcher: For our last question sir, do you think that our
too.
Interview Transcript
regulations.
Researcher: Thank you sir. By the way, I’m Kelvin, and the
It’s not that hard to get a vehicle now. Most of the time,
from that, drivers are only being aware of some of the rules
ANGELES CAMPUS 68
what do you think may be the best way to solve this ongoing
defensive driver.
Appendix D
Data Dictionary
Devices system.
a program or software that is designed and
user.
a non-probability sampling technique where
researcher.
ANGELES CAMPUS 70
devices.
Non-probability sampling is a sampling
selected.
is an act or an instance of notifying, or
Notification
alerting someone.
is the condition of being capable of but
hypotheses.
are also known as traffic rules. Are rules or
vehicles.
Search the act of looking, or to find something.
are a class of mobile phones and of multi-
messaging.
is a collection of elements or components that
System
are organized for a common purpose.
is the collection
Technology
of techniques, skills, methods,
ANGELES CAMPUS 72
investigation.
is a person who utilizes a computer, mobile
Users
application, or network service
Vehicles is a machine that transports people or cargo
Appendix E
Survey Questionnaire
__________________________________________
Signature over Printed Name
Appendix F
Evaluation Tool for User Acceptability
(Adapted from ISO 25010)
CDC: ROAD RULES!
Name: ________________________________
Occupation: __________________________
QUESTIONNAIRE
Please indicate a check mark (√) under the column that best describes your
responses for each item about the CDC: Road Rules android application.
FUNCTIONAL SUITABILITY:
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Functional Completeness -
1 Functionality covers the
required tasks
Functional Correctness -
System provides the
2
appropriate results with
accuracy
Functional Appropriateness –
System functions accomplishes
3
the desired tasks and
objectives
PERFORMANCE EFFICIENCY:
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Time Behavior - Response and
processing time is at acceptable
1
rate when performing specific
functionality
Resource Utilization - Amounts
and types of resources used by
2 the system, when performing its
functions, meet requirements of
the user
3 Capacity – Limitations like
ANGELES CAMPUS 75
COMPATIBILITY:
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Co-existence – The system
performs its required functions
efficiently while sharing a
1 common environment and
resources with other products,
without detrimental impact on
any other product
Interoperability – System
works well when exchanging
2
information with different
units of the organization
USABILITY:
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Appropriateness
Recognizability – Usefulness of
the software/hardware to the
1
intended users. Presence of
the basic or expected functions
of the system
Learnability – Use of the
2 system is easily learned by the
intended users
Operability – Functions of
3 system are designed to be
easily adaptable for users
User Error Protection - System
4 protects users against making
errors
User Interface Aesthetics –
User interface like its colors
5 and icons enables pleasing and
satisfying interaction for the
users
Accessibility – System can be
used by people with the widest
range of characteristics and
6
capabilities to achieve a
specified goal in a specified
context of use.
RELIABILITY:
ANGELES CAMPUS 76
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Maturity – System component
1 meet the needs for reliability
under normal operation
Availability – System
component is operational and
2
accessible when required for
use
Fault Tolerance – System
component operates as
3
intended despite the presence
of hardware or software faults
Recoverability - In the event of
an interruption or a failure, the
4 system can recover the data
directly affected and re-
establish its normal state
SECURITY:
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Confidentiality – System
ensures that data are
1
accessible only to those
authorized users
Integrity – System prevents
unauthorized access to, or
2
modification of, computer
programs or data
MAINTAINABILITY:
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Modularity – System failure of
one component has minimal
1
impact to another part of the
computer program
Reusability – Data from
another part of the system are
2
easily shared with other units
or entities
Analyzability – Errors or
failures of the system is easily
3 diagnosed and mechanism to
determine cause of failures are
easily identified.
4 Modifiability – System can be
effectively and efficiently
modified without introducing
defects or degrading existing
ANGELES CAMPUS 77
quality
Testability – Effectiveness and
efficiency with which test
criteria can be established for
5 the system and tests can be
performed to determine
whether those criteria have
been met
PORTABILITY:
1– 2– 3– 4– 5–
Questions
Poor Fair Satisfactory Very Good Excellent
Adaptability – Appropriate
interface for novice/ new user.
Appropriate interface for the
1 user’s device display or screen.
System was designed to
perform even in mobile
devices.
Installability – Effectiveness
and efficiency with which the
2 system can be successfully
installed and/or uninstalled in
a specified environment
Replaceability – System can
replace another software for
3
the same purpose in the same
environment
______________________________________________
Signature over Printed Name
Appendix G
List of Violations and Updated Fees
ANGELES CAMPUS 78
colored windshield
22 Without permanent tail gate w/ 500 5,000 6,500
inscription "Not for Hire" sign
in a Private jeepney / jitney
23 Use / installation of a 500 5,000 6,500
glaring / stainless object at
the front and rear of a MV
D WEIGHTS AND LOAD LIMITS CDC LTO Revised
1 Load extending beyond the 500 1,000 1,300
projected width without permit
2 Axle overloading - an amount 300 1,000 1,300
equivalent to 25% of MVUC at the
time of infringement on owner /
operator or driver of trucks and
trailers for loading beyond
their registered gross weight,
vehicle weight. No MV shall
exceed 13,500 kgs. or vehicle
load exceeds150% of the maximum
allowable gross weight
3 Operating a passenger truck 300 1,000 1,300
(Bus) with cargo excess 160kgs
4 Allowing more passengers and or 300 1,000 1,300
freight or cargo in excess of
carrying capacity of motor
vehicle
5 Baggage or Freight carried on 300 1,000 1,300
top of truck exceeds 20 kgs. per
sg. meter and not distributed in
such a manner as not to endanger
the Passenger stability of the
truck
E PROHIBITED OR ILLEGAL OPERATION CDC LTO Revised
OF MOTOR VEHICLES
1 Colorum and Out of Line
Violation - a MV is considered
operating as colorum under any
of the following circumstances.
a) A Private MV operating as a
PUV but w/out proper authority
from the LTFRB.
A PUV operating outside of its
approved route w/out a prior
permit from the
Board
ANGELES CAMPUS 82
prohibited cargoes
1st Offense 500 5,000 6,500
2nd Offense 10,000 13,000
3rd Offense 15,000 19,500
81 Trip Cutting (PUJ, PUB, UV) 1,000 5,000 6,500
1st Offense 5,000 6,500
2nd Offense 10,000 13000
3rd Offense 15,000 19,500
82 Littering 150 - 1,300
83 Improper Attire (wearing 500 1,000 1,300
slippers/Flip-Flops/Sandals) for
hire vehicles & MC
84 Violation of color scheme, 500 5,000 6,500
adaptation of MV, color or
design without authority.
85 Old meter seal / or loose 500 5,000 6,500
triplex seal.
86 Flagged up meter and / or 750 5,000 6,500
operating on contractual basis
87 No taxi meter 1,200 5,000 6,500
88 Failure to paint the word 750 750 975
Äircon"
89 No Identification Card 150 150 195
90 Failure to provide top lights 200 200 260
indicating availability
91 Failure to print owner / 500 5,000 6,500
operator's name, address and /
or capacity markings, type of
service on taxi units
92 Unauthorized installation of 750 750 1,300
Aircon on buses.
93 Non-painting of the word aircon 750 750 1,300
for buses
94 Operating a right-hand drive 50,000 50,000 65,000
Motor Vehicle
95 Failure to install Seatbelt as 1,000 3,000 3,900
defined under R A 8750
96 Failure to wear seatbelt &
Allowing child six years old and
below to be seated on the front
passenger seat
1st Offense 250 1,000 1,300
2nd Offense 2,000 2,600
3rd Offense 5,000 6,500
97 Failure to require his/her 1,000 3,000 3,900
ANGELES CAMPUS 93
Appendix H
User Manual
First Look
ANGELES CAMPUS 96
Lets get started! We’ll guide you how to use and tell you a
bit about the application’s features.
Registration Page
Freeport Zone.
ANGELES CAMPUS 98
Rules Page
Event Logs
C.D.C
Information Page
Appendix I
Appendix J
Appendix K
Sample Code
<!--
HTML5 shim and Respond.js for IE8 support of HTML5
elements and media queries
-->
<!-- WARNING: Respond.js doesn't work if you view the page
via file:// -->
<!--[if lt IE 9]>
<script
src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js
"></script>
<script
src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></
script>
<![endif]-->
</head>
</head>
<body class="login-bg" id="body">
<div class="container d-flex flex-column justify-
content-between vh-100">
<div class="row justify-content-center mt-5">
<div class="col-xl-5 col-lg-6 col-md-10">
<div id="login">
<transition appear name="slide-fade">
<div class="login-card">
<div style="text-align: center;"class="card-body
p-5">
<img style="width: 75%;" src="media/CDC
Logo.png">
<h2 class="text-white my-4">Login</h2>
<transition name="fade">
<div class="login-alert"></div>
ANGELES CAMPUS 107
</transition>
<form>
<div class="row">
<div class="form-group col-md-12 mb-4">
<input id="user" type="text"
class="form-control input-lg" aria-describedby="emailHelp"
placeholder="Username">
</div>
<div class="form-group col-md-12 ">
<input id="pass" type="password"
class="form-control input-lg" placeholder="Password">
</div>
<div class="col-md-12">
<input onclick="LoginUser(event)"
type="submit" class="btn btn-lg btn-primary btn-block mb-4"
value="Login">
</div>
</div>
</form>
</div>
</div>
</transition>
</div>
</div>
</div>
</div>
</body>
</html>
<script>
function LoginUser(event)
{
ANGELES CAMPUS 108
event.preventDefault();
var user = document.getElementById('user').value;
var pass = document.getElementById('pass').value;
axios.post('sql/login.php',{
user: user,
pass: pass
})
.then((response) => {
console.log(response.data);
switch(response.data)
{
case 0:
var html = `<div
class="alert alert-danger alert-highlighted" role="alert">
Error! Wrong Password!
</div>`;
$('.login-
alert').html(html);
break;
case 2:
window.location.href =
'admin/index.php';
break;
case 3:
var html = `<div
class="alert alert-danger alert-highlighted" role="alert">
Error! Username not found!
</div>`;
$('.login-
alert').html(html);
ANGELES CAMPUS 109
break;
}
})
}
</script>
<?php
require_once("../sql/handler.php");
require_once("../functions.php");
session_start();
if(!isset($_SESSION['id']))
{
header("Location: ../index.php");
}
else
{
$sql = $handler->prepare('SELECT * FROM accounts WHERE
acc_id = ?');
$sql->execute(array($_SESSION['id']));
$row = $sql->fetch(PDO::FETCH_OBJ);
}
$ui = new MainInterface("Dashboard");
?>
<script src="../assets/vue.js"></script>
<script src="../assets/vue-router.js"></script>
<script src="../assets/moment.js"></script>
<script src="../assets/axios.min.js"></script>
<!-- Vue Js Views -->
<script src="./views/dashboard.js"></script>
<script src="./views/enforcers.js"></script>
<script src="./views/drivers.js"></script>
ANGELES CAMPUS 110
<script src="./views/admins.js"></script>
<script src="./views/violation_records.js"></script>
<script src="./views/announcements.js"></script>
<script src="./views/violationlist.js"></script>
<!-- Vue Js Views -->
<!-- Vue Js Components -->
<script src="./components/menu.js"></script>
<script src="./components/dashboard.js"></script>
<script src="./components/notifications.js"></script>
<script src="./components/profile-card.js"></script>
<script src="./components/profile.js"></script>
<script src="./components/account.js"></script>
<!-- Vue Js Components -->
<div class="page-wrapper">
<div id="app">
<menu-header username="<?php echo $row->username; ?>" id="<?
php echo $_SESSION['info']; ?>"></menu-header>
<main-menu></main-menu>
<div class="content-wrapper">
<div class="content">
<transition appear mode="out-in" name="sf-left">
<router-view></router-view>
</transition>
</div>
</div>
</div>
<script>
Vue.use(VueRouter);
const routes = [{
ANGELES CAMPUS 111
path: '/',
component: home
},
{
path: '/enforcers',
component: enflist
},
{
path: '/add-enforcer',
component: addEnforcer
},
{
path: '/drivers',
component: driverlist
},
{
path: '/admins',
component: adminlist
},
{
path: '/add-admin',
component: addAdmin
},
{
path: '/edit-enf:eid',
component: editEnforcer,
props: true
},
{
path: '/dprofile:id',
component: profile,
ANGELES CAMPUS 112
props: true
},
{
path: '/announcements',
component: announcements
},
{
path: '/new-post',
component: newAnn
},
{
path: '/violations',
component: violationList
},
{
path: '/new-violation',
component: newViolation
},
{
path: '/vrecords',
component: vrecords
},
{
path: '/ann-details:id',
component: annDetails,
props: true
}
]
})
var app = new Vue({
el: '#app',
watch: {},
data: {
},
methods: {},
router
})
</script>
<?php
$ui->end_page();
?>
Login.php
<?php
require_once("handler.php");
//THIS IS USED BY BOTH WEB AND MOBILE APPLICATIONS.
//MOBILE APPLICATION LOGIN
if(isset($_POST['user']))
{
$user = $_POST['user'];
$pass = $_POST['pass'];
$datenow = date("Y-m-d h-i-s");
$hash = $info->password;
$type = $info->acc_info;
else
{
$sql = $handler->prepare("UPDATE accounts SET last_login = ?
WHERE username = ?");
$sql->execute(array($datenow,
$user));
echo 'E1';
}
}
else if($count != 1)
{
echo 'Invalid Password.';
}
else
{
echo 'Employee not found.';
}
die();
}
else
{
//Gets username, password and info as driver via username.
$sql = $handler->prepare("SELECT * FROM accounts
INNER JOIN drivers ON CONCAT('D-', drivers.d_id) =
accounts.acc_info WHERE username = ?");
$sql->execute(array($user));
$count = $sql->rowCount();
//Checks if the account exists under driver.
if($count == 1)
ANGELES CAMPUS 116
{
$info = $sql->fetch(PDO::FETCH_OBJ);
$hash = $info->password;
$type = $info->acc_info;
//If the credentials entered matches any of the email and
passwords in the accounts table, it will log in.
if($user == $info->username && password_verify($pass,
$hash))
{
//Checks if this is the user's first time logging in.
Directs the user to replace temp password.
if($info->last_login == '0000-00-00 00:00:00')
{
echo 0;
}
else
{
$sql = $handler-
>prepare("UPDATE accounts SET last_login = ? WHERE username
= ?");
$sql->execute(array($datenow,
$user));
echo 'D1';
}
}
else if($count != 1)
{
echo 'Invalid Password.';
}
ANGELES CAMPUS 117
else
{
echo 'Driver not found.';
}
die();
}
}
}
//Checks the employee's table if the username input is
actually an employee ID.
else
{
//Gets username, password and info as employee via employee
ID.
$sql = $handler->prepare("SELECT * FROM accounts INNER JOIN
employees emp ON CONCAT('E-', emp.emp_info) =
accounts.acc_info WHERE emp_id = ?");
$sql->execute(array($user));
$count = $sql->rowCount();
{
//Checks if this is the user's first time logging in.
Directs the user to replace temp password.
if($info->last_login == '0000-00-00 00:00:00')
{
echo 0;
}
else
{
$sql = $handler->prepare("UPDATE accounts SET last_login = ?
WHERE username = ?");
$sql->execute(array($datenow, $user));
echo 'E1';
}
}
else if($count != 1)
{
echo 'Invalid Password.';
}
else
{
echo 'Employee not found.';
}
die();
}
else
{
echo 'Employee/Driver account not found!';
}
}
ANGELES CAMPUS 119
if($info->last_login == '0000-00-00
00:00:00')
{
$sql = $handler->prepare("UPDATE
accounts SET last_login = ? WHERE username = ?");
$sql->execute(array($datenow, $user));
echo 1;
}
else
{
$sql = $handler->prepare("UPDATE
accounts SET last_login = ? WHERE username = ?");
$sql->execute(array($datenow, $user));
echo 2;
}
}
else if($count != 1)
{
echo 3;
}
else
{
echo 0;
}
die();
}
?>
News_handle.php
<?php
require_once('handler.php');
require_once('../functions.php');
ANGELES CAMPUS 121
session_start();
switch($fun)
{
case 1:
$sql = $handler->prepare('INSERT INTO news(n_type,
n_title, n_body, n_admin) VALUES(?,?,?,?)');
//$sql->execute(array($data['type'], $data['title'],
$data['text'], $_SESSION['acc_id']));
$sql->execute(array($_POST['type'], $_POST['title'],
$_POST['text'], $_SESSION['id']));
if(isset($_FILES['image']))
{
$file = new File();
$file->upload_photo($_FILES['image']['name'],
$_FILES['image']['tmp_name'], $_FILES['image']['size'],
$_SESSION['id'], 3);
ANGELES CAMPUS 122
case 2:
$id = $data['id'];
$db->delete_row('news', 'n_id', $id);
$output = 'Row has beeen deleted.';
break;
}
echo $output;
?>
Notifications_handler.php
<?php
require_once('../init.php');
require(ROOT_DIR . '/sql/handler.php');
include(ROOT_DIR . '/functions.php');
require_once('../init.php');
require_once(ROOT_DIR . '/sql/handler.php');
require_once(ROOT_DIR . '/functions.php');
$pass = $_POST['cnew-pass'];
$confirm_pass = $_POST['new-pass'];
if (isset($_POST ['set-pass'])) {
?>
Ticket_handler.php
<?php
require_once('handler.php');
require_once('../init.php');
include(ROOT_DIR . '/functions.php');
$licenseCheck = $_POST['license'];
//$licenseCheck = 125;
$db = new Database();
$sql = $handler->prepare('SELECT * FROM drivers WHERE
d_license = ?');
//$sql->execute(array($_POST['license']));
$sql->execute(array($licenseCheck));
if($row = $sql->fetch(PDO::FETCH_OBJ))
{
//Driver's index number in Database.
$id = $row->d_id;
$row = $sql->fetch(PDO::FETCH_OBJ);
$violation = $row->v_id;
$officer = 1;
//Inserts the record into the database.
$sql = $handler->prepare('INSERT INTO
violation_records(v_driver, v_violation, v_officer)
VALUES(?,?,?)');
$sql->execute(array($id, $violation, $officer));
//Gets the latest record entry.
$last_entry = $db->get_latest_row_entry('record_id',
'violation_records');
//Gets the violation fee from record.
$sql = $handler->prepare('SELECT * FROM
violation_records INNER JOIN violations ON violations.v_id =
violation_records.v_violation WHERE record_id = ?');
$sql->execute(array($last_entry));
$row = $sql->fetch(PDO::FETCH_OBJ);
$note = new WebNotification();
$note->createNotification(1, 'A');
//Packs the ticket number and violation fee into a
Json Object to be sent back to the mobile app.
$data = new \stdClass();
$data->ticket = $last_entry;
$data->fee = $row->v_fee;
$jsonData = json_encode($data);
echo $jsonData;
}
else
{
$officer = 1;
ANGELES CAMPUS 126
require(ROOT_DIR . '/sql/handler.php');
include(ROOT_DIR . '/functions.php');
//session_start();
$type = $_POST['type'];
?>
Account.js
function createAccount(event, type)
{
event.preventDefault();
switch(type)
{
case 1:
var fname = document.getElementById('fname').value
var mname = document.getElementById('mname').value
ANGELES CAMPUS 128
}
}
Dashboard.js
var latestDrivers = Vue.component('latest-drivers', {
data()
{
return{
drivers: []
}
},
methods:
{
getDate: function(date)
{
return moment(date, 'YYYY-MM-DD
H:m:s').format('DD/MM/YY H:mmA');
}
},
created()
{
axios.post('../sql/get_data.php',{
type: 2
})
.then((response) => {
this.drivers = response.data;
console.log(this.drivers);
})
},
template:
ANGELES CAMPUS 130
<td>
<div class="media">
<div class="media-image mr-3
rounded-circle">
<router-link v-if="driver.image"
v-bind:to="'/drivers/profile:' + driver.acc_info"><img
class="rounded-circle w-45" v-
bind:src="'..uploads/photos/drivers/' + image" alt="customer
image"></router-link>
<router-link v-else v-
bind:to="'/drivers/profile:' + driver.acc_info"><img
class="rounded-circle w-45" src="../assets/img/user/Driver-
Profile.jpg" alt="customer image"></router-link>
</div>
<div class="media-body align-self-
center">
<router-link v-
bind:to="'/drivers/profile:' + driver.acc_info">
<h6 class="mt-0 text-dark
font-weight-medium">{{ driver.d_name }}</h6>
</router-link>
<small>License No.:
{{ driver.d_license }}</small>
</div>
</div>
</td>
<td>Last Login on
{{ getDate(driver.last_login) }}</td>
</tr>
</tbody>
</table>
ANGELES CAMPUS 132
</div>
</div>`
})
this.users = response.data;
console.log(this.users);
})
},
template:
`<div class="col-md-6 col-lg-6 col-xl-4">
<div class="card widget-block p-4 rounded bg-primary
border">
<div class="card-block">
<i class="mdi mdi-account-outline mr-4 text-
white"></i>
ANGELES CAMPUS 133
<a class="sidenav-item-link"
href="javascript:void(0)" data-toggle="collapse" data-
target="#dashboard" aria-expanded="false" aria-
controls="dashboard">
<i class="mdi mdi-view-dashboard-
outline"></i>
<span class="nav-text">Dashboard</span> <b
class="caret"></b>
</a>
<ul class="collapse show" id="dashboard" data-
parent="#dashboard">
<div class="sub-menu">
<li>
<router-link to="/">Home</router-
link>
</li>
</div>
</ul>
</li>
<li class="has-sub">
<a class="sidenav-item-link"
href="javascript:void(0)" data-toggle="collapse" data-
target="#enforcers" aria-expanded="false" aria-
controls="enforcers">
<i class="mdi mdi-folder-multiple-
outline"></i>
<span class="nav-text">Employees</span> <b
class="caret"></b>
</a>
ANGELES CAMPUS 136
<li>
<router-link to="/vrecords">Violation
Records</router-link>
</li>
</div>
</ul>
</li>
<li class="has-sub">
<a class="sidenav-item-link"
href="javascript:void(0)" data-toggle="collapse" data-
target="#settings" aria-expanded="false" aria-
controls="drivers">
<i class="mdi mdi-folder-multiple-
outline"></i>
<span class="nav-text">Admin</span> <b
class="caret"></b>
</a>
<ul class="collapse" id="settings" data-
parent="#settings">
<div class="sub-menu">
<li>
<router-link to="announcements">News &
Announcements</router-link>
</li>
<li>
<router-link to="new-post">New Post</router-
link>
</li>
<li>
ANGELES CAMPUS 138
</aside>
`
})
var header = Vue.component("menu-header", {
ANGELES CAMPUS 139
props:
[
'id',
'username'
],
template:
`<header class="main-header " id="header">
<nav class="navbar navbar-static-top navbar-expand-lg">
<!-- Sidebar toggle button -->
<button id="sidebar-toggler" class="sidebar-toggle">
<span class="sr-only">Toggle navigation</span>
</button>
<!-- search form -->
<div class="search-form d-none d-lg-inline-block">
<div class="input-group">
</div>
</div>
</div>
notes: []
}
},
created()
{
axios.post('../sql/notifications_handler.php',{
id: this.id
})
.then((response) => {
this.notes = response.data;
console.log(response.data);
})
},
template: `
<ul class="dropdown-menu dropdown-menu-right">
<li v-if="notes.length > 1" class="dropdown-
header">You have {{ notes.length }} notifications</li>
<li v-else class="dropdown-header">You have
{{ notes.length }} notification</li>
<li v-for="i in notes">
<a v-if="i.note_type == 1" href="#">
<i class="mdi mdi-account-plus"></i> New
Violation Record
<span class=" font-size-12 d-inline-block
float-right"><i class="mdi mdi-clock-outline"></i> 10
AM</span>
</a>
</li>
</ul>`
}
)
ANGELES CAMPUS 142
Profile.js
var profile = Vue.component("profile", {
props:
['id'],
created()
{
axios.post('../sql/data_handler.php',{
type: 5,
id: this.$route.params.id
})
.then((response) => {
this.name = response.data.d_name;
this.image = response.data.file_name;
this.license = response.data.d_license;
this.contact = response.data.d_contact_no;
this.dob = response.data.d_dob;
//console.log('Profile Info: ' + response.data);
})
//Gets violation list.
axios.post('../sql/data_handler.php',
{
type: 2,
id: this.$route.params.id
})
.then((response) =>{
this.vio = response.data;
console.log('Violations: ' + response.data);
console.log('Found ' + this.vio);
})
},
ANGELES CAMPUS 143
data()
{
return{
name: null,
image: null,
license: null,
contact: null,
dob: null,
vio: null
}
},
methods:
{
},
template:
`<transition appear name="sf-left" mode="in-out">
<div class="bg-white border rounded">
<div class="row no-gutters">
<div class="col-lg-4 col-xl-3">
<div class="profile-content-left pt-5 pb-3 px-3 px-
xl-5">
<div class="card text-center widget-profile px-0
border-0">
<div class="card-img mx-auto rounded-circle">
<img v-if="image" style="width: 100%" v-
bind:src="'../uploads/photos/drivers/' + image" alt="user
image">
<img v-else style="width: 100%"
src="../assets/img/user/u6.jpg" alt="user image">
</div>
<div class="card-body">
ANGELES CAMPUS 144
</li>
<li class="nav-item">
<a class="nav-link" id="settings-tab" data-
toggle="tab" href="#settings" role="tab" aria-
controls="settings" aria-selected="false">Settings</a>
</li>
</ul>
<div class="tab-content px-3 px-xl-5"
id="myTabContent">
<div class="tab-pane fade show active"
id="timeline" role="tabpanel" aria-labelledby="timeline-
tab">
<div class="media mt-5 profile-timeline-media">
<v-entry v-for="i in vio" v-
bind:id="i.record_id" v-bind:status="i.v_status" v-
bind:name="i.v_name" v-bind:issuer="i.emp_fname + ' ' +
i.emp_mname + '. ' + i.emp_lname" v-
bind:timestamp="i.record_timestamp"></v-entry>
</div>
</div>
<div class="tab-pane fade" id="settings" role="tabpanel"
aria-labelledby="settings-tab">...</div>
<div class="tab-pane fade" id="settings" role="tabpanel"
aria-labelledby="settings-tab">...</div>
</div>
</div>
</div>
</div>
</div>
</transition>`
})
ANGELES CAMPUS 146
</div>
})
ANGELES CAMPUS 149
Appendix L
Answered Surveys and Evaluation Forms
ANGELES CAMPUS 150
Appendix M
Curriculum Vitae