✨ Feilkort med dynamisk haster tag, og felles interface.ts fil
This commit is contained in:
parent
6906609bf5
commit
f40c345bd3
3 changed files with 34 additions and 22 deletions
frontend/src
|
@ -1,35 +1,35 @@
|
||||||
import FeilCard from "./FeilCard"
|
import FeilCard from "./FeilCard"
|
||||||
|
|
||||||
type FeilMelding = {
|
|
||||||
tittel: String
|
|
||||||
beskrivelse: String
|
|
||||||
}
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @returns Komponent for returnering av konteiner med alle feilinnmeldingene.
|
* @returns Komponent for returnering av konteiner med alle feilinnmeldingene.
|
||||||
*/
|
*/
|
||||||
const CardsContainer = () => {
|
const CardsContainer = () => {
|
||||||
|
|
||||||
const feilMeldinger: FeilMelding[] = [
|
const feilMeldinger: Feilmelding[] = [
|
||||||
{
|
{
|
||||||
tittel: "Mangel på hensyn til tariffoppgjør",
|
tittel: "Mangel på hensyn til tariffoppgjør",
|
||||||
beskrivelse: "Det har vært ett tariffoppgjør og speil sier sykepengene må tilbakekreves, noe som er feil. (sier vi.. har ikke domenekunnskap)"
|
beskrivelse: "Det har vært ett tariffoppgjør og speil sier sykepengene må tilbakekreves, noe som er feil. (sier vi.. har ikke domenekunnskap)",
|
||||||
|
haster: false
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
tittel: "Speil sier NAV må tilbakekreve sykepenger på feil grunnlag",
|
tittel: "Speil sier NAV må tilbakekreve sykepenger på feil grunnlag",
|
||||||
beskrivelse: "baluba"
|
beskrivelse: "baluba",
|
||||||
|
haster: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
tittel: "Feil A",
|
tittel: "Feil A",
|
||||||
beskrivelse: "Lorem Ipsum"
|
beskrivelse: "Lorem Ipsum",
|
||||||
|
haster: false
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
tittel: "Feil B",
|
tittel: "Feil B",
|
||||||
beskrivelse: "dolor"
|
beskrivelse: "dolor",
|
||||||
|
haster: false
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
tittel: "Håndkle på hue",
|
tittel: "Håndkle på hue",
|
||||||
beskrivelse: "Bombastic side eye"
|
beskrivelse: "Bombastic side eye",
|
||||||
|
haster: true
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
|
@ -37,7 +37,12 @@ const CardsContainer = () => {
|
||||||
<div>
|
<div>
|
||||||
<div className="grid grid-cols-2 gap-4">
|
<div className="grid grid-cols-2 gap-4">
|
||||||
{feilMeldinger.map((feilMelding) => (
|
{feilMeldinger.map((feilMelding) => (
|
||||||
<FeilCard key={feilMelding.toString()} tittel={feilMelding.tittel} beskrivelse={feilMelding.beskrivelse}/>
|
<FeilCard
|
||||||
|
key={feilMeldinger.indexOf(feilMelding)}
|
||||||
|
tittel={feilMelding.tittel}
|
||||||
|
beskrivelse={feilMelding.beskrivelse}
|
||||||
|
haster={feilMelding.haster}
|
||||||
|
/>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,24 +1,21 @@
|
||||||
import "@navikt/ds-css";
|
import "@navikt/ds-css";
|
||||||
import { ExpansionCard, Tag } from "@navikt/ds-react";
|
import { ExpansionCard, Tag } from "@navikt/ds-react";
|
||||||
|
|
||||||
interface feilmeldingInterface {
|
interface TagBarInterface {
|
||||||
tittel: String,
|
haster: boolean
|
||||||
beskrivelse: String
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const TagBar = () => {
|
//typen på status er veldig wack heheheh, må fjerne any etterhvert men String fungerer ikke
|
||||||
|
const TagBar = (props: TagBarInterface) => {
|
||||||
return (
|
return (
|
||||||
<div className="flex gap-8 mt-4">
|
<div className="flex gap-8 mt-4">
|
||||||
<Tag variant="info">Jobbes med</Tag>
|
<Tag variant="info">Jobbes med</Tag>
|
||||||
<div className="flex gap-2">
|
{props.haster === true ? <Tag variant="warning">Haster</Tag> : <></>}
|
||||||
<Tag variant="neutral">Spleiselaget</Tag>
|
|
||||||
<Tag variant="warning">Haster</Tag>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const FeilCard = (props: feilmeldingInterface) => {
|
const FeilCard = (props: Feilmelding) => {
|
||||||
return (
|
return (
|
||||||
<ExpansionCard aria-label="tekst">
|
<ExpansionCard aria-label="tekst">
|
||||||
<ExpansionCard.Header>
|
<ExpansionCard.Header>
|
||||||
|
@ -26,7 +23,7 @@ const FeilCard = (props: feilmeldingInterface) => {
|
||||||
<ExpansionCard.Description>
|
<ExpansionCard.Description>
|
||||||
{props.beskrivelse}
|
{props.beskrivelse}
|
||||||
</ExpansionCard.Description>
|
</ExpansionCard.Description>
|
||||||
<TagBar />
|
<TagBar haster={props.haster}/>
|
||||||
</ExpansionCard.Header>
|
</ExpansionCard.Header>
|
||||||
<ExpansionCard.Content>
|
<ExpansionCard.Content>
|
||||||
Hællæ
|
Hællæ
|
||||||
|
|
10
frontend/src/interface.ts
Normal file
10
frontend/src/interface.ts
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
/*
|
||||||
|
* I denne filen kan vi legge interfaces som skal brukes over flere steder!
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
interface Feilmelding {
|
||||||
|
tittel: String,
|
||||||
|
beskrivelse: String
|
||||||
|
haster: boolean
|
||||||
|
}
|
Reference in a new issue