Skip to content
Snippets Groups Projects
Commit 54a0d6d5 authored by Erik Bertilsson's avatar Erik Bertilsson
Browse files

Merge branch 'dev' of ssh://gitlab.liu.se/emisv011/c3

parents f3be35f0 bb2817fd
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
client/KnowledgeBank/Nolans.css
+ 23
− 11
View file @ 54a0d6d5
...@@ -57,6 +57,15 @@ font-size:15px; ...@@ -57,6 +57,15 @@ font-size:15px;
padding-top: 5%; padding-top: 5%;
} }
.projectPageNolandsModel {
width: 50%;
display: flex;
flex-direction: column; /* Stack children (e.g. the buttons) vertically*/
/* justify-content: center; */ /* Horizontal centering. align-items istead would be vertical centering. */
align-items: center;
/* padding-top: 5%; */
position: relative;
}
.NolansButtons { .NolansButtons {
width: 50%; width: 50%;
...@@ -96,7 +105,7 @@ font-size:15px; ...@@ -96,7 +105,7 @@ font-size:15px;
/*Styling for the PGSA-circle */ /*Styling for the PGSA-circle */
.wrap { .wrap {
height: 350px; height: 350px; /* varför 350?? */
width: 300px; width: 300px;
border-radius: 50%; border-radius: 50%;
position: relative; position: relative;
...@@ -104,6 +113,11 @@ font-size:15px; ...@@ -104,6 +113,11 @@ font-size:15px;
border: 2px solid #000; /* Add a 2px solid black border */ border: 2px solid #000; /* Add a 2px solid black border */
} }
.projectPageWrap{
height: 300px; /* ful lösning, men behövdes för att bägge sidor skulle bli snygga */
}
.quart { .quart {
position: absolute; position: absolute;
height: 50%; height: 50%;
...@@ -119,29 +133,27 @@ font-size:15px; ...@@ -119,29 +133,27 @@ font-size:15px;
.quart:first-child { .quart:first-child {
top: 0; top: 0;
left: 0; left: 50%;
background-color: #884582; background-color: #ffaaf8;
} }
.quart:nth-child(2) { .quart:nth-child(2) {
top: 0; top: 50%;
left: 50%; left: 50%;
background-color: #ffaaf8; background-color: #ef7de6;
} }
.quart:nth-child(3) { .quart:nth-child(3) {
top: 50%; top: 50%;
left: 0; left: 0;
background-color: #bc60b4; background-color: #bc60b4;
} }
.quart:nth-child(4) { .quart:nth-child(4) {
top: 50%; top: 0;
left: 50%; left: 0;
background-color: #ef7de6; background-color: #884582;
} }
.center { .center {
......
client/KnowledgeBank/Nolans.html
+ 2
− 2
View file @ 54a0d6d5
...@@ -110,10 +110,10 @@ ...@@ -110,10 +110,10 @@
<div class="arrow"></div> <div class="arrow"></div>
<div class="wrap"> <div class="wrap">
<div id="nolans7" class="quart" onclick="redirectToPage('Nolans7.html')">Agera</div>
<div id="nolans4" class="quart" onclick="redirectToPage('Nolans4.html')">Planera</div> <div id="nolans4" class="quart" onclick="redirectToPage('Nolans4.html')">Planera</div>
<div id="nolans6" class="quart" onclick="redirectToPage('Nolans6.html')">Studera</div>
<div id="nolans5" class="quart" onclick="redirectToPage('Nolans5.html')">Göra</div> <div id="nolans5" class="quart" onclick="redirectToPage('Nolans5.html')">Göra</div>
<div id="nolans6" class="quart" onclick="redirectToPage('Nolans6.html')">Studera</div>
<div id="nolans7" class="quart" onclick="redirectToPage('Nolans7.html')">Agera</div>
<div class="center">P G S A</div> <div class="center">P G S A</div>
</div> </div>
</div> </div>
......
client/KnowledgeBank/completedProjects.ts
+ 143
− 2
View file @ 54a0d6d5
...@@ -21,7 +21,148 @@ import { ...@@ -21,7 +21,148 @@ import {
import { formatDate } from "../projectPage/projectPage.js"; import { formatDate } from "../projectPage/projectPage.js";
import { projectCard } from "../currentProjects/currentProjects.js" //import { projectCard } from "../currentProjects/currentProjects.js"
export class projectCard {
public name: string; // Projectowner
public department: string;
public title: string;
public description: string;
public id: number;
public projectId: string;
public stage: any;
public dateStarted: any;
public endDate: any;
public completed: boolean;
constructor(
id: number,
name: string,
department: string,
title: string,
description: string,
projectId: string,
currentStage: string,
dateStarted: any,
endDate: any,
completed: boolean
) {
this.name = name;
this.department = department;
this.title = title;
this.description = description;
this.id = id;
this.projectId = projectId;
this.stage = currentStage;
this.dateStarted = dateStarted;
this.endDate = endDate;
this.completed = completed;
}
showMoreInfo(blockId: string, thisTextId: string): void {
const blockElement = document.getElementById(blockId);
if (blockElement) {
blockElement.style.display = "flex";
}
const textElement = document.getElementById(thisTextId);
if (textElement) {
textElement.innerText = "^ Stäng detaljer";
}
}
closeMoreInfo(blockId: string, thisTextId: string): void {
const blockElement = document.getElementById(blockId) as HTMLSelectElement;
if (blockElement) {
blockElement.style.display = "none";
}
const textElement = document.getElementById(thisTextId);
if (textElement) {
textElement.innerText = "> Mer information";
}
}
loadInitiatePage() {
alert("The initiate project page should now be loaded");
}
generateHTML(): string {
// Set default styles for stageSymbol (P, D, S, A, Avslutat)
let stageSymbol = "";
let stageFontSize = "50px";
let stageMarginLeft = "35px";
let stageMarginTop = "10px";
// Set projectDates to dateStarted
let projectDates = formatDate(this.dateStarted);
if (this.completed) {
stageSymbol = "Avslutat";
stageFontSize = "25px";
stageMarginLeft = "5px";
stageMarginTop = "30px";
// Append endDate to projectDates
projectDates += " till " + formatDate(this.endDate);
} else if (this.stage == "Plan") {
stageSymbol = "P";
} else if (this.stage == "Do") {
stageSymbol = "D";
} else if (this.stage == "Study") {
stageSymbol = "S";
} else if (this.stage == "Act") {
stageSymbol = "A";
}
return `
<div class="totalExpandedOngoingWorkCard">
<div style="cursor: default;" class="flex-container ongoingCard shadow" id="${
this.projectId
}">
<div class="ongoingCardImageContainer toSinglePage">
<div id="borderPinkFaded">
<div class = "flex-box ongoingCardImage toSinglePage">
<div id="currentStageLetter${this.projectId}" style=
"font-size: ${stageFontSize};
margin-left: ${stageMarginLeft};
margin-top: ${stageMarginTop};
font-weight:
bolder;
color: #845380;
position: inherit;
">${stageSymbol}</div>
</div>
</div>
</div>
<div class="div ongoingCardInfo toSinglePage">
<p class="toSinglePage" id="ongoingCardIdeaTitle">${this.title}</p>
<p class="toSinglePage" id="ongoingCardDepartment">${
this.department
}</p>
<p class="toSinglePage" id="ongoingCardManager">${this.name}</p>
<p class="toSinglePage" id="ongoingCardDatesCurrentProjects${this.projectId}" style="font-size: 13px; font-style: italic; margin-top: 5px;">${projectDates} </p>
</div>
<button id="completed-page-button-${this.projectId}" data-project-id="${
this.id
}" class="projectButton fs-6 text-white d-flex pb-2 pt-2" role="button" style="height: 10%; min-width: 15vw; white-space: nowrap; align-items: center; font-family:'Roboto', sans-serif;">Gå till Förbättringsarbetet</button>
<div class="container ongoingSeeCardDetails toSinglePage">
<div class="ongoingSeeCardDetailsInner">
<div id="completed-page-ongoingSeeDetailsButton${
this.projectId
}" class = "moreInfoClass">> Mer information</div>
</div>
</div>
</div>
<div class = "expandedOngoingWorkCard" id="expandedOngoingWorkCard${
this.projectId
}" style="display: none;">
<div class ="expandedTextOngoingWorkCard">
${this.description}
</div>
</div>
</div> `;
}
}
let projectCards: projectCard[] = []; let projectCards: projectCard[] = [];
let filteredImprovementWorks: any[] = []; let filteredImprovementWorks: any[] = [];
...@@ -309,11 +450,11 @@ function sortProjects( ...@@ -309,11 +450,11 @@ function sortProjects(
// Loop through the saved array of cards and generate HTML for each card // Loop through the saved array of cards and generate HTML for each card
for (const card of cardsToIterate) { for (const card of cardsToIterate) {
let cardHTML = card.generateHTML(); let cardHTML = card.generateHTML();
addEventListener(listenersLoaded, card.projectId, card);
let div = document.createElement("div"); let div = document.createElement("div");
div.className = "projectCardCardDiv"; // Set the class name(s) here div.className = "projectCardCardDiv"; // Set the class name(s) here
div.innerHTML = cardHTML; div.innerHTML = cardHTML;
if (!selectElement) return; if (!selectElement) return;
addEventListener(listenersLoaded, card.projectId, card);
selectElement.appendChild(div); // Stop if the container isn't found selectElement.appendChild(div); // Stop if the container isn't found
} }
} }
......
client/projectPage/projectPageA.html
+ 7
− 6
View file @ 54a0d6d5
...@@ -92,12 +92,13 @@ ...@@ -92,12 +92,13 @@
</div> </div>
<div id="NolansModel" style="margin:3%; width: 30%;"> <div id="NolansModel" style="margin:3%; width: 30%;">
<div class="wrap"> <div class="wrap projectPageWrap">
<div class="quart" id="nolansToP" data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen" >1. Planera </div> <div class="quart" id="nolansToP" data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen" >Planera </div>
<div class="quart" id="nolansToG"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">2. Göra</div> <div class="quart" id="nolansToG"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Göra</div>
<div class="quart"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">4. Agera</div> <div class="quart" id="nolansToS"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Studera</div>
<div class="quart" id="nolansToS"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">3. Studera</div> <div class="quart"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Agera</div>
<div class="center">PGSA</div>
<div class="center">P G S A</div>
</div> </div>
<article class="infoText"> <article class="infoText">
<h1>Sista steget</h1> <h1>Sista steget</h1>
......
client/projectPage/projectPageG.html
+ 5
− 5
View file @ 54a0d6d5
...@@ -98,11 +98,11 @@ ...@@ -98,11 +98,11 @@
</div> </div>
</div> </div>
<div id="NolansModel" style="margin:3%; width: 30%;"> <div class="projectPageNolandsModel" style="margin:3%; width: 30%;">
<div class="wrap"> <div class="wrap projectPageWrap">
<div class="quart" id="nolansToP"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">1. Planera</div> <div class="quart" id="nolansToP"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Planera</div>
<div class="quart"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">2. Göra</div> <div class="quart"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Göra</div>
<div class="center">PGSA</div> <div class="center">P G S A</div>
</div> </div>
<article class="infoText"> <article class="infoText">
<h1>Nästa steg</h1> <h1>Nästa steg</h1>
......
client/projectPage/projectPageP.html
+ 6
− 8
View file @ 54a0d6d5
...@@ -101,16 +101,16 @@ ...@@ -101,16 +101,16 @@
<img src="../images/info.png" style="height: 3vh; margin-left: 3px;" data-toggle="tooltip" title="FÖRTYDLIGANDE INFO HÄR"> <img src="../images/info.png" style="height: 3vh; margin-left: 3px;" data-toggle="tooltip" title="FÖRTYDLIGANDE INFO HÄR">
</div> </div>
<textarea id="p7" class="textArea" name="answer6" rows="5" cols="50" placeholder="Svara på frågan här..." required></textarea> <textarea id="p7" class="textArea" name="answer6" rows="5" cols="50" placeholder="Svara på frågan här..." required></textarea>
</form> </form>
<div class="saveEditDiv"> <div class="saveEditDiv">
<button id="saveEditBtnP" class="saveBtn">Spara</button> <button id="saveEditBtnP" class="saveBtn">Spara</button>
</div> </div>
</div> </div>
<div id="NolansModel" style="margin:3%; width: 30%;"> <div class ="projectPageNolandsModel" style="margin:3%; width: 30%;">
<div class="wrap"> <div class="wrap projectPageWrap"> <!-- double class because of different heights -->
<div class="quart" data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen" >1. Planera</div> <div class="quart" data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen" >Planera</div>
<div class="center">PGSA</div> <div class="center">P G S A</div>
</div> </div>
<article class="infoText"> <article class="infoText">
<h1>Nästa steg</h1> <h1>Nästa steg</h1>
...@@ -118,9 +118,7 @@ ...@@ -118,9 +118,7 @@
</article> </article>
<button id="toG" data-project-id="${this.id}" class="btn btn-primary" role="button">Nästa steg</button> <button id="toG" data-project-id="${this.id}" class="btn btn-primary" role="button">Nästa steg</button>
</div>
</div>
<div style="width: 25%;"> <div style="width: 25%;">
<div class="sideTitle">Dokument</div> <div class="sideTitle">Dokument</div>
<div class="documentsContainer"> <div class="documentsContainer">
......
client/projectPage/projectPageS.html
+ 5
− 6
View file @ 54a0d6d5
...@@ -85,12 +85,11 @@ ...@@ -85,12 +85,11 @@
</div> </div>
<div id="NolansModel" style="margin:3%; width: 30%;"> <div id="NolansModel" style="margin:3%; width: 30%;">
<div class="wrap"> <div class="wrap projectPageWrap">
<div class="quart" id="nolansToP"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">1. Planera</div> <div class="quart" id="nolansToP"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Planera</div>
<div class="quart" id="nolansToG"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">2. Göra</div> <div class="quart" id="nolansToG"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Göra</div>
<div></div> <div class="quart"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">Studera</div>
<div class="quart"data-toggle="tooltip" title="Klicka för att komma till detta steg av modellen">3. Studera</div> <div class="center">P G S A</div>
<div class="center">PGSA</div>
</div> </div>
<article class="infoText"> <article class="infoText">
<h1>Nästa steg</h1> <h1>Nästa steg</h1>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment