first commit
This commit is contained in:
schmieders
@@ -0,0 +1,414 @@
|
||||
/***********/
|
||||
/* GENERAL */
|
||||
/***********/
|
||||
:root {
|
||||
/* Override Bootstrap colors */
|
||||
--bs-primary: #e2001a;
|
||||
--bs-secondary: #5c6971;
|
||||
/* Other colors */
|
||||
--primary-hover: #fe1530;
|
||||
--secondary-hover: #222;
|
||||
--light-grey: #f1f3f3;
|
||||
--darker-grey: #d4dada;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--secondary-hover);
|
||||
text-decoration-color: var(--bs-primary);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: var(--primary-hover);
|
||||
}
|
||||
|
||||
/*************/
|
||||
/* BOOTSTRAP */
|
||||
/*************/
|
||||
/* Colors*/
|
||||
.bg-primary {
|
||||
background-color: var(--bs-primary) !important;
|
||||
}
|
||||
|
||||
.bg-secondary {
|
||||
background-color: var(--bs-secondary) !important;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
.btn-primary {
|
||||
--bs-btn-color: #fff;
|
||||
--bs-btn-bg: var(--bs-primary);
|
||||
--bs-btn-border-color: var(--bs-primary);
|
||||
--bs-btn-hover-color: #fff;
|
||||
--bs-btn-hover-bg: var(--primary-hover);
|
||||
--bs-btn-hover-border-color: var(--primary-hover);
|
||||
--bs-btn-focus-shadow-rgb: 49, 132, 253;
|
||||
--bs-btn-active-color: #fff;
|
||||
--bs-btn-active-bg: var(--bs-primary);
|
||||
--bs-btn-active-border-color: var(--bs-primary);
|
||||
--bs-btn-active-shadow: inset 0 3px 5px #00000020;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
--bs-btn-color: #fff;
|
||||
--bs-btn-bg: var(--bs-secondary);
|
||||
--bs-btn-border-color: var(--bs-secondary);
|
||||
--bs-btn-hover-color: #fff;
|
||||
--bs-btn-hover-bg: var(--secondary-hover);
|
||||
--bs-btn-hover-border-color: var(--secondary-hover);
|
||||
--bs-btn-focus-shadow-rgb: 130, 138, 145;
|
||||
--bs-btn-active-color: #fff;
|
||||
--bs-btn-active-bg: var(--bs-secondary);
|
||||
--bs-btn-active-border-color: var(--bs-secondary);
|
||||
--bs-btn-active-shadow: inset 0 3px 5px #00000020;
|
||||
}
|
||||
|
||||
.btn-primary:focus,
|
||||
.btn-secondary:focus {
|
||||
box-shadow: 0 0 0 0.25rem #5c69714a;
|
||||
}
|
||||
|
||||
.form-control:focus,
|
||||
.form-select:focus,
|
||||
.btn-close:focus {
|
||||
color: #212529;
|
||||
background-color: #fff;
|
||||
border-color: #5c6971;
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.25rem #5c69714a;
|
||||
}
|
||||
|
||||
/* Navbar */
|
||||
.navbar-dark {
|
||||
--bs-navbar-color: #fffc;
|
||||
--bs-navbar-hover-color: #fffe;
|
||||
--bs-navbar-active-color: #fff;
|
||||
}
|
||||
|
||||
.dropdown-item.active,
|
||||
.dropdown-item:active {
|
||||
background-color: var(--bs-primary) !important;
|
||||
}
|
||||
|
||||
/* Modals */
|
||||
.modal-body form {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
/**********/
|
||||
/* HEADER */
|
||||
/**********/
|
||||
header nav {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.dash-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/***********/
|
||||
/* CONTENT */
|
||||
/***********/
|
||||
h5 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
/* Main Page */
|
||||
.section-title {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.content-section:first-of-type {
|
||||
padding-top: 62px;
|
||||
}
|
||||
|
||||
.content-section {
|
||||
padding-top: 70px;
|
||||
}
|
||||
|
||||
/* Management */
|
||||
main.content {
|
||||
margin-top: 62px;
|
||||
margin-bottom: 66px;
|
||||
padding: 20px;
|
||||
min-height: calc(100vh - 194px);
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
.table-heading {
|
||||
margin: 20px 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.content table tbody td,
|
||||
.content table tbody th {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.content table thead th.text-center {
|
||||
width: 78px;
|
||||
}
|
||||
|
||||
/* Custom Buttons */
|
||||
.add-button {
|
||||
margin-left: auto;
|
||||
background-color: var(--bs-secondary);
|
||||
border-radius: 100%;
|
||||
color: white;
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.add-button:hover {
|
||||
background-color: var(--secondary-hover);
|
||||
}
|
||||
|
||||
.action-row {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.action-button {
|
||||
border: none;
|
||||
border-radius: 100%;
|
||||
height: 34px;
|
||||
width: 34px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.action-button.edit {
|
||||
color: white;
|
||||
background-color: var(--bs-secondary);
|
||||
}
|
||||
|
||||
.action-button.edit:not(.placeholder):hover {
|
||||
background-color: var(--secondary-hover);
|
||||
}
|
||||
|
||||
.action-button.delete {
|
||||
color: white;
|
||||
background-color: var(--bs-primary);
|
||||
}
|
||||
|
||||
.action-button.delete:hover {
|
||||
background-color: var(--bs-secondary);
|
||||
}
|
||||
|
||||
/* Media Queries */
|
||||
@media (min-width: 992px) {
|
||||
|
||||
.container,
|
||||
.content > section {
|
||||
padding-left: 80px;
|
||||
padding-right: 80px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
aside {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* SIDEBAR */
|
||||
.sidebar {
|
||||
-webkit-box-shadow: 5px 0 5px rgba(196, 194, 196, 0.72);
|
||||
-moz-box-shadow: 5px 0 5px rgba(196, 194, 196, 0.72);
|
||||
box-shadow: 5px 0 5px rgba(196, 194, 196, 0.72);
|
||||
position: absolute;
|
||||
top: 62px;
|
||||
left: 0;
|
||||
width: 80px;
|
||||
background-color: white;
|
||||
min-height: calc(100vh - 62px - 66px);
|
||||
}
|
||||
|
||||
.sidebar li {
|
||||
border-bottom: 1px solid #c5c5c5;
|
||||
}
|
||||
|
||||
.sidebar li a {
|
||||
display: block;
|
||||
height: 65px;
|
||||
width: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sidebar .nav-link {
|
||||
color: var(--bs-secondary);
|
||||
}
|
||||
|
||||
.sidebar .nav-link:not(.active):hover {
|
||||
color: var(--secondary-hover);
|
||||
}
|
||||
|
||||
.sidebar .nav-link.active {
|
||||
color: var(--bs-primary);
|
||||
}
|
||||
|
||||
.sidebar .nav-link svg {
|
||||
vertical-align: -1.4em;
|
||||
}
|
||||
|
||||
/* Carousel */
|
||||
.carousel-item {
|
||||
height: calc(100vh - 62px);
|
||||
}
|
||||
|
||||
.carousel-item > img {
|
||||
position: absolute;
|
||||
object-fit: cover;
|
||||
top: 0;
|
||||
left: 0;
|
||||
min-width: 100%;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.carousel-caption {
|
||||
text-align: left;
|
||||
max-width: 400px;
|
||||
z-index: 10;
|
||||
color: white;
|
||||
background-color: #00000090;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
/* Custom Cards */
|
||||
.name {
|
||||
color: var(--bs-primary);
|
||||
}
|
||||
|
||||
.work {
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.work a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.about {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.box {
|
||||
-webkit-box-shadow: 13px 12px 5px -10px rgba(196, 194, 196, 0.72);
|
||||
-moz-box-shadow: 13px 12px 5px -10px rgba(196, 194, 196, 0.72);
|
||||
box-shadow: 13px 12px 5px -10px rgba(196, 194, 196, 0.72);
|
||||
min-height: 300px;
|
||||
}
|
||||
|
||||
/*************/
|
||||
/* DASHBOARD */
|
||||
/*************/
|
||||
.dash-select {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.dashboard .row.full,
|
||||
.dashboard .section {
|
||||
min-height: calc(100vh - 330px);
|
||||
}
|
||||
|
||||
.dashboard .row.gap {
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.dashboard .person {
|
||||
vertical-align: middle;
|
||||
margin: auto 0;
|
||||
}
|
||||
|
||||
.dashboard .details svg {
|
||||
color: var(--bs-primary)
|
||||
}
|
||||
|
||||
#lecturerOther {
|
||||
font-size: 16px;
|
||||
text-overflow: ellipsis;
|
||||
max-height: 580px;
|
||||
}
|
||||
|
||||
.dashboard .details {
|
||||
padding: 20px;
|
||||
font-size: 18px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.dashboard .row .card-cust {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Lecture List */
|
||||
.lectureList {
|
||||
list-style-type: none;
|
||||
padding-left: 0;
|
||||
overflow-y: scroll;
|
||||
max-height: 580px;
|
||||
}
|
||||
|
||||
.lectureList li {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.lectureList li:not(:last-of-type) {
|
||||
border-bottom: 0.5px solid var(--darker-grey);
|
||||
}
|
||||
|
||||
.lectureList li:nth-child(even) {
|
||||
background-color: var(--light-grey);
|
||||
}
|
||||
|
||||
.lectureList li:hover {
|
||||
background-color: var(--darker-grey);
|
||||
}
|
||||
|
||||
.lectureList .lecture {
|
||||
font-size: 16px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* Misc */
|
||||
.error {
|
||||
display: none;
|
||||
color: red;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.error.show {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**********/
|
||||
/* FOOTER */
|
||||
/**********/
|
||||
footer {
|
||||
bottom: 0;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
color: var(--light-grey);
|
||||
background-color: var(--bs-secondary);
|
||||
padding: 20px 0;
|
||||
margin-top: 20px;
|
||||
border-top: 2px solid var(--bs-primary);
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 7.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.4 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="#e2001a" viewBox="0 0 640 512">
|
||||
<!--! Font Awesome Pro 6.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. -->
|
||||
<path d="M320 32c-8.1 0-16.1 1.4-23.7 4.1L15.8 137.4C6.3 140.9 0 149.9 0 160s6.3 19.1 15.8 22.6l57.9 20.9C57.3 229.3 48 259.8 48 291.9v28.1c0 28.4-10.8 57.7-22.3 80.8c-6.5 13-13.9 25.8-22.5 37.6C0 442.7-.9 448.3 .9 453.4s6 8.9 11.2 10.2l64 16c4.2 1.1 8.7 .3 12.4-2s6.3-6.1 7.1-10.4c8.6-42.8 4.3-81.2-2.1-108.7C90.3 344.3 86 329.8 80 316.5V291.9c0-30.2 10.2-58.7 27.9-81.5c12.9-15.5 29.6-28 49.2-35.7l157-61.7c8.2-3.2 17.5 .8 20.7 9s-.8 17.5-9 20.7l-157 61.7c-12.4 4.9-23.3 12.4-32.2 21.6l159.6 57.6c7.6 2.7 15.6 4.1 23.7 4.1s16.1-1.4 23.7-4.1L624.2 182.6c9.5-3.4 15.8-12.5 15.8-22.6s-6.3-19.1-15.8-22.6L343.7 36.1C336.1 33.4 328.1 32 320 32zM128 408c0 35.3 86 72 192 72s192-36.7 192-72L496.7 262.6 354.5 314c-11.1 4-22.8 6-34.5 6s-23.5-2-34.5-6L143.3 262.6 128 408z" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
@@ -0,0 +1,42 @@
|
||||
let logicHandler = new LogicHandler()
|
||||
|
||||
window.addEventListener('load', function () {
|
||||
let dropdown = this.document.getElementById("dropdown")
|
||||
logicHandler.getItems("lecturers").forEach(lecturer => {
|
||||
dropdown.innerHTML += `<li><a class="dropdown-item" onclick="selectLecturer('${lecturer.id}')">${lecturer.firstName} ${lecturer.lastName}</a></li>`
|
||||
})
|
||||
})
|
||||
|
||||
function selectLecturer(id) {
|
||||
let lecturer = logicHandler.getItem("lecturers", id)
|
||||
document.getElementById("dropdown-button").innerText = `${lecturer.firstName} ${lecturer.lastName}`
|
||||
|
||||
document.getElementById("lecturerName").innerText = `${lecturer.firstName} ${lecturer.lastName}`
|
||||
document.getElementById("lecturerTitle").innerText = "Prof. Dr."
|
||||
|
||||
document.getElementById("lecturerMail").innerHTML = `<a href="mailto:${lecturer.email}">${lecturer.email}</a>`
|
||||
document.getElementById("lecturerProgram").innerText = logicHandler.getItem("studyPrograms", lecturer.studyProgram).name
|
||||
document.getElementById("lecturerOther").innerText = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
|
||||
|
||||
let btn = document.getElementById("lecturerEditButton")
|
||||
btn.classList.remove("disabled", "placeholder")
|
||||
btn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-pencil" viewBox = "0 0 16 16" ><path d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z" /></svg>`
|
||||
btn.onclick = () => window.location.href = window.location.href.replace("dashboard", "lecturers") + `?id=${id}`
|
||||
|
||||
let html = ""
|
||||
let lectures = logicHandler.getItems("lectures")
|
||||
lectures.forEach(lecture => {
|
||||
lecture.lectureDates.forEach(lectureDate => {
|
||||
let date = logicHandler.getItem("lectureDates", lectureDate)
|
||||
if (lecture.lecturers.includes(id)) {
|
||||
html = html + `
|
||||
<li class="lecture">${lecture.lectureName} - ${logicHandler.getItem("studyClasses", lecture.studyClass).name} (${logicHandler.formatDateTime(date.startDate)} - ${logicHandler.formatDateTime(date.endDate)})</li>
|
||||
`
|
||||
}
|
||||
})
|
||||
|
||||
})
|
||||
document.querySelector(".lectureList").innerHTML = html
|
||||
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
}
|
||||
@@ -0,0 +1,149 @@
|
||||
function loadDummyData() {
|
||||
|
||||
window.localStorage.setItem("studyPrograms", JSON.stringify([
|
||||
{
|
||||
id: 0,
|
||||
name: "Informatik",
|
||||
short: "TIF"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: "Wirtschaftsinformatik",
|
||||
short: "WIF"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "Betriebswirtschaftslehre",
|
||||
short: "BWL"
|
||||
},
|
||||
]))
|
||||
|
||||
window.localStorage.setItem("lectureDates", JSON.stringify([
|
||||
{
|
||||
id: 0,
|
||||
startDate: "2022-01-01T00:00",
|
||||
endDate: "2022-01-01T23:59"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
startDate: "2022-02-02T00:00",
|
||||
endDate: "2022-02-02T23:59"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
startDate: "2022-03-03T00:00",
|
||||
endDate: "2022-03-03T23:59"
|
||||
},
|
||||
]))
|
||||
|
||||
|
||||
window.localStorage.setItem("semesters", JSON.stringify([
|
||||
{
|
||||
id: 0,
|
||||
name: "1. Semester",
|
||||
startDate: 0,
|
||||
endDate: 2,
|
||||
number: 1,
|
||||
studyProgram: 1
|
||||
}, {
|
||||
id: 1,
|
||||
name: "2. Semester",
|
||||
startDate: 1,
|
||||
endDate: 2,
|
||||
number: 2,
|
||||
studyProgram: 2
|
||||
}, {
|
||||
id: 2,
|
||||
name: "3. Semester",
|
||||
startDate: 0,
|
||||
endDate: 1,
|
||||
number: 3,
|
||||
studyProgram: 0
|
||||
},
|
||||
]))
|
||||
|
||||
window.localStorage.setItem("studyClasses", JSON.stringify([
|
||||
{
|
||||
id: 0,
|
||||
name: "TIF22A",
|
||||
startDate: 0,
|
||||
endDate: 0,
|
||||
semester: 0,
|
||||
studyProgram: 0
|
||||
}, {
|
||||
id: 1,
|
||||
name: "WIF21B",
|
||||
startDate: 1,
|
||||
endDate: 1,
|
||||
semester: 1,
|
||||
studyProgram: 1
|
||||
}, {
|
||||
id: 2,
|
||||
name: "BWL20A",
|
||||
startDate: 2,
|
||||
endDate: 2,
|
||||
semester: 2,
|
||||
studyProgram: 2
|
||||
},
|
||||
]))
|
||||
|
||||
window.localStorage.setItem("lecturers", JSON.stringify([
|
||||
{
|
||||
id: 0,
|
||||
firstName: "Max",
|
||||
lastName: "Mustermann",
|
||||
email: "max.mustermann@uniplanner.de",
|
||||
studyProgram: 0
|
||||
}, {
|
||||
id: 1,
|
||||
firstName: "Erika",
|
||||
lastName: "Musterfrau",
|
||||
email: "erika.musterfrau@uniplanner.de",
|
||||
studyProgram: 1
|
||||
}, {
|
||||
id: 2,
|
||||
firstName: "Max",
|
||||
lastName: "Musterfrau",
|
||||
email: "max.musterfrau@uniplanner.de",
|
||||
studyProgram: 2
|
||||
},
|
||||
]))
|
||||
|
||||
window.localStorage.setItem("lectures", JSON.stringify([
|
||||
{
|
||||
id: 0,
|
||||
lectureName: "Technische Informatik",
|
||||
moduleName: "Digitaltechnik I",
|
||||
duration: 48,
|
||||
lectureDates: ["0", "2"],
|
||||
lecturers: ["0"],
|
||||
studyClass: 0
|
||||
}, {
|
||||
id: 1,
|
||||
lectureName: "Mathematik I",
|
||||
moduleName: "Analysis",
|
||||
duration: 50,
|
||||
lectureDates: ["1", "2"],
|
||||
lecturers: ["1", "2"],
|
||||
studyClass: 1
|
||||
}, {
|
||||
id: 2,
|
||||
lectureName: "Betriebswirtschaftslehre",
|
||||
moduleName: "Projektmanagement",
|
||||
duration: 35,
|
||||
lectureDates: ["0", "2"],
|
||||
lecturers: ["0", "1", "2"],
|
||||
studyClass: 2
|
||||
},
|
||||
]))
|
||||
|
||||
window.localStorage.setItem("currentIds", JSON.stringify({
|
||||
lectureDate: 3,
|
||||
lecturer: 3,
|
||||
lecture: 3,
|
||||
semester: 3,
|
||||
studyClass: 3,
|
||||
studyProgram: 3
|
||||
}))
|
||||
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
let logicHandler = new LogicHandler()
|
||||
let modalHandler = new LectureDateModalHandler()
|
||||
|
||||
function renderLectureDateModal(id) {
|
||||
id = typeof id == "undefined" ? "Create" : id
|
||||
|
||||
let lectureDate = id == "Create" ? getEmptyLectureDate() : logicHandler.getItem("lectureDates", id)
|
||||
|
||||
document.body.append(modalHandler.getLectureDateModal(lectureDate))
|
||||
document.body.append(modalHandler.getLectureDateModalButton(id))
|
||||
let htmlButton = document.getElementById("modalButton" + id)
|
||||
htmlButton.click()
|
||||
htmlButton.remove()
|
||||
}
|
||||
|
||||
function cancelLectureDateModal(id) {
|
||||
document.getElementById("lectureDateModal" + id).remove()
|
||||
}
|
||||
|
||||
function saveLectureDate(id) {
|
||||
logicHandler.saveItem("lectureDate", id)
|
||||
}
|
||||
|
||||
function removeLectureDate(id) {
|
||||
logicHandler.removeItem("lectureDates", id)
|
||||
document.getElementById("row" + id).remove()
|
||||
}
|
||||
|
||||
function getEmptyLectureDate() {
|
||||
return {
|
||||
id: "Create",
|
||||
startDate: "",
|
||||
endDate: ""
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
class LectureDateModalHandler {
|
||||
getLectureDateModal(lectureDate) {
|
||||
let heading = lectureDate.id == "Create" ? "Neuen Termin erstellen" : `Termin #${lectureDate.id} bearbeiten`
|
||||
|
||||
let modal = `
|
||||
<div class="modal modal-lg fade" id="lectureDateModal${lectureDate.id}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="lectureDateModalLabel${lectureDate.id}" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="lectureDateModalLabel${lectureDate.id}">${heading}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Abbrechen" onclick="cancelLectureDateModal('${lectureDate.id}')"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p class="error"><i class="bi bi-exclamation-circle"></i> Bitte alle Felder ausfüllen.</p>
|
||||
<form id="lectureDateForm${lectureDate.id}">
|
||||
<div class="mb-3">
|
||||
<label for="startDateInput" class="form-label">Startdatum</label>
|
||||
<input type="datetime-local" class="form-control modalInput" id="startDateInput" name="startDate" value="${lectureDate.startDate}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="endDateInput" class="form-label">Enddatum</label>
|
||||
<input type="datetime-local" class="form-control modalInput" id="endDateInput" name="endDate" value="${lectureDate.endDate}" >
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="cancelLectureDateModal('${lectureDate.id}')">Abbrechen</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="saveLectureDate('${lectureDate.id}')">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
|
||||
let htmlModal = document.createElement("div")
|
||||
htmlModal.innerHTML = modal
|
||||
return htmlModal
|
||||
}
|
||||
|
||||
getLectureDateModalButton(id) {
|
||||
let button = `
|
||||
<button type="button" data-bs-toggle="modal" data-bs-target="#lectureDateModal${id}" id="modalButton${id}" style="display: none;"></button>
|
||||
`
|
||||
|
||||
let htmlButton = document.createElement("div")
|
||||
htmlButton.innerHTML = button
|
||||
return htmlButton
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
window.addEventListener("load", function () {
|
||||
var logicHandler = new LogicHandler()
|
||||
|
||||
let lectureDates = logicHandler.getItems("lectureDates")
|
||||
|
||||
if (lectureDates != null) {
|
||||
lectureDates.forEach(lectureDate => {
|
||||
|
||||
let content = `
|
||||
<th scope="row">${lectureDate.id}</th>
|
||||
<td>${logicHandler.formatDateTime(lectureDate.startDate)}</td>
|
||||
<td>${logicHandler.formatDateTime(lectureDate.endDate)}</td>
|
||||
<td>
|
||||
<div class="action-row">
|
||||
<button class="action-button edit" onclick="renderLectureDateModal(${lectureDate.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-pencil" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z" />
|
||||
</svg>
|
||||
</button>
|
||||
<button class="action-button delete" onclick="removeLectureDate(${lectureDate.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-trash" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
`
|
||||
|
||||
let row = document.createElement("tr")
|
||||
row.id = "row" + lectureDate.id
|
||||
row.innerHTML = content
|
||||
document.getElementById("lectureDateTable").appendChild(row)
|
||||
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,46 @@
|
||||
let logicHandler = new LogicHandler()
|
||||
let modalHandler = new LecturerModalHandler()
|
||||
|
||||
window.addEventListener('load', function () {
|
||||
if (this.window.location.search.includes("id=")) {
|
||||
renderLecturerModal(window.location.search.replace("?id=", ""))
|
||||
}
|
||||
})
|
||||
|
||||
function renderLecturerModal(id) {
|
||||
id = typeof id == "undefined" ? "Create" : id
|
||||
|
||||
let lecturer = id == "Create" ? getEmptyLecturer() : logicHandler.getItem("lecturers", id)
|
||||
|
||||
let studyProgramList = logicHandler.getAsDataList("studyPrograms", "name", [lecturer.studyProgram])
|
||||
|
||||
document.body.append(modalHandler.getLecturerModal(lecturer, studyProgramList))
|
||||
document.body.append(modalHandler.getLecturerModalButton(id))
|
||||
let htmlButton = document.getElementById("lecturerButton" + id)
|
||||
htmlButton.click()
|
||||
htmlButton.remove()
|
||||
}
|
||||
|
||||
function cancelLecturerModal(id) {
|
||||
document.getElementById("lecturerModal" + id).remove()
|
||||
window.location.href = window.location.href.replace(window.location.search, "")
|
||||
}
|
||||
|
||||
function saveLecturer(id) {
|
||||
logicHandler.saveItem("lecturer", id)
|
||||
}
|
||||
|
||||
function removeLecturer(id) {
|
||||
logicHandler.removeItem("lecturers", id)
|
||||
document.getElementById("row" + id).remove()
|
||||
}
|
||||
|
||||
function getEmptyLecturer() {
|
||||
return {
|
||||
id: "Create",
|
||||
firstName: "",
|
||||
lastName: "",
|
||||
email: "",
|
||||
studyProgram: ""
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,60 @@
|
||||
class LecturerModalHandler {
|
||||
|
||||
getLecturerModal(lecturer, studyProgramList) {
|
||||
let heading = lecturer.id == "Create" ? "Neuen Dozent erstellen" : `Dozent #${lecturer.id} bearbeiten`
|
||||
let modal = `
|
||||
<div class="modal modal-lg fade" id="lecturerModal${lecturer.id}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="lecturerModalLabel${lecturer.id}" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="lecturerModalLabel${lecturer.id}">${heading}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Abbrechen" onclick="cancelLecturerModal('${lecturer.id}')"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p class="error"><i class="bi bi-exclamation-circle"></i> Bitte alle Felder ausfüllen.</p>
|
||||
<form id="lecturerForm${lecturer.id}">
|
||||
<div class="mb-3">
|
||||
<label for="firstNameInput" class="form-label">Vorname</label>
|
||||
<input type="text" class="form-control modalInput" id="firstNameInput" name="firstName" value="${lecturer.firstName}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="lastNameInput" class="form-label">Nachname</label>
|
||||
<input type="text" class="form-control modalInput" id="lastNameInput" name="lastName" value="${lecturer.lastName}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="emailInput" class="form-label">Email</label>
|
||||
<input type="email" class="form-control modalInput" id="emailInput" name="email" value="${lecturer.email}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="studyProgramInput" class="form-label">Studiengang</label>
|
||||
<select class="form-select modalInput" id="studyProgramInput" name="studyProgram" >
|
||||
<option selected disabled hidden>Bitte wählen</option>
|
||||
${studyProgramList}
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="cancelLecturerModal('${lecturer.id}')">Abbrechen</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="saveLecturer('${lecturer.id}')">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
|
||||
let htmlModal = document.createElement("div")
|
||||
htmlModal.innerHTML = modal
|
||||
return htmlModal
|
||||
}
|
||||
|
||||
getLecturerModalButton(id) {
|
||||
let button = `
|
||||
<button type="button" data-bs-toggle="modal" data-bs-target="#lecturerModal${id}" id="lecturerButton${id}" style="display: none;"></button>
|
||||
`
|
||||
|
||||
let htmlButton = document.createElement("div")
|
||||
htmlButton.innerHTML = button
|
||||
return htmlButton
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
window.addEventListener("load", function () {
|
||||
let logicHandler = new LogicHandler()
|
||||
|
||||
let lecturers = logicHandler.getItems("lecturers")
|
||||
|
||||
|
||||
if (lecturers != null) {
|
||||
lecturers.forEach(lecturer => {
|
||||
|
||||
let studyProgram = logicHandler.getItem("studyPrograms", lecturer.studyProgram)
|
||||
studyProgram = typeof studyProgram == "undefined" ? "" : studyProgram.name
|
||||
|
||||
let content = `
|
||||
<th scope="row">${lecturer.id}</th>
|
||||
<td>${lecturer.firstName}</td>
|
||||
<td>${lecturer.lastName}</td>
|
||||
<td>${lecturer.email}</td>
|
||||
<td>${studyProgram}</td>
|
||||
<td>
|
||||
<div class="action-row">
|
||||
<button class="action-button edit" onclick="renderLecturerModal(${lecturer.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-pencil" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z" />
|
||||
</svg>
|
||||
</button>
|
||||
<button class="action-button delete" onclick="removeLecturer(${lecturer.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-trash" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
`
|
||||
let row = document.createElement("tr")
|
||||
row.id = "row" + lecturer.id
|
||||
row.innerHTML = content
|
||||
document.getElementById("lecturersTable").appendChild(row)
|
||||
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,43 @@
|
||||
let logicHandler = new LogicHandler()
|
||||
let modalHandler = new LectureModalHandler()
|
||||
|
||||
function renderLectureModal(id) {
|
||||
id = typeof id == "undefined" ? "Create" : id
|
||||
|
||||
let lecture = id == "Create" ? getEmptyLecture() : logicHandler.getItem("lectures", id)
|
||||
|
||||
let lectureDateList = logicHandler.getAsDataListWithRange("lectureDates", "startDate", "endDate", lecture.lectureDates)
|
||||
let lecturerList = logicHandler.getAsDataList("lecturers", "lastName", lecture.lecturers)
|
||||
let studyClassList = logicHandler.getAsDataList("studyClasses", "name", [lecture.studyClass])
|
||||
|
||||
document.body.append(modalHandler.getLectureModal(lecture, lectureDateList, lecturerList, studyClassList))
|
||||
document.body.append(modalHandler.getLectureModalButton(id))
|
||||
let htmlButton = document.getElementById("lectureButton" + id)
|
||||
htmlButton.click()
|
||||
htmlButton.remove()
|
||||
}
|
||||
|
||||
function cancelLectureModal(id) {
|
||||
document.getElementById("lectureModal" + id).remove()
|
||||
}
|
||||
|
||||
function saveLecture(id) {
|
||||
logicHandler.saveItem("lecture", id)
|
||||
}
|
||||
|
||||
function removeLecture(id) {
|
||||
logicHandler.removeItem("lectures", id)
|
||||
document.getElementById("row" + id).remove()
|
||||
}
|
||||
|
||||
function getEmptyLecture() {
|
||||
return {
|
||||
id: "Create",
|
||||
lectureName: "",
|
||||
moduleName: "",
|
||||
duration: "",
|
||||
lectureDates: [],
|
||||
lecturers: [],
|
||||
studyClass: ""
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,72 @@
|
||||
class LectureModalHandler {
|
||||
|
||||
getLectureModal(lecture, lectureDateList, lecturerList, studyClassList) {
|
||||
let heading = lecture.id == "Create" ? "Neue Vorlesung erstellen" : `Vorlesung #${lecture.id} bearbeiten`
|
||||
let modal = `
|
||||
<div class="modal modal-lg fade" id="lectureModal${lecture.id}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="lectureModalLabel${lecture.id}" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="lectureModalLabel${lecture.id}">${heading}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Abbrechen" onclick="cancelLectureModal('${lecture.id}')"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p class="error"><i class="bi bi-exclamation-circle"></i> Bitte alle Felder ausfüllen.</p>
|
||||
<form id="lectureForm${lecture.id}">
|
||||
<div class="mb-3">
|
||||
<label for="lectureNameInput" class="form-label">Vorlesungs-Name</label>
|
||||
<input type="text" class="form-control modalInput" id="lectureNameInput" name="lectureName" value="${lecture.lectureName}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="moduleNameInput" class="form-label">Modul-Name</label>
|
||||
<input type="text" class="form-control modalInput" id="moduleNameInput" name="moduleName" value="${lecture.moduleName}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="durationInput" class="form-label">Dauer</label>
|
||||
<input type="number" min="0" class="form-control modalInput" id="durationInput" name="duration" value="${lecture.duration}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="lectureDatesInput" class="form-label">Termine</label>
|
||||
<select class="form-select modalInput" id="lectureDatesInput" name="lectureDates" multiple >
|
||||
${lectureDateList}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="lecturersInput" class="form-label">Dozenten</label>
|
||||
<select class="form-select modalInput" id="lecturersInput" name="lecturers" multiple >
|
||||
${lecturerList}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="studyClassInput" class="form-label">Jahrgang</label>
|
||||
<select class="form-select modalInput" id="studyClassInput" name="studyClass" >
|
||||
<option selected disabled hidden>Bitte wählen</option>
|
||||
${studyClassList}
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="cancelLectureModal('${lecture.id}')">Abbrechen</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="saveLecture('${lecture.id}')">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
|
||||
let htmlModal = document.createElement("div")
|
||||
htmlModal.innerHTML = modal
|
||||
return htmlModal
|
||||
}
|
||||
|
||||
getLectureModalButton(id) {
|
||||
let button = `
|
||||
<button type="button" data-bs-toggle="modal" data-bs-target="#lectureModal${id}" id="lectureButton${id}" style="display: none;"></button>
|
||||
`
|
||||
|
||||
let htmlButton = document.createElement("div")
|
||||
htmlButton.innerHTML = button
|
||||
return htmlButton
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,55 @@
|
||||
window.addEventListener("load", function () {
|
||||
let logicHandler = new LogicHandler()
|
||||
|
||||
let lectures = logicHandler.getItems("lectures")
|
||||
|
||||
if (lectures != null) {
|
||||
lectures.forEach(lecture => {
|
||||
|
||||
let lecturers = logicHandler.getItems("lecturers").filter(lecturer => { return lecture.lecturers.indexOf(lecturer.id.toString()) > -1 })
|
||||
lecturers.forEach((lecturer, idx) => lecturers[idx] = " " + lecturer.lastName)
|
||||
|
||||
let lectureDates = logicHandler.getItems("lectureDates").filter(lectureDate => { return lecture.lectureDates.indexOf(lectureDate.id.toString()) > -1 })
|
||||
lectureDates.forEach((lectureDate, idx) => lectureDates[idx] = ` ${logicHandler.formatDateTime(lectureDate.startDate)} - ${logicHandler.formatDateTime(lectureDate.endDate)}`)
|
||||
|
||||
let studyClass = logicHandler.getItem("studyClasses", lecture.studyClass)
|
||||
studyClass = typeof studyClass == "undefined" ? "" : studyClass.name
|
||||
|
||||
let content = `
|
||||
<th scope="row">${lecture.id}</th>
|
||||
<td>${lecture.lectureName}</td>
|
||||
<td>${lecture.moduleName}</td>
|
||||
<td>${lecture.duration}</td>
|
||||
<td>${lectureDates}</td>
|
||||
<td>${lecturers}</td>
|
||||
<td>${studyClass}</td>
|
||||
<td>
|
||||
<div class="action-row">
|
||||
<button class="action-button edit" onclick="renderLectureModal(${lecture.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-pencil" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z" />
|
||||
</svg>
|
||||
</button>
|
||||
<button class="action-button delete" onclick="removeLecture(${lecture.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-trash" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
`
|
||||
let row = document.createElement("tr")
|
||||
row.id = "row" + lecture.id
|
||||
row.innerHTML = content
|
||||
document.getElementById("lecturesTable").appendChild(row)
|
||||
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,152 @@
|
||||
class LogicHandler {
|
||||
|
||||
getItems(type) {
|
||||
let items = JSON.parse(window.localStorage.getItem(type))
|
||||
return items == null ? [] : items
|
||||
}
|
||||
|
||||
getItem(type, id) {
|
||||
let item = JSON.parse(window.localStorage.getItem(type))
|
||||
return item == null ? {} : item.filter(item => {
|
||||
return item.id == id
|
||||
})[0]
|
||||
}
|
||||
|
||||
addItem(type, item) {
|
||||
let items = this.getItems(type)
|
||||
items[items.length] = item
|
||||
window.localStorage.setItem(type, JSON.stringify(items))
|
||||
}
|
||||
|
||||
updateItem(type, data) {
|
||||
let items = this.getItems(type)
|
||||
items.forEach((item, idx) => {
|
||||
if (item.id == data.id)
|
||||
items[idx] = data
|
||||
})
|
||||
window.localStorage.setItem(type, JSON.stringify(items))
|
||||
}
|
||||
|
||||
removeItem(type, id) {
|
||||
let items = this.getItems(type).filter(item => {
|
||||
return item.id != id
|
||||
})
|
||||
window.localStorage.setItem(type, JSON.stringify(items))
|
||||
}
|
||||
|
||||
saveItem(type, id, multiple = "s") {
|
||||
let json = this.getFormData(type + "Form" + id)
|
||||
if (!json) {
|
||||
document.getElementById(type + "Modal" + id).querySelector("p.error").classList.add("show")
|
||||
return
|
||||
}
|
||||
|
||||
json.id = id == "Create" ? this.getId(type) : id
|
||||
|
||||
if (id == "Create")
|
||||
this.addItem(type + multiple, json)
|
||||
else
|
||||
this.updateItem(type + multiple, json)
|
||||
|
||||
window.location.href = window.location.href.replace(window.location.search, "")
|
||||
}
|
||||
|
||||
getId(type) {
|
||||
var values = JSON.parse(window.localStorage.getItem("currentIds"))
|
||||
if (values == null)
|
||||
values = {}
|
||||
|
||||
if (values[type] == null)
|
||||
values[type] = 0
|
||||
|
||||
let id = values[type]
|
||||
values[type] = parseInt(values[type]) + 1
|
||||
window.localStorage.setItem("currentIds", JSON.stringify(values))
|
||||
return id
|
||||
}
|
||||
|
||||
getAsDataList(type, field, selected) {
|
||||
let datalist = ""
|
||||
Array.from(this.getItems(type)).forEach(item => {
|
||||
if (selected.length > 0 && selected.filter(select => { return parseInt(select) == item['id'] }).length > 0)
|
||||
datalist += `<option value="${item['id']}" selected>${item[field]}</option>`
|
||||
else
|
||||
datalist += `<option value="${item['id']}">${item[field]}</option>`
|
||||
})
|
||||
return datalist
|
||||
}
|
||||
|
||||
getAsDataListWithRange(type, rangeStart, rangeEnd, selected) {
|
||||
let datalist = ""
|
||||
Array.from(this.getItems(type)).forEach(item => {
|
||||
if (selected.length > 0 && selected.filter(select => { return parseInt(select) == item['id'] }).length > 0)
|
||||
datalist += `<option value="${item['id']}" selected>${this.formatDateTime(item[rangeStart])} - ${this.formatDateTime(item[rangeEnd])}</option>`
|
||||
else
|
||||
datalist += `<option value="${item['id']}">${this.formatDateTime(item[rangeStart])} - ${this.formatDateTime(item[rangeEnd])}</option>`
|
||||
})
|
||||
return datalist
|
||||
}
|
||||
|
||||
getAsDateList(type, field, selected) {
|
||||
let datalist = ""
|
||||
Array.from(this.getItems(type)).forEach(item => {
|
||||
if (selected.length > 0 && selected.filter(select => { return parseInt(select) == item['id'] }).length > 0)
|
||||
datalist += `<option value="${item['id']}" selected>${this.formatDateTimeToDate(item[field])}</option>`
|
||||
else
|
||||
datalist += `<option value="${item['id']}">${this.formatDateTimeToDate(item[field])}</option>`
|
||||
})
|
||||
return datalist
|
||||
}
|
||||
|
||||
getFormData(form) {
|
||||
let fields = Array.from(document.getElementById(form).querySelectorAll(".modalInput"))
|
||||
let json = {}
|
||||
let valid = true
|
||||
|
||||
fields.forEach(element => {
|
||||
if (typeof element.options != "undefined") {
|
||||
let values = []
|
||||
Array.from(element.options).forEach(option => {
|
||||
if (option.selected && !option.disabled)
|
||||
values.push(option.value)
|
||||
})
|
||||
if (values.length == 0)
|
||||
valid = false
|
||||
|
||||
json[element.name] = values
|
||||
} else {
|
||||
if (element.value.trim().length == 0)
|
||||
valid = false
|
||||
|
||||
json[element.name] = element.value
|
||||
}
|
||||
})
|
||||
|
||||
if (!valid)
|
||||
return false
|
||||
|
||||
return json
|
||||
}
|
||||
|
||||
formatDateTime(dateTime) {
|
||||
let split = dateTime.split("T")
|
||||
let dateSplit = split[0].split("-")
|
||||
|
||||
return dateSplit[2] + "." + dateSplit[1] + "." + dateSplit[0] + " " + split[1]
|
||||
}
|
||||
|
||||
formatDateTimeToDate(dateTime) {
|
||||
let split = dateTime.split("T")
|
||||
let dateSplit = split[0].split("-")
|
||||
|
||||
return dateSplit[2] + "." + dateSplit[1] + "." + dateSplit[0]
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener('load', function () {
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
|
||||
window.addEventListener('resize', function () {
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
@@ -0,0 +1,43 @@
|
||||
let logicHandler = new LogicHandler()
|
||||
let modalHandler = new SemesterModalHandler()
|
||||
|
||||
function renderSemesterModal(id) {
|
||||
id = typeof id == "undefined" ? "Create" : id
|
||||
|
||||
let semester = id == "Create" ? getEmptySemester() : logicHandler.getItem("semesters", id)
|
||||
|
||||
let startDateList = logicHandler.getAsDateList("lectureDates", "startDate", [semester.startDate])
|
||||
let endDateList = logicHandler.getAsDateList("lectureDates", "endDate", [semester.endDate])
|
||||
|
||||
let studyProgramList = logicHandler.getAsDataList("studyPrograms", "name", [semester.studyProgram])
|
||||
|
||||
document.body.append(modalHandler.getSemesterModal(semester, startDateList, endDateList, studyProgramList))
|
||||
document.body.append(modalHandler.getSemesterModalButton(id))
|
||||
let htmlButton = document.getElementById("modalButton" + id)
|
||||
htmlButton.click()
|
||||
htmlButton.remove()
|
||||
}
|
||||
|
||||
function cancelSemesterModal(id) {
|
||||
document.getElementById("semesterModal" + id).remove()
|
||||
}
|
||||
|
||||
function saveSemester(id) {
|
||||
logicHandler.saveItem("semester", id)
|
||||
}
|
||||
|
||||
function removeSemester(id) {
|
||||
logicHandler.removeItem("semesters", id)
|
||||
document.getElementById("row" + id).remove()
|
||||
}
|
||||
|
||||
function getEmptySemester() {
|
||||
return {
|
||||
id: "Create",
|
||||
name: "",
|
||||
startDate: "",
|
||||
endDate: "",
|
||||
number: "",
|
||||
studyProgram: ""
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,68 @@
|
||||
class SemesterModalHandler {
|
||||
getSemesterModal(semester, startDateList, endDateList, studyProgramList) {
|
||||
let heading = semester.id == "Create" ? "Neues Semester erstellen" : `Semester #${semester.id} bearbeiten`
|
||||
let modal = `
|
||||
<div class="modal modal-lg fade" id="semesterModal${semester.id}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="semesterModalLabel${semester.id}" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="semesterModalLabel${semester.id}">${heading}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Abbrechen" onclick="cancelSemesterModal('${semester.id}')"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p class="error"><i class="bi bi-exclamation-circle"></i> Bitte alle Felder ausfüllen.</p>
|
||||
<form id="semesterForm${semester.id}">
|
||||
<div class="mb-3">
|
||||
<label for="semesterNameInput" class="form-label">Semester-Name</label>
|
||||
<input type="text" class="form-control modalInput" id="semesterNameInput" name="name" value="${semester.name}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="startDateInput" class="form-label">Startdatum</label>
|
||||
<select class="form-select modalInput" id="startDateInput" name="startDate">
|
||||
<option selected hidden disabled>Bitte wählen</option>
|
||||
${startDateList}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="endDateInput" class="form-label">Enddatum</label>
|
||||
<select class="form-select modalInput" id="endDateInput" name="endDate">
|
||||
<option selected hidden disabled>Bitte wählen</option>
|
||||
${endDateList}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="semesterNumberInput" class="form-label">Semester (Nummer)</label>
|
||||
<input type="number" min="0" class="form-control modalInput" id="semesterNumberInput" name="number" value="${semester.number}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="studyProgramInput" class="form-label">Studiengang</label>
|
||||
<select class="form-select modalInput" id="studyProgramInput" name="studyProgram" >
|
||||
<option selected disabled hidden>Bitte wählen</option>
|
||||
${studyProgramList}
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="cancelSemesterModal('${semester.id}')">Abbrechen</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="saveSemester('${semester.id}')">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
|
||||
let htmlModal = document.createElement("div")
|
||||
htmlModal.innerHTML = modal
|
||||
return htmlModal
|
||||
}
|
||||
|
||||
getSemesterModalButton(id) {
|
||||
let button = `
|
||||
<button type="button" data-bs-toggle="modal" data-bs-target="#semesterModal${id}" id="modalButton${id}" style="display: none;"></button>
|
||||
`
|
||||
let htmlButton = document.createElement("div")
|
||||
htmlButton.innerHTML = button
|
||||
return htmlButton
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
window.addEventListener("load", function () {
|
||||
var logicHandler = new LogicHandler()
|
||||
|
||||
let semesters = logicHandler.getItems("semesters")
|
||||
|
||||
if (semesters != null) {
|
||||
semesters.forEach(semester => {
|
||||
|
||||
let studyProgram = logicHandler.getItem("studyPrograms", semester.studyProgram)
|
||||
studyProgram = typeof studyProgram == "undefined" ? "" : studyProgram.name
|
||||
|
||||
let content = `
|
||||
<th scope="row">${semester.id}</th>
|
||||
<td>${semester.name}</td>
|
||||
<td>${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", semester.startDate).startDate)}</td>
|
||||
<td>${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", semester.endDate).endDate)}</td>
|
||||
<td>${semester.number}</td>
|
||||
<td>${studyProgram}</td>
|
||||
<td>
|
||||
<div class="action-row">
|
||||
<button class="action-button edit" onclick="renderSemesterModal(${semester.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-pencil" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z" />
|
||||
</svg>
|
||||
</button>
|
||||
<button class="action-button delete" onclick="removeSemester(${semester.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-trash" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
`
|
||||
|
||||
let row = document.createElement("tr")
|
||||
row.id = "row" + semester.id
|
||||
row.innerHTML = content
|
||||
document.getElementById("semestersTable").appendChild(row)
|
||||
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,43 @@
|
||||
let logicHandler = new LogicHandler()
|
||||
let modalHandler = new StudyClassModalHandler()
|
||||
|
||||
function renderStudyClassModal(id) {
|
||||
id = typeof id == "undefined" ? "Create" : id
|
||||
|
||||
let studyClass = id == "Create" ? getEmptyStudyClass() : logicHandler.getItem("studyClasses", id)
|
||||
|
||||
let startDateList = logicHandler.getAsDateList("lectureDates", "startDate", [studyClass.startDate])
|
||||
let endDateList = logicHandler.getAsDateList("lectureDates", "endDate", [studyClass.endDate])
|
||||
let semesterList = logicHandler.getAsDataList("semesters", "name", [studyClass.semester])
|
||||
let studyProgramList = logicHandler.getAsDataList("studyPrograms", "name", [studyClass.studyProgram])
|
||||
|
||||
document.body.append(modalHandler.getStudyClassModal(studyClass, semesterList, startDateList, endDateList, studyProgramList))
|
||||
document.body.append(modalHandler.getStudyClassModalButton(id))
|
||||
let htmlButton = document.getElementById("studyClassButton" + id)
|
||||
htmlButton.click()
|
||||
htmlButton.remove()
|
||||
}
|
||||
|
||||
function cancelStudyClassModal(id) {
|
||||
document.getElementById("studyClassModal" + id).remove()
|
||||
}
|
||||
|
||||
function saveStudyClass(id) {
|
||||
logicHandler.saveItem("studyClass", id, "es")
|
||||
}
|
||||
|
||||
function removeStudyClass(id) {
|
||||
logicHandler.removeItem("studyClasses", id)
|
||||
document.getElementById("row" + id).remove()
|
||||
}
|
||||
|
||||
function getEmptyStudyClass() {
|
||||
return {
|
||||
id: "Create",
|
||||
name: "",
|
||||
startDate: "",
|
||||
endDate: "",
|
||||
semester: "",
|
||||
studyProgram: ""
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,73 @@
|
||||
class StudyClassModalHandler {
|
||||
|
||||
getStudyClassModal(studyClass, semesterList, startDateList, endDateList, studyProgramList) {
|
||||
let heading = studyClass.id == "Create" ? "Neuen Jahrgang erstellen" : `Jahrgang #${studyClass.id} bearbeiten`
|
||||
let modal = `
|
||||
<div class="modal modal-lg fade" id="studyClassModal${studyClass.id}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="lecturerModalLabel${studyClass.id}" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="studyClassModalLabel${studyClass.id}">${heading}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Abbrechen" onclick="cancelStudyClassModal('${studyClass.id}')"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p class="error"><i class="bi bi-exclamation-circle"></i> Bitte alle Felder ausfüllen.</p>
|
||||
<form id="studyClassForm${studyClass.id}">
|
||||
<div class="mb-3">
|
||||
<label for="studyClassNameInput" class="form-label">Name</label>
|
||||
<input type="text" class="form-control modalInput" id="studyClassNameInput" name="name" value="${studyClass.name}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="startDateInput" class="form-label">Startdatum</label>
|
||||
<select class="form-select modalInput" id="startDateInput" name="startDate" >
|
||||
<option selected disabled hidden>Bitte wählen</option>
|
||||
${startDateList}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="endDateInput" class="form-label">Enddatum</label>
|
||||
<select class="form-select modalInput" id="endDateInput" name="endDate" >
|
||||
<option selected disabled hidden>Bitte wählen</option>
|
||||
${endDateList}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="semesterInput" class="form-label">Semester</label>
|
||||
<select class="form-select modalInput" id="semesterInput" name="semester">
|
||||
<option selected disabled hidden>Bitte wählen</option>
|
||||
${semesterList}
|
||||
</select>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="studyProgramInput" class="form-label">Studiengang</label>
|
||||
<select class="form-select modalInput" id="studyProgramInput" name="studyProgram" >
|
||||
<option selected disabled hidden>Bitte wählen</option>
|
||||
${studyProgramList}
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="cancelStudyClassModal('${studyClass.id}')">Abbrechen</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="saveStudyClass('${studyClass.id}')">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
|
||||
let htmlModal = document.createElement("div")
|
||||
htmlModal.innerHTML = modal
|
||||
return htmlModal
|
||||
}
|
||||
|
||||
getStudyClassModalButton(id) {
|
||||
let button = `
|
||||
<button type="button" data-bs-toggle="modal" data-bs-target="#studyClassModal${id}" id="studyClassButton${id}" style="display: none;"></button>
|
||||
`
|
||||
|
||||
let htmlButton = document.createElement("div")
|
||||
htmlButton.innerHTML = button
|
||||
return htmlButton
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
window.addEventListener("load", function () {
|
||||
let logicHandler = new LogicHandler()
|
||||
|
||||
let studyClasses = logicHandler.getItems("studyClasses")
|
||||
|
||||
|
||||
if (studyClasses != null) {
|
||||
studyClasses.forEach(studyClass => {
|
||||
|
||||
let studyProgram = logicHandler.getItem("studyPrograms", studyClass.studyProgram)
|
||||
studyProgram = typeof studyProgram == "undefined" ? "" : studyProgram.name
|
||||
|
||||
let content = `
|
||||
<th scope="row">${studyClass.id}</th>
|
||||
<td>${studyClass.name}</td>
|
||||
<td>${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", studyClass.startDate).startDate)}</td>
|
||||
<td>${logicHandler.formatDateTimeToDate(logicHandler.getItem("lectureDates", studyClass.endDate).endDate)}</td>
|
||||
<td>${logicHandler.getItem("semesters", studyClass.semester).name}</td>
|
||||
<td>${studyProgram}</td>
|
||||
<td>
|
||||
<div class="action-row">
|
||||
<button class="action-button edit" onclick="renderStudyClassModal(${studyClass.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-pencil" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z" />
|
||||
</svg>
|
||||
</button>
|
||||
<button class="action-button delete" onclick="removeStudyClass(${studyClass.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-trash" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
`
|
||||
let row = document.createElement("tr")
|
||||
row.id = "row" + studyClass.id
|
||||
row.innerHTML = content
|
||||
document.getElementById("studyClassTable").appendChild(row)
|
||||
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,35 @@
|
||||
let logicHandler = new LogicHandler()
|
||||
let modalHandler = new StudyProgramModalHandler()
|
||||
|
||||
function renderStudyProgramModal(id) {
|
||||
id = typeof id == "undefined" ? "Create" : id
|
||||
|
||||
let studyProgram = id == "Create" ? getEmptyStudyProgram() : logicHandler.getItem("studyPrograms", id)
|
||||
|
||||
document.body.append(modalHandler.getStudyProgramModal(studyProgram))
|
||||
document.body.append(modalHandler.getStudyProgramModalButton(id))
|
||||
let htmlButton = document.getElementById("modalButton" + id)
|
||||
htmlButton.click()
|
||||
htmlButton.remove()
|
||||
}
|
||||
|
||||
function cancelStudyProgramModal(id) {
|
||||
document.getElementById("studyProgramModal" + id).remove()
|
||||
}
|
||||
|
||||
function saveStudyProgram(id) {
|
||||
logicHandler.saveItem("studyProgram", id)
|
||||
}
|
||||
|
||||
function removeStudyProgram(id) {
|
||||
logicHandler.removeItem("studyPrograms", id)
|
||||
document.getElementById("row" + id).remove()
|
||||
}
|
||||
|
||||
function getEmptyStudyProgram() {
|
||||
return {
|
||||
id: "Create",
|
||||
name: "",
|
||||
short: ""
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
class StudyProgramModalHandler {
|
||||
|
||||
getStudyProgramModal(studyProgram) {
|
||||
let heading = studyProgram.id == "Create" ? "Neuen Studiengang erstellen" : `Studiengang #${studyProgram.id} bearbeiten`
|
||||
let modal = `
|
||||
<div class="modal modal-lg fade" id="studyProgramModal${studyProgram.id}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="studyProgramModalLabel${studyProgram.id}" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-scrollable">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="studyProgramModalLabel${studyProgram.id}">${heading}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Abbrechen" onclick="cancelStudyProgramModal('${studyProgram.id}')"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p class="error"><i class="bi bi-exclamation-circle"></i> Bitte alle Felder ausfüllen.</p>
|
||||
<form id="studyProgramForm${studyProgram.id}">
|
||||
<div class="mb-3">
|
||||
<label for="nameInput" class="form-label">Name</label>
|
||||
<input type="text" class="form-control modalInput" id="nameInput" name="name" value="${studyProgram.name}" >
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="shortInput" class="form-label">Kürzel</label>
|
||||
<input type="text" class="form-control modalInput" id="shortInput" name="short" value="${studyProgram.short}" >
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" onclick="cancelStudyProgramModal('${studyProgram.id}')">Abbrechen</button>
|
||||
<button type="button" class="btn btn-secondary" onclick="saveStudyProgram('${studyProgram.id}')">Speichern</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
|
||||
let htmlModal = document.createElement("div")
|
||||
htmlModal.innerHTML = modal
|
||||
return htmlModal
|
||||
}
|
||||
|
||||
getStudyProgramModalButton(id) {
|
||||
let button = `
|
||||
<button type="button" data-bs-toggle="modal" data-bs-target="#studyProgramModal${id}" id="modalButton${id}" style="display: none;"></button>
|
||||
`
|
||||
|
||||
let htmlButton = document.createElement("div")
|
||||
htmlButton.innerHTML = button
|
||||
return htmlButton
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
window.addEventListener("load", function () {
|
||||
let logicHandler = new LogicHandler()
|
||||
|
||||
let studyPrograms = logicHandler.getItems("studyPrograms")
|
||||
|
||||
if (studyPrograms != null) {
|
||||
studyPrograms.forEach(studyProgram => {
|
||||
|
||||
let content = `
|
||||
<th scope="row">${studyProgram.id}</th>
|
||||
<td>${studyProgram.name}</td>
|
||||
<td>${studyProgram.short}</td>
|
||||
<td>
|
||||
<div class="action-row">
|
||||
<button class="action-button edit" onclick="renderStudyProgramModal(${studyProgram.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-pencil" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M12.146.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1 0 .708l-10 10a.5.5 0 0 1-.168.11l-5 2a.5.5 0 0 1-.65-.65l2-5a.5.5 0 0 1 .11-.168l10-10zM11.207 2.5 13.5 4.793 14.793 3.5 12.5 1.207 11.207 2.5zm1.586 3L10.5 3.207 4 9.707V10h.5a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 .5.5v.5h.293l6.5-6.5zm-9.761 5.175-.106.106-1.528 3.821 3.821-1.528.106-.106A.5.5 0 0 1 5 12.5V12h-.5a.5.5 0 0 1-.5-.5V11h-.5a.5.5 0 0 1-.468-.325z" />
|
||||
</svg>
|
||||
</button>
|
||||
<button class="action-button delete" onclick="removeStudyProgram(${studyProgram.id})">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-trash" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1zM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118zM2.5 3V2h11v1h-11z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
`
|
||||
|
||||
let row = document.createElement("tr")
|
||||
row.id = "row" + studyProgram.id
|
||||
row.innerHTML = content
|
||||
document.getElementById("studyProgramTable").appendChild(row)
|
||||
|
||||
document.getElementsByClassName("sidebar")[0].style.minHeight = `${document.body.offsetHeight - 66}px`
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,279 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="../assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="../index.html#home">
|
||||
<img class="navlogo" src="../assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="" role="button" data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item" href="../semesters/index.html">Semester</a></li>
|
||||
<li><a class="dropdown-item" href="../lecturers/index.html">Dozenten</a></li>
|
||||
<li><a class="dropdown-item" href="../lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item" href="../studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item" href="../studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link active" href="../dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="content container">
|
||||
<aside class="sidebar" id="sidebar">
|
||||
<ul class="nav navbar-dark">
|
||||
<li class="nav-item">
|
||||
<a href="../lectures/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Vorlesungen">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z" />
|
||||
<path
|
||||
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
|
||||
<path
|
||||
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../semesters/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Semester">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2zm1 12h2V2h-2v12zm-3 0V7H7v7h2zm-5 0v-3H2v3h2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lecturers/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Dozenten">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lectureDates/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Termine">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" />
|
||||
<path
|
||||
d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyClasses/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Jahrgänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.5 0a.5.5 0 0 1 .5.5v15a.5.5 0 0 1-1 0V.5A.5.5 0 0 1 .5 0zM2 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyProgram/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Studiengänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<section class="dashboard">
|
||||
<h1 class="mb-5">
|
||||
Dashboard
|
||||
<div class="btn-group">
|
||||
<button class="dash-select btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown"
|
||||
aria-expanded="false" id="dropdown-button">
|
||||
Dozent wählen
|
||||
</button>
|
||||
<ul class="dropdown-menu" id="dropdown"></ul>
|
||||
</div>
|
||||
</h1>
|
||||
|
||||
<div class="row full">
|
||||
<div class="col-lg-6 col-md-12 mb-4">
|
||||
<div class="card-cust bg-white p-4 rounded box">
|
||||
<h3>Vorlesungstermine</h3>
|
||||
<ul class="lectureList">
|
||||
<li>
|
||||
<p class="card-text placeholder-glow">
|
||||
<span class="placeholder col-4"></span>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p class="card-text placeholder-glow">
|
||||
<span class="placeholder col-7"></span>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p class="card-text placeholder-glow">
|
||||
<span class="placeholder col-11"></span>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p class="card-text placeholder-glow">
|
||||
<span class="placeholder col-5"></span>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
<p class="card-text placeholder-glow">
|
||||
<span class="placeholder col-6"></span>
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-12 mb-4">
|
||||
<div class="card-cust bg-white p-4 rounded box">
|
||||
<div class="row">
|
||||
<div class="col-xxl-3 col-xl-4 col-lg-5 col-md-3 mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" fill="#e2001a"
|
||||
class="bi bi-person-circle" viewBox="0 0 16 16">
|
||||
<path d="M11 6a3 3 0 1 1-6 0 3 3 0 0 1 6 0z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8zm8-7a7 7 0 0 0-5.468 11.37C3.242 11.226 4.805 10 8 10s4.757 1.225 5.468 2.37A7 7 0 0 0 8 1z" />
|
||||
</svg>
|
||||
</div>
|
||||
<div class="col-xxl-7 col-xl-6 col-lg-5 col-md-6 person">
|
||||
<h4 class="card-text placeholder-glow" id="lecturerName">
|
||||
<span class="placeholder col-6"></span>
|
||||
</h4>
|
||||
<p class="card-text placeholder-glow" id="lecturerTitle">
|
||||
<span class="placeholder col-4"></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<button class="action-button edit placeholder disabled" id="lecturerEditButton"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="details">
|
||||
<div class="mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-envelope-fill" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757Zm3.436-.586L16 11.801V4.697l-5.803 3.546Z" />
|
||||
</svg>
|
||||
<span class="card-text placeholder-glow" id="lecturerMail">
|
||||
<span class="placeholder col-7"></span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
<span class="card-text placeholder-glow" id="lecturerProgram">
|
||||
<span class="placeholder col-9"></span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
class="bi bi-person-vcard" viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M5 8a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm4-2.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5ZM9 8a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4A.5.5 0 0 1 9 8Zm1 2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1-.5-.5Z" />
|
||||
<path
|
||||
d="M2 2a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H2ZM1 4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H8.96c.026-.163.04-.33.04-.5C9 10.567 7.21 9 5 9c-2.086 0-3.8 1.398-3.984 3.181A1.006 1.006 0 0 1 1 12V4Z" />
|
||||
</svg>
|
||||
Weiteres
|
||||
<p class="card-text placeholder-glow mt-2" id="lecturerOther">
|
||||
<span class="placeholder col-4"></span>
|
||||
<span class="placeholder col-6"></span>
|
||||
<span class="placeholder col-7"></span>
|
||||
<span class="placeholder col-2"></span>
|
||||
<span class="placeholder col-9"></span>
|
||||
<span class="placeholder col-3"></span>
|
||||
<span class="placeholder col-4"></span>
|
||||
<span class="placeholder col-2"></span>
|
||||
<span class="placeholder col-7"></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script src="../assets/js/logicHandler.js"></script>
|
||||
<script src="../assets/js/dashboard/dashboardLogicHandler.js"></script>
|
||||
|
||||
<script src="../assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
+332
@@ -0,0 +1,332 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="#start">
|
||||
<img class="navlogo" src="assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="#start">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="" role="button"
|
||||
data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="./lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item" href="./semesters/index.html">Semester</a></li>
|
||||
<li><a class="dropdown-item" href="./lecturers/index.html">Dozenten</a></li>
|
||||
<li><a class="dropdown-item" href="./lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item" href="./studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item" href="./studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link" href="./dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<section class="content-section" id="start">
|
||||
<div id="carousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-indicators">
|
||||
<button type="button" data-bs-target="#carousel" data-bs-slide-to="0" class="active"
|
||||
aria-current="true" aria-label="Slide 1"></button>
|
||||
<button type="button" data-bs-target="#carousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
|
||||
<button type="button" data-bs-target="#carousel" data-bs-slide-to="2" aria-label="Slide 3"></button>
|
||||
</div>
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="https://images.pexels.com/photos/1122865/pexels-photo-1122865.jpeg"
|
||||
class="d-block w-100" alt="Ein Student">
|
||||
<div class="carousel-caption">
|
||||
<h3>Struktur</h3>
|
||||
<p>Als Student ist es wichtig den Überblick über seinen Alltag zu behalten.<br />
|
||||
Wann hat man welche Vorlesung?<br />
|
||||
Wie kontaktiert man seine Dozenten?<br />
|
||||
Der Uniplanner hilft seinen Benutzern genau in diesen Bereichen.<br />
|
||||
Mit ihm ist es einfacher denn je, seinen Tag in der Universität ordentlich zu planen und
|
||||
umzusetzen.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="https://images.pexels.com/photos/1409215/pexels-photo-1409215.jpeg"
|
||||
class="d-block w-100" alt="Ein Student">
|
||||
<div class="carousel-caption">
|
||||
<h3>Alles in einem Tool</h3>
|
||||
<p>Mit dem Uniplanner können Studenten nicht nur ihre Vorlesungen strukturieren.
|
||||
Auch das verwalten von Kontaktdaten der Dozenten sowie eine Kursübergreifende
|
||||
Terminplanung ist durch unsere Systeme einfacher denn je.<br />
|
||||
Mit dem Uniplanner behält die gesamte Universität den Plan im Griff.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="https://images.pexels.com/photos/3184454/pexels-photo-3184454.jpeg"
|
||||
class="d-block w-100" alt="Ein Klassenraum">
|
||||
<div class="carousel-caption">
|
||||
<h3>Digitalisierung</h3>
|
||||
<p>Der digitale Uniplanner bietet den Studenten neue Möglichkeiten für ihren Alltag.<br />
|
||||
Anders als herkömmliche Stundenpläne ist der Uniplanner jederzeit im Internet abrufbar
|
||||
und durch seine verschiedensten Funktionalitäten wie dem Bearbeiten, Löschen und
|
||||
Hinzufügen von Vorlesungen wird es Studenten ermöglicht jegliche Fehler sofort zu
|
||||
beheben.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#carousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
|
||||
<span class="visually-hidden">Previous</span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#carousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon" aria-hidden="true"></span>
|
||||
<span class="visually-hidden">Next</span>
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="ueber-uns" class="content-section">
|
||||
<div class="container">
|
||||
<div class="section-title">
|
||||
<h2>Über uns</h2>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
|
||||
</div>
|
||||
<div class="row" id="team">
|
||||
<div class="col-12 col-lg-4 mb-4">
|
||||
<div class="bg-white p-4 text-center rounded box">
|
||||
<img class="img-responsive rounded-circle" src="./assets/img/AliFistik.jpg" width="90">
|
||||
|
||||
<h5 class="mt-3 name">Ali Fistik</h5>
|
||||
<span class="work d-block">Dualer Student</span>
|
||||
<span class="work d-block px-4">
|
||||
<a href="https://www.linkedin.com/in/ali-fistik-186181252/" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#0a66c2"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="mailto:ali.fistik@uniplanner.de">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="gray"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757Zm3.436-.586L16 11.801V4.697l-5.803 3.546Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</span>
|
||||
<div class="mt-4 about px-4">
|
||||
Persistence. Perfection. Prioritize your passion.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-lg-4 mb-4">
|
||||
<div class="bg-white p-4 text-center rounded box">
|
||||
<img class="img-responsive rounded-circle" src="./assets/img/JonasBraus.jpg" width="90">
|
||||
|
||||
<h5 class="mt-3 name px-4">Jonas Braus</h5>
|
||||
<span class="work d-block">Dualer Student</span>
|
||||
<span class="work d-block px-4">
|
||||
<a href="https://www.linkedin.com/in/jonas-braus-b99259252/" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#0a66c2"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="mailto:jonas.braus@uniplanner.de">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="gray"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757Zm3.436-.586L16 11.801V4.697l-5.803 3.546Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<div class="mt-4 about px-4">
|
||||
Price is what you pay. Value is what you get.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-lg-4 mb-4">
|
||||
<div class="bg-white p-4 text-center rounded box">
|
||||
<img class="img-responsive rounded-circle" src="./assets/img/SimonSchmieder.jpg" width="90">
|
||||
|
||||
<h5 class="mt-3 name px-4">Simon Schmieder</h5>
|
||||
<span class="work d-block">Dualer Student</span>
|
||||
<span class="work d-block px-4">
|
||||
<a href="https://www.linkedin.com/in/simon-schmieder/" target="_blank">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="#0a66c2"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854V1.146zm4.943 12.248V6.169H2.542v7.225h2.401zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248-.822 0-1.359.54-1.359 1.248 0 .694.521 1.248 1.327 1.248h.016zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016a5.54 5.54 0 0 1 .016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225h2.4z" />
|
||||
</svg>
|
||||
</a>
|
||||
<a href="mailto:simon.schmieder@uniplanner.de">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="gray"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757Zm3.436-.586L16 11.801V4.697l-5.803 3.546Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<div class="mt-4 about px-4">
|
||||
Best way to predict your future is to create IT.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="funktionen" class="content-section">
|
||||
<div class="container">
|
||||
<div class="section-title">
|
||||
<h2>Funktionen</h2>
|
||||
</div>
|
||||
<div>
|
||||
<p class="mb-3">
|
||||
Herzlich Willkommen auf uniplanner.de <br>
|
||||
UniPlanner ist <strong>DEIN</strong> Online-Tool für die Planung sämtlicher studienrelevanten
|
||||
Themen!
|
||||
</p>
|
||||
|
||||
<h5>Wie funktionierts? </h5>
|
||||
|
||||
<p>
|
||||
Mit UniPlanner kannst du kostenlos Einträge für Vorlesungen, Semester, Dozenten und Weiteres
|
||||
anlegen. Womit du am Besten anfängst
|
||||
erfährst du in diesem kurzen Guide.
|
||||
</p>
|
||||
<ul>
|
||||
<li>
|
||||
Über das Dropdownmenü "Verwaltung", gelangst du zu den jeweiligen Seiten für die
|
||||
Datenerfassung
|
||||
</li>
|
||||
<li>
|
||||
Zu Beginn kannst du einen <a href="./studyProgram/index.html" target="_blank">
|
||||
Studiengang</a>, sowie einen oder mehrere <a href="./lectureDates/index.html"
|
||||
target="_blank">Termine</a>, bestehend aus einem
|
||||
Start- und Enddatum, so wie der jeweiligen Uhrzeit, anlegen
|
||||
</li>
|
||||
<li>
|
||||
Hast du das getan, ist es dir bereits möglich <a href="./semesters/index.html"
|
||||
target="_blank">Semester</a> und <a href="./lecturers/index.html"
|
||||
target="_blank">Dozenten</a> mit allen erforderlichen
|
||||
Daten einzutragen
|
||||
</li>
|
||||
<li>
|
||||
Navigiere nun in den Bereich <a href="./studyClasses/index.html"
|
||||
target="_blank">Jahrgänge</a> und trage die jeweiligen Daten ein
|
||||
</li>
|
||||
<li>
|
||||
Du hast nun alle nötigen Daten um Einträge zu <a href="./lectures/index.html"
|
||||
target="_blank">Vorlesungen</a> zu erstellen
|
||||
</li>
|
||||
<li>
|
||||
Nachdem alle Daten ins System eingetragen wurden kannst du über das <a
|
||||
href="./dashboard/index.html" target="_blank">Dashboard</a> einen Dozenten
|
||||
auswählen, um dir seine Kontaktdaten, Vorlesungen und einige weiteren Daten anzusehen
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="impressum" class="content-section">
|
||||
<div class="container">
|
||||
<div>
|
||||
<div class='impressum'>
|
||||
<h2>Impressum</h2>
|
||||
<p>Angaben gemäß § 5 TMG</p>
|
||||
<p>Simon Schmieder <br>
|
||||
Musterstraße 1<br>
|
||||
79576 Weil am Rhein <br>
|
||||
</p>
|
||||
<p><strong>Vertreten durch: </strong><br>
|
||||
Ali Fistik, Jonas Braus<br>
|
||||
</p>
|
||||
<p><strong>Kontakt:</strong> <br>
|
||||
Telefon: 01234-789456<br>
|
||||
Fax: 1234-56789<br>
|
||||
E-Mail: <a href='mailto:kontakt@uniplanner.de'>kontakt@uniplanner.de</a></br></p>
|
||||
<p><strong>Umsatzsteuer-ID: </strong> <br>
|
||||
Umsatzsteuer-Identifikationsnummer gemäß §27a Umsatzsteuergesetz: 0123456789<br><br>
|
||||
<strong>Wirtschafts-ID: </strong><br>
|
||||
0123456789<br>
|
||||
</p>
|
||||
<p><strong>Aufsichtsbehörde:</strong><br>
|
||||
Bezirksgericht Freiburg im Breisgau<br></p>
|
||||
<br />
|
||||
<p style="font-size: 10px; opacity: 0.5;">
|
||||
Website Impressum erstellt durch <a
|
||||
href="https://www.impressum-generator.de">impressum-generator.de</a> von der <a
|
||||
href="https://www.kanzlei-hasselbach.de/" rel="nofollow">Kanzlei Hasselbach</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script src="./assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,195 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="../assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="../index.html#home">
|
||||
<img class="navlogo" src="../assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle active" href="" role="button"
|
||||
data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item" href="../semesters/index.html">Semester</a></li>
|
||||
<li><a class="dropdown-item" href="../lecturers/index.html">Dozenten</a></li>
|
||||
<li><a class="dropdown-item active" href="../lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item" href="../studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item" href="../studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link" href="../dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="content container">
|
||||
<aside class="sidebar">
|
||||
<ul class="nav navbar-dark">
|
||||
<li class="nav-item">
|
||||
<a href="../lectures/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Vorlesungen">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z" />
|
||||
<path
|
||||
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
|
||||
<path
|
||||
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../semesters/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Semester">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2zm1 12h2V2h-2v12zm-3 0V7H7v7h2zm-5 0v-3H2v3h2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lecturers/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Dozenten">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lectureDates/index.html" class="nav-link active" data-bs-toggle="tooltip"
|
||||
data-bs-placement="right" data-bs-title="Termine">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" />
|
||||
<path
|
||||
d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyClasses/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Jahrgänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.5 0a.5.5 0 0 1 .5.5v15a.5.5 0 0 1-1 0V.5A.5.5 0 0 1 .5 0zM2 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyProgram/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Studiengänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<section>
|
||||
<h1 class="table-heading">
|
||||
Vorlesungstermine
|
||||
<span class="add-button" onclick="renderLectureDateModal()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-plus"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
|
||||
</svg>
|
||||
</span>
|
||||
</h1>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" id="id">#</th>
|
||||
<th scope="col" id="startDate">Startdatum</th>
|
||||
<th scope="col" id="endDate">Enddatum</th>
|
||||
<th scope="col" class="text-center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="lectureDateTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
||||
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
|
||||
</script>
|
||||
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<script src="../assets/js/logicHandler.js"></script>
|
||||
<script src="../assets/js/lectureDates/lectureDateModalHandler.js"></script>
|
||||
<script src="../assets/js/lectureDates/lectureDateLogicHandler.js"></script>
|
||||
<script src="../assets/js/lectureDates/lectureDateTableHandler.js"></script>
|
||||
|
||||
<script src="../assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,197 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="../assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="../index.html#home">
|
||||
<img class="navlogo" src="../assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle active" href="" role="button"
|
||||
data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item" href="../semesters/index.html">Semester</a></li>
|
||||
<li><a class="dropdown-item active" href="../lecturers/index.html">Dozenten</a></li>
|
||||
<li><a class="dropdown-item" href="../lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item" href="../studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item" href="../studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link" href="../dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="content container">
|
||||
<aside class="sidebar">
|
||||
<ul class="nav navbar-dark">
|
||||
<li class="nav-item">
|
||||
<a href="../lectures/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Vorlesungen">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z" />
|
||||
<path
|
||||
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
|
||||
<path
|
||||
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../semesters/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Semester">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2zm1 12h2V2h-2v12zm-3 0V7H7v7h2zm-5 0v-3H2v3h2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lecturers/index.html" class="nav-link active" data-bs-toggle="tooltip"
|
||||
data-bs-placement="right" data-bs-title="Dozenten">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lectureDates/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Termine">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" />
|
||||
<path
|
||||
d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyClasses/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Jahrgänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.5 0a.5.5 0 0 1 .5.5v15a.5.5 0 0 1-1 0V.5A.5.5 0 0 1 .5 0zM2 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyProgram/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Studiengänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<section>
|
||||
<h1 class="table-heading">
|
||||
Dozenten
|
||||
<span class="add-button" onclick="renderLecturerModal()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-plus"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
|
||||
</svg>
|
||||
</span>
|
||||
</h1>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" id="id">#</th>
|
||||
<th scope="col" id="lecturerFirstName">Vorname</th>
|
||||
<th scope="col" id="lecturerLastName">Nachname</th>
|
||||
<th scope="col" id="lecturerEmail">Email</th>
|
||||
<th scope="col" id="studyProgram">Studiengang</th>
|
||||
<th scope="col" class="text-center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="lecturersTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
||||
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
|
||||
</script>
|
||||
|
||||
<script src="../assets/js/logicHandler.js"></script>
|
||||
<script src="../assets/js/lecturers/lecturerModalHandler.js"></script>
|
||||
<script src="../assets/js/lecturers/lecturerLogicHandler.js"></script>
|
||||
<script src="../assets/js/lecturers/lecturerTableHandler.js"></script>
|
||||
|
||||
<script src="../assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,201 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="../assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="../index.html#home">
|
||||
<img class="navlogo" src="../assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle active" href="" role="button"
|
||||
data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item active" href="../lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item" href="../semesters/index.html">Semester</a>
|
||||
</li>
|
||||
<li><a class="dropdown-item" href="../lecturers/index.html">Dozenten</a>
|
||||
</li>
|
||||
<li><a class="dropdown-item" href="../lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item" href="../studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item" href="../studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link" href="../dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="content container">
|
||||
<aside class="sidebar">
|
||||
<ul class="nav navbar-dark">
|
||||
<li class="nav-item">
|
||||
<a href="../lectures/index.html" class="nav-link active" data-bs-toggle="tooltip"
|
||||
data-bs-placement="right" data-bs-title="Vorlesungen">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z" />
|
||||
<path
|
||||
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
|
||||
<path
|
||||
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../semesters/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Semester">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2zm1 12h2V2h-2v12zm-3 0V7H7v7h2zm-5 0v-3H2v3h2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lecturers/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Dozenten">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lectureDates/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Termine">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" />
|
||||
<path
|
||||
d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyClasses/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Jahrgänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.5 0a.5.5 0 0 1 .5.5v15a.5.5 0 0 1-1 0V.5A.5.5 0 0 1 .5 0zM2 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyProgram/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Studiengänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<section>
|
||||
<h1 class="table-heading">
|
||||
Vorlesungen
|
||||
<span class="add-button" onclick="renderLectureModal()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-plus"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
|
||||
</svg>
|
||||
</span>
|
||||
</h1>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" id="id">#</th>
|
||||
<th scope="col" id="lectureName">Name</th>
|
||||
<th scope="col" class="responsive-column" id="moduleName">Modul</th>
|
||||
<th scope="col" class="responsive-column" id="duration">Dauer</th>
|
||||
<th scope="col" class="responsive-column" id="lectureDates">Termine</th>
|
||||
<th scope="col" class="responsive-column" id="lecturers">Dozenten</th>
|
||||
<th scope="col" id="studyClass">Jahrgang</th>
|
||||
<th scope="col" class="text-center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="lecturesTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
||||
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
|
||||
</script>
|
||||
|
||||
<script src="../assets/js/logicHandler.js"></script>
|
||||
<script src="../assets/js/lectures/lectureModalHandler.js"></script>
|
||||
<script src="../assets/js/lectures/lectureLogicHandler.js"></script>
|
||||
<script src="../assets/js/lectures/lectureTableHandler.js"></script>
|
||||
|
||||
<script src="../assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,94 @@
|
||||
# UniPlanner
|
||||
|
||||
## Inhaltsverzeichnis
|
||||
1. Projektbeschreibung
|
||||
2. Projektarchitektur
|
||||
1. Technologien
|
||||
2. Anforderungen
|
||||
3. Farbschema
|
||||
4. Anleitung zum starten
|
||||
|
||||
## Projektbeschreibung
|
||||
Der UniPlanner ist eine WebAnwendung, mit der
|
||||
- Vorlesungen
|
||||
- Semester
|
||||
- Dozenten
|
||||
- Termine
|
||||
- Jahrgänge
|
||||
- Studiengänge
|
||||
|
||||
verwaltet werden können.
|
||||
|
||||
Die Webseite ist dabei aufgeteilt in eine statische Hauptseite und einen Verwaltungsbereich mit Dashboard.
|
||||
|
||||
Die Hauptseite mit Carousel enthält einige Informationen über uns und die Anwendung sowie ein Impressum.
|
||||
|
||||
Im Verwaltungsbereich befinden sich Unterseiten, die per Dropdown oder per Sidebar erreicht werden können.
|
||||
Auf jeder dieser Unterseiten kann ein "Datentyp" verwaltet werden (Einsehen, Erstellen, Editieren und Löschen).
|
||||
Die einzelnen Datentypen verweisen dabei teilweise auf andere Datentypen, wodurch eine Reihenfolge der Eingaben vorgegeben ist.
|
||||
Um Elemente zu erstellen müssen stets alle Felder ausgefüllt werden.
|
||||
|
||||
Über das Dashboard können mithilfe eines Dropdown-Menüs Dozenten einzeln gewählt und angezeigt werden. Hierbei werden Vorlesungen mit Jahrgang und dem ersten Vorlesungstermin angezeigt, außerdem sind einige Informationen über den Dozenten einsehbar.
|
||||
|
||||
## Projektarchitektur
|
||||
Das Projekt ist in 2 Teile zu unterteilen.
|
||||
Im Hauptordner befinden sich die einzelnen HTML Dateien, die über eine Ordnerstruktur den Webseitenaufbau abbilden.
|
||||
Im Assets-Ordner befinden sich alle JavaScript und CSS Dateien, welche in den einzelnen HTML Dateien importiert werden.
|
||||
|
||||
### Technologien
|
||||
|
||||
#### HTML
|
||||
HTML ist eine Markdownsprache, mit der die Struktur von Webseiten beschrieben werden kann.
|
||||
Wir haben unsere Webseite mit HTML5 aufgebaut und in Bereiche wie <code>header</code>, <code>main</code> und <code>footer</code> aufgeteilt.
|
||||
|
||||
#### CSS
|
||||
CSS ist eine Sprache, mit der HTML Elemente gestyled werden können.
|
||||
In der Datei assets/styles.css befinden sich alle unsere Styledefinitionen (Bootstrap ausgenommen).
|
||||
Wir haben CSS3 verwendet, um eigene Styles zu definieren und bestehende HTML sowie Bootstrap Styles zu überschreiben.
|
||||
|
||||
#### JavaScript
|
||||
JavaScript (JS) ist eine Scriptsprache, mit der Webseiten interaktiv aufgebaut werden können.
|
||||
Wir haben auf unserer Webseite JavaScript verwendet, um Daten im Lokalen Speicher des Browsers abzulegen, HTML Code für Popups und Tabellen zu generieren und styles von HTML Elementen anzupassen (...).
|
||||
|
||||
Unsere JS Dateien verweisen dabei nicht aufeinander, können jedoch Elemente aus anderen Dateien verwenden, da wir sie in einer speziellen Reihenfolge in den HTML Code importiert haben. Die Hauptkomponente stellt hierbei der LogicHandler (assets/logicHandler.js) dar, welcher sich mit der Speicher und Ladelogik sowie einigen weiteren oft verwendeten Operationen befasst.
|
||||
|
||||
Für jeden Datentyp haben wir außerdem einen TableHandler und einen ModalHandler erstellt, welche sich um das generieren von Tabellen und Modals (Popups) mit den jeweiligen Werten kümmern. Diese beiden Handler haben wir dann über einen Datentyp spezifischen LogicHandler mit der Hauptlogik verknüpft.
|
||||
|
||||
Das Dashboard hat ebenfalls einen gesonderten LogicHandler, welcher sich mit der Ladelogik der Dozenten in der Dashboard Ansicht befasst.
|
||||
|
||||
### Anforderungen
|
||||
Für unser Projekt wird eine stabile Internetanbindung benötigt, da wir Bootstrap v5.2 per URL (CDN) importiert haben.
|
||||
|
||||
Bootstrap ist eine Bibliothek, die Styles, Icons und JavaScript in eine Webseite einbinden kann, um das erstellen von vorgefertigten Komponenten zu ermöglichen.
|
||||
Im Rahmen unserer Projektarbeit haben wir manche der Standardwerte von Bootstrap überschrieben.
|
||||
|
||||
## Farbschema
|
||||
Als Farben haben wir uns für ein kräftiges Rot in Kombination mit einem Grauton entschieden.
|
||||
|
||||
In der Farbtheorie wird Rot oft mit Wut und Agressionen, jedoch auch mit Liebe und Harmonie verbunden. Da wir diese Kombination aus Gefühlen als eine recht passende Beschreibung eines Studiums angesehen haben, haben wir die Farbe #e2001a als Primärfarbe gewählt.
|
||||
|
||||
Da die Kombination aus Rot und Grau aus unserer Sicht professionell wirkt und außerdem die Farbkombination der DHBW wiederspiegelt haben wir als Sekundäre Farbe #5c6971 gewählt.
|
||||
|
||||
Als Hintergrundfarbe haben wir zudem nicht ein klares Weiß gewählt, sondern einen sehr hellen grauton.
|
||||
Durch diese Entscheidung konnten wir einzelne Komponenten der Webseite besser hervorheben und unsere Augen schonen.
|
||||
|
||||
## Anleitung zum starten
|
||||
Um unsere Webseite zu testen kann die Datei index.html im Hauptverzeichnis im Browser geöffnert werden.
|
||||
|
||||
Unsere Webseite ist alternativ auch über [uniplanner.de](https://uniplanner.de) erreichbar <small>(Stand 12.12.2022)</small>
|
||||
|
||||
Auf der Webseite befindet sich im Bereich Funktionen folgende Kurzanleitung, die veranschaulicht, in welcher Reihenfolge das erstellen von Daten möglich ist.
|
||||
- Über das Dropdownmenü "Verwaltung", gelangen Sie zu den jeweiligen Seiten für die Datenerfassung
|
||||
- Zu Beginn können Sie einen Studiengang, sowie einen oder mehrere Termine, bestehend aus einem Start- und Enddatum, so wie der jeweiligen Uhrzeit, anlegen
|
||||
- Haben Sie das getan, ist es Ihnen bereits möglich Semester und Dozenten mit allen erforderlichen Daten einzutragen
|
||||
- Navigieren Sie nun in den Bereich Jahrgänge und tragen Sie die jeweiligen Daten ein
|
||||
- Nun haben Sie alle nötigen Daten um Einträge zu Vorlesungen zu erstellen
|
||||
- Nachdem Sie alle Daten ins System eingetragen haben, können Sie über das Dashboard einen Dozenten auswählen, um dessen Kontaktdaten, Vorlesungen und einige weiteren Daten anzusehen
|
||||
|
||||
Knöpfe zum erstellen von Daten sind immer durch ein <code>+</code>-Symbol erkennbar
|
||||
|
||||
Knöpfe zum editieren von Daten sind immer durch ein Stift-Symbol erkennbar
|
||||
|
||||
Knöpfe zum löschen von Daten sind immer durch ein Mülleimer-Symbol erkennbar
|
||||
|
||||
Um die manuelle Datenerstellung zu überspringen und die Webseite mit Testdaten zu füllen, kann jedoch auch in der Konsole der JS Befehl <code>loadDummyData()</code> ausgeführt werden.
|
||||
@@ -0,0 +1,197 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="../assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="../index.html#home">
|
||||
<img class="navlogo" src="../assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle active" href="" role="button"
|
||||
data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item active" href="../semesters/index.html">Semester</a></li>
|
||||
<li><a class="dropdown-item" href="../lecturers/index.html">Dozenten</a></li>
|
||||
<li><a class="dropdown-item" href="../lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item" href="../studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item" href="../studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link" href="../dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="content container">
|
||||
<aside class="sidebar">
|
||||
<ul class="nav navbar-dark">
|
||||
<li class="nav-item">
|
||||
<a href="../lectures/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Vorlesungen">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z" />
|
||||
<path
|
||||
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
|
||||
<path
|
||||
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../semesters/index.html" class="nav-link active" data-bs-toggle="tooltip"
|
||||
data-bs-placement="right" data-bs-title="Semester">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2zm1 12h2V2h-2v12zm-3 0V7H7v7h2zm-5 0v-3H2v3h2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lecturers/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Dozenten">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lectureDates/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Termine">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" />
|
||||
<path
|
||||
d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyClasses/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Jahrgänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.5 0a.5.5 0 0 1 .5.5v15a.5.5 0 0 1-1 0V.5A.5.5 0 0 1 .5 0zM2 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyProgram/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Studiengänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<section>
|
||||
<h1 class="table-heading">
|
||||
Semester
|
||||
<span class="add-button" onclick="renderSemesterModal()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-plus"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
|
||||
</svg>
|
||||
</span>
|
||||
</h1>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope=" col" id="id">#</th>
|
||||
<th scope="col" id="semesterName">Name</th>
|
||||
<th scope="col" id="semesterStartDate">Start</th>
|
||||
<th scope="col" id="semesterEndDate">Ende</th>
|
||||
<th scope="col" id="semesterNumber">Nummer</th>
|
||||
<th scope="col" id="semesterStudyProgram">Studiengang</th>
|
||||
<th scope="col" class="text-center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="semestersTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
||||
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
|
||||
</script>
|
||||
|
||||
<script src="../assets/js/logicHandler.js"></script>
|
||||
<script src="../assets/js/semesters/semesterModalHandler.js"></script>
|
||||
<script src="../assets/js/semesters/semesterLogicHandler.js"></script>
|
||||
<script src="../assets/js/semesters/semesterTableHandler.js"></script>
|
||||
|
||||
<script src="../assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,197 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="../assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="../index.html#home">
|
||||
<img class="navlogo" src="../assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle active" href="" role="button"
|
||||
data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item" href="../semesters/index.html">Semester</a></li>
|
||||
<li><a class="dropdown-item" href="../lecturers/index.html">Dozenten</a></li>
|
||||
<li><a class="dropdown-item" href="../lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item active" href="../studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item" href="../studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link" href="../dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="content container">
|
||||
<aside class="sidebar">
|
||||
<ul class="nav navbar-dark">
|
||||
<li class="nav-item">
|
||||
<a href="../lectures/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Vorlesungen">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z" />
|
||||
<path
|
||||
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
|
||||
<path
|
||||
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../semesters/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Semester">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2zm1 12h2V2h-2v12zm-3 0V7H7v7h2zm-5 0v-3H2v3h2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lecturers/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Dozenten">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lectureDates/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Termine">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" />
|
||||
<path
|
||||
d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyClasses/index.html" class="nav-link active" data-bs-toggle="tooltip"
|
||||
data-bs-placement="right" data-bs-title="Jahrgänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.5 0a.5.5 0 0 1 .5.5v15a.5.5 0 0 1-1 0V.5A.5.5 0 0 1 .5 0zM2 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyProgram/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Studiengänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<section>
|
||||
<h1 class="table-heading">
|
||||
Jahrgänge
|
||||
<span class="add-button" onclick="renderStudyClassModal()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-plus"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
|
||||
</svg>
|
||||
</span>
|
||||
</h1>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope=" col" id="id">#</th>
|
||||
<th scope="col" id="studyClassName">Name</th>
|
||||
<th scope="col" id="studyClassStartDate">Start</th>
|
||||
<th scope="col" id="studyClassEndDate">Ende</th>
|
||||
<th scope="col" id="semester">Semester</th>
|
||||
<th scope="col" id="studyProgram">Studiengang</th>
|
||||
<th scope="col" class="text-center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="studyClassTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
||||
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
|
||||
</script>
|
||||
|
||||
<script src="../assets/js/logicHandler.js"></script>
|
||||
<script src="../assets/js/studyClasses/studyClassModalHandler.js"></script>
|
||||
<script src="../assets/js/studyClasses/studyClassLogicHandler.js"></script>
|
||||
<script src="../assets/js/studyClasses/studyClassTableHandler.js"></script>
|
||||
|
||||
<script src="../assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,194 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="author" content="Ali Fistik, Jonas Braus, Simon Schmieder">
|
||||
<meta name="description" content="FrontEnd des UniPlanners">
|
||||
|
||||
<title>UniPlanner</title>
|
||||
<link rel="icon" href="../assets/img/favicon.svg">
|
||||
|
||||
<!-- Styles -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="../assets/css/styles.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
<nav class="navbar navbar-dark bg-primary navbar-expand-lg fixed-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="../index.html#home">
|
||||
<img class="navlogo" src="../assets/img/uniplanner.png" height="36">
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse navbar-dark" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto nav-item-custom">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html">Home</a>
|
||||
</li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle active" href="" role="button"
|
||||
data-bs-toggle="dropdown">Verwaltung</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../lectures/index.html">Vorlesungen</a></li>
|
||||
<li><a class="dropdown-item" href="../semesters/index.html">Semester</a></li>
|
||||
<li><a class="dropdown-item" href="../lecturers/index.html">Dozenten</a></li>
|
||||
<li><a class="dropdown-item" href="../lectureDates/index.html">Termine</a></li>
|
||||
<li><a class="dropdown-item" href="../studyClasses/index.html">Jahrgänge</a></li>
|
||||
<li><a class="dropdown-item active" href="../studyProgram/index.html">Studiengänge</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#ueber-uns">Über uns</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#funktionen">Funktionen</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="../index.html#impressum">Impressum</a>
|
||||
</li>
|
||||
<li class="nav-item dash-item">
|
||||
<a class="nav-link" href="../dashboard/index.html">
|
||||
Dashboard
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 2a.5.5 0 0 1 .5.5V4a.5.5 0 0 1-1 0V2.5A.5.5 0 0 1 8 2zM3.732 3.732a.5.5 0 0 1 .707 0l.915.914a.5.5 0 1 1-.708.708l-.914-.915a.5.5 0 0 1 0-.707zM2 8a.5.5 0 0 1 .5-.5h1.586a.5.5 0 0 1 0 1H2.5A.5.5 0 0 1 2 8zm9.5 0a.5.5 0 0 1 .5-.5h1.5a.5.5 0 0 1 0 1H12a.5.5 0 0 1-.5-.5zm.754-4.246a.389.389 0 0 0-.527-.02L7.547 7.31A.91.91 0 1 0 8.85 8.569l3.434-4.297a.389.389 0 0 0-.029-.518z" />
|
||||
<path fill-rule="evenodd"
|
||||
d="M6.664 15.889A8 8 0 1 1 9.336.11a8 8 0 0 1-2.672 15.78zm-4.665-4.283A11.945 11.945 0 0 1 8 10c2.186 0 4.236.585 6.001 1.606a7 7 0 1 0-12.002 0z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="content container">
|
||||
<aside class="sidebar">
|
||||
<ul class="nav navbar-dark">
|
||||
<li class="nav-item">
|
||||
<a href="../lectures/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Vorlesungen">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path fill-rule="evenodd" d="M6 1h6v7a.5.5 0 0 1-.757.429L9 7.083 6.757 8.43A.5.5 0 0 1 6 8V1z" />
|
||||
<path
|
||||
d="M3 0h10a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-1h1v1a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v1H1V2a2 2 0 0 1 2-2z" />
|
||||
<path
|
||||
d="M1 5v-.5a.5.5 0 0 1 1 0V5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0V8h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1zm0 3v-.5a.5.5 0 0 1 1 0v.5h.5a.5.5 0 0 1 0 1h-2a.5.5 0 0 1 0-1H1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../semesters/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Semester">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M11 2a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v12h.5a.5.5 0 0 1 0 1H.5a.5.5 0 0 1 0-1H1v-3a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v3h1V7a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v7h1V2zm1 12h2V2h-2v12zm-3 0V7H7v7h2zm-5 0v-3H2v3h2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lecturers/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Dozenten">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../lectureDates/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Termine">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M14 0H2a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM1 3.857C1 3.384 1.448 3 2 3h12c.552 0 1 .384 1 .857v10.286c0 .473-.448.857-1 .857H2c-.552 0-1-.384-1-.857V3.857z" />
|
||||
<path
|
||||
d="M6.5 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm-9 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm3 0a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyClasses/index.html" class="nav-link" data-bs-toggle="tooltip" data-bs-placement="right"
|
||||
data-bs-title="Jahrgänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M.5 0a.5.5 0 0 1 .5.5v15a.5.5 0 0 1-1 0V.5A.5.5 0 0 1 .5 0zM2 1.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-4a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-6a.5.5 0 0 1-.5-.5v-1zm2 4a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-7a.5.5 0 0 1-.5-.5v-1z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="../studyProgram/index.html" class="nav-link active" data-bs-toggle="tooltip"
|
||||
data-bs-placement="right" data-bs-title="Studiengänge">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" fill="currentColor"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M4 2.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3 0a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1ZM4 5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM7.5 5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1ZM4.5 8a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Zm2.5.5a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-1Zm3.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5h-1Z" />
|
||||
<path
|
||||
d="M2 1a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V1Zm11 0H3v14h3v-2.5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 .5.5V15h3V1Z" />
|
||||
</svg>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
|
||||
<section>
|
||||
<h1 class="table-heading">
|
||||
Studiengang
|
||||
<span class="add-button" onclick="renderStudyProgramModal()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" class="bi bi-plus"
|
||||
viewBox="0 0 16 16">
|
||||
<path
|
||||
d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z" />
|
||||
</svg>
|
||||
</span>
|
||||
</h1>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope=" col" id="id">#</th>
|
||||
<th scope="col" id="studyProgramName">Name</th>
|
||||
<th scope="col" id="studyProgramShort">Kürzel</th>
|
||||
<th scope="col" class="text-center"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="studyProgramTable"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
Copyright © 2022 Ali Fistik, Jonas Braus, Simon Schmieder
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
||||
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
|
||||
</script>
|
||||
|
||||
<script src="../assets/js/logicHandler.js"></script>
|
||||
<script src="../assets/js/studyProgram/studyProgramModalHandler.js"></script>
|
||||
<script src="../assets/js/studyProgram/studyProgramLogicHandler.js"></script>
|
||||
<script src="../assets/js/studyProgram/studyProgramTableHandler.js"></script>
|
||||
|
||||
<script src="../assets/js/dummyDataHandler.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user