Rollen Chunk 5: Genehmigungs-Status mit Eigen-UI

src/components/YearTable.test.tsx

@@ -33,6 +33,7 @@ const baseProps = {
       startDate: "2026-04-14",
       endDate: "2026-04-14",
       dayFraction: "full" as const,
+      status: "bestätigt" as const,
       units: 2,
     },
   ],
@@ -248,6 +249,7 @@ test("day tooltips name the vacation range", () => {
           startDate: "2026-04-13",
           endDate: "2026-04-17",
           dayFraction: "full",
+          status: "bestätigt" as const,
           units: 10,
         },
       ]}
@@ -295,3 +297,18 @@ test("marks earned overtime and deductions", () => {
     "ycell-overtime",
   );
 });
+
+test("marks requested days dashed instead of solid vacation", () => {
+  render(
+    <YearTable
+      {...baseProps}
+      vacationRequests={[
+        { id: 1, startDate: "2026-04-13", endDate: "2026-04-13", dayFraction: "full" as const, status: "beantragt" as const, units: 2 },
+      ]}
+      onSelectDate={() => {}}
+    />,
+  );
+  const cell = screen.getByRole("button", { name: "2026-04-13" });
+  expect(cell).toHaveClass("ycell-requested");
+  expect(cell).not.toHaveClass("ycell-vacation");
+});