Setter default uten lønn

navikt · Nov 14, 2024 · 160daa6 · 160daa6
1 parent 06b0792
commit 160daa6
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 10 deletions.
diff --git a/src/components/kalender/dag/Dag.module.css b/src/components/kalender/dag/Dag.module.css
@@ -18,27 +18,43 @@
     line-height: var(--a-font-size-medium);
     cursor: pointer;
     border: 0;
-    z-index: 10;
 }
 
 .dato:hover {
     outline: solid 4px var(--a-deepblue-500);
 }
 
 .ikkeValgt {
-    background-color: var(--a-bg-subtle);
+    background: var(--a-bg-subtle);
 }
 
 .deltatt {
-    background-color: var(--a-green-300);
+    background: var(--a-green-300);
+}
+
+.deltattMedLønn {
+    background: repeating-linear-gradient(
+            45deg,
+            var(--a-orange-300),
+            var(--a-orange-300) 10px,
+            var(--a-green-300) 10px,
+            var(--a-green-300) 20px
+    );
 }
 
 .fravær {
-    background-color: var(--a-orange-300);
+    background: var(--a-orange-300);
 }
 
 .ikkeDeltatt {
-    background-color: var(--a-red-300);
+    background: var(--a-red-300);
+}
+
+.ikon {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    color: var(--a-red-400)
 }
 
 @media screen and (min-width: 768px) {

diff --git a/src/components/kalender/dag/Dag.tsx b/src/components/kalender/dag/Dag.tsx
@@ -2,14 +2,15 @@ import { format } from 'date-fns';
 import { MeldekortDag } from '@typer/meldekort-utfylling';
 import classNames from 'classnames';
 import { useMeldekortUtfylling } from '@context/meldekort-utfylling/useMeldekortUtfylling';
+import { FirstAidFillIcon } from '@navikt/aksel-icons';
 
 import style from './Dag.module.css';
 
 const getStatusStyle = (dag: MeldekortDag) => {
     const { deltattValg, underValg } = dag.status;
 
     if (deltattValg === 'deltatt') {
-        return style.deltatt;
+        return underValg === 'DELTATT_UTEN_LØNN' ? style.deltatt : style.deltattMedLønn;
     }
 
     if (deltattValg === 'ikkeDeltatt') {
@@ -39,6 +40,8 @@ export const Dag = ({ dag, readonly }: Props) => {
                 disabled={readonly}
             >
                 {formattedDate}
+                {dag.status.deltattValg === 'ikkeDeltatt' &&
+                    dag.status.underValg !== 'IKKE_DELTATT' && <FirstAidFillIcon className={style.ikon} />}
             </button>
         </td>
     );

diff --git a/src/components/meldekort-dag-modal/MeldekortDagModal.tsx b/src/components/meldekort-dag-modal/MeldekortDagModal.tsx
@@ -50,20 +50,22 @@ export const MeldekortDagModal = () => {
                     </Radio>
                     {valgtStatus?.deltattValg === 'deltatt' && (
                         <RadioGroup
-                            value={valgtStatus?.underValg}
+                            value={
+                                valgtStatus?.underValg || MeldekortDeltattUndervalg.DeltattUtenLønn
+                            }
                             legend={'Valgt deltatt'}
                             hideLegend={true}
                             className={style.underValg}
                             onChange={(value) => {
                                 setValgtStatus({ ...valgtStatus, underValg: value });
                             }}
                         >
-                            <Radio value={MeldekortDeltattUndervalg.DeltattMedLønn}>
-                                {'Med lønn'}
-                            </Radio>
                             <Radio value={MeldekortDeltattUndervalg.DeltattUtenLønn}>
                                 {'Uten lønn'}
                             </Radio>
+                            <Radio value={MeldekortDeltattUndervalg.DeltattMedLønn}>
+                                {'Med lønn'}
+                            </Radio>
                         </RadioGroup>
                     )}
                     <Radio value={'ikkeDeltatt'}>