📝 Dokumentert redigeringsverktøy, skillelinje og tagbar
This commit is contained in:
parent
7ab280ed40
commit
8091b21b20
3 changed files with 32 additions and 26 deletions
|
@ -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
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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. må være 0, 1 eller 2.
|
||||
* @returns Tag komponent med riktig farge og tekst basert på 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. må være 0, 1 eller 2.
|
||||
*/
|
||||
const TagBar = (props: TagBarInterface) => {
|
||||
return (
|
||||
<div className="flex gap-3 mt-4">
|
||||
{toggleArbeidsstatus(props.arbeidsstatus)}
|
||||
|
|
Reference in a new issue