Being able to edit a timeline item fully working as currently tested.
Signed-off-by: rodude123 <rodude123@gmail.com>
This commit is contained in:
@@ -8,7 +8,7 @@ input[type="submit"] {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
.edit, .delete{
|
||||
.edit, .delete {
|
||||
border: none;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
@@ -19,6 +19,10 @@ input[type="submit"] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.timelineHeader {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
div.editorContainer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
@@ -40,10 +44,10 @@ div.modifyBtnContainer {
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
div.dateContainer {
|
||||
div.dateContainer, div.companyAreaContainer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
gap: 1em;
|
||||
margin-bottom: 0.5em;
|
||||
@@ -103,20 +107,32 @@ section#curriculumVitae form.timelineItem.editing div.gradeContainer.formControl
|
||||
}
|
||||
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.gradeContainer.formControl input,
|
||||
section#curriculumVitae form.timelineItem:not(.editing) .formControl .courseText {
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.companyAreaContainer.formControl input,
|
||||
section#curriculumVitae form.timelineItem:not(.editing) .formControl .courseText,
|
||||
section#curriculumVitae form.timelineItem:not(.editing) .formControl .jobTitleText {
|
||||
outline: none;
|
||||
border: none;
|
||||
color: #FFFFFF;
|
||||
-webkit-border-radius: 0;
|
||||
-moz-border-radius: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.gradeContainer.formControl > *,
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.companyAreaContainer.formControl > * {
|
||||
color: hsl(0, 0%, 90%);
|
||||
}
|
||||
|
||||
section#curriculumVitae form.timelineItem:not(.editing) .formControl .courseText,
|
||||
section#curriculumVitae form.timelineItem:not(.editing) .formControl .jobTitleText {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.gradeContainer.formControl input {
|
||||
padding: 0 0.25em;
|
||||
}
|
||||
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.formControl .courseText {
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.formControl .courseText,
|
||||
section#curriculumVitae form.timelineItem:not(.editing) .formControl .courseText {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@@ -126,4 +142,8 @@ section#curriculumVitae form.timelineItem:not(.editing) input[type=submit] {
|
||||
|
||||
.courseText {
|
||||
resize: none;
|
||||
}
|
||||
}
|
||||
|
||||
section#curriculumVitae form.timelineItem:not(.editing) div.companyAreaContainer input {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
+45
-9
@@ -24,20 +24,19 @@
|
||||
<section id="curriculumVitae">
|
||||
<h2>curriculum vitae</h2>
|
||||
<div class="cvGrid">
|
||||
<!-- https://codepen.io/keithwyland/pen/wqNqvy -->
|
||||
<div>
|
||||
<h3>Education</h3>
|
||||
|
||||
<div class="editorContainer">
|
||||
<form action="" method="POST">
|
||||
<form action="" method="POST" id="addEdu">
|
||||
<div class="formControl">
|
||||
<label for="dateFrom">Date From</label>
|
||||
<input type="date" id="dateFrom" name="dateFrom">
|
||||
<label for="dateFromE">Date From</label>
|
||||
<input type="date" id="dateFromE" name="dateFromE">
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="dateTo">Date To</label>
|
||||
<input type="date" id="dateTo" name="dateTo">
|
||||
<label for="dateToE">Date To</label>
|
||||
<input type="date" id="dateToE" name="dateToE">
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
@@ -65,11 +64,48 @@
|
||||
</div>
|
||||
<div>
|
||||
<h3>Work</h3>
|
||||
|
||||
<div class="timeline" id="work">
|
||||
</div>
|
||||
|
||||
<div class="editorContainer">
|
||||
<form action="" method="POST" id="addWork">
|
||||
<div class="formControl">
|
||||
<label for="dateFromW">Date From</label>
|
||||
<input type="date" id="dateFromW" name="dateFromW">
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="dateToW">Date To</label>
|
||||
<input type="date" id="dateToW" name="dateToW">
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="company">Company</label>
|
||||
<input type="text" id="company" name="company">
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="area">Area</label>
|
||||
<input type="text" id="area" name="area">
|
||||
</div>
|
||||
|
||||
<div class="formControl">
|
||||
<label for="jobTitle">Job Title</label>
|
||||
<input type="text" id="jobTitle" name="jobTitle">
|
||||
</div>
|
||||
|
||||
<div class="error hidden" id="workError">
|
||||
<button class="close" type="button">×</button>
|
||||
<div></div>
|
||||
</div>
|
||||
|
||||
<input type="submit" class="btn btnPrimary boxShadowIn boxShadowOut" value="Add new job">
|
||||
</form>
|
||||
|
||||
<div class="timeline" id="work">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
|
||||
+327
-48
@@ -1,15 +1,17 @@
|
||||
let dateOptions = {month: 'short', year: 'numeric'};
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () =>
|
||||
{
|
||||
// check if the user is logged in, if not redirect to log in
|
||||
/* fetch('/api/user/isLoggedIn').then(res =>
|
||||
fetch('/api/user/isLoggedIn').then(res =>
|
||||
{
|
||||
if (!res.ok)
|
||||
{
|
||||
window.location.href = './';
|
||||
}
|
||||
});*/
|
||||
document.querySelector("#dateFrom").max = new Date().toISOString().split("T")[0];
|
||||
});
|
||||
document.querySelector("#dateFromE").max = new Date().toISOString().split("T")[0];
|
||||
document.querySelector("#dateFromW").max = new Date().toISOString().split("T")[0];
|
||||
|
||||
|
||||
fetch("/api/timelineData/edu").then(res =>
|
||||
@@ -20,37 +22,24 @@ document.addEventListener('DOMContentLoaded', () =>
|
||||
{
|
||||
for (let i = 0; i < json.length; i++)
|
||||
{
|
||||
let id = json[i].ID;
|
||||
let timelineItem = document.createElement("form")
|
||||
timelineItem.id = "timelineItem" + id;
|
||||
timelineItem.classList.add("timelineItem");
|
||||
timelineItem.onsubmit = e => updateEduItem(id, e);
|
||||
timelineItem.innerHTML = `
|
||||
<div class="modifyBtnContainer">
|
||||
<button class="edit" type="button" id="edit${id}" onclick="edit(${id})"><i class="fa-solid fa-pen-to-square"></i></button>
|
||||
<button class="delete" type="button" id="delete${id}" onclick="deleteEduItem(${id})"><i class="fa- fa-trash"></i></button>
|
||||
</div>
|
||||
<div class="dateContainer formControl">
|
||||
<input type="date" name="dateFrom${id}" id="dateFrom${id}" onload="this.max = new Date().toISOString().split('T')[0]" value="${json[i]['startPeriod']}">
|
||||
-
|
||||
<input type="date" name="dateTo${id}" id="dateTo${id}" value="${json[i]['endPeriod']}">
|
||||
</div>
|
||||
<h3 class="timelineHeader" id="timelineHeader${id}">${new Date(json[i]["startPeriod"]).toLocaleString('en-gb', dateOptions)} - ${new Date(json[i]["endPeriod"]).toLocaleString('en-gb', dateOptions)}</h3>
|
||||
<div class="gradeContainer formControl">
|
||||
<label for="grade${id}">Grade:</label>
|
||||
<input type="text" name="grade${id}" id="grade${id}" value="${json[i]['grade']}" disabled>
|
||||
</div>
|
||||
<div class="formControl">
|
||||
<textarea class="courseText" name="course${id}" id="course${id}" cols="10" rows="3" disabled>${json[i]['course']}</textarea>
|
||||
</div>
|
||||
|
||||
<div class="error hidden" id="eduError${id}">
|
||||
<button class="close" type="button" onclick="this.parentElement.classList.toggle('hidden');">×</button>
|
||||
<div></div>
|
||||
</div>
|
||||
<input type="submit" value="Change">
|
||||
`;
|
||||
document.getElementById("edu").appendChild(timelineItem);
|
||||
addEduData(json[i].ID, json[i].startPeriod, json[i].endPeriod, json[i].grade, json[i].course);
|
||||
}
|
||||
return;
|
||||
}
|
||||
document.querySelector("#edu").innerHTML = "No education data found";
|
||||
})
|
||||
});
|
||||
|
||||
fetch("/api/timelineData/work").then(res =>
|
||||
{
|
||||
res.json().then(json =>
|
||||
{
|
||||
if (res.ok)
|
||||
{
|
||||
for (let i = 0; i < json.length; i++)
|
||||
{
|
||||
let endPeriod = json[i].endPeriod === null ? "Present" : json[i].endPeriod;
|
||||
addWorkData(json[i].ID, json[i].startPeriod, endPeriod, json[i].companyName, json[i].area, json[i].title);
|
||||
}
|
||||
return;
|
||||
}
|
||||
@@ -73,6 +62,79 @@ document.querySelector("#navClose").addEventListener("click", () =>
|
||||
document.querySelector("#navOpen").style.visibility = "visible";
|
||||
});
|
||||
|
||||
document.querySelector("#addEdu").addEventListener("submit", e =>
|
||||
{
|
||||
e.preventDefault();
|
||||
let data = new FormData();
|
||||
data.append("dateFrom", document.querySelector("#dateFromE").value);
|
||||
data.append("dateTo", document.querySelector("#dateToE").value);
|
||||
data.append("grade", document.querySelector("#grade").value);
|
||||
data.append("course", document.querySelector("#courseTitle").value);
|
||||
|
||||
fetch("/api/timelineData/edu", {
|
||||
method: "POST",
|
||||
body: data,
|
||||
headers: {
|
||||
"Authentication": localStorage.getItem("token")
|
||||
}
|
||||
}).then(res => res.json().then(json =>
|
||||
{
|
||||
if (res.ok)
|
||||
{
|
||||
addEduData(json.ID, data.get("dateFrom"), data.get("dateTo"), data.get("grade"), data.get("course"), true);
|
||||
document.querySelector("#addEdu").reset();
|
||||
return;
|
||||
}
|
||||
|
||||
if (res.status === 401)
|
||||
{
|
||||
window.location.href = "./";
|
||||
return;
|
||||
}
|
||||
|
||||
document.querySelector("#eduError").classList.remove("hidden");
|
||||
document.querySelector("#eduError div").innerHTML = json.error;
|
||||
}));
|
||||
});
|
||||
|
||||
document.querySelector("#addWork").addEventListener("submit", e =>
|
||||
{
|
||||
e.preventDefault();
|
||||
let data = new FormData();
|
||||
data.append("dateFrom", document.querySelector("#dateFromW").value);
|
||||
data.append("dateTo", document.querySelector("#dateToW").value);
|
||||
data.append("companyName", document.querySelector("#company").value);
|
||||
data.append("area", document.querySelector("#area").value);
|
||||
data.append("title", document.querySelector("#jobTitle").value);
|
||||
|
||||
fetch("/api/timelineData/work", {
|
||||
method: "POST",
|
||||
body: data,
|
||||
headers: {
|
||||
"Authentication": localStorage.getItem("token")
|
||||
}
|
||||
}).then(res => res.json().then(json =>
|
||||
{
|
||||
if (res.ok)
|
||||
{
|
||||
let endPeriod = data.get("dateTo") === null ? "Present" : data.get("dateTo ");
|
||||
addWorkData(json.ID, data.get("dateFrom"), endPeriod, data.get("companyName"), data.get("area"), data.get("title"), true);
|
||||
document.querySelector("#addEdu").reset();
|
||||
return;
|
||||
}
|
||||
|
||||
if (res.status === 401)
|
||||
{
|
||||
window.location.href = "./";
|
||||
return;
|
||||
}
|
||||
|
||||
document.querySelector("#eduError").classList.remove("hidden");
|
||||
document.querySelector("#eduError div").innerHTML = json.error;
|
||||
}));
|
||||
});
|
||||
|
||||
|
||||
/**
|
||||
* Switches the timeline item between edit and view mode
|
||||
* @param id the id of the timeline item
|
||||
@@ -80,19 +142,131 @@ document.querySelector("#navClose").addEventListener("click", () =>
|
||||
function edit(id)
|
||||
{
|
||||
document.querySelector("#timelineItem" + id).classList.toggle("editing");
|
||||
document.querySelector("#grade" + id).toggleAttribute("disabled");
|
||||
document.querySelector("#course" + id).toggleAttribute("disabled");
|
||||
if (id.includes("e"))
|
||||
{
|
||||
document.querySelector("#grade" + id).toggleAttribute("disabled");
|
||||
document.querySelector("#course" + id).toggleAttribute("disabled");
|
||||
return;
|
||||
}
|
||||
document.querySelector("#companyName" + id).toggleAttribute("disabled");
|
||||
document.querySelector("#area" + id).toggleAttribute("disabled");
|
||||
document.querySelector("#jobTitle" + id).toggleAttribute("disabled");
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the education timeline item with the given id
|
||||
* @param ID - the id of the course timeline item
|
||||
* @param startPeriod - the start date of the course
|
||||
* @param endPeriod - the end date of the course
|
||||
* @param grade - the grade of the course
|
||||
* @param course - the name of the course
|
||||
* @param prepend - whether to prepend the timeline item to the timeline
|
||||
*/
|
||||
function addEduData(ID, startPeriod, endPeriod, grade, course, prepend=false)
|
||||
{
|
||||
let id = ID + "e";
|
||||
let timelineItem = document.createElement("form")
|
||||
timelineItem.id = "timelineItem" + id;
|
||||
timelineItem.classList.add("timelineItem");
|
||||
timelineItem.onsubmit = e => updateEduItem(ID, e);
|
||||
timelineItem.innerHTML = `
|
||||
<div class="modifyBtnContainer">
|
||||
<button class="edit" type="button" id="edit${id}" onclick="edit('${id}')"><i class="fa-solid fa-pen-to-square"></i></button>
|
||||
<button class="delete" type="button" id="delete${id}" onclick="deleteEduItem(${ID})"><i class="fa-solid fa-trash"></i></button>
|
||||
</div>
|
||||
<div class="dateContainer formControl">
|
||||
<input type="date" name="dateFrom${id}" id="dateFrom${id}" onload="this.max = new Date().toISOString().split('T')[0]" value="${startPeriod}">
|
||||
-
|
||||
<input type="date" name="dateTo${id}" id="dateTo${id}" value="${endPeriod}">
|
||||
</div>
|
||||
<h3 class="timelineHeader" id="timelineHeader${id}">${new Date(startPeriod).toLocaleString('en-gb', dateOptions)} - ${new Date(endPeriod).toLocaleString('en-gb', dateOptions)}</h3>
|
||||
<div class="gradeContainer formControl">
|
||||
<label for="grade${id}">Grade:</label>
|
||||
<input type="text" name="grade${id}" id="grade${id}" value="${grade}" disabled>
|
||||
</div>
|
||||
<div class="formControl">
|
||||
<textarea class="courseText" name="course${id}" id="course${id}" cols="10" rows="3" disabled>${course}</textarea>
|
||||
</div>
|
||||
|
||||
<div class="error hidden" id="eduError${id}">
|
||||
<button class="close" type="button" onclick="this.parentElement.classList.toggle('hidden');">×</button>
|
||||
<div></div>
|
||||
</div>
|
||||
<input type="submit" value="Change">
|
||||
`;
|
||||
if (prepend)
|
||||
{
|
||||
document.querySelector("#edu").prepend(timelineItem);
|
||||
return;
|
||||
}
|
||||
document.getElementById("edu").appendChild(timelineItem);
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds a new work timeline item to the page
|
||||
* @param ID - the id of the work timeline item
|
||||
* @param startPeriod - the start date of the job
|
||||
* @param endPeriod - the end date of the job
|
||||
* @param companyName - the name of the company
|
||||
* @param area - the area of the company
|
||||
* @param jobTitle - the job title
|
||||
* @param prepend - whether to prepend the timeline item to the timeline
|
||||
*/
|
||||
function addWorkData(ID, startPeriod, endPeriod, companyName, area, jobTitle, prepend=false)
|
||||
{
|
||||
let id = ID + "w";
|
||||
let timelineItem = document.createElement("form")
|
||||
timelineItem.id = "timelineItem" + id;
|
||||
timelineItem.classList.add("timelineItem");
|
||||
timelineItem.onsubmit = e => updateWorkItem(ID, e);
|
||||
timelineItem.innerHTML = `
|
||||
<div class="modifyBtnContainer">
|
||||
<button class="edit" type="button" id="edit${id}" onclick="edit('${id}')"><i class="fa-solid fa-pen-to-square"></i></button>
|
||||
<button class="delete" type="button" id="delete${id}" onclick="deleteWorkItem(${ID})"><i class="fa-solid fa-trash"></i></button>
|
||||
</div>
|
||||
<div class="dateContainer formControl">
|
||||
<input type="date" name="dateFrom${id}" id="dateFrom${id}" onload="this.max = new Date().toISOString().split('T')[0]" value="${startPeriod}">
|
||||
-
|
||||
<input type="date" name="dateTo${id}" id="dateTo${id}" value="${endPeriod === 'Present' ? '' : endPeriod}">
|
||||
</div>
|
||||
<h3 class="timelineHeader" id="timelineHeader${id}">${new Date(startPeriod).toLocaleString('en-gb', dateOptions)} - ${endPeriod === 'Present' ? '' : new Date(endPeriod).toLocaleString('en-gb', dateOptions)}</h3>
|
||||
<div class="companyAreaContainer formControl">
|
||||
<input type="text" name="companyName${id}" id="companyName${id}" value="${companyName}" disabled>
|
||||
-
|
||||
<input type="text" name="area${id}" id="area${id}" value="${area}" disabled>
|
||||
</div>
|
||||
<div class="formControl">
|
||||
<textarea class="jobTitleText" name="jobTitle${id}" id="jobTitle${id}" cols="10" rows="3" disabled>${jobTitle}</textarea>
|
||||
</div>
|
||||
|
||||
<div class="error hidden" id="workError${id}">
|
||||
<button class="close" type="button" onclick="this.parentElement.classList.toggle('hidden');">×</button>
|
||||
<div></div>
|
||||
</div>
|
||||
<input type="submit" value="Change">
|
||||
`;
|
||||
if (prepend)
|
||||
{
|
||||
document.querySelector("#work").prepend(timelineItem);
|
||||
return;
|
||||
}
|
||||
|
||||
document.getElementById("work").appendChild(timelineItem);
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the edu timeline item with the given id
|
||||
* @param id the id of the edu timeline item
|
||||
* @param e the event that triggered the function
|
||||
*/
|
||||
function updateEduItem(id, e)
|
||||
{
|
||||
e.preventDefault();
|
||||
|
||||
let data = {}
|
||||
data["dateFrom"] = document.querySelector("#dateFrom" + id).value;
|
||||
data["dateTo"] = document.querySelector("#dateTo" + id).value;
|
||||
data["grade"] = document.querySelector("#grade" + id).value;
|
||||
data["course"] = document.querySelector("#course" + id).value;
|
||||
data["dateFrom"] = document.querySelector(`#dateFrom${id}e`).value;
|
||||
data["dateTo"] = document.querySelector(`#dateTo${id}e`).value;
|
||||
data["grade"] = document.querySelector(`#grade${id}e`).value;
|
||||
data["course"] = document.querySelector(`#course${id}e`).value;
|
||||
|
||||
fetch("/api/timelineData/edu/" + id, {
|
||||
method: "PATCH",
|
||||
@@ -105,10 +279,10 @@ function updateEduItem(id, e)
|
||||
{
|
||||
if (res.ok)
|
||||
{
|
||||
document.querySelector("#timelineHeader" + id).innerHTML = new Date(document.querySelector("#dateFrom" + id).value).toLocaleString('en-gb', dateOptions) + " - " + new Date(document.querySelector("#dateTo" + id).value).toLocaleString('en-gb', dateOptions);
|
||||
document.querySelector("#timelineItem" + id).classList.toggle("editing");
|
||||
document.querySelector("#grade" + id).setAttribute("disabled", "");
|
||||
document.querySelector("#course" + id).setAttribute("disabled", "");
|
||||
document.querySelector(`#timelineHeader${id}e`).innerHTML = new Date(document.querySelector(`#dateFrom${id}e`).value).toLocaleString('en-gb', dateOptions) + " - " + new Date(document.querySelector(`#dateTo${id}e`).value).toLocaleString('en-gb', dateOptions);
|
||||
document.querySelector(`#timelineItem${id}e`).classList.toggle("editing");
|
||||
document.querySelector(`#grade${id}e`).setAttribute("disabled", "");
|
||||
document.querySelector(`#course${id}e`).setAttribute("disabled", "");
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -120,9 +294,114 @@ function updateEduItem(id, e)
|
||||
|
||||
res.json().then(json =>
|
||||
{
|
||||
document.querySelector("#eduError" + id).classList.remove("hidden");
|
||||
document.querySelector(`#eduError${id} div`).innerHTML = json.error;
|
||||
document.querySelector(`#eduError${id}e`).classList.remove("hidden");
|
||||
document.querySelector(`#eduError${id}e div`).innerHTML = json.error;
|
||||
});
|
||||
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the work timeline item with the given id
|
||||
* @param id the id of the work timeline item
|
||||
* @param e the event that triggered the function
|
||||
*/
|
||||
function updateWorkItem(id, e)
|
||||
{
|
||||
e.preventDefault();
|
||||
let data = {}
|
||||
data["dateFrom"] = document.querySelector(`#dateFrom${id}w`).value;
|
||||
data["dateTo"] = document.querySelector(`#dateTo${id}w`).value;
|
||||
data["companyName"] = document.querySelector(`#companyName${id}w`).value;
|
||||
data["area"] = document.querySelector(`#area${id}w`).value;
|
||||
data["title"] = document.querySelector(`#jobTitle${id}w`).value;
|
||||
|
||||
fetch("/api/timelineData/work/" + id, {
|
||||
method: "PATCH",
|
||||
body: JSON.stringify(data),
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
"Authorization": "Bearer " + localStorage.getItem("token")
|
||||
}
|
||||
}).then(res =>
|
||||
{
|
||||
if(res.ok)
|
||||
{
|
||||
document.querySelector(`#timelineHeader${id}w`).innerHTML = new Date(document.querySelector(`#dateFrom${id}w`).value).toLocaleString('en-gb', dateOptions) + " - " + new Date(document.querySelector(`#dateTo${id}w`).value).toLocaleString('en-gb', dateOptions);
|
||||
document.querySelector(`#timelineItem${id}w`).classList.toggle("editing");
|
||||
document.querySelector(`#companyName${id}w`).setAttribute("disabled", "");
|
||||
document.querySelector(`#area${id}w`).setAttribute("disabled", "");
|
||||
document.querySelector(`#jobTitle${id}w`).setAttribute("disabled", "");
|
||||
return;
|
||||
}
|
||||
|
||||
if (res.status === 401)
|
||||
{
|
||||
window.location.href = "./";
|
||||
return;
|
||||
}
|
||||
|
||||
res.json().then(json =>
|
||||
{
|
||||
document.querySelector(`#workError${id}w`).classList.remove("hidden");
|
||||
document.querySelector(`#workError${id}w div`).innerHTML = json.error;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Deletes the timeline item with the given id
|
||||
* @param id the id of the timeline item
|
||||
*/
|
||||
function deleteEduItem(id)
|
||||
{
|
||||
fetch("/api/timelineData/edu/" + id, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
"Authorization": "Bearer " + localStorage.getItem("token")
|
||||
}
|
||||
}).then(res =>
|
||||
{
|
||||
if (res.ok)
|
||||
{
|
||||
document.querySelector(`#timelineItem${id}e`).remove();
|
||||
return;
|
||||
}
|
||||
|
||||
if (res.status === 401)
|
||||
{
|
||||
window.location.href = "./";
|
||||
return;
|
||||
}
|
||||
res.json().then(json => alert(json.error));
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the timeline item with the given id
|
||||
* @param id the id of the timeline item
|
||||
*/
|
||||
function deleteWorkItem(id)
|
||||
{
|
||||
fetch("/api/timelineData/work/" + id, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
"Authorization": "Bearer " + localStorage.getItem("token")
|
||||
}
|
||||
}).then(res =>
|
||||
{
|
||||
if (res.ok)
|
||||
{
|
||||
document.querySelector(`#timelineItem${id}w`).remove();
|
||||
return;
|
||||
}
|
||||
|
||||
if (res.status === 401)
|
||||
{
|
||||
window.location.href = "./";
|
||||
return;
|
||||
}
|
||||
res.json().then(json => alert(json.error));
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user