143 lines
6.0 KiB
HTML
143 lines
6.0 KiB
HTML
<!doctype html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>CRM – Org-Einstellungen</title>
|
||
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<link rel="stylesheet" href="/css/app.css" />
|
||
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.1/dist/cdn.min.js"></script>
|
||
|
||
<script type="module" src="/js/store.js"></script>
|
||
<script type="module" src="/js/components/notifications.js"></script>
|
||
</head>
|
||
<body class="min-h-screen bg-slate-50">
|
||
|
||
<div x-data="toastContainer()" class="crm-toast-container" x-cloak>
|
||
<template x-for="n in items" :key="n.id">
|
||
<div class="crm-toast" :class="'toast-' + n.type"
|
||
@click="dismiss(n.id)" x-text="n.message"></div>
|
||
</template>
|
||
</div>
|
||
|
||
<div x-data="{ init: () => Alpine.store('auth').init() }" x-init="init()" class="flex min-h-screen">
|
||
|
||
<aside class="crm-sidebar">
|
||
<div class="px-6 py-4 text-white text-lg font-bold border-b border-slate-700">
|
||
<a href="/app.html" class="!text-white !border-0">CRM</a>
|
||
</div>
|
||
<nav class="mt-2">
|
||
<a href="/app.html">Dashboard</a>
|
||
<a href="/accounts.html">Accounts</a>
|
||
<a href="/contacts.html">Contacts</a>
|
||
<a href="/pipeline.html">Pipeline</a>
|
||
<a href="/activities.html">Activities</a>
|
||
<a href="/settings-profile.html">Profil</a>
|
||
<a href="/settings-users.html" x-show="$store.auth.isAdmin">Users (Admin)</a>
|
||
<a href="/settings-org.html" class="active" x-show="$store.auth.isAdmin">Org (Admin)</a>
|
||
</nav>
|
||
</aside>
|
||
|
||
<div class="flex-1 flex flex-col">
|
||
<header class="bg-white border-b border-slate-200 px-6 py-3 flex items-center justify-between">
|
||
<h1 class="text-xl font-semibold text-slate-800">Org-Einstellungen (Admin)</h1>
|
||
<div class="flex items-center gap-3 text-sm">
|
||
<span class="text-slate-600">
|
||
<strong class="text-slate-900"
|
||
x-text="$store.auth.user ? $store.auth.user.name : '…'"></strong>
|
||
</span>
|
||
<button class="btn-secondary" @click="$store.auth.logout()">Logout</button>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="flex-1 p-6 max-w-2xl" x-data="orgSettings()" x-init="init()">
|
||
|
||
<!-- Admin-Gate -->
|
||
<div x-show="checked && !$store.auth.isAdmin" class="crm-card text-center py-8">
|
||
<p class="text-red-600 font-medium">Zugriff verweigert.</p>
|
||
<p class="text-slate-500 text-sm mt-1">Diese Seite ist nur für Admins.</p>
|
||
<a href="/app.html" class="btn-primary inline-block mt-4">Zum Dashboard</a>
|
||
</div>
|
||
|
||
<div x-show="!checked" class="crm-card text-center py-8">
|
||
<div class="crm-spinner mx-auto"></div>
|
||
</div>
|
||
|
||
<div x-show="checked && $store.auth.isAdmin" class="crm-card">
|
||
|
||
<!-- Hinweis: Coming in v1.1 -->
|
||
<div class="mb-4 p-4 bg-amber-50 border border-amber-200 text-amber-800 text-sm rounded">
|
||
<strong>Hinweis:</strong> Das Bearbeiten von Organisationseinstellungen ist
|
||
für v1.1 geplant. In v1 ist der <code>PATCH /api/v1/orgs/{id}</code>-Endpoint
|
||
noch nicht verfügbar. Die Form ist deshalb deaktiviert (nur Read-View).
|
||
</div>
|
||
|
||
<h2 class="text-lg font-semibold mb-4">Aktuelle Organisation</h2>
|
||
|
||
<div x-show="loading" class="text-center py-6">
|
||
<div class="crm-spinner mx-auto"></div>
|
||
</div>
|
||
|
||
<div x-show="!loading && org" class="space-y-3 text-sm">
|
||
<div>
|
||
<label class="crm-label">Org-ID</label>
|
||
<input type="text" disabled :value="org?.id || ''" class="crm-input" />
|
||
</div>
|
||
<div>
|
||
<label class="crm-label">Name</label>
|
||
<input type="text" disabled :value="org?.name || ''" class="crm-input" />
|
||
</div>
|
||
<div>
|
||
<label class="crm-label">Logo-URL</label>
|
||
<input type="text" disabled :value="org?.logo_url || '(nicht gesetzt)'" class="crm-input" />
|
||
</div>
|
||
<div>
|
||
<label class="crm-label">Default-Currency</label>
|
||
<input type="text" disabled :value="org?.default_currency || 'EUR'" class="crm-input" />
|
||
</div>
|
||
</div>
|
||
|
||
<p class="text-xs text-slate-400 mt-4">
|
||
Quelle: <code>GET /api/v1/orgs/{id}</code> (read-only in v1).
|
||
</p>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
function orgSettings() {
|
||
return {
|
||
checked: false,
|
||
org: null,
|
||
loading: false,
|
||
|
||
async init() {
|
||
const auth = Alpine.store('auth');
|
||
if (!auth.user) { try { await auth.fetchUser(); } catch {} }
|
||
this.checked = true;
|
||
if (!auth.isAdmin) return;
|
||
|
||
this.loading = true;
|
||
try {
|
||
const { api } = await import('/js/api.js');
|
||
// Read own org — backend: GET /orgs/{id} where id = current_user.org_id
|
||
const orgId = auth.user && auth.user.org_id;
|
||
if (orgId) {
|
||
try { this.org = await api.get(`/orgs/${orgId}`); }
|
||
catch {
|
||
// Fallback: synthesize from user
|
||
this.org = { id: orgId, name: '(Org-Name unbekannt)' };
|
||
}
|
||
}
|
||
} catch (err) {
|
||
Alpine.store('notifications').error(err.message || 'Lade-Fehler.');
|
||
} finally { this.loading = false; }
|
||
},
|
||
};
|
||
}
|
||
</script>
|
||
</body>
|
||
</html>
|