jslightham/MEVN-Attendance-Tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix all present bug and remove console.log

Browse Source
This commit is contained in:
jslightham
2020-04-15 09:54:30 -04:00
parent 93956f9ab5
commit 3a03688e6a
8 changed files with 209 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
attendancetracker/API/attendance.route.js
View File

@@ -17,7 +17,7 @@ let Att = require('./attendee.model');
attendanceRoute.route('/attendees').post(function (req, res) { attendanceRoute.route('/attendees').post(function (req, res) {
let username = req.body.user; let username = req.body.user;
console.log(username) //console.log(username)
Att.find({user: username}, function (err, posts){ Att.find({user: username}, function (err, posts){
if(err) { if(err) {
res.json(err); res.json(err);
@@ -29,7 +29,7 @@ let Att = require('./attendee.model');
attendanceRoute.route('/getById').post(function (req, res) { attendanceRoute.route('/getById').post(function (req, res) {
let username = req.body.user; let username = req.body.user;
console.log(username) //console.log(username)
Att.find({user: username}, function (err, posts){ Att.find({user: username}, function (err, posts){
if(err) { if(err) {
res.json(err); res.json(err);

23
attendancetracker/API/login.route.js
View File

@@ -4,15 +4,15 @@ const loginRoute = express.Router();
let LInfo = require('./user.model'); let LInfo = require('./user.model');
loginRoute.route('/add').post(function (req, res) { loginRoute.route('/add').post(function (req, res) {
console.log(req.body); //console.log(req.body);
var username = req.body.user; var username = req.body.user;
LInfo.findOne({user: username}, LInfo.findOne({user: username},
function(err, user){ function(err, user){
console.log(user); //console.log(user);
if(user == null){ if(user == null){
let post = new LInfo(req.body); let post = new LInfo(req.body);
post.dates = []; post.dates = [];
console.log(post); //console.log(post);
post.save() post.save()
.then(() => { .then(() => {
res.status(200).send("Account added successfully"); res.status(200).send("Account added successfully");
@@ -23,7 +23,7 @@ loginRoute.route('/add').post(function (req, res) {
} }
else { else {
res.json(user); res.json(user);
console.log("user"); //console.log("user");
} }
}); });
}); });
@@ -33,18 +33,18 @@ loginRoute.route('/post').post(function (req, res) {
//console.log(res); //console.log(res);
var username = req.body.user; var username = req.body.user;
var password = req.body.pass; var password = req.body.pass;
console.log(username); //console.log(username);
console.log(password); //console.log(password);
LInfo.findOne({user: username, pass: password}, LInfo.findOne({user: username, pass: password},
function(err, user){ function(err, user){
console.log(user); //console.log(user);
if(!user){ if(!user){
res.json(null); res.json(null);
console.log("err"); //console.log("err");
} }
else { else {
res.json(user); res.json(user);
console.log("user"); //console.log("user");
} }
}); });
}); });
@@ -65,7 +65,7 @@ loginRoute.route('/post').post(function (req, res) {
var username = req.body.user; var username = req.body.user;
var dates = req.body.dates; var dates = req.body.dates;
Att.findOne({user: username}, function(err, post) { LInfo.findOne({user: username}, function(err, post) {
if (!post) if (!post)
res.status(404).send("data is not found"); res.status(404).send("data is not found");
else { else {
@@ -80,4 +80,7 @@ loginRoute.route('/post').post(function (req, res) {
} }
}); });
}); });
module.exports = loginRoute; module.exports = loginRoute;

134
attendancetracker/src/components/Attendance.vue
View File

@@ -224,24 +224,16 @@
this.$router.push({name: 'login'}); this.$router.push({name: 'login'});
}else{ }else{
this.post.user = this.user; this.post.user = this.user;
//alert(this.post.user); let uri = 'http://localhost:4000/attendance/attendees';
let uri = 'http://65.92.152.100:4000/attendance/attendees';
this.axios.post(uri, this.post).then(res => { this.axios.post(uri, this.post).then(res => {
this.attendees = res.data; this.attendees = res.data;
//console.log(this.attendees);
for(var element of this.attendees){ for(var element of this.attendees){
//console.log(element);
if(element.presences.indexOf(this.$route.params.id) > -1){ if(element.presences.indexOf(this.$route.params.id) > -1){
this.presentNames.push(element._id); this.presentNames.push(element._id);
//document.getElementById(element + ":pcheckbox").style.backgroundColor = "green";
}else{ }else{
this.absentNames.push(element._id); this.absentNames.push(element._id);
//document.getElementById(element + ":acheckbox").style.backgroundColor = "red";
} }
} }
//console.log(this.presentNames);
}); });
} }
}, },
@@ -258,10 +250,7 @@
presentNames: [], presentNames: [],
checked: true, checked: true,
post: {}, post: {},
user: null, user: null
dismissSecs: 10,
dismissCountDown: 0,
showDismissibleAlert: false
} }
}, },
methods: { methods: {
@@ -273,86 +262,131 @@
//iterate through all present, then all absent, and get array of that id user, then check for the current day, if it contains delete, and append the date to the correct array //iterate through all present, then all absent, and get array of that id user, then check for the current day, if it contains delete, and append the date to the correct array
for(var element of this.presentNames){ for(var element of this.presentNames){
var test = {number: element}; var test = {number: element};
let uri = 'http://65.92.152.100:4000/attendance/getarr'; let uri = 'http://localhost:4000/attendance/getarr';
this.axios.post(uri, test).then(res => { this.axios.post(uri, test).then(res => {
var arr = res.data.presences; var arr = res.data.presences;
arr = arr.filter(e => e !== this.$route.params.id); arr = arr.filter(e => e !== this.$route.params.id);
//console.log(arr);
var arr2 = res.data.absenses; var arr2 = res.data.absenses;
arr2 = arr2.filter(e => e !== this.$route.params.id); arr2 = arr2.filter(e => e !== this.$route.params.id);
//console.log(arr2);
arr.push(this.$route.params.id); arr.push(this.$route.params.id);
this.post.presences = arr; this.post.presences = arr;
this.post.absenses = arr2; this.post.absenses = arr2;
//console.log(res.data._id);
var test2 = {id: res.data._id, presences: arr, absenses: arr2};
//console.log(test2);
let url = 'http://65.92.152.100:4000/attendance/post';
this.axios.post(url, test2).then(res => {
console.log(res);
/*
var ldata = {user: this.user};
let url2 = 'http://65.92.152.100:4000/login/getdates';
this.axios.post(url2, ldata).then(res => {
console.log(res.data);
var arrd = res.data.dates;
arrd = arrd.filter(e => e !== this.$route.params.id, this.date);
var ddata = {dates: arrd, user: this.user};
arrd.push(ddata);
console.log(arrd);
let url3 = 'http://65.92.152.100:4000/login/update'; var test2 = {id: res.data._id, presences: arr, absenses: arr2};
this.axios.post(url3, ddata).then(res => {
let url = 'http://localhost:4000/attendance/post';
this.axios.post(url, test2).then(res => {
console.log("Arr: " + res);
// start of user updating
var ldata = {user: this.user};
let url2 = 'http://localhost:4000/login/getdates';
this.axios.post(url2, ldata).then(res => {
//console.log(res.data);
var arrd = res.data.dates;
//arrd = arrd.filter(e => e !== this.$route.params.id, this.date);
for(var i = 0; i<arrd.length; i++){
if(arrd[i].date == this.$route.params.id){
arrd[i] = null;
}
}
arrd = arrd.filter(function (el) {
return el != null;
});
var ddata = {date: this.$route.params.id, numPresent: this.presentNames.length};
arrd.push(ddata);
//console.log(arrd);
var userPostData = {dates: arrd, user: this.user}
let url3 = 'http://localhost:4000/login/update';
this.axios.post(url3, userPostData).then(res => {
//console.log("URL 3");
console.log(res); console.log(res);
this.$router.push({name: 'calendar'});
}) })
}) })
*/
}) })
}) })
} }
//alert("hello");
if(this.absentNames.length != 0){
for(var element1 of this.absentNames){ //alert("absences")
for(var element1 of this.absentNames){
var test1 = {number: element1}; var test1 = {number: element1};
let uri1 = 'http://65.92.152.100:4000/attendance/getarr'; let uri1 = 'http://localhost:4000/attendance/getarr';
this.axios.post(uri1, test1).then(res => { this.axios.post(uri1, test1).then(res => {
var arrr = res.data.absenses; var arrr = res.data.absenses;
arrr = arrr.filter(e => e !== this.$route.params.id); arrr = arrr.filter(e => e !== this.$route.params.id);
//console.log(arrr);
var arrr2 = res.data.presences; var arrr2 = res.data.presences;
arrr2 = arrr2.filter(e => e !== this.$route.params.id); arrr2 = arrr2.filter(e => e !== this.$route.params.id);
arrr.push(this.$route.params.id); arrr.push(this.$route.params.id);
this.post.absenses = arrr; this.post.absenses = arrr;
//console.log(res.data._id);
var testt2 = {id: res.data._id, presences: arrr2, absenses: arrr}; var testt2 = {id: res.data._id, presences: arrr2, absenses: arrr};
//console.log(test2);
let url1 = 'http://65.92.152.100:4000/attendance/post'; let url1 = 'http://localhost:4000/attendance/post';
this.axios.post(url1, testt2).then(res => { this.axios.post(url1, testt2).then(res => {
console.log(res); console.log("Arr2: " + res);
this.$router.push({name: 'calendar'});
}) })
}) })
}
// start of user updating
var ldata = {user: this.user};
let url2 = 'http://localhost:4000/login/getdates';
this.axios.post(url2, ldata).then(res => {
//console.log(res.data);
var arrd = res.data.dates;
//arrd = arrd.filter(e => e !== this.$route.params.id, this.date);
for(var i = 0; i<arrd.length; i++){
if(arrd[i].date == this.$route.params.id){
arrd[i] = null;
}
}
arrd = arrd.filter(function (el) {
return el != null;
});
var ddata = {date: this.$route.params.id, numPresent: this.presentNames.length};
arrd.push(ddata);
console.log(arrd);
var userPostData = {dates: arrd, user: this.user}
let url3 = 'http://localhost:4000/login/update';
this.axios.post(url3, userPostData).then(res => {
console.log("URL 3");
console.log(res);
this.$router.push({name: 'calendar'});
})
})
} }
}, },
test(input, type){ test(input, type){
var letter; var letter;
if(type == "a"){ if(type == "a"){
//alert(input);
//console.log(this.presentNames);
this.presentNames = this.presentNames.filter(e => e !== input); this.presentNames = this.presentNames.filter(e => e !== input);
//console.log(this.presentNames);
letter = "p"; letter = "p";
document.getElementById(input + ":acheckbox").style.backgroundColor = "red"; document.getElementById(input + ":acheckbox").style.backgroundColor = "red";
document.getElementById(input + ":pcheckbox").style.backgroundColor = "#6CD182"; document.getElementById(input + ":pcheckbox").style.backgroundColor = "#6CD182";

6
attendancetracker/src/components/Attendees.vue
View File

@@ -123,7 +123,7 @@ export default {
this.checkAccount(); this.checkAccount();
this.post.user = this.user; this.post.user = this.user;
//alert(this.post.user); //alert(this.post.user);
let uri = 'http://65.92.152.100:4000/attendance/attendees'; let uri = 'http://localhost:4000/attendance/attendees';
this.axios.post(uri, this.post).then(res => { this.axios.post(uri, this.post).then(res => {
this.attendees = res.data; this.attendees = res.data;
console.log(this.attendees); console.log(this.attendees);
@@ -152,7 +152,7 @@ export default {
del(id){ del(id){
this.post.id = id; this.post.id = id;
//alert(id); //alert(id);
let uri = 'http://65.92.152.100:4000/attendance/delete'; let uri = 'http://localhost:4000/attendance/delete';
this.axios.post(uri, this.post).then(() => { this.axios.post(uri, this.post).then(() => {
location.reload(); location.reload();
}); });
@@ -161,7 +161,7 @@ export default {
//alert(this.attendee.name); //alert(this.attendee.name);
this.attendee.user = this.user; this.attendee.user = this.user;
let uri = 'http://65.92.152.100:4000/attendance/add'; let uri = 'http://localhost:4000/attendance/add';
this.axios.post(uri, this.attendee).then(() => { this.axios.post(uri, this.attendee).then(() => {
location.reload(); location.reload();
}); });

106
attendancetracker/src/components/Calendar.vue
View File

@@ -34,12 +34,27 @@
</b-collapse> </b-collapse>
</b-navbar> </b-navbar>
</div> </div>
<center>
<h1>Attendance Calendar for {{user}}:</h1> <div class="container">
<div id="" style="width: 35%; float:left; margin:10px;" class="box">
<h3>Attendance Calendar for {{user}}</h3>
<ul style="text-align: left;">
<li><b>-</b> Get started by creating some club members on the <a href="/attendees">"Manage Club Members"</a> page. </li>
<br>
<li><b>-</b> Use the calendar below to select a date to take attendance.</li>
<br>
<li><b>-</b> A day with attendance taken will be highlighted in blue. </li>
</ul>
</div>
<div id="" style="width: 60%; float:left; margin:10px;" class="box">
<form @submit.prevent="att"> <form @submit.prevent="att">
<br><br><br>
<div id="cal"> <div id="cal">
<b-calendar v-model="value" locale="en-US" class="cal" selected-variant="primary" width="35vw" hide-header> <div v-if="!dates"><center>Calendar loading please wait...</center></div>
<div v-else>
<b-calendar v-model="value" locale="en-US" class="cal" selected-variant="primary" width="30vw" :date-info-fn="dateClass">
<div class="d-flex" dir="ltr"> <div class="d-flex" dir="ltr">
<b-button <b-button
size="sm" size="sm"
@@ -59,13 +74,30 @@
</b-button> </b-button>
</div> </div>
</b-calendar> </b-calendar>
</div> </div>
</div>
<p id="incorrect">Please select a date in the calendar </p> <p id="incorrect">Please select a date in the calendar </p>
<br> <br>
<div id="buttone"> <div id="buttone">
<button class="btn btn-primary">Take/View Attendance</button> <button class="btn btn-primary">Take/View Attendance</button>
</div> </div>
</form> </form>
</div>
<br>
<br>
</div>
<div id="calcontainer" style="border: 0.25px solid grey;">
<h3>Club Attendance</h3>
<div v-if="chartData.length == 1"><center>You haven't taken any attendance yet! Take some to view club performance.</center></div>
<div v-else>
<GChart type="LineChart" :data="chartData" :options="chartOptions" id="graph" style=""/>
</div>
</div>
</center>
</div> </div>
</template> </template>
@@ -90,7 +122,8 @@
} }
#whole-page{ #whole-page{
height: 100vh; height: 100%;
text-align: center;
} }
#incorrect { #incorrect {
@@ -98,14 +131,43 @@
display: none; display: none;
} }
#calcontainer{
background-color: white;
width: 75%;
text-align: center;
padding: 20px;
border-radius: 10px;
display: inline-block;
}
.box{
border: 0.25px solid grey;
}
</style> </style>
<script> <script>
export default { export default {
mounted() { created() {
this.checkAccount() this.checkAccount()
var ldata = {user: this.user};
let url2 = 'http://localhost:4000/login/getdates';
this.axios.post(url2, ldata).then(res => {
var datearr = res.data.dates;
console.log(res.data.dates)
this.dates = [];
for(var i =0; i<datearr.length; i++){
this.dates[i] = datearr[i].date;
this.chartData[i+1] = [this.dates[i], datearr[i].numPresent];
}
})
},
updated(){
var body = document.body, html = document.documentElement;
var height = Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight);
document.getElementById("whole-page").style.height = height + "px";
}, },
data() { data() {
return { return {
@@ -115,7 +177,18 @@
attendee: {}, attendee: {},
modal: null, modal: null,
btn: null, btn: null,
span: null span: null,
dates: null,
chartData: [
["Dates", "Attendances"]
],
chartOptions: {
chart: {
title: "Club Performance",
width: 100,
height: 400
}
}
} }
}, },
methods: { methods: {
@@ -142,6 +215,23 @@
}, },
clearDate() { clearDate() {
this.value = '' this.value = ''
},
dateClass(ymd, date) {
var year = 1900 + date.getYear();
var month = date.getMonth() + 1 + "";
if(month.length == 1){
month = "0" + month;
}
var day = date.getDate() + "";
if(day.length == 1){
day = "0" + day;
}
var str = year + "-" + month + "-" + day
return this.dates.includes(str) ? 'table-info' : ''
} }
} }
} }

12
attendancetracker/src/components/Insights.vue
View File

@@ -40,7 +40,7 @@
<div v-if="chartData.length == 1"><center>You have no members yet! Add some to get insights. <br>Chart Loading, please wait...</center></div> <div v-if="chartData.length == 1"><center>You have no members yet! Add some to get insights. <br>Chart Loading, please wait...</center></div>
<div v-else> <div v-else>
<center> <center>
<GChart type="ColumnChart" :data="chartData" :options="chartOptions" id="graph" /></center></div> <GChart style="max-width: 70%;" type="ColumnChart" :data="chartData" :options="chartOptions" id="graph" /></center></div>
<br> <br>
<center> <center>
<table id="presences"> <table id="presences">
@@ -146,8 +146,7 @@ export default {
], ],
chartOptions: { chartOptions: {
chart: { chart: {
title: "Company Performance", title: "Club Performance",
subtitle: "Sales, Expenses, and Profit: 2014-2017",
width: 100, width: 100,
height: 400 height: 400
} }
@@ -157,7 +156,7 @@ export default {
methods: { methods: {
getAttById(){ getAttById(){
var data = {user: this.user}; var data = {user: this.user};
let uri = 'http://65.92.152.100:4000/attendance/getById'; let uri = 'http://localhost:4000/attendance/getById';
this.axios.post(uri, data).then(res => { this.axios.post(uri, data).then(res => {
console.log(res); console.log(res);
this.attendees = res.data; this.attendees = res.data;
@@ -165,11 +164,12 @@ export default {
for(var i = 0; i < this.attendees.length; i++){ for(var i = 0; i < this.attendees.length; i++){
this.chartData[i+1] = [this.attendees[i].name, parseInt(this.attendees[i].presences.length, 10)] this.chartData[i+1] = [this.attendees[i].name, parseInt(this.attendees[i].presences.length, 10)]
} }
console.log(this.chartData);
}); });
}, },
getAttByPresences(){ getAttByPresences(){
var data = {user: this.user}; var data = {user: this.user};
let uri = 'http://65.92.152.100:4000/attendance/getById'; let uri = 'http://localhost:4000/attendance/getById';
this.axios.post(uri, data).then(res => { this.axios.post(uri, data).then(res => {
console.log(res); console.log(res);
this.attendees = res.data; this.attendees = res.data;
@@ -183,7 +183,7 @@ export default {
}, },
getAttByAbsenses(){ getAttByAbsenses(){
var data = {user: this.user}; var data = {user: this.user};
let uri = 'http://65.92.152.100:4000/attendance/getById'; let uri = 'http://localhost:4000/attendance/getById';
this.axios.post(uri, data).then(res => { this.axios.post(uri, data).then(res => {
console.log(res); console.log(res);
this.attendees = res.data; this.attendees = res.data;

2
attendancetracker/src/components/Login.vue
View File

@@ -155,7 +155,7 @@ input:focus {
}, },
methods: { methods: {
add(){ add(){
let uri = 'http://65.92.152.100:4000/login/post'; let uri = 'http://localhost:4000/login/post';
this.axios.post(uri, this.post).then(res => { this.axios.post(uri, this.post).then(res => {
if(!res.data){ if(!res.data){
document.getElementById("incorrect").style.display = "block"; document.getElementById("incorrect").style.display = "block";

4
attendancetracker/src/components/Register.vue
View File

@@ -164,12 +164,12 @@ input:focus {
methods: { methods: {
add(){ add(){
if(this.post.user != "" || this.post.email != "" || this.post.pass != ""){ if(this.post.user != "" || this.post.email != "" || this.post.pass != ""){
let uri = 'http://65.92.152.100:4000/login/add'; let uri = 'http://localhost:4000/login/add';
this.axios.post(uri, this.post).then(res => { this.axios.post(uri, this.post).then(res => {
console.log(res); console.log(res);
if(!res.data.user){ if(!res.data.user){
alert("Success! Account Created!"); alert("Success! Account Created!");
this.$router.push({name: '/'}); this.$router.push({name: 'login'});
}else{ }else{
alert("Error username already in use!") alert("Error username already in use!")
} }