Newwebshop/templates/admin/shop/index.html.twig

387 lines
18 KiB
Twig

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?= $title ?> - Webshop Admin</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
<style>
.shop-card {
border: 1px solid #dee2e6;
border-radius: 0.5rem;
transition: all 0.3s ease;
height: 100%;
}
.shop-card:hover {
border-color: #667eea;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
transform: translateY(-2px);
}
.shop-card.active {
border-color: #28a745;
background-color: #f8fff9;
}
.shop-card.default {
border-color: #007bff;
background-color: #f8fbff;
}
.shop-status {
position: absolute;
top: 0.5rem;
right: 0.5rem;
}
.shop-stats {
font-size: 0.875rem;
color: #6c757d;
}
.shop-stats .stat-item {
display: flex;
justify-content: space-between;
margin-bottom: 0.25rem;
}
.shop-actions {
position: absolute;
top: 0.5rem;
left: 0.5rem;
opacity: 0;
transition: opacity 0.3s ease;
}
.shop-card:hover .shop-actions {
opacity: 1;
}
.metric-card {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-radius: 0.5rem;
padding: 1.5rem;
margin-bottom: 1rem;
}
.metric-value {
font-size: 2rem;
font-weight: bold;
margin-bottom: 0.5rem;
}
.metric-label {
font-size: 0.875rem;
opacity: 0.9;
}
.quick-action {
background: white;
border: 1px solid #dee2e6;
border-radius: 0.5rem;
padding: 1rem;
text-align: center;
transition: all 0.3s ease;
cursor: pointer;
}
.quick-action:hover {
border-color: #667eea;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.quick-action i {
font-size: 2rem;
color: #667eea;
margin-bottom: 0.5rem;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="row">
<!-- Sidebar -->
<nav class="col-md-3 col-lg-2 d-md-block bg-light sidebar">
<div class="position-sticky pt-3">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="/admin/dashboard">
<i class="fas fa-tachometer-alt me-2"></i>Dashboard
</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/admin/shop">
<i class="fas fa-store me-2"></i>Shop-Verwaltung
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/admin/products">
<i class="fas fa-box me-2"></i>Produkte
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/admin/orders">
<i class="fas fa-shopping-cart me-2"></i>Bestellungen
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/admin/customers">
<i class="fas fa-users me-2"></i>Kunden
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/admin/security">
<i class="fas fa-shield-alt me-2"></i>Sicherheit
</a>
</li>
</ul>
</div>
</nav>
<!-- Main content -->
<main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
<h1 class="h2">
<i class="fas fa-store me-2"></i>Shop-Verwaltung
</h1>
<div class="btn-toolbar mb-2 mb-md-0">
<div class="btn-group me-2">
<a href="/admin/shop/create" class="btn btn-sm btn-primary">
<i class="fas fa-plus me-1"></i>Neuen Shop erstellen
</a>
</div>
</div>
</div>
<!-- Current Shop Info -->
<?php if ($current_shop): ?>
<div class="alert alert-info">
<div class="d-flex justify-content-between align-items-center">
<div>
<strong>Aktueller Shop:</strong> <?= htmlspecialchars($current_shop.name) ?>
<?php if ($current_shop.is_default): ?>
<span class="badge bg-primary ms-2">Standard</span>
<?php endif; ?>
</div>
<div>
<a href="/admin/shop/switch/<?= $current_shop.id ?>" class="btn btn-sm btn-outline-primary">
<i class="fas fa-exchange-alt me-1"></i>Shop wechseln
</a>
</div>
</div>
</div>
<?php endif; ?>
<!-- Quick Actions -->
<div class="row mb-4">
<div class="col-md-3">
<div class="quick-action" onclick="location.href='/admin/shop/create'">
<i class="fas fa-plus"></i>
<div><strong>Neuen Shop</strong></div>
<small class="text-muted">Erstellen</small>
</div>
</div>
<div class="col-md-3">
<div class="quick-action" onclick="location.href='/admin/shop/config/<?= $current_shop.id ?? 1 ?>'">
<i class="fas fa-cog"></i>
<div><strong>Konfiguration</strong></div>
<small class="text-muted">Bearbeiten</small>
</div>
</div>
<div class="col-md-3">
<div class="quick-action" onclick="location.href='/admin/shop/statistics/<?= $current_shop.id ?? 1 ?>'">
<i class="fas fa-chart-bar"></i>
<div><strong>Statistiken</strong></div>
<small class="text-muted">Anzeigen</small>
</div>
</div>
<div class="col-md-3">
<div class="quick-action" onclick="location.href='/admin/security/backup'">
<i class="fas fa-database"></i>
<div><strong>Backup</strong></div>
<small class="text-muted">Erstellen</small>
</div>
</div>
</div>
<!-- Shop Overview -->
<div class="row">
<?php foreach ($shops as $shop): ?>
<div class="col-md-6 col-lg-4 mb-4">
<div class="shop-card card position-relative <?= $shop.id == ($current_shop.id ?? 0) ? 'active' : '' ?> <?= $shop.is_default ? 'default' : '' ?>">
<!-- Shop Actions -->
<div class="shop-actions">
<div class="btn-group btn-group-sm">
<button class="btn btn-outline-secondary dropdown-toggle" data-bs-toggle="dropdown">
<i class="fas fa-ellipsis-v"></i>
</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="/admin/shop/edit/<?= $shop.id ?>">
<i class="fas fa-edit me-2"></i>Bearbeiten
</a></li>
<li><a class="dropdown-item" href="/admin/shop/config/<?= $shop.id ?>">
<i class="fas fa-cog me-2"></i>Konfiguration
</a></li>
<li><a class="dropdown-item" href="/admin/shop/statistics/<?= $shop.id ?>">
<i class="fas fa-chart-bar me-2"></i>Statistiken
</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="/admin/shop/switch/<?= $shop.id ?>">
<i class="fas fa-exchange-alt me-2"></i>Wechseln
</a></li>
<?php if (!$shop.is_default): ?>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item text-danger" href="/admin/shop/delete/<?= $shop.id ?>">
<i class="fas fa-trash me-2"></i>Löschen
</a></li>
<?php endif; ?>
</ul>
</div>
</div>
<!-- Shop Status -->
<div class="shop-status">
<?php if ($shop.is_default): ?>
<span class="badge bg-primary">Standard</span>
<?php elseif ($shop.id == ($current_shop.id ?? 0)): ?>
<span class="badge bg-success">Aktiv</span>
<?php else: ?>
<span class="badge bg-secondary">Inaktiv</span>
<?php endif; ?>
</div>
<div class="card-body">
<h5 class="card-title"><?= htmlspecialchars($shop.name) ?></h5>
<p class="card-text text-muted"><?= htmlspecialchars($shop.description) ?></p>
<?php if ($shop.domain): ?>
<div class="mb-3">
<small class="text-muted">
<i class="fas fa-globe me-1"></i>
<?= htmlspecialchars($shop.domain) ?>
<?php if ($shop.ssl_enabled): ?>
<i class="fas fa-lock text-success ms-1"></i>
<?php endif; ?>
</small>
</div>
<?php endif; ?>
<!-- Shop Statistics -->
<?php if (isset($shop_stats[$shop.id])): ?>
<div class="shop-stats">
<?php $stats = $shop_stats[$shop.id]; ?>
<div class="stat-item">
<span>Bestellungen:</span>
<span><?= $stats.orders.total_orders ?? 0 ?></span>
</div>
<div class="stat-item">
<span>Umsatz:</span>
<span>€<?= number_format($stats.orders.total_revenue ?? 0, 2, ',', '.') ?></span>
</div>
<div class="stat-item">
<span>Produkte:</span>
<span><?= $stats.products.total_products ?? 0 ?></span>
</div>
<div class="stat-item">
<span>Kunden:</span>
<span><?= $stats.customers.total_customers ?? 0 ?></span>
</div>
</div>
<?php endif; ?>
<div class="mt-3">
<div class="btn-group btn-group-sm w-100">
<a href="/admin/shop/edit/<?= $shop.id ?>" class="btn btn-outline-primary">
<i class="fas fa-edit me-1"></i>Bearbeiten
</a>
<a href="/admin/shop/config/<?= $shop.id ?>" class="btn btn-outline-secondary">
<i class="fas fa-cog me-1"></i>Konfig
</a>
<a href="/admin/shop/statistics/<?= $shop.id ?>" class="btn btn-outline-info">
<i class="fas fa-chart-bar me-1"></i>Stats
</a>
</div>
</div>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<!-- Empty State -->
<?php if (empty($shops)): ?>
<div class="text-center py-5">
<i class="fas fa-store fa-3x text-muted mb-3"></i>
<h4>Keine Shops vorhanden</h4>
<p class="text-muted">Erstellen Sie Ihren ersten Shop um zu beginnen.</p>
<a href="/admin/shop/create" class="btn btn-primary">
<i class="fas fa-plus me-2"></i>Ersten Shop erstellen
</a>
</div>
<?php endif; ?>
<!-- Global Statistics -->
<?php if (!empty($shops)): ?>
<div class="row mt-5">
<div class="col-12">
<h4>Globale Statistiken</h4>
</div>
<div class="col-md-3">
<div class="metric-card">
<div class="metric-value">
<i class="fas fa-store me-2"></i><?= count($shops) ?>
</div>
<div class="metric-label">Aktive Shops</div>
</div>
</div>
<div class="col-md-3">
<div class="metric-card">
<div class="metric-value">
<i class="fas fa-shopping-cart me-2"></i><?= array_sum(array_column(array_column($shop_stats, 'orders'), 'total_orders')) ?>
</div>
<div class="metric-label">Gesamt-Bestellungen</div>
</div>
</div>
<div class="col-md-3">
<div class="metric-card">
<div class="metric-value">
<i class="fas fa-euro-sign me-2"></i>€<?= number_format(array_sum(array_column(array_column($shop_stats, 'orders'), 'total_revenue')), 2, ',', '.') ?>
</div>
<div class="metric-label">Gesamt-Umsatz</div>
</div>
</div>
<div class="col-md-3">
<div class="metric-card">
<div class="metric-value">
<i class="fas fa-users me-2"></i><?= array_sum(array_column(array_column($shop_stats, 'customers'), 'total_customers')) ?>
</div>
<div class="metric-label">Gesamt-Kunden</div>
</div>
</div>
</div>
<?php endif; ?>
</main>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Shop-Wechsel Bestätigung
function confirmShopSwitch(shopId, shopName) {
if (confirm(`Möchten Sie zu "${shopName}" wechseln?`)) {
location.href = `/admin/shop/switch/${shopId}`;
}
}
// Shop-Löschung Bestätigung
function confirmShopDelete(shopId, shopName) {
if (confirm(`Möchten Sie "${shopName}" wirklich löschen?\n\nDiese Aktion kann nicht rückgängig gemacht werden!`)) {
location.href = `/admin/shop/delete/${shopId}`;
}
}
// Auto-Refresh alle 30 Sekunden
setInterval(() => {
if (!document.hidden) {
fetch('/admin/shop/status')
.then(response => response.json())
.then(data => {
if (data.needs_refresh) {
location.reload();
}
});
}
}, 30000);
</script>
</body>
</html>