vict3459
/
Ekapp
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fixes

This commit is contained in:
frederikpyt 2020-07-28 15:13:33 +02:00
parent 606e13560b
commit b4f9065d79
6 changed files with 215 additions and 423 deletions
skolehjem/resources
js/calendar
calendar.jsmonth.js
views/app
layout
base.blade.phpheader.blade.php
washing-reservations
create.blade.phpindex.blade.php

177
skolehjem/resources/js/calendar/calendar.js vendored
View File

@ -1,177 +0,0 @@
const moment = require("moment");
function generateCalendar(weekOffset = 0) {
const week = (moment().week() + weekOffset);
document.getElementById("title").innerText = week;
let weekDays = Array.apply(null, Array(7)).map((value, index) => {
return moment(index, "e").locale("da").startOf("week").weekday(index).format("ddd");
});
// weekDays.push(weekDays.shift());
// console.log(week);
// console.log(weekDays);
const calendar = document.getElementById("calendar");
let header = document.createElement("div");
header.classList.add("calendar-table__header", "calendar-table__row");
let calendarBody = document.createElement("div");
calendarBody.classList.add("calendar-table__body");
let calendarRow = document.createElement("div");
calendarRow.classList.add("calendar-table__row")
calendarRow.id = "calenderRow";
weekDays.forEach(function (weekDay) {
let headerDay = document.createElement("div");
headerDay.classList.add("calendar-table__col");
headerDay.innerText = weekDay;
header.appendChild(headerDay);
let date = moment().locale("da").day(weekDay).week(week);
// onDateSelect(date);
let dayHolder = document.createElement("div");
dayHolder.classList.add("calendar-table__col");
let day = document.createElement("div");
day.classList.add("calendar-table__item");
day.innerText = date.date();
dayHolder.appendChild(day);
dayHolder.onclick = function() {
onDateSelect(date, dayHolder);
}
calendarRow.appendChild(dayHolder);
});
calendarBody.appendChild(calendarRow);
calendar.innerHTML = "";
calendar.appendChild(header);
calendar.appendChild(calendarBody);
}
function onDateSelect(date, dayHolder) {
let events;
let machinez;
let buttonz;
let container = document.getElementById("event-container");
NodeList.prototype.forEach = Array.prototype.forEach
var children = document.getElementById("calenderRow").childNodes;
children.forEach(function(item){
item.classList.remove("selected");
});
dayHolder.classList.add("selected");
axios({
method: 'get',
url: '/washing-reservationsapi',
data: { date: date }
}).then(function (response) {
var data = response.data();
console.log(data);
});
$.ajax({
type: 'get',
url: "/washing-reservationsapi",
data: {'date': date},
success:function (data) {
console.log(data);
/*if(document.getElementById("washing-machines") != undefined)
machinez = document.getElementById("washing-machines");
else {
let span = document.createElement("span");
span.classList.add("events__title");
span.innerText = "Maskiner";
let select = document.createElement("select");
select.classList.add("events__title");
select.id = "washing-machines";
container.appendChild(span);
container.appendChild(select);
machinez = document.getElementById("washing-machines");
}
if(document.getElementById("events") != undefined)
events = document.getElementById("events");
else {
let span = document.createElement("span");
span.classList.add("events__title");
span.innerText = "Tider";
let select = document.createElement("select");
select.classList.add("events__title");
select.id = "events";
container.appendChild(span);
container.appendChild(select);
events = document.getElementById("events");
}
if(document.getElementById("create-reservation") != undefined)
buttonz = document.getElementById("create-reservation");
else {
let button = document.createElement("button");
button.id = "create-reservation";
button.innerText = "Reserver";
container.appendChild(button);
buttonz = document.getElementById("events");
}
const machines = [
"Maskine 1",
"Maskine 2"
]
machinez.innerHTML = "";
for (let i = 0; i < machines.length; i++) {
let option = document.createElement("option");
option.text = machines[i];
machinez.appendChild(option);
}
events.innerHTML = "";
for (let hour = 8; hour <= 20; hour++) {
let option = document.createElement("option");
option.text = prependZero(hour);
events.appendChild(option);
}*/
},
error:function (data) {
console.log("FEJL");
console.log(data);
}
});
}
function prependZero(value) {
if(value < 10)
return "0" + value;
return value;
}

31
skolehjem/resources/js/calendar/month.js vendored
View File

