Merge branch 'main' into nyRedigeringsLayout
This commit is contained in:
Sid
GitHub
commit
eb6f52b440
5 changed files with 109 additions and 11 deletions
|
|
@ -46,7 +46,10 @@ const FeilKort = (props: IFeilKort) => {
|
|||
arbeidsstatus={props.arbeidsstatus}
|
||||
/>
|
||||
</div>
|
||||
<FeilModal open={visModal} setOpen={setVisModal} >
|
||||
<FeilModal
|
||||
open={visModal}
|
||||
setOpen={setVisModal}
|
||||
>
|
||||
{redigeringsmodus ?
|
||||
<RedigeringsVerktoy
|
||||
id={props.id}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,36 @@
|
|||
import { PencilIcon, XMarkIcon } from "@navikt/aksel-icons"
|
||||
import { Button } from "@navikt/ds-react"
|
||||
import { ChatElipsisIcon, PencilIcon, XMarkIcon } from "@navikt/aksel-icons"
|
||||
import { Button, Heading, TextField } from "@navikt/ds-react"
|
||||
import { FeilmeldingsInnholdInterface } from "../interface"
|
||||
import FeilkortHeader from "./FeilkortHeader"
|
||||
import { useState } from "react"
|
||||
import Skillelinje from "./Skillelinje"
|
||||
import axios from "axios"
|
||||
|
||||
const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
||||
const [kommentar, setKommentar] = useState("")
|
||||
const [kommentarfelt, setKommentarfelt] = useState("")
|
||||
|
||||
const oppdaterkommentar = async() => {
|
||||
setKommentar(kommentarfelt)
|
||||
|
||||
const payload = {
|
||||
id: props.id,
|
||||
tittel: kommentar,
|
||||
}
|
||||
|
||||
await axios.put("/api/oppdaterkommentar", payload, {
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
}).then((response) => {
|
||||
console.log(response);
|
||||
}).catch((error) => {
|
||||
console.log(error);
|
||||
})
|
||||
|
||||
props.reset()
|
||||
}
|
||||
|
||||
return(
|
||||
<>
|
||||
<div className="flex justify-between ">
|
||||
|
|
@ -17,7 +43,7 @@ const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
|||
arbeidsstatus={props.arbeidsstatus} />
|
||||
<div className="flex gap-4 items-start">
|
||||
<Button
|
||||
variant="secondary"
|
||||
variant="tertiary"
|
||||
icon={<PencilIcon />}
|
||||
onClick={() => props.setRedigeringsmodus(true)}
|
||||
>
|
||||
|
|
@ -36,7 +62,65 @@ const FeilmeldingsInnhold = (props: FeilmeldingsInnholdInterface) => {
|
|||
</div>
|
||||
<Skillelinje/>
|
||||
{props.children}
|
||||
{kommentar.length === 0 ?
|
||||
<KommentarTekstfelt
|
||||
kommentarfelt={kommentarfelt}
|
||||
setKommentarfelt={setKommentarfelt}
|
||||
oppdaterKommentar={() => oppdaterkommentar()}
|
||||
/>
|
||||
:
|
||||
<Kommentar
|
||||
tekst={kommentar}
|
||||
/>
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
export default FeilmeldingsInnhold;
|
||||
|
||||
|
||||
interface Ikommentar {
|
||||
setKommentarfelt: (val: string) => void
|
||||
oppdaterKommentar: () => void
|
||||
}
|
||||
|
||||
interface kommentarTekstfeltInterface extends Ikommentar{
|
||||
kommentarfelt: string,
|
||||
}
|
||||
interface kommentarInterface {
|
||||
tekst: string
|
||||
}
|
||||
|
||||
|
||||
const KommentarTekstfelt = (props: kommentarTekstfeltInterface) => {
|
||||
return(
|
||||
<div className="flex items-end gap-12 w-full mt-4 h-fit">
|
||||
<TextField
|
||||
className="grow"
|
||||
label="Skriv inn din kommentar til feilen"
|
||||
value={props.kommentarfelt}
|
||||
onChange={e => props.setKommentarfelt(e.target.value)}
|
||||
>
|
||||
</TextField>
|
||||
<Button
|
||||
variant="secondary"
|
||||
icon={<ChatElipsisIcon/>}
|
||||
onClick={() => props.oppdaterKommentar()}
|
||||
>
|
||||
Legg til kommentar
|
||||
</Button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const Kommentar = (props: kommentarInterface) => {
|
||||
return(
|
||||
<>
|
||||
<Skillelinje/>
|
||||
<div className="p-5 bg-bg-subtle rounded-lg w-2/3 my-4">
|
||||
<Heading size="medium">Notat</Heading>
|
||||
<p className="break-words">{props.tekst}</p>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
const Skillelinje = () => {
|
||||
return (
|
||||
<div className="h-1 bg-gray-200 my-4 rounded-lg w-full"></div>
|
||||
<div className="h-1 bg-gray-200 my-3 rounded-lg w-full"></div>
|
||||
)
|
||||
}
|
||||
export default Skillelinje
|
||||
|
|
@ -16,6 +16,7 @@ export interface FeilmeldingsInnholdInterface extends IFeilmelding {
|
|||
children?: React.ReactNode
|
||||
setRedigeringsmodus: (redigeringsmodus: boolean) => void
|
||||
setVisModal: (visModal: boolean) => void
|
||||
reset: () => void
|
||||
}
|
||||
|
||||
export class Feilmelding implements IFeilmelding {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import "@navikt/ds-css";
|
||||
|
||||
import { ArrowLeftIcon, BugIcon } from "@navikt/aksel-icons";
|
||||
import { Alert, Button, Heading, TextField, Textarea } from "@navikt/ds-react";
|
||||
import { Alert, Button, Heading, Switch, TextField, Textarea } from "@navikt/ds-react";
|
||||
import axios from "axios";
|
||||
import { useState } from "react";
|
||||
import BildeOpplastning from "../components/BildeOpplastning";
|
||||
|
|
@ -13,7 +13,7 @@ export default function Feil() {
|
|||
const [tittel, setTittel] = useState("");
|
||||
const [beskrivelse, setBeskrivelse] = useState("");
|
||||
const [status, setStatus] = useState(0)
|
||||
//const [haster, setHaster] = useState(false)
|
||||
const [haster, setHaster] = useState(false)
|
||||
|
||||
const handleSubmit = () => {
|
||||
|
||||
|
|
@ -23,8 +23,8 @@ export default function Feil() {
|
|||
beskrivelse: beskrivelse,
|
||||
dato: new Date().toISOString().replace('Z', ''), // Litt wack fix, burde endres
|
||||
arbeidsstatus: 0,
|
||||
haster: false,
|
||||
kommentar: ""
|
||||
haster: haster,
|
||||
kommentar: null
|
||||
}
|
||||
|
||||
axios.post("/api/nyfeil", payload, {
|
||||
|
|
@ -63,7 +63,7 @@ export default function Feil() {
|
|||
<Header/>
|
||||
<div className="flex grow">
|
||||
<div className="w-1/4 bg-bg-subtle"></div>
|
||||
<div className="flex flex-col justify-center gap-16 p-8 px-16 grow">
|
||||
<div className="flex flex-col justify-center gap-8 p-8 px-16 grow">
|
||||
<div className=" flex flex-col gap-2 justify-center">
|
||||
<BugIcon
|
||||
title="Insekts ikon"
|
||||
|
|
@ -89,7 +89,17 @@ export default function Feil() {
|
|||
<Skillelinje/>
|
||||
<BildeOpplastning/>
|
||||
<Skillelinje/>
|
||||
<Heading size="xsmall">
|
||||
Haster det å fikse feilen?
|
||||
</Heading>
|
||||
<Switch
|
||||
onClick={() => setHaster(!haster)}
|
||||
>
|
||||
Saken Haster
|
||||
</Switch>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="w-1/2 flex flex-col gap-2 justify-center">
|
||||
{status != 0 ? handleAlerts() : <></>}
|
||||
<Button
|
||||
|
|
|
|||
Reference in a new issue