Fixes
This commit is contained in:
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user