@ -1,31 +0,0 @@
class Month {
constructor(year, monthOffsetNormalized) {
this.year = year;
this.normalizedOffset = monthOffsetNormalized;
}
init() {
this.firstDay = (new Date(this.year, month - 1)).getDay();
}
draw(render) {
this.clearRender(render);
}
clearRender(render) {
let renderElement = document.getElementById(render);
renderElement.innerHTML = "";
}
createDay() {
}
countDays() {
return 32 - new Date(this.year, this.normalizedOffset - 1, 32).getDate();
}
}

2
skolehjem/resources/views/app/layout/base.blade.php
View File

@ -25,7 +25,7 @@
<img src="{{URL::asset('/images/icons/Aktiviteter.svg')}}" alt="Aktiviteter">
Aktiviteter
</a>
<a href="{{ route("washing-reservations.index") }}">
<a href="{{ route("washing-reservations.create") }}">
<img src="{{URL::asset('/images/icons/Vaske booking liste.svg')}}" alt="Reservationer">
Reservationer
</a>

34
skolehjem/resources/views/app/layout/header.blade.php
View File

@ -1,34 +0,0 @@
@section("header")
<header class="row align-items-center">
<img class="w-50" id="sdeLogo" src="{{URL::asset('/images/logos/Logo-normal.svg')}}" alt="Syddansk Erhvervsskole">
<a class="ml-auto" href="javascript:void(0)" id="toggle">
<img src="{{URL::asset('/images/icons/icon.svg')}}" id="menuIcon" alt="-">
</a>
</header>
<div class="d-none bg-sde-blue col" id="menu">
<a href="">
<img src="{{URL::asset('/images/icons/Menuplan.svg')}}" alt="Menuplan">
Menuplan
</a>
<a href="">
<img src="{{URL::asset('/images/icons/Aktiviteter.svg')}}" alt="Aktiviteter">
Aktiviteter
</a>
<a href="">
<img src="{{URL::asset('/images/icons/Vaske booking liste.svg')}}" alt="Vaske booking liste">
Vaske booking liste
</a>
<a href="">
<img src="{{URL::asset('/images/icons/Galleri.svg')}}" alt="Galleri">
Galleri
</a>
<a href="">
<img src="{{URL::asset('/images/icons/Kontoret.svg')}}" alt="Kontoret">
Kontoret
</a>
<a href="">
<img src="{{URL::asset('/images/icons/Vagttelefon-hvid.svg')}}" alt="Vagttelefon">
Vagttelefon
</a>
</div>
@endsection

213
skolehjem/resources/views/app/washing-reservations/create.blade.php Normal file
View File

