Enhances employee details with comprehensive salary and HR data

Adds detailed salary rates, commission structures, and HR-related records

Introduces new data models and view components for:
- Salary rates and supplements
- Commissions and rate configurations
- Employee HR tracking (certifications, courses, absence)

Implements dynamic rate synchronization between drawer and card views
This commit is contained in:
Janus C. H. Knudsen 2026-01-13 22:37:29 +01:00
parent 2e6207bb0b
commit f71f00099a
15 changed files with 1589 additions and 137 deletions

View file

@ -14,6 +14,7 @@
* - swp-section-label (card section headers)
* - swp-section-header (section header with action link)
* - swp-section-action (action link in section header)
* - swp-add-button (dashed border add button)
*/
/* ===========================================
@ -194,6 +195,36 @@ swp-status-badge.employee {
color: var(--color-text-secondary);
}
/* Additional status variants */
swp-status-badge.valid {
background: color-mix(in srgb, var(--color-green) 15%, transparent);
color: var(--color-green);
}
swp-status-badge.expiring,
swp-status-badge.warning {
background: color-mix(in srgb, var(--color-amber) 15%, transparent);
color: #b45309;
}
swp-status-badge.enrolled,
swp-status-badge.ferie {
background: color-mix(in srgb, var(--color-teal) 15%, transparent);
color: var(--color-teal);
}
swp-status-badge.fri,
swp-status-badge.info {
background: color-mix(in srgb, var(--color-blue) 15%, transparent);
color: var(--color-blue);
}
swp-status-badge.sygdom,
swp-status-badge.danger {
background: color-mix(in srgb, var(--color-red) 15%, transparent);
color: var(--color-red);
}
/* ===========================================
PLAN CARDS (swp-plan-card)
=========================================== */
@ -432,3 +463,27 @@ swp-card-footer {
margin: var(--spacing-6) calc(-1 * var(--card-padding)) calc(-1 * var(--card-padding));
border-radius: 0 0 var(--border-radius-lg) var(--border-radius-lg);
}
/* ===========================================
ADD BUTTON (dashed border style)
=========================================== */
swp-add-button {
display: flex;
align-items: center;
justify-content: center;
gap: var(--spacing-2);
padding: var(--spacing-5);
margin-top: var(--spacing-5);
border: 2px dashed var(--color-border);
border-radius: var(--radius-md);
color: var(--color-text-secondary);
font-size: var(--font-size-md);
cursor: pointer;
transition: all var(--transition-fast);
}
swp-add-button:hover {
border-color: var(--color-teal);
color: var(--color-teal);
background: color-mix(in srgb, var(--color-teal) 5%, transparent);
}