Kundenportal arbeiten

backend/src/routes/admin.ts

@@ -4,6 +4,7 @@ import { and, eq, inArray, isNull } from "drizzle-orm";
 import {
     authTenantUsers,
     authProfiles,
+    customers,
     authRoles,
     authUserRoles,
     authUsers,
@@ -12,6 +13,7 @@ import {
     tenants,
 } from "../../db/schema";
 import { generateRandomPassword, hashPassword } from "../utils/password";
+import { sendMail } from "../utils/mailer";
 
 export default async function adminRoutes(server: FastifyInstance) {
     const deriveNameFromEmail = (email: string) => {
@@ -255,6 +257,33 @@ export default async function adminRoutes(server: FastifyInstance) {
         return currentUser;
     };
 
+    const ensurePortalRoleForTenant = async (tenantId: number, createdBy: string) => {
+        const existingRoles = await server.db
+            .select({
+                id: authRoles.id,
+                name: authRoles.name,
+            })
+            .from(authRoles)
+            .where(eq(authRoles.tenant_id, tenantId));
+
+        const portalRole = existingRoles.find((role) => role.name === "Kundenportal");
+        if (portalRole) return portalRole.id;
+
+        const [createdRole] = await server.db
+            .insert(authRoles)
+            .values({
+                name: "Kundenportal",
+                description: "Automatisch angelegte Rolle für eingeladene Kundenportal-Benutzer",
+                tenant_id: tenantId,
+                created_by: createdBy,
+            })
+            .returning({
+                id: authRoles.id,
+            });
+
+        return createdRole.id;
+    };
+
     // -------------------------------------------------------------
     // GET /admin/overview
     // -------------------------------------------------------------
@@ -422,6 +451,233 @@ export default async function adminRoutes(server: FastifyInstance) {
         }
     });
 
+    server.post("/admin/customers/:customerId/invite-portal-user", async (req, reply) => {
+        try {
+            const currentUser = await requireAdmin(req, reply);
+            if (!currentUser) return;
+
+            const tenantId = Number(req.user?.tenant_id);
+            const { customerId } = req.params as { customerId: string };
+
+            if (!tenantId) {
+                return reply.code(400).send({ error: "No tenant selected" });
+            }
+
+            const [tenantRecord] = await server.db
+                .select({
+                    id: tenants.id,
+                    name: tenants.name,
+                    portalDomain: tenants.portalDomain,
+                })
+                .from(tenants)
+                .where(eq(tenants.id, tenantId))
+                .limit(1);
+
+            const [customerRecord] = await server.db
+                .select()
+                .from(customers)
+                .where(and(eq(customers.id, Number(customerId)), eq(customers.tenant, tenantId)))
+                .limit(1);
+
+            if (!customerRecord) {
+                return reply.code(404).send({ error: "Customer not found" });
+            }
+
+            const customerInfo = customerRecord.infoData && typeof customerRecord.infoData === "object" ? customerRecord.infoData as Record<string, any> : {};
+            const email = String(customerInfo.email || customerInfo.invoiceEmail || "").trim().toLowerCase();
+
+            if (!email) {
+                return reply.code(400).send({ error: "Customer has no email address" });
+            }
+
+            const generatedPassword = generateRandomPassword(14);
+            const passwordHash = await hashPassword(generatedPassword);
+
+            const [existingUser] = await server.db
+                .select({
+                    id: authUsers.id,
+                    email: authUsers.email,
+                    is_admin: authUsers.is_admin,
+                })
+                .from(authUsers)
+                .where(eq(authUsers.email, email))
+                .limit(1);
+
+            const derivedName = deriveNameFromEmail(email);
+            const firstName = customerRecord.firstname?.trim() || derivedName.first_name;
+            const lastName = customerRecord.lastname?.trim() || derivedName.last_name;
+
+            let userId = existingUser?.id || null;
+            let createdNewUser = false;
+
+            if (existingUser) {
+                const [existingProfile] = await server.db
+                    .select({
+                        id: authProfiles.id,
+                        customer_for_portal: authProfiles.customer_for_portal,
+                    })
+                    .from(authProfiles)
+                    .where(and(
+                        eq(authProfiles.user_id, existingUser.id),
+                        eq(authProfiles.tenant_id, tenantId)
+                    ))
+                    .limit(1);
+
+                if (existingUser.is_admin) {
+                    return reply.code(409).send({ error: "Email address is already used by an admin user" });
+                }
+
+                if (!existingProfile) {
+                    return reply.code(409).send({ error: "Email address is already used by another user" });
+                }
+
+                if (existingProfile.customer_for_portal && existingProfile.customer_for_portal !== customerRecord.id) {
+                    return reply.code(409).send({ error: "Email address is already assigned to another portal customer" });
+                }
+
+                await server.db
+                    .update(authUsers)
+                    .set({
+                        passwordHash,
+                        must_change_password: true,
+                        multiTenant: false,
+                        updatedAt: new Date(),
+                    })
+                    .where(eq(authUsers.id, existingUser.id));
+
+                userId = existingUser.id;
+            } else {
+                const [createdUser] = await server.db
+                    .insert(authUsers)
+                    .values({
+                        email,
+                        passwordHash,
+                        is_admin: false,
+                        multiTenant: false,
+                        must_change_password: true,
+                        updatedAt: new Date(),
+                    })
+                    .returning({
+                        id: authUsers.id,
+                    });
+
+                userId = createdUser.id;
+                createdNewUser = true;
+            }
+
+            const portalRoleId = await ensurePortalRoleForTenant(tenantId, currentUser.id);
+
+            const existingMemberships = await server.db
+                .select()
+                .from(authTenantUsers)
+                .where(and(
+                    eq(authTenantUsers.user_id, userId!),
+                    eq(authTenantUsers.tenant_id, tenantId)
+                ))
+                .limit(1);
+
+            if (!existingMemberships.length) {
+                await server.db
+                    .insert(authTenantUsers)
+                    .values({
+                        tenant_id: tenantId,
+                        user_id: userId!,
+                        created_by: currentUser.id,
+                    });
+            }
+
+            const existingPortalRoleAssignment = await server.db
+                .select()
+                .from(authUserRoles)
+                .where(and(
+                    eq(authUserRoles.user_id, userId!),
+                    eq(authUserRoles.tenant_id, tenantId),
+                    eq(authUserRoles.role_id, portalRoleId)
+                ))
+                .limit(1);
+
+            if (!existingPortalRoleAssignment.length) {
+                await server.db
+                    .insert(authUserRoles)
+                    .values({
+                        user_id: userId!,
+                        tenant_id: tenantId,
+                        role_id: portalRoleId,
+                        created_by: currentUser.id,
+                    });
+            }
+
+            const [existingTenantProfile] = await server.db
+                .select({
+                    id: authProfiles.id,
+                    user_id: authProfiles.user_id,
+                    customer_for_portal: authProfiles.customer_for_portal,
+                })
+                .from(authProfiles)
+                .where(and(
+                    eq(authProfiles.user_id, userId!),
+                    eq(authProfiles.tenant_id, tenantId)
+                ))
+                .limit(1);
+
+            if (existingTenantProfile) {
+                await server.db
+                    .update(authProfiles)
+                    .set({
+                        first_name: firstName,
+                        last_name: lastName,
+                        email,
+                        customer_for_portal: customerRecord.id,
+                        active: true,
+                    })
+                    .where(eq(authProfiles.id, existingTenantProfile.id));
+            } else {
+                await server.db
+                    .insert(authProfiles)
+                    .values({
+                        user_id: userId!,
+                        tenant_id: tenantId,
+                        first_name: firstName,
+                        last_name: lastName,
+                        email,
+                        customer_for_portal: customerRecord.id,
+                        active: true,
+                    });
+            }
+
+            const portalUrl = tenantRecord?.portalDomain ? `https://${tenantRecord.portalDomain}/login` : null;
+
+            const mailResult = await sendMail(
+                email,
+                `FEDEO | Einladung ins Kundenportal`,
+                `
+                    <p>Hallo${customerRecord.name ? ` ${customerRecord.name}` : ""},</p>
+                    <p>für Sie wurde ein Zugang zum FEDEO Kundenportal eingerichtet.</p>
+                    <p><strong>E-Mail:</strong> ${email}</p>
+                    <p><strong>Initialpasswort:</strong> ${generatedPassword}</p>
+                    <p>Bitte ändern Sie dieses Passwort direkt nach dem ersten Login.</p>
+                    ${portalUrl ? `<p><strong>Login:</strong> <a href="${portalUrl}">${portalUrl}</a></p>` : ""}
+                    <p>Viele Grüße<br>${tenantRecord?.name || "FEDEO"}</p>
+                `
+            );
+
+            if (!mailResult.success) {
+                return reply.code(500).send({ error: "Invitation email could not be sent" });
+            }
+
+            return {
+                success: true,
+                createdNewUser,
+                email,
+                initialPassword: generatedPassword,
+                portalUrl,
+            };
+        } catch (err) {
+            console.error("ERROR /admin/customers/:customerId/invite-portal-user:", err);
+            return reply.code(500).send({ error: "Internal Server Error" });
+        }
+    });
+
     // -------------------------------------------------------------
     // POST /admin/tenants
     // -------------------------------------------------------------

backend/src/routes/files.ts

@@ -10,7 +10,9 @@ import { secrets } from "../utils/secrets"
 import { saveFile } from "../utils/files"
 
 import { eq, inArray } from "drizzle-orm"
+import { and } from "drizzle-orm"
 import {
+    authProfiles,
     files,
     createddocuments,
     customers
@@ -18,6 +20,55 @@ import {
 
 
 export default async function fileRoutes(server: FastifyInstance) {
+    const getPortalCustomerId = async (req: any) => {
+        const tenantId = req.user?.tenant_id
+        const userId = req.user?.user_id
+
+        if (!tenantId || !userId) return null
+
+        const [profile] = await server.db
+            .select({ customer_for_portal: authProfiles.customer_for_portal })
+            .from(authProfiles)
+            .where(and(
+                eq(authProfiles.tenant_id, tenantId),
+                eq(authProfiles.user_id, userId)
+            ))
+            .limit(1)
+
+        return profile?.customer_for_portal || null
+    }
+
+    const loadSingleFileForRequest = async (req: any, id: string) => {
+        const tenantId = req.user?.tenant_id
+        if (!tenantId) return null
+
+        const portalCustomerId = await getPortalCustomerId(req)
+
+        if (!portalCustomerId) {
+            const rows = await server.db
+                .select()
+                .from(files)
+                .where(and(eq(files.id, id), eq(files.tenant, tenantId)))
+
+            return rows[0] || null
+        }
+
+        const rows = await server.db
+            .select({
+                file: files,
+            })
+            .from(files)
+            .leftJoin(createddocuments, eq(files.createddocument, createddocuments.id))
+            .where(and(
+                eq(files.id, id),
+                eq(files.tenant, tenantId),
+                eq(createddocuments.customer, portalCustomerId),
+                eq(createddocuments.availableInPortal, true)
+            ))
+            .limit(1)
+
+        return rows[0]?.file || null
+    }
 
     // -------------------------------------------------------------
     // MULTIPART INIT
@@ -80,12 +131,7 @@ export default async function fileRoutes(server: FastifyInstance) {
 
             // 🔹 EINZELNE DATEI
             if (id) {
-                const rows = await server.db
+                const file = await loadSingleFileForRequest(req, id)
-                    .select()
-                    .from(files)
-                    .where(eq(files.id, id))
-
-                const file = rows[0]
                 if (!file) return reply.code(404).send({ error: "Not found" })
 
                 return file
@@ -135,12 +181,7 @@ export default async function fileRoutes(server: FastifyInstance) {
             // 1️⃣ SINGLE DOWNLOAD
             // -------------------------------------------------
             if (id) {
-                const rows = await server.db
+                const file = await loadSingleFileForRequest(req, id)
-                    .select()
-                    .from(files)
-                    .where(eq(files.id, id))
-
-                const file = rows[0]
                 if (!file) return reply.code(404).send({ error: "File not found" })
 
                 const command = new GetObjectCommand({
@@ -217,12 +258,7 @@ export default async function fileRoutes(server: FastifyInstance) {
             // SINGLE FILE PRESIGNED URL
             // -------------------------------------------------
             if (id) {
-                const rows = await server.db
+                const file = await loadSingleFileForRequest(req, id)
-                    .select()
-                    .from(files)
-                    .where(eq(files.id, id))
-
-                const file = rows[0]
                 if (!file) return reply.code(404).send({ error: "Not found" })
 
                 const url = await getSignedUrl(

backend/src/routes/resources/main.ts

@@ -11,6 +11,7 @@ import {
     sql,
 } from "drizzle-orm"
 
+import { authProfiles } from "../../../db/schema";
 import { resourceConfig } from "../../utils/resource.config";
 import { useNextNumberRangeNumber } from "../../utils/functions";
 import { getHistoryEntityLabel, insertHistoryItem } from "../../utils/history";
@@ -18,6 +19,9 @@ import { diffObjects } from "../../utils/diff";
 import { recalculateServicePricesForTenant } from "../../modules/service-price-recalculation.service";
 import { decrypt, encrypt } from "../../utils/crypt";
 
+const PORTAL_ALLOWED_RESOURCES = new Set(["customers", "contracts", "createddocuments"])
+const PORTAL_VISIBLE_DOCUMENT_TYPES = ["invoices", "advanceInvoices", "cancellationInvoices"]
+
 // -------------------------------------------------------------
 // SQL Suche auf mehreren Feldern (Haupttabelle + Relationen)
 // -------------------------------------------------------------
@@ -130,6 +134,65 @@ function applyResourceWhereFilters(resource: string, table: any, whereCond: any)
     return whereCond
 }
 
+async function getPortalCustomerId(server: FastifyInstance, req: any) {
+    const tenantId = req.user?.tenant_id
+    const userId = req.user?.user_id
+
+    if (!tenantId || !userId) return null
+
+    const [profile] = await server.db
+        .select({ customer_for_portal: authProfiles.customer_for_portal })
+        .from(authProfiles)
+        .where(and(
+            eq(authProfiles.tenant_id, tenantId),
+            eq(authProfiles.user_id, userId)
+        ))
+        .limit(1)
+
+    return profile?.customer_for_portal || null
+}
+
+function applyPortalScope(resource: string, table: any, whereCond: any, portalCustomerId: number | null) {
+    if (!portalCustomerId) return whereCond
+
+    if (!PORTAL_ALLOWED_RESOURCES.has(resource)) {
+        return null
+    }
+
+    if (resource === "customers") {
+        return and(whereCond, eq(table.id, portalCustomerId))
+    }
+
+    if (resource === "contracts") {
+        return and(whereCond, eq(table.customer, portalCustomerId))
+    }
+
+    if (resource === "createddocuments") {
+        return and(
+            whereCond,
+            eq(table.customer, portalCustomerId),
+            eq(table.availableInPortal, true),
+            inArray(table.type, PORTAL_VISIBLE_DOCUMENT_TYPES)
+        )
+    }
+
+    return whereCond
+}
+
+function sanitizePortalCustomerUpdate(payload: Record<string, any>) {
+    const nextInfoData = payload.infoData && typeof payload.infoData === "object" ? payload.infoData : {}
+
+    return {
+        name: payload.name,
+        firstname: payload.firstname,
+        lastname: payload.lastname,
+        salutation: payload.salutation,
+        title: payload.title,
+        nameAddition: payload.nameAddition,
+        infoData: nextInfoData,
+    }
+}
+
 function getTenantColumn(resource: string, table: any) {
     const config = resourceConfig[resource]
     const tenantKey = config?.tenantKey || "tenant"
@@ -271,11 +334,16 @@ export default async function resourceRoutes(server: FastifyInstance) {
             if (!config) {
                 return reply.code(404).send({ error: "Unknown resource" })
             }
+            const portalCustomerId = await getPortalCustomerId(server, req)
+            if (portalCustomerId && !PORTAL_ALLOWED_RESOURCES.has(resource)) {
+                return reply.code(403).send({ error: "Forbidden" })
+            }
             const table = config.table
 
             const tenantColumn = getTenantColumn(resource, table)
             let whereCond: any = tenantColumn ? eq(tenantColumn, tenantId) : undefined
             whereCond = applyResourceWhereFilters(resource, table, whereCond)
+            whereCond = applyPortalScope(resource, table, whereCond, portalCustomerId)
             let q = server.db.select().from(table).$dynamic()
 
             const searchCols: any[] = (config.searchColumns || []).map(c => table[c])
@@ -380,6 +448,10 @@ export default async function resourceRoutes(server: FastifyInstance) {
             if (!config) {
                 return reply.code(404).send({ error: "Unknown resource" });
             }
+            const portalCustomerId = await getPortalCustomerId(server, req)
+            if (portalCustomerId && !PORTAL_ALLOWED_RESOURCES.has(resource)) {
+                return reply.code(403).send({ error: "Forbidden" })
+            }
             const table = config.table;
 
             const { queryConfig } = req;
@@ -389,6 +461,7 @@ export default async function resourceRoutes(server: FastifyInstance) {
             const tenantColumn = getTenantColumn(resource, table);
             let whereCond: any = tenantColumn ? eq(tenantColumn, tenantId) : undefined;
             whereCond = applyResourceWhereFilters(resource, table, whereCond)
+            whereCond = applyPortalScope(resource, table, whereCond, portalCustomerId)
             const searchCols: any[] = (config.searchColumns || []).map(c => table[c]);
             const debugSearchColumnNames: string[] = [...(config.searchColumns || [])];
             const parsedFilters: Array<{ key: string; value: any }> = []
@@ -489,6 +562,7 @@ export default async function resourceRoutes(server: FastifyInstance) {
                     }
                     let distinctWhereCond: any = tenantColumn ? eq(tenantColumn, tenantId) : undefined
                     distinctWhereCond = applyResourceWhereFilters(resource, table, distinctWhereCond)
+                    distinctWhereCond = applyPortalScope(resource, table, distinctWhereCond, portalCustomerId)
 
                     if (search) {
                         const searchCond = buildSearchCondition(searchCols, search.trim())
@@ -570,10 +644,15 @@ export default async function resourceRoutes(server: FastifyInstance) {
             if (!tenantId) return reply.code(400).send({ error: "No tenant selected" })
 
             const { resource, no_relations } = req.params as { resource: string, no_relations?: boolean }
+            const portalCustomerId = await getPortalCustomerId(server, req)
+            if (portalCustomerId && !PORTAL_ALLOWED_RESOURCES.has(resource)) {
+                return reply.code(403).send({ error: "Forbidden" })
+            }
             const table = resourceConfig[resource].table
 
             let whereCond: any = and(eq(table.id, id), eq(table.tenant, tenantId))
             whereCond = applyResourceWhereFilters(resource, table, whereCond)
+            whereCond = applyPortalScope(resource, table, whereCond, portalCustomerId)
 
             const projRows = await server.db
                 .select()
@@ -624,6 +703,10 @@ export default async function resourceRoutes(server: FastifyInstance) {
         try {
             if (!req.user?.tenant_id) return reply.code(400).send({ error: "No tenant selected" });
             const { resource } = req.params as { resource: string };
+            const portalCustomerId = await getPortalCustomerId(server, req)
+            if (portalCustomerId) {
+                return reply.code(403).send({ error: "Forbidden" })
+            }
             if (resource === "accounts") {
                 return reply.code(403).send({ error: "Accounts are read-only" })
             }
@@ -703,8 +786,12 @@ export default async function resourceRoutes(server: FastifyInstance) {
             const body = req.body as Record<string, any>
             const tenantId = req.user?.tenant_id
             const userId = req.user?.user_id
+            const portalCustomerId = await getPortalCustomerId(server, req)
 
             if (!tenantId || !userId) return reply.code(401).send({ error: "Unauthorized" })
+            if (portalCustomerId && resource !== "customers") {
+                return reply.code(403).send({ error: "Forbidden" })
+            }
 
             const table = resourceConfig[resource].table
             const normalizeDate = (val: any) => { const d = new Date(val); return isNaN(d.getTime()) ? null : d; }
@@ -712,13 +799,25 @@ export default async function resourceRoutes(server: FastifyInstance) {
             const [oldRecord] = await server.db
                 .select()
                 .from(table)
-                .where(and(eq(table.id, id), eq(table.tenant, tenantId)))
+                .where(applyPortalScope(resource, table, and(eq(table.id, id), eq(table.tenant, tenantId)), portalCustomerId))
                 .limit(1)
 
+            if (!oldRecord) {
+                return reply.code(404).send({ error: "Resource not found" })
+            }
+
             let data: Record<string, any> = { ...body, updated_at: new Date().toISOString(), updated_by: userId }
             //@ts-ignore
             delete data.updatedBy; delete data.updatedAt;
 
+            if (portalCustomerId) {
+                data = {
+                    ...sanitizePortalCustomerUpdate(data),
+                    updated_at: data.updated_at,
+                    updated_by: data.updated_by,
+                }
+            }
+
             if (resource === "members") {
                 data = normalizeMemberPayload(data)
                 const validationError = validateMemberPayload(data)

backend/src/utils/resource.config.ts

@@ -192,7 +192,7 @@ export const resourceConfig = {
         table: createddocuments,
         mtoLoad: ["customer", "project", "contact", "contract", "plant","letterhead","createddocument"],
         mtmLoad: ["statementallocations","files","createddocuments"],
-        mtmListLoad: ["statementallocations"],
+        mtmListLoad: ["statementallocations", "files"],
     },
     texttemplates: {
         table: texttemplates

frontend/components/EntityShow.vue

@@ -50,10 +50,12 @@ const route = useRoute()
 const dataStore = useDataStore()
 const modal = useModal()
 const auth = useAuthStore()
+const toast = useToast()
 
 const dataType = dataStore.dataTypes[type]
 
 const openTab = ref(String(route.query.tabIndex || 0))
+const portalInviteLoading = ref(false)
 
 
 
@@ -152,6 +154,31 @@ const openCustomerInventoryLabelPrint = () => {
   })
 }
 
+const invitePortalUser = async () => {
+  if (type !== "customers" || !props.item?.id) return
+
+  portalInviteLoading.value = true
+
+  try {
+    const response = await useAdmin().invitePortalUser(Number(props.item.id))
+    toast.add({
+      title: "Portal-Einladung versendet",
+      description: `E-Mail: ${response.email}${response.initialPassword ? ` | Initialpasswort: ${response.initialPassword}` : ""}`,
+      timeout: 9000
+    })
+    emit("updateNeeded")
+  } catch (err) {
+    toast.add({
+      title: "Portal-Einladung fehlgeschlagen",
+      description: err?.data?.error || "Die Einladung konnte nicht erstellt werden.",
+      color: "error",
+      timeout: 7000
+    })
+  } finally {
+    portalInviteLoading.value = false
+  }
+}
+
 </script>
 
 <template>
@@ -217,6 +244,15 @@ const openCustomerInventoryLabelPrint = () => {
       >
         Label
       </UButton>
+      <UButton
+          v-if="type === 'customers' && auth.user?.is_admin"
+          icon="i-heroicons-envelope"
+          variant="outline"
+          :loading="portalInviteLoading"
+          @click="invitePortalUser"
+      >
+        Portal einladen
+      </UButton>
       <UButton
           @click="router.push(`/standardEntity/${type}/edit/${item.id}`)"
       >
@@ -246,6 +282,15 @@ const openCustomerInventoryLabelPrint = () => {
       >
         Label
       </UButton>
+      <UButton
+          v-if="type === 'customers' && auth.user?.is_admin"
+          icon="i-heroicons-envelope"
+          variant="outline"
+          :loading="portalInviteLoading"
+          @click="invitePortalUser"
+      >
+        Portal einladen
+      </UButton>
       <UButton
           @click="router.push(`/standardEntity/${type}/edit/${item.id}`)"
       >

frontend/composables/useAdmin.ts

@@ -90,6 +90,12 @@ export const useAdmin = () => {
     })
   }
 
+  const invitePortalUser = async (customerId: number) => {
+    return await $api(`/api/admin/customers/${customerId}/invite-portal-user`, {
+      method: "POST",
+    })
+  }
+
   const updateTenant = async (id: number, body: Record<string, any>) => {
     return await $api(`/api/admin/tenants/${id}`, {
       method: "PUT",
@@ -103,6 +109,7 @@ export const useAdmin = () => {
     updateUser,
     updateUserAccess,
     createTenant,
+    invitePortalUser,
     updateTenant,
   }
 }

frontend/middleware/auth.global.ts

@@ -1,5 +1,6 @@
 export default defineNuxtRouteMiddleware(async (to, from) => {
     const auth = useAuthStore()
+    const isPortalUser = Boolean(auth.profile?.customer_for_portal)
 
     // DEBUG: Was sieht die Middleware wirklich?
     console.log("🔒 Middleware Check auf:", to.path)
@@ -33,10 +34,14 @@ export default defineNuxtRouteMiddleware(async (to, from) => {
         if (auth.user.must_change_password) {
             return navigateTo("/password-change")
         }
-        return navigateTo("/")
+        return navigateTo(isPortalUser ? "/customer-portal" : "/")
     }
 
     if (auth.user.must_change_password && to.path !== "/password-change") {
         return navigateTo("/password-change")
     }
-})
+
+    if (isPortalUser && !["/customer-portal", "/password-change"].includes(to.path)) {
+        return navigateTo("/customer-portal")
+    }
+})

frontend/pages/createDocument/show/[id].vue

@@ -14,10 +14,13 @@ const route = useRoute()
 const router = useRouter()
 const auth = useAuthStore()
 const dataStore = useDataStore()
+const toast = useToast()
 
 const itemInfo = ref({})
 const linkedDocument =ref({})
 const links = ref([])
+const portalReleaseLoading = ref(false)
+const portalEligibleTypes = ["invoices", "advanceInvoices", "cancellationInvoices"]
 
 const setupPage = async () => {
   if(route.params) {
@@ -51,6 +54,30 @@ const openBankstatements = () => {
     navigateTo(`/banking/statements/edit/${itemInfo.value.statementallocations[0].bankstatement}`)
   }
 }
+
+const togglePortalRelease = async () => {
+  if (!itemInfo.value?.id) return
+
+  portalReleaseLoading.value = true
+
+  try {
+    const nextValue = !itemInfo.value.availableInPortal
+    await useEntities("createddocuments").update(itemInfo.value.id, {
+      availableInPortal: nextValue
+    }, true)
+
+    itemInfo.value = {
+      ...itemInfo.value,
+      availableInPortal: nextValue
+    }
+
+    toast.add({
+      title: nextValue ? "Für Kundenportal freigegeben" : "Portal-Freigabe entfernt"
+    })
+  } finally {
+    portalReleaseLoading.value = false
+  }
+}
 </script>
 
 <template>
@@ -87,6 +114,15 @@ const openBankstatements = () => {
       >
         E-Mail
       </UButton>
+      <UButton
+          v-if="portalEligibleTypes.includes(itemInfo.type) && itemInfo.state !== 'Entwurf'"
+          :icon="itemInfo.availableInPortal ? 'i-heroicons-eye-slash' : 'i-heroicons-eye'"
+          variant="outline"
+          :loading="portalReleaseLoading"
+          @click="togglePortalRelease"
+      >
+        {{ itemInfo.availableInPortal ? "Portal-Freigabe entfernen" : "Für Kundenportal freigeben" }}
+      </UButton>
       <UTooltip
           v-if="itemInfo.type === 'invoices' || itemInfo.type === 'advanceInvoices'"
           :text="links.find(i => i.type === 'cancellationInvoices') ? 'Bereits stoniert' : ''"
@@ -170,6 +206,14 @@ const openBankstatements = () => {
     </template>
   </UDashboardToolbar>
   <UDashboardPanelContent>
+    <div
+        v-if="portalEligibleTypes.includes(itemInfo.type) && itemInfo.state !== 'Entwurf'"
+        class="px-4 py-3"
+    >
+      <UBadge :color="itemInfo.availableInPortal ? 'primary' : 'neutral'" variant="soft">
+        {{ itemInfo.availableInPortal ? "Im Kundenportal sichtbar" : "Nicht im Kundenportal freigegeben" }}
+      </UBadge>
+    </div>
 <!--    <object
         :data="linkedDocument.url"
         class="w-full previewDocumentMobile"
@@ -187,4 +231,4 @@ const openBankstatements = () => {
   aspect-ratio: 1 / 1.414;
 
 }
-</style>
+</style>

frontend/pages/customer-portal.vue

@@ -0,0 +1,502 @@
+<script setup lang="ts">
+import dayjs from "dayjs"
+
+definePageMeta({
+  layout: "notLoggedIn"
+})
+
+const auth = useAuthStore()
+const toast = useToast()
+
+const customer = ref<any | null>(null)
+const contracts = ref<any[]>([])
+const invoices = ref<any[]>([])
+const loading = ref(true)
+const saving = ref(false)
+const expandedInvoiceId = ref<number | null>(null)
+const downloadingInvoiceId = ref<number | null>(null)
+const activeTab = ref("0")
+
+const customerForm = reactive({
+  name: "",
+  firstname: "",
+  lastname: "",
+  salutation: "",
+  title: "",
+  nameAddition: "",
+  email: "",
+  invoiceEmail: "",
+  phone: "",
+  mobile: "",
+  website: "",
+  street: "",
+  special: "",
+  zip: "",
+  city: "",
+  country: ""
+})
+
+const portalCustomerId = computed(() => auth.profile?.customer_for_portal || null)
+
+const summaryCards = computed(() => [
+  {
+    label: "Offene Rechnungen",
+    value: invoices.value.filter((invoice) => getOpenAmount(invoice) > 0).length,
+    icon: "i-heroicons-document-text"
+  },
+  {
+    label: "Aktive Vertrage",
+    value: contracts.value.filter((contract) => contract.active).length,
+    icon: "i-heroicons-clipboard-document-check"
+  },
+  {
+    label: "Dokumente im Portal",
+    value: invoices.value.length,
+    icon: "i-heroicons-folder-open"
+  }
+])
+
+const portalTabs = computed(() => [
+  {
+    label: "Kundendaten",
+    slot: "customer",
+    value: "0"
+  },
+  {
+    label: `Rechnungen (${invoices.value.length})`,
+    slot: "invoices",
+    value: "1"
+  },
+  {
+    label: `Verträge (${contracts.value.length})`,
+    slot: "contracts",
+    value: "2"
+  }
+])
+
+function fillFormFromCustomer(record: any) {
+  const infoData = record?.infoData || {}
+
+  customerForm.name = record?.name || ""
+  customerForm.firstname = record?.firstname || ""
+  customerForm.lastname = record?.lastname || ""
+  customerForm.salutation = record?.salutation || ""
+  customerForm.title = record?.title || ""
+  customerForm.nameAddition = record?.nameAddition || ""
+  customerForm.email = infoData.email || ""
+  customerForm.invoiceEmail = infoData.invoiceEmail || ""
+  customerForm.phone = infoData.tel || ""
+  customerForm.mobile = infoData.mobileTel || ""
+  customerForm.website = infoData.web || ""
+  customerForm.street = infoData.street || ""
+  customerForm.special = infoData.special || ""
+  customerForm.zip = infoData.zip || ""
+  customerForm.city = infoData.city || ""
+  customerForm.country = infoData.country || ""
+}
+
+function getDocumentTypeLabel(type: string) {
+  if (type === "advanceInvoices") return "Abschlagsrechnung"
+  if (type === "cancellationInvoices") return "Stornorechnung"
+  return "Rechnung"
+}
+
+function formatDate(value?: string | null) {
+  if (!value) return "-"
+
+  const date = dayjs(value)
+  return date.isValid() ? date.format("DD.MM.YYYY") : value
+}
+
+function formatCurrency(value: number) {
+  return useCurrency(value)
+}
+
+function getInvoiceAmount(invoice: any) {
+  return useSum().getCreatedDocumentSum(invoice, invoices.value)
+}
+
+function getOpenAmount(invoice: any) {
+  return useSum().getCreatedDocumentOpenAmount(invoice, invoices.value)
+}
+
+function toggleInvoice(invoiceId: number) {
+  expandedInvoiceId.value = expandedInvoiceId.value === invoiceId ? null : invoiceId
+}
+
+async function logout() {
+  await auth.logout()
+}
+
+async function downloadInvoice(invoice: any) {
+  const fileId = invoice?.files?.[0]?.id
+  if (!fileId) return
+
+  downloadingInvoiceId.value = invoice.id
+
+  try {
+    await useFiles().downloadFile(fileId)
+  } finally {
+    downloadingInvoiceId.value = null
+  }
+}
+
+async function loadPortalData() {
+  if (!portalCustomerId.value) {
+    loading.value = false
+    return
+  }
+
+  loading.value = true
+
+  try {
+    const [customerRecord, contractRows, invoiceRows] = await Promise.all([
+      useEntities("customers").selectSingle(portalCustomerId.value),
+      useEntities("contracts").select("*, contracttype(id,name)", "startDate", true),
+      useEntities("createddocuments").select("*, files(*), statementallocations(*), contract(id,name,contractNumber)", "documentDate", true)
+    ])
+
+    customer.value = customerRecord
+    contracts.value = (contractRows || []).filter((item: any) => !item.archived)
+    invoices.value = (invoiceRows || []).filter((item: any) => !item.archived)
+    fillFormFromCustomer(customerRecord)
+  } finally {
+    loading.value = false
+  }
+}
+
+async function saveCustomerData() {
+  if (!customer.value?.id) return
+
+  saving.value = true
+
+  try {
+    const payload = {
+      name: customerForm.name,
+      firstname: customerForm.firstname,
+      lastname: customerForm.lastname,
+      salutation: customerForm.salutation,
+      title: customerForm.title,
+      nameAddition: customerForm.nameAddition,
+      infoData: {
+        ...(customer.value.infoData || {}),
+        email: customerForm.email,
+        invoiceEmail: customerForm.invoiceEmail,
+        tel: customerForm.phone,
+        mobileTel: customerForm.mobile,
+        web: customerForm.website,
+        street: customerForm.street,
+        special: customerForm.special,
+        zip: customerForm.zip,
+        city: customerForm.city,
+        country: customerForm.country
+      }
+    }
+
+    const updated = await useEntities("customers").update(customer.value.id, payload, true)
+    customer.value = updated
+    fillFormFromCustomer(updated)
+    toast.add({ title: "Kundendaten gespeichert" })
+  } finally {
+    saving.value = false
+  }
+}
+
+onMounted(async () => {
+  await loadPortalData()
+})
+</script>
+
+<template>
+  <div class="min-h-screen bg-gradient-to-b from-neutral-50 via-white to-neutral-100">
+    <UContainer class="py-8 lg:py-12">
+      <div class="flex flex-col gap-6">
+        <div class="rounded-3xl border border-neutral-200 bg-white/90 p-6 shadow-sm lg:p-8">
+          <div class="flex flex-col gap-6 lg:flex-row lg:items-end lg:justify-between">
+            <div class="space-y-3">
+              <p class="text-sm font-medium uppercase tracking-[0.2em] text-primary-600">Kundenportal</p>
+              <div>
+                <h1 class="text-3xl font-semibold text-neutral-900">
+                  {{ customer?.name || "Ihr Zugang" }}
+                </h1>
+                <p class="mt-2 max-w-2xl text-sm text-neutral-600">
+                  Hier konnen Sie Ihre Kundendaten pflegen, Rechnungen einsehen und aktive Vertrage im Blick behalten.
+                </p>
+              </div>
+            </div>
+
+            <div class="flex flex-wrap gap-3">
+              <UButton color="neutral" variant="soft" icon="i-heroicons-arrow-path" :loading="loading" @click="loadPortalData">
+                Aktualisieren
+              </UButton>
+              <UButton color="neutral" variant="outline" icon="i-heroicons-arrow-right-on-rectangle" @click="logout">
+                Abmelden
+              </UButton>
+            </div>
+          </div>
+
+          <div class="mt-6 grid gap-4 md:grid-cols-3">
+            <div
+              v-for="card in summaryCards"
+              :key="card.label"
+              class="rounded-2xl border border-neutral-200 bg-neutral-50 p-4"
+            >
+              <div class="flex items-start justify-between gap-4">
+                <div>
+                  <p class="text-sm text-neutral-500">{{ card.label }}</p>
+                  <p class="mt-2 text-2xl font-semibold text-neutral-900">{{ card.value }}</p>
+                </div>
+                <div class="rounded-xl bg-white p-2 text-primary-600 shadow-sm">
+                  <UIcon :name="card.icon" class="h-5 w-5" />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div v-if="loading" class="rounded-3xl border border-neutral-200 bg-white p-8 text-center text-neutral-500">
+          Portal wird geladen...
+        </div>
+
+        <div v-else-if="!portalCustomerId" class="rounded-3xl border border-amber-200 bg-amber-50 p-8 text-amber-900">
+          Fuer diesen Zugang ist noch kein Portal-Kunde hinterlegt.
+        </div>
+
+        <UCard v-else :ui="{ body: 'p-4 sm:p-6' }">
+          <UTabs v-model="activeTab" :items="portalTabs" class="portal-tabs">
+            <template #customer>
+              <div class="pt-4">
+                <div class="mb-4 flex items-center justify-between gap-4">
+                  <div>
+                    <h2 class="text-xl font-semibold text-neutral-900">Kundendaten</h2>
+                    <p class="mt-1 text-sm text-neutral-500">Aenderungen werden direkt in Ihrem Kundenstamm gespeichert.</p>
+                  </div>
+                  <UBadge color="primary" variant="subtle">Bearbeitbar</UBadge>
+                </div>
+
+                <div class="grid gap-4 md:grid-cols-2">
+                  <UFormField label="Name / Firma">
+                    <UInput v-model="customerForm.name" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Firmenzusatz">
+                    <UInput v-model="customerForm.nameAddition" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Anrede">
+                    <UInput v-model="customerForm.salutation" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Titel">
+                    <UInput v-model="customerForm.title" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Vorname">
+                    <UInput v-model="customerForm.firstname" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Nachname">
+                    <UInput v-model="customerForm.lastname" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="E-Mail">
+                    <UInput v-model="customerForm.email" type="email" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Rechnungs-E-Mail">
+                    <UInput v-model="customerForm.invoiceEmail" type="email" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Telefon">
+                    <UInput v-model="customerForm.phone" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Mobil">
+                    <UInput v-model="customerForm.mobile" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Webseite">
+                    <UInput v-model="customerForm.website" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Land">
+                    <UInput v-model="customerForm.country" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Strasse" class="md:col-span-2">
+                    <UInput v-model="customerForm.street" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Adresszusatz" class="md:col-span-2">
+                    <UInput v-model="customerForm.special" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="PLZ">
+                    <UInput v-model="customerForm.zip" class="w-full" />
+                  </UFormField>
+
+                  <UFormField label="Ort">
+                    <UInput v-model="customerForm.city" class="w-full" />
+                  </UFormField>
+                </div>
+
+                <div class="mt-6 flex justify-end">
+                  <UButton icon="i-heroicons-check" :loading="saving" @click="saveCustomerData">
+                    Kundendaten speichern
+                  </UButton>
+                </div>
+              </div>
+            </template>
+
+            <template #invoices>
+              <div class="pt-4">
+                <div class="mb-4 flex items-center justify-between gap-4">
+                  <div>
+                    <h2 class="text-xl font-semibold text-neutral-900">Rechnungen</h2>
+                    <p class="mt-1 text-sm text-neutral-500">Alle fuer das Portal freigegebenen Rechnungen Ihres Kundenkontos.</p>
+                  </div>
+                  <UBadge color="neutral" variant="subtle">{{ invoices.length }}</UBadge>
+                </div>
+
+                <div v-if="!invoices.length" class="rounded-2xl border border-dashed border-neutral-200 p-6 text-sm text-neutral-500">
+                  Aktuell sind keine Rechnungen im Portal verfuegbar.
+                </div>
+
+                <div v-else class="space-y-3">
+                  <div
+                    v-for="invoice in invoices"
+                    :key="invoice.id"
+                    class="rounded-2xl border border-neutral-200 bg-neutral-50 p-4"
+                  >
+                    <div class="flex flex-col gap-3 lg:flex-row lg:items-center lg:justify-between">
+                      <div>
+                        <div class="flex flex-wrap items-center gap-2">
+                          <p class="font-semibold text-neutral-900">{{ invoice.documentNumber || `Dokument #${invoice.id}` }}</p>
+                          <UBadge color="primary" variant="soft">{{ getDocumentTypeLabel(invoice.type) }}</UBadge>
+                          <UBadge color="neutral" variant="soft">{{ invoice.state }}</UBadge>
+                        </div>
+                        <p class="mt-2 text-sm text-neutral-500">
+                          Datum: {{ formatDate(invoice.documentDate) }}
+                          <span v-if="invoice.contract?.name"> | Vertrag: {{ invoice.contract.contractNumber || "-" }} {{ invoice.contract.name }}</span>
+                        </p>
+                      </div>
+
+                      <div class="flex flex-col items-start gap-3 text-sm lg:items-end">
+                        <div class="text-neutral-600">
+                          Gesamt: <span class="font-semibold text-neutral-900">{{ formatCurrency(getInvoiceAmount(invoice)) }}</span>
+                        </div>
+                        <div class="text-neutral-600">
+                          Offen: <span class="font-semibold text-neutral-900">{{ formatCurrency(getOpenAmount(invoice)) }}</span>
+                        </div>
+                        <div class="flex flex-wrap gap-2">
+                          <UButton
+                              v-if="invoice.files?.length"
+                              color="primary"
+                              variant="soft"
+                              size="sm"
+                              icon="i-heroicons-arrow-down-tray"
+                              :loading="downloadingInvoiceId === invoice.id"
+                              @click="downloadInvoice(invoice)"
+                          >
+                            PDF herunterladen
+                          </UButton>
+                          <UButton color="neutral" variant="soft" size="sm" @click="toggleInvoice(invoice.id)">
+                            {{ expandedInvoiceId === invoice.id ? "Details ausblenden" : "Details ansehen" }}
+                          </UButton>
+                        </div>
+                      </div>
+                    </div>
+
+                    <div v-if="expandedInvoiceId === invoice.id" class="mt-4 border-t border-neutral-200 pt-4">
+                      <div v-if="invoice.rows?.length" class="space-y-3">
+                        <div
+                          v-for="(row, index) in invoice.rows.filter((entry: any) => !['pagebreak'].includes(entry.mode))"
+                          :key="`${invoice.id}-${index}`"
+                          class="flex flex-col gap-1 rounded-xl bg-white p-3 sm:flex-row sm:items-start sm:justify-between"
+                        >
+                          <div class="pr-4">
+                            <p class="font-medium text-neutral-900">{{ row.text || row.title || row.description || "Position" }}</p>
+                            <p class="text-xs text-neutral-500">
+                              Menge: {{ row.quantity || "-" }} | Einzelpreis: {{ formatCurrency(Number(row.price || 0)) }}
+                            </p>
+                          </div>
+                          <div class="text-sm font-medium text-neutral-900">
+                            {{ formatCurrency((Number(row.quantity || 0) * Number(row.price || 0)) * (1 - Number(row.discountPercent || 0) / 100)) }}
+                          </div>
+                        </div>
+                      </div>
+                      <div v-else class="text-sm text-neutral-500">
+                        Fuer dieses Dokument liegen keine Positionsdaten vor.
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </template>
+
+            <template #contracts>
+              <div class="pt-4">
+                <div class="mb-4 flex items-center justify-between gap-4">
+                  <div>
+                    <h2 class="text-xl font-semibold text-neutral-900">Vertraege</h2>
+                    <p class="mt-1 text-sm text-neutral-500">Ihre aktuell zugeordneten Vertrage auf einen Blick.</p>
+                  </div>
+                  <UBadge color="neutral" variant="subtle">{{ contracts.length }}</UBadge>
+                </div>
+
+                <div v-if="!contracts.length" class="rounded-2xl border border-dashed border-neutral-200 p-6 text-sm text-neutral-500">
+                  Es sind aktuell keine Vertraege hinterlegt.
+                </div>
+
+                <div v-else class="space-y-3">
+                  <div
+                    v-for="contract in contracts"
+                    :key="contract.id"
+                    class="rounded-2xl border border-neutral-200 bg-neutral-50 p-4"
+                  >
+                    <div class="flex items-start justify-between gap-4">
+                      <div>
+                        <div class="flex flex-wrap items-center gap-2">
+                          <p class="font-semibold text-neutral-900">{{ contract.name }}</p>
+                          <UBadge :color="contract.active ? 'green' : 'neutral'" variant="soft">
+                            {{ contract.active ? "Aktiv" : "Inaktiv" }}
+                          </UBadge>
+                        </div>
+                        <p class="mt-2 text-sm text-neutral-500">
+                          Vertragsnummer: {{ contract.contractNumber || "-" }}
+                        </p>
+                      </div>
+                      <div class="text-right text-sm text-neutral-500">
+                        <p>{{ contract.contracttype?.name || "Ohne Vertragstyp" }}</p>
+                        <p>{{ contract.billingInterval || "Kein Intervall hinterlegt" }}</p>
+                      </div>
+                    </div>
+
+                    <div class="mt-4 grid gap-3 sm:grid-cols-2">
+                      <div class="rounded-xl bg-white p-3">
+                        <p class="text-xs uppercase tracking-wide text-neutral-400">Laufzeit</p>
+                        <p class="mt-1 text-sm font-medium text-neutral-900">
+                          {{ formatDate(contract.startDate) }} bis {{ formatDate(contract.endDate) }}
+                        </p>
+                      </div>
+                      <div class="rounded-xl bg-white p-3">
+                        <p class="text-xs uppercase tracking-wide text-neutral-400">Abrechnung</p>
+                        <p class="mt-1 text-sm font-medium text-neutral-900">
+                          {{ contract.paymentType || "Nicht hinterlegt" }}
+                        </p>
+                      </div>
+                    </div>
+
+                    <p v-if="contract.notes" class="mt-4 text-sm text-neutral-600">
+                      {{ contract.notes }}
+                    </p>
+                  </div>
+                </div>
+              </div>
+            </template>
+          </UTabs>
+        </UCard>
+      </div>
+    </UContainer>
+  </div>
+</template>