@ -0,0 +1,213 @@
@extends("app.layout.base")
@extends("app.layout.header")
@section("title")
Booking Liste
@endsection
@section("content")
<main>
<h1 class="text-center sde-blue mb-0">Booking Liste</h1>
<div class="col w-100 mt-auto">
<div class="calendar-container">
<div class="calendar-container__header">
<button id="week-previous" class="calendar-container__btn fas fa-arrow-left" title="Previous">
<i class="icon ion-ios-arrow-back"></i>
</button>
<h2 id="title" class="calendar-container__title">{Måned} {År}</h2>
<button id="week-next" class="calendar-container__btn fas fa-arrow-right" title="Next">
<i class="icon ion-ios-arrow-forward"></i>
</button>
</div>
<div class="calendar-container__body">
<div id="calendar" class="calendar-table">
<div class="calendar-table__body">
</div>
</div>
</div>
</div>
<form method="post" action="{{ route("washing-reservations.store") }}" id="event-container" class="events-container">
@csrf
<p>
Maskiner skal dynamisk opdateres alt efter om det er en fra bygning E eller en af de andre bygninger der vil vaske, da bygning E har egen vaskekælder!
</p>
</form>
</div>
</main>
@endsection
@section("scripts")
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment-with-locales.min.js" integrity="sha512-qSnlnyh7EcD3vTqRoSP4LYsy2yVuqqmnkM9tW4dWo6xvAoxuVXyM36qZK54fyCmHoY1iKi9FJAUZrlPqmGNXFw==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/locale/da.min.js" integrity="sha512-rybyYvSnwg3zAZ/vjTTMoh8tOK0Z6tC2XCzr9e27M0xr8WU40IGo6SOP7FXXCyWgMyd3wZ8ln2nY4ce1ysYUfw==" crossorigin="anonymous"></script>
<script>
function generateCalendar(weekOffset = 0) {
const week = (moment().week() + weekOffset);
let weekDays = Array.apply(null, Array(7)).map((value, index) => {
return moment(index, "e").locale("da").startOf("week").weekday(index).format("ddd");
});
document.getElementById("title").innerText = moment().locale("da").day(weekDays[0]).week(week).isoWeek().toString();
const calendar = document.getElementById("calendar");
let header = document.createElement("div");
header.classList.add("calendar-table__header", "calendar-table__row");
let calendarBody = document.createElement("div");
calendarBody.classList.add("calendar-table__body");
let calendarRow = document.createElement("div");
calendarRow.classList.add("calendar-table__row")
calendarRow.id = "calenderRow";
weekDays.forEach(function (weekDay) {
let headerDay = document.createElement("div");
headerDay.classList.add("calendar-table__col");
headerDay.innerText = weekDay;
header.appendChild(headerDay);
let date = moment().locale("da").day(weekDay).week(week);
let dayHolder = document.createElement("div");
dayHolder.classList.add("calendar-table__col");
let day = document.createElement("div");
day.classList.add("calendar-table__item");
day.innerText = date.date();
dayHolder.appendChild(day);
dayHolder.onclick = function() {
onDateSelect(date, dayHolder);
}
calendarRow.appendChild(dayHolder);
});
calendarBody.appendChild(calendarRow);
calendar.innerHTML = "";
calendar.appendChild(header);
calendar.appendChild(calendarBody);
}
function onDateSelect(date, dayHolder) {
let events;
let machinez;
let buttonz;
let container = document.getElementById("event-container");
NodeList.prototype.forEach = Array.prototype.forEach
var children = document.getElementById("calenderRow").childNodes;
children.forEach(function(item){
item.classList.remove("selected");
});
dayHolder.classList.add("selected");
axios({
method: 'get',
url: '/washing-reservationsapi',
params: { 'date': date }
}).then(function (response) {
var data = response.data;
if(document.getElementById("washing-machines") != undefined)
machinez = document.getElementById("washing-machines");
else {
let span = document.createElement("span");
span.classList.add("events__title");
span.innerText = "Maskiner";
let select = document.createElement("select");
select.classList.add("events__title");
select.id = "washing-machines";
select.name = "machine";
container.appendChild(span);
container.appendChild(select);
machinez = document.getElementById("washing-machines");
}
if(document.getElementById("events") != undefined)
events = document.getElementById("events");
else {
let span = document.createElement("span");
span.classList.add("events__title");
span.innerText = "Tider";
let select = document.createElement("select");
select.classList.add("events__title");
select.id = "events";
select.name = "time";
container.appendChild(span);
container.appendChild(select);
events = document.getElementById("events");
}
if(document.getElementById("create-reservation") != undefined)
buttonz = document.getElementById("create-reservation");
else {
let button = document.createElement("button");
button.id = "create-reservation";
button.innerText = "Reserver";
button.type = "submit";
container.appendChild(button);
buttonz = document.getElementById("events");
}
let machines = data["washingmachines"];
machinez.innerHTML = "";
for (let i = 0; i < machines.length; i++) {
let option = document.createElement("option");
option.text = machines[i]["name"];
option.value = machines[i]["id"];
machinez.appendChild(option);
}
events.innerHTML = "";
for (let hour = 8; hour <= 20; hour++) {
let option = document.createElement("option");
option.text = prependZero(hour) + ":00";
option.value = data["date"].split("T")[0].slice(1, data["date"].split("T")[0].length) + "T" + prependZero(hour) + ":00";
events.appendChild(option);
}
});
}
function prependZero(value) {
if(value < 10)
return "0" + value;
return value;
}
let weekOffset = 0;
if(document.getElementById("calendar")) {
generateCalendar();
document.getElementById("week-previous").onclick = function () {
weekOffset--;
generateCalendar(weekOffset);
}
document.getElementById("week-next").onclick = function () {
weekOffset++;
generateCalendar(weekOffset);
}
}
</script>
@endsection

181
skolehjem/resources/views/app/washing-reservations/index.blade.php
View File

