📝 Dokumentert redigeringsverktøy, skillelinje og tagbar

This commit is contained in:
Markus Johansen 2023-08-07 12:00:51 +02:00
parent 7ab280ed40
commit 8091b21b20
3 changed files with 32 additions and 26 deletions

View file

@ -9,12 +9,18 @@ interface redigeringsInterface extends FeilmeldingsInnholdInterface {
reset: () => void
}
/**
* Redigeringsverktøy er et skjema som lar brukeren redigere en innmeldt feil.
* Statusflagg som arbeidsstatus og haster flagg kan endres.
* Tittel og beskrivelse kan også endres
*/
const RedigeringsVerktoy = (props: redigeringsInterface) => {
const [tittel, setTittel] = useState(props.tittel)
const [beskrivelse, setBeskrivelse] = useState(props.beskrivelse)
const [arbeidsstatus, setArbeidsstatus] = useState(props.arbeidsstatus)
const [haster, setHaster] = useState(props.haster)
const lagreEndringer = async() => {
props.setVisModal(false)
props.setRedigeringsmodus(false)
@ -44,7 +50,6 @@ const RedigeringsVerktoy = (props: redigeringsInterface) => {
return (
<div className="flex flex-col gap-12 items-center px-12">
<div className="flex flex-col gap-6 w-full">
<Heading className="" size="large">
Rediger feil

View file

@ -1,5 +1,8 @@
/**
* Skillelinjer som brukes for å dele opp innholdet i et komponent/skjema i mindre deler
* Forbedrer lesbarheten til skjemaet
*/
const Skillelinje = () => {
return (
<div className="h-1 bg-gray-200 my-3 rounded-lg w-full"></div>

View file

@ -4,18 +4,10 @@ interface TagBarInterface {
haster: boolean
arbeidsstatus: number
}
/**
* Komponentet er en bar (vanrett linje) som inneholder to statusflagg: "arbeidsstatus" og "Haster".
* Komponentet er en del av FeilKortHeader
* @param haster er en boolean som beskriver om feilen haster eller ikke.
* @param arbeidsstatus
*/
const TagBar = (props: TagBarInterface) => {
/**
* Funksjonen tar inn
* @param arbeidsstatus
* @returns
* @param arbeidsstatus er en kode som beskriver om feilen er fikset, jobbes med eller ikke påbegynt. være 0, 1 eller 2.
* @returns Tag komponent med riktig farge og tekst basert arbeidsstatus-kode
*/
const toggleArbeidsstatus = (arbeidsstatus: number) => {
switch (arbeidsstatus) {
@ -27,10 +19,16 @@ const TagBar = (props: TagBarInterface) => {
return <Tag variant="success">Feilen er fikset</Tag>;
default:
throw new Error("Ikke gyldig arbeidsstatus-kode. Koden må være 0, 1 eller 2");
}
}
/**
* Komponentet er en bar (vanrett linje) som inneholder to statusflagg: "arbeidsstatus" og "Haster".
* Komponentet er en del av FeilKortHeader
* @param haster er en boolean som beskriver om feilen haster eller ikke.
* @param arbeidsstatus er en kode som beskriver om feilen er fikset, jobbes med eller ikke påbegynt. være 0, 1 eller 2.
*/
const TagBar = (props: TagBarInterface) => {
return (
<div className="flex gap-3 mt-4">
{toggleArbeidsstatus(props.arbeidsstatus)}