-
-
Dra og slipp skjermbilder her!
+
+ Skjermbilder
+
+
+
+
+ Dra og slipp skjermbilder her!
+
}>
Last opp skjermbilder
diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
index 7181cfd..c13b070 100644
--- a/frontend/src/index.tsx
+++ b/frontend/src/index.tsx
@@ -9,37 +9,28 @@ import axios from "axios";
import { useEffect, useState } from "react";
import { Feilmelding } from "./interface";
+/**
+ * Hovedsiden til applikasjonen, viser alle innmeldte feil.
+ * Tilbyr søkefelt og filtreringsmuligheter
+ * Tilbyr også navigering til feilinnmeldingssiden
+ */
export default function Home() {
const navigate = useNavigate()
-
const [feilmeldinger, setFeilmeldinger] = useState
([]);
- /**
- * Henter alle feilmeldinger fra backend.
- * Bruker endepunktet /api/hentallefeil.
- */
+
const hentAlleFeil = async () => {
- await axios.get("/api/hentallefeil")
- .then(data => data.data)
- .then(feil => {
- setFeilmeldinger(
- feil.map((jsonFeilmelding: any) => new Feilmelding(jsonFeilmelding))
- );
- })
+ const { data } = await axios.get("/api/hentallefeil")
+ setFeilmeldinger(data)
}
-
- // Sørger for at hentAlleFeil() kun kjører når komponentet laster inn
+
useEffect(() => {
hentAlleFeil();
}, [])
- /**
- * Oppdaterer viste feilmeldinger ved endring i søkefelt.
- * Kontakter endepunktet /api/hentsok/.
- * @param soketekst
- */
+
+ //oppdaterer visningen av feilmeldinger når søkefeltet endres
const handleSearch = async (soketekst: string) => {
- // Ved tomt søkefelt hentes alle feilmeldinger
if (soketekst === "") {
hentAlleFeil()
return
@@ -48,6 +39,7 @@ export default function Home() {
setFeilmeldinger(data)
}
+
return (
diff --git a/frontend/src/interface.ts b/frontend/src/interface.ts
index 67d1e78..3b19b97 100644
--- a/frontend/src/interface.ts
+++ b/frontend/src/interface.ts
@@ -1,8 +1,3 @@
-/**
- * I denne filen kan vi legge interfaces som skal brukes over flere steder!
- */
-
-
export interface IFeilmelding {
id: number,
tittel: string,
@@ -21,6 +16,10 @@ export interface FeilmeldingsInnholdInterface extends IFeilmelding {
reset: () => void
}
+/**
+ * En klasse som implementerer IFeilmelding interfacet.
+ * Brukes for å mappe JSON objekter til en klasse ved henting av data fra backend
+ */
export class Feilmelding implements IFeilmelding {
id: number = 0
tittel: string = "default tittel"
@@ -31,10 +30,6 @@ export class Feilmelding implements IFeilmelding {
kommentar?: string = undefined
aktorid?: number = undefined
- /**
- * Typescript 2.1 syntax som lar deg sende inn et JSON object og mappe det til class.
- * https://stackoverflow.com/questions/14142071/typescript-and-field-initializers
- */
public constructor(
fields: {
id: number
diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
index cb81e91..4d7f099 100644
--- a/frontend/src/main.tsx
+++ b/frontend/src/main.tsx
@@ -5,6 +5,7 @@ import './index.css'
import Home from './index'
import Feil from './pages/feil'
+
const router = createBrowserRouter([
{
path: "/",
diff --git a/frontend/src/pages/feil.tsx b/frontend/src/pages/feil.tsx
index 8a053f8..c195993 100644
--- a/frontend/src/pages/feil.tsx
+++ b/frontend/src/pages/feil.tsx
@@ -9,6 +9,9 @@ import Header from "../components/Header";
import { useNavigate } from "react-router-dom";
import Skillelinje from "../components/Skillelinje";
+/**
+ * Siden for å melde inn feil i speil.
+ */
export default function Feil() {
const [tittel, setTittel] = useState("");
const [beskrivelse, setBeskrivelse] = useState("");
@@ -16,20 +19,27 @@ export default function Feil() {
const [haster, setHaster] = useState(false)
const [valgteTags, setValgteTags] = useState([] as string[]);
const [aktorid, setAktorid] = useState(null);
+ const navigate = useNavigate()
+ const tags = [
+ "Utbetaling",
+ "Inntekt",
+ "Speil",
+ "Annet"
+ ];
- const handleSubmit = () => {
+ //Sender feil til databasen
+ const meldInnFeil = () => {
const payload = {
id: null,
tittel: tittel,
beskrivelse: beskrivelse,
- dato: new Date().toISOString().replace('Z', ''), // Litt wack fix, burde endres
+ dato: new Date().toISOString().replace('Z', ''),
arbeidsstatus: 0,
haster: haster,
kommentar: null,
aktorid: aktorid ? aktorid : null,
- //kategorier: valgteTags
+ //TODO: kategorier: valgteTags
}
-
axios.post("/api/nyfeil", payload, {
headers: {
'Content-Type': 'application/json'
@@ -41,6 +51,7 @@ export default function Feil() {
})
}
+ //Håndterer alerts som vises etter at feil er lagt til i databasen eller feiler i å bli lagt til
const handleAlerts = () => {
if (status === 201) {
console.log("Feil lagt til i database");
@@ -56,18 +67,6 @@ export default function Feil() {
}
}
- // TODO: clear data fra felter
-
-
- const navigate = useNavigate()
-
- const tags = [
- "Utbetaling",
- "Inntekt",
- "Speil",
- "Annet"
- ];
-
return (
@@ -147,7 +146,7 @@ export default function Feil() {
{status != 0 ? handleAlerts() : <>>}