@ -25,189 +25,10 @@
</div>
</div>
</div>
<form method="post" action="{{ route("washing-reservations.store") }}" id="event-container" class="events-container">
@csrf
<p>
Maskiner skal dynamisk opdateres alt efter om det er en fra bygning E eller en af de andre bygninger der vil vaske, da bygning E har egen vaskekælder!
</p>
</form>
<div></div>
</div>
</main>
@endsection
@section("scripts")
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/moment-with-locales.min.js" integrity="sha512-qSnlnyh7EcD3vTqRoSP4LYsy2yVuqqmnkM9tW4dWo6xvAoxuVXyM36qZK54fyCmHoY1iKi9FJAUZrlPqmGNXFw==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.27.0/locale/da.min.js" integrity="sha512-rybyYvSnwg3zAZ/vjTTMoh8tOK0Z6tC2XCzr9e27M0xr8WU40IGo6SOP7FXXCyWgMyd3wZ8ln2nY4ce1ysYUfw==" crossorigin="anonymous"></script>
<script>
function generateCalendar(weekOffset = 0) {
const week = (moment().week() + weekOffset);
let weekDays = Array.apply(null, Array(7)).map((value, index) => {
return moment(index, "e").locale("da").startOf("week").weekday(index).format("ddd");
});
document.getElementById("title").innerText = moment().locale("da").day(weekDays[0]).week(week).isoWeek().toString();
const calendar = document.getElementById("calendar");
let header = document.createElement("div");
header.classList.add("calendar-table__header", "calendar-table__row");
let calendarBody = document.createElement("div");
calendarBody.classList.add("calendar-table__body");
let calendarRow = document.createElement("div");
calendarRow.classList.add("calendar-table__row")
calendarRow.id = "calenderRow";
weekDays.forEach(function (weekDay) {
let headerDay = document.createElement("div");
headerDay.classList.add("calendar-table__col");
headerDay.innerText = weekDay;
header.appendChild(headerDay);
let date = moment().locale("da").day(weekDay).week(week);
let dayHolder = document.createElement("div");
dayHolder.classList.add("calendar-table__col");
let day = document.createElement("div");
day.classList.add("calendar-table__item");
day.innerText = date.date();
dayHolder.appendChild(day);
dayHolder.onclick = function() {
onDateSelect(date, dayHolder);
}
calendarRow.appendChild(dayHolder);
});
calendarBody.appendChild(calendarRow);
calendar.innerHTML = "";
calendar.appendChild(header);
calendar.appendChild(calendarBody);
}
function onDateSelect(date, dayHolder) {
let events;
let machinez;
let buttonz;
let container = document.getElementById("event-container");
NodeList.prototype.forEach = Array.prototype.forEach
var children = document.getElementById("calenderRow").childNodes;
children.forEach(function(item){
item.classList.remove("selected");
});
dayHolder.classList.add("selected");
axios({
method: 'get',
url: '/washing-reservationsapi',
params: { 'date': date }
}).then(function (response) {
var data = response.data;
if(document.getElementById("washing-machines") != undefined)
machinez = document.getElementById("washing-machines");
else {
let span = document.createElement("span");
span.classList.add("events__title");
span.innerText = "Maskiner";
let select = document.createElement("select");
select.classList.add("events__title");
select.id = "washing-machines";
select.name = "machine";
container.appendChild(span);
container.appendChild(select);
machinez = document.getElementById("washing-machines");
}
if(document.getElementById("events") != undefined)
events = document.getElementById("events");
else {
let span = document.createElement("span");
span.classList.add("events__title");
span.innerText = "Tider";
let select = document.createElement("select");
select.classList.add("events__title");
select.id = "events";
select.name = "time";
container.appendChild(span);
container.appendChild(select);
events = document.getElementById("events");
}
if(document.getElementById("create-reservation") != undefined)
buttonz = document.getElementById("create-reservation");
else {
let button = document.createElement("button");
button.id = "create-reservation";
button.innerText = "Reserver";
button.type = "submit";
container.appendChild(button);
buttonz = document.getElementById("events");
}
let machines = data["washingmachines"];
machinez.innerHTML = "";
for (let i = 0; i < machines.length; i++) {
let option = document.createElement("option");
option.text = machines[i]["name"];
option.value = machines[i]["id"];
machinez.appendChild(option);
}
events.innerHTML = "";
for (let hour = 8; hour <= 20; hour++) {
let option = document.createElement("option");
option.text = prependZero(hour) + ":00";
option.value = data["date"].split("T")[0].slice(1, data["date"].split("T")[0].length) + "T" + prependZero(hour) + ":00";
events.appendChild(option);
}
});
}
function prependZero(value) {
if(value < 10)
return "0" + value;
return value;
}
let weekOffset = 0;
if(document.getElementById("calendar")) {
generateCalendar();
document.getElementById("week-previous").onclick = function () {
weekOffset--;
generateCalendar(weekOffset);
}
document.getElementById("week-next").onclick = function () {
weekOffset++;
generateCalendar(weekOffset);
}
}
</script>
@endsection