<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Ürün Konfigürasyonu</title>
    <link rel="icon" type="image/png" href="images/selduslogo.png">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
    <link rel="stylesheet" href="css/main.css">
    <style>
        .hero-section {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 4rem 0;
            margin-bottom: 3rem;
        }
        .feature-card {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: none;
            border-radius: 15px;
            overflow: hidden;
        }
        .feature-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0,0,0,0.15);
        }
        .feature-card .card-body {
            padding: 2rem;
        }
        .feature-icon {
            font-size: 3rem;
            margin-bottom: 1rem;
            color: #667eea;
        }
        .navbar-brand img {
            filter: brightness(0) invert(1);
        }
        .sidebar {
            position: fixed;
            left: 0;
            top: 80px;
            z-index: 1000;
            background: linear-gradient(180deg, #f8f9fa 0%, #e9ecef 100%);
            border-right: 1px solid rgba(0,0,0,0.1);
        }
        .sidebar .nav-link {
            border-radius: 12px;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 12px 16px;
            margin-bottom: 8px;
            position: relative;
            overflow: hidden;
        }
        .sidebar .nav-link::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            transition: left 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            z-index: -1;
        }
        .sidebar .nav-link:hover::before {
            left: 0;
        }
        .sidebar .nav-link:hover {
            color: white !important;
            transform: translateX(8px);
            box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
        }
        .sidebar .nav-link i {
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            margin-right: 12px;
        }
        .sidebar .nav-link:hover i {
            transform: scale(1.1) rotate(5deg);
            color: #fff;
        }
        .flex-grow-1 {
            margin-left: 280px;
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
            min-height: 100vh;
            padding-bottom: 100px;
            display: flex;
            justify-content: center;
            align-items: flex-start;
        }
        .hero-section {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            padding: 6rem 0;
            margin-bottom: 0;
            position: fixed;
            top: 80px;
            left: 280px;
            right: 0;
            z-index: 999;
            overflow: hidden;
            height: 200px;
        }
        .hero-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
            z-index: 1;
        }
        .hero-section .container {
            position: relative;
            z-index: 2;
        }
        .stat-card {
            transition: all 0.3s ease;
            border-radius: 15px;
        }
        .stat-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0,0,0,0.15) !important;
        }
        .stat-icon {
            font-size: 2.5rem;
        }
        .stat-number {
            font-size: 2.5rem;
            font-weight: bold;
        }
        .stat-label {
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .stats-section {
            background-color: #f8f9fa;
            padding: 3rem 0;
            margin: 3rem 0;
        }
        .stat-item {
            text-align: center;
            padding: 1rem;
        }
        .stat-number {
            font-size: 2.5rem;
            font-weight: bold;
            color: #667eea;
        }
        .stat-label {
            color: #6c757d;
            font-size: 0.9rem;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        /* Chart canvas styles */
        canvas {
            max-height: 300px !important;
            width: 100% !important;
        }
        
        .chart-container {
            position: relative;
            height: 300px;
            width: 100%;
        }
        
        /* Trend chart için özel stil */
        #trendChart {
            height: 350px !important;
        }
        
        /* Son grafik için daha fazla alt boşluk */
        .row:last-child .chart-container {
            margin-bottom: 2rem;
        }
        
        /* Scrollable content için özel stil */
        .scrollable-content {
            background: white;
            border-radius: 15px;
            box-shadow: 0 0 30px rgba(0,0,0,0.1);
            border: 1px solid rgba(102, 126, 234, 0.1);
            padding: 20px;
        }
        
        /* Sayfa scrollbar'ını gizle */
        body {
            overflow: hidden;
        }
        
        /* Footer'ı görünür yap */
        footer {
            position: fixed;
            bottom: 0;
            right: 0;
            left: 280px;
            z-index: 100;
        }
        
        /* Sadece scrollable content'te scrollbar göster */
        .scrollable-content::-webkit-scrollbar {
            width: 8px;
        }
        
        .scrollable-content::-webkit-scrollbar-track {
            background: #f1f1f1;
            border-radius: 4px;
        }
        
        .scrollable-content::-webkit-scrollbar-thumb {
            background: #667eea;
            border-radius: 4px;
        }
        
        .scrollable-content::-webkit-scrollbar-thumb:hover {
            background: #5a6fd8;
        }
    </style>
</head>
<body>
    <nav class="navbar navbar-dark shadow-sm mb-0" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
        <div class="container-fluid">
            <a class="navbar-brand d-flex align-items-center" href="#">
                <img src="images/selduslogo.png" alt="Seldus Logo" height="40" class="me-2">
                <span class="fw-bold">Ürün Konfigürasyonu</span>
            </a>
        </div>
    </nav>

        <div class="d-flex">
        <!-- Sidebar -->
        <div class="sidebar bg-light shadow-sm" style="width: 220px; height: calc(100vh - 60px); overflow-y: auto; overflow-x: hidden; position: fixed; top: 60px; left: 0;">
            <div class="p-2" style="padding-bottom: 20px !important;">
                <h6 class="text-muted text-uppercase mb-2 fw-bold" style="letter-spacing: 1px; font-size: 0.65rem; color: #6c757d !important; padding: 3px 8px;">MENÜ</h6>
                <ul class="nav flex-column" style="margin-bottom: 10px;">
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/ustgrup.html">
                            <i class="bi bi-diagram-3 me-2"></i>Üst Grup
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/gruptip.html">
                            <i class="bi bi-type me-2"></i>Grup Tipi
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/seri.html">
                            <i class="bi bi-layers me-2"></i>Seri
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/renk.html">
                            <i class="bi bi-palette me-2"></i>Renk
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/camyuksekligi.html">
                            <i class="bi bi-arrows-expand-vertical me-2"></i>Cam Yüksekliği
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/camkalinligi.html">
                            <i class="bi bi-arrows-expand me-2"></i>Cam Kalınlığı
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/cam_turu.html">
                            <i class="bi bi-window-stack me-2"></i>Cam Türü
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/cam_desen.html">
                            <i class="bi bi-grid-3x3-gap me-2"></i>Cam Deseni
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/aksesuar.html">
                            <i class="bi bi-gear me-2"></i>Aksesuar
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/vitrin.html">
                            <i class="bi bi-display me-2"></i>Vitrin
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/seri_mamul_konfigurasyon.html">
                            <i class="bi bi-gear-fill me-2"></i>Seri-Mamül Konfigürasyonu
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/konfigurasyon_yonetimi.html">
                            <i class="bi bi-list-check me-2"></i>Konfigürasyon Yönetimi
                        </a>
                    </li>
                    <li class="nav-item mb-1">
                        <a class="nav-link text-dark d-flex align-items-center" style="padding: 5px 8px; font-size: 13px;" href="pages/resim_yonetimi.html">
                            <i class="bi bi-images me-2"></i>Resim Yönetimi
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- Main Content -->
        <div class="flex-grow-1">
            
            
            <!-- Statistics Cards -->
            <div class="container scrollable-content" style="margin-left: 230px; margin-top: 70px; height: calc(100vh - 80px); overflow-y: auto; width: calc(100% - 240px); max-width: calc(100% - 240px);">
                <div class="row g-4 mb-5">
                    <div class="col-md-2 col-sm-6">
                        <div class="card stat-card h-100 border-0 shadow-sm">
                            <div class="card-body text-center p-3">
                                <div class="stat-icon mb-2">
                                    <i class="bi bi-collection text-success"></i>
                                </div>
                                <h4 class="stat-number text-success mb-1" id="urunGrubuSayisi">-</h4>
                                <p class="stat-label text-muted mb-0 small">Ürün Grubu</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        <div class="card stat-card h-100 border-0 shadow-sm">
                            <div class="card-body text-center p-3">
                                <div class="stat-icon mb-2">
                                    <i class="bi bi-cpu text-info"></i>
                                </div>
                                <h4 class="stat-number text-info mb-1" id="toplamModelSayisi">-</h4>
                                <p class="card-text text-muted mb-0 small">Toplam Model</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        <div class="card stat-card h-100 border-0 shadow-sm">
                            <div class="card-body text-center p-3">
                                <div class="stat-icon mb-2">
                                    <i class="bi bi-window text-warning"></i>
                                </div>
                                <h4 class="stat-number text-warning mb-1" id="camTuruSayisi">-</h4>
                                <p class="card-text text-muted mb-0 small">Cam Türü</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        <div class="card stat-card h-100 border-0 shadow-sm">
                            <div class="card-body text-center p-3">
                                <div class="stat-icon mb-2">
                                    <i class="bi bi-palette text-danger"></i>
                                </div>
                                <h4 class="stat-number text-danger mb-1" id="camDeseniSayisi">-</h4>
                                <p class="card-text text-muted mb-0 small">Cam Deseni</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        <div class="card stat-card h-100 border-0 shadow-sm">
                            <div class="card-body text-center p-3">
                                <div class="stat-icon mb-2">
                                    <i class="bi bi-layers text-primary"></i>
                                </div>
                                <h4 class="stat-number text-primary mb-1" id="seriSayisi">-</h4>
                                <p class="card-text text-muted mb-0 small">Seri</p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2 col-sm-6">
                        <div class="card stat-card h-100 border-0 shadow-sm">
                            <div class="card-body text-center p-3">
                                <div class="stat-icon mb-2">
                                    <i class="bi bi-gear text-secondary"></i>
                                </div>
                                <h4 class="stat-number text-secondary mb-1" id="konfigurasyonSayisi">-</h4>
                                <p class="card-text text-muted mb-0 small">Konfigürasyon</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                <!-- Hızlı Erişim Paneli -->
                <div class="row g-4 mb-5 justify-content-center">
                    <div class="col-md-5">
                        <div class="card border-0 shadow-sm h-100">
                            <div class="card-header bg-transparent border-0 text-center">
                                <h5 class="card-title mb-0 fw-bold">Hızlı Erişim</h5>
                                <div class="mt-2">
                                    <small class="text-muted">Toplam Konfigürasyon</small>
                                    <div class="h4 text-primary mb-0" id="toplamKonfigurasyonSayisi">-</div>
                                </div>
                            </div>
                            <div class="card-body p-4">
                                <div class="d-flex flex-column align-items-center g-3">
                                    <div class="w-100">
                                        <a href="pages/seri_mamul_konfigurasyon.html" class="btn btn-primary btn-lg w-100 d-flex align-items-center justify-content-center py-4">
                                            <div class="text-center">
                                                <i class="bi bi-gear-fill me-3 fs-2"></i>
                                                <div>
                                                    <div class="fw-bold fs-5">Seri Mamul Konfigürasyonu</div>
                                                    <small class="opacity-75">Yeni ürün konfigürasyonu oluştur</small>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                    <div class="w-100">
                                        <a href="pages/konfigurasyon_yonetimi.html" class="btn btn-success btn-lg w-100 d-flex align-items-center justify-content-center py-4">
                                            <div class="text-center">
                                                <i class="bi bi-clipboard-data me-3 fs-2"></i>
                                                <div>
                                                    <div class="fw-bold fs-5">Konfigürasyon Yönetimi</div>
                                                    <small class="opacity-75">Mevcut konfigürasyonları yönet</small>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- Sistem Durumu -->
                    <div class="col-md-5">
                        <div class="card border-0 shadow-sm h-100">
                            <div class="card-header bg-transparent border-0 text-center">
                                <h5 class="card-title mb-0 fw-bold">Sistem Durumu</h5>
                            </div>
                            <div class="card-body p-4">
                                <div class="row g-3 justify-content-center">
                                    <div class="col-5">
                                        <div class="text-center p-3 bg-light rounded">
                                            <i class="bi bi-check-circle-fill text-success fs-1"></i>
                                            <div class="mt-2">
                                                <div class="fw-bold" id="aktifKonfigurasyonSayisi">-</div>
                                                <small class="text-muted">Aktif Konfigürasyon</small>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-5">
                                        <div class="text-center p-3 bg-light rounded">
                                            <i class="bi bi-clock-fill text-warning fs-1"></i>
                                            <div class="mt-2">
                                                <div class="fw-bold" id="bekleyenKonfigurasyonSayisi">-</div>
                                                <small class="text-muted">Bekleyen</small>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-5">
                                        <div class="text-center p-3 bg-light rounded">
                                            <i class="bi bi-person-fill text-info fs-1"></i>
                                            <div class="mt-2">
                                                <div class="fw-bold" id="bugunEklenenSayisi">-</div>
                                                <small class="text-muted">Bugün Eklenen</small>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-5">
                                        <div class="text-center p-3 bg-light rounded">
                                            <i class="bi bi-calendar-fill text-primary fs-1"></i>
                                            <div class="mt-2">
                                                <div class="fw-bold" id="buAyEklenenSayisi">-</div>
                                                <small class="text-muted">Bu Ay</small>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                
                <!-- Son Konfigürasyonlar -->
                <div class="row g-4">
                    <div class="col-12">
                        <div class="card border-0 shadow-sm">
                            <div class="card-header bg-transparent border-0 d-flex justify-content-between align-items-center">
                                <h5 class="card-title mb-0 fw-bold">Son Konfigürasyonlar</h5>
                                <a href="pages/konfigurasyon_yonetimi.html" class="btn btn-outline-primary btn-sm">
                                    <i class="bi bi-arrow-right me-1"></i>Tümünü Gör
                                </a>
                            </div>
                            <div class="card-body p-0">
                                <div class="table-responsive">
                                    <table class="table table-hover mb-0">
                                        <thead class="table-light">
                                            <tr>
                                                <th>Seri</th>
                                                <th>Cam Türü</th>
                                                <th>Renk</th>
                                                <th>Oluşturan</th>
                                                <th>Tarih</th>
                                                <th>Durum</th>
                                            </tr>
                                        </thead>
                                        <tbody id="sonKonfigurasyonlarListesi">
                                            <tr>
                                                <td colspan="6" class="text-center text-muted py-4">
                                                    <i class="bi bi-hourglass-split fs-2 mb-2 d-block"></i>
                                                    Konfigürasyonlar yükleniyor...
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>







    <footer class="bg-dark text-light py-4">
        <div class="container text-center">
            <p class="mb-0">© 2025 Uzser Bilişim Hizmetleri. All rights reserved.</p>
        </div>
    </footer>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script>
        // Test script - main.js yüklenmeden önce çalışır
        console.log('=== TEST SCRIPT BAŞLADI ===');
        console.log('Main.js yüklenmeden önce test');
        
        // main.js yüklendikten sonra kontrol et
        setTimeout(() => {
            console.log('=== MAIN.JS KONTROL ===');
            if (typeof API_BASE_URL !== 'undefined') {
                console.log('✅ API_BASE_URL tanımlı:', API_BASE_URL);
            } else {
                console.log('❌ API_BASE_URL tanımlı değil!');
            }
            
            if (typeof currentUserId !== 'undefined') {
                console.log('✅ currentUserId tanımlı:', currentUserId);
            } else {
                console.log('❌ currentUserId tanımlı değil!');
            }
        }, 2000);
    </script>
    <script src="js/main.js"></script>
    <script>
        // Alternatif yolları test et
        console.log('=== DOSYA YOLU TEST ===');
        console.log('Current location:', window.location.href);
        console.log('Base URL:', window.location.origin);
        console.log('Pathname:', window.location.pathname);
    </script>
    <script>
        console.log('=== SCRIPT START ===');
        
        // Global chart variables to prevent duplicates
        let monthlyChart = null;
        let trendChart = null;
        
        // Dashboard statistics
        let dashboardStats = {
            urunGrubu: 0,
            toplamModel: 0,
            camTuru: 0,
            camDeseni: 0,
            seri: 0,
            konfigurasyon: 0,
            aktifKonfigurasyon: 0,
            bekleyenKonfigurasyon: 0,
            bugunEklenen: 0,
            buAyEklenen: 0
        };
        
        // Check if Chart.js is loaded
        if (typeof Chart !== 'undefined') {
            console.log('✅ Chart.js loaded');
        } else {
            console.log('❌ Chart.js not loaded');
        }
        
        // API Configuration
        const API_BASE_URL = `${window.location.protocol}//${window.location.hostname}:8282/Uzser/api`;
        
        // Load dashboard statistics
        async function loadDashboardStats() {
            try {
                console.log('📊 Dashboard istatistikleri yükleniyor...');
                
                // Paralel olarak tüm API çağrılarını yap
                const [
                    groupTypesResponse,
                    seriesResponse,
                    glassTypesResponse,
                    glassPatternsResponse,
                    configurationsResponse
                ] = await Promise.allSettled([
                    fetch(`${API_BASE_URL}/GroupType`),
                    fetch(`${API_BASE_URL}/Series`),
                    fetch(`${API_BASE_URL}/GlassType`),
                    fetch(`${API_BASE_URL}/GlassPattern`),
                    fetch(`${API_BASE_URL}/Configuration`)
                ]);
                
                // Ürün Grupları
                if (groupTypesResponse.status === 'fulfilled' && groupTypesResponse.value.ok) {
                    const groupTypes = await groupTypesResponse.value.json();
                    dashboardStats.urunGrubu = groupTypes.length;
                    document.getElementById('urunGrubuSayisi').textContent = groupTypes.length;
                }
                
                // Seriler
                if (seriesResponse.status === 'fulfilled' && seriesResponse.value.ok) {
                    const series = await seriesResponse.value.json();
                    dashboardStats.seri = series.length;
                    document.getElementById('seriSayisi').textContent = series.length;
                }
                
                // Cam Türleri
                if (glassTypesResponse.status === 'fulfilled' && glassTypesResponse.value.ok) {
                    const glassTypes = await glassTypesResponse.value.json();
                    dashboardStats.camTuru = glassTypes.length;
                    document.getElementById('camTuruSayisi').textContent = glassTypes.length;
                }
                
                // Cam Desenleri
                if (glassPatternsResponse.status === 'fulfilled' && glassPatternsResponse.value.ok) {
                    const glassPatterns = await glassPatternsResponse.value.json();
                    dashboardStats.camDeseni = glassPatterns.length;
                    document.getElementById('camDeseniSayisi').textContent = glassPatterns.length;
                }
                
                // Konfigürasyonlar
                if (configurationsResponse.status === 'fulfilled' && configurationsResponse.value.ok) {
                    const configurations = await configurationsResponse.value.json();
                    dashboardStats.konfigurasyon = configurations.length;
                    document.getElementById('konfigurasyonSayisi').textContent = configurations.length;
                    document.getElementById('toplamKonfigurasyonSayisi').textContent = configurations.length;
                    
                    // Konfigürasyon durumlarını hesapla
                    const bugun = new Date().toDateString();
                    const buAy = new Date().getMonth();
                    
                    dashboardStats.aktifKonfigurasyon = configurations.filter(c => c.isActive).length;
                    dashboardStats.bekleyenKonfigurasyon = configurations.filter(c => !c.isActive).length;
                    dashboardStats.bugunEklenen = configurations.filter(c => new Date(c.createdAt).toDateString() === bugun).length;
                    dashboardStats.buAyEklenen = configurations.filter(c => new Date(c.createdAt).getMonth() === buAy).length;
                    
                    // Sistem durumu güncelle
                    document.getElementById('aktifKonfigurasyonSayisi').textContent = dashboardStats.aktifKonfigurasyon;
                    document.getElementById('bekleyenKonfigurasyonSayisi').textContent = dashboardStats.bekleyenKonfigurasyon;
                    document.getElementById('bugunEklenenSayisi').textContent = dashboardStats.bugunEklenen;
                    document.getElementById('buAyEklenenSayisi').textContent = dashboardStats.buAyEklenen;
                    
                    // Son konfigürasyonları yükle
                    loadSonKonfigurasyonlar(configurations);
                }
                
                // Toplam Model (örnek veri - gerçek API endpoint'i yoksa)
                dashboardStats.toplamModel = dashboardStats.seri * 3; // Örnek hesaplama
                document.getElementById('toplamModelSayisi').textContent = dashboardStats.toplamModel;
                
                console.log('✅ Dashboard istatistikleri yüklendi:', dashboardStats);
                
            } catch (error) {
                console.error('❌ Dashboard istatistikleri yüklenirken hata:', error);
                
                // Hata durumunda varsayılan değerler
                document.getElementById('urunGrubuSayisi').textContent = '0';
                document.getElementById('toplamModelSayisi').textContent = '0';
                document.getElementById('camTuruSayisi').textContent = '0';
                document.getElementById('camDeseniSayisi').textContent = '0';
                document.getElementById('seriSayisi').textContent = '0';
                document.getElementById('konfigurasyonSayisi').textContent = '0';
                document.getElementById('toplamKonfigurasyonSayisi').textContent = '0';
            }
        }
        
        // Son konfigürasyonları yükle
        function loadSonKonfigurasyonlar(configurations) {
            const tbody = document.getElementById('sonKonfigurasyonlarListesi');
            if (!tbody) return;
            
            // Son 5 konfigürasyonu al ve tarihe göre sırala
            const sonKonfigurasyonlar = configurations
                .sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt))
                .slice(0, 5);
            
            if (sonKonfigurasyonlar.length === 0) {
                tbody.innerHTML = `
                    <tr>
                        <td colspan="6" class="text-center text-muted py-4">
                            <i class="bi bi-inbox fs-2 mb-2 d-block"></i>
                            Henüz konfigürasyon bulunmuyor
                        </td>
                    </tr>
                `;
                return;
            }
            
            tbody.innerHTML = sonKonfigurasyonlar.map(config => `
                <tr>
                    <td>
                        <div class="d-flex align-items-center">
                            <i class="bi bi-layers text-primary me-2"></i>
                            <span>${config.series?.name || 'Seri Yok'}</span>
                        </div>
                    </td>
                    <td>
                        <span class="badge bg-info">${config.glassType?.name || 'Cam Türü Yok'}</span>
                    </td>
                    <td>
                        <span class="badge bg-secondary">${config.color?.name || 'Renk Yok'}</span>
                    </td>
                    <td>
                        <div class="d-flex align-items-center">
                            <i class="bi bi-person-circle text-muted me-2"></i>
                            <span>${config.createdBy || 'Bilinmiyor'}</span>
                        </div>
                    </td>
                    <td>
                        <small class="text-muted">${new Date(config.createdAt).toLocaleDateString('tr-TR')}</small>
                    </td>
                    <td>
                        <span class="badge ${config.isActive ? 'bg-success' : 'bg-warning'}">
                            ${config.isActive ? 'Aktif' : 'Beklemede'}
                        </span>
                    </td>
                </tr>
            `).join('');
        }
        
        // Function to create charts (only once)
        function createCharts() {
            console.log('Creating charts...');
            
            // Check if charts already exist
            if (monthlyChart || trendChart) {
                console.log('❌ Charts already exist, skipping creation');
                return;
            }
            
            try {
                // Monthly Chart
                const monthlyCtx = document.getElementById('monthlyChart');
                console.log('Monthly canvas:', monthlyCtx);
                if (monthlyCtx && !monthlyChart) {
                    monthlyChart = new Chart(monthlyCtx, {
                        type: 'line',
                        data: {
                            labels: ['Ocak', 'Şubat', 'Mart', 'Nisan', 'Mayıs', 'Haziran'],
                            datasets: [{
                                label: 'Eklenen Ürün Sayısı',
                                data: [12, 19, 15, 25, 22, 30],
                                borderColor: '#667eea',
                                backgroundColor: 'rgba(102, 126, 234, 0.1)',
                                tension: 0.4,
                                fill: true
                            }]
                        },
                        options: {
                            responsive: true,
                            maintainAspectRatio: false
                        }
                    });
                    console.log('✅ Monthly chart created');
                }
                
                
                // Trend Chart
                const trendCtx = document.getElementById('trendChart');
                console.log('Trend canvas:', trendCtx);
                if (trendCtx && !trendChart) {
                    trendChart = new Chart(trendCtx, {
                        type: 'bar',
                        data: {
                            labels: ['Grup', 'Model', 'Cam Türü', 'Aksesuar', 'Seri', 'Konfigürasyon'],
                            datasets: [{
                                label: 'Bu Ay',
                                data: [3, 8, 15, 4, 6, 12],
                                backgroundColor: '#667eea'
                            }]
                        },
                        options: {
                            responsive: true,
                            maintainAspectRatio: false,
                            plugins: {
                                legend: {
                                    position: 'top'
                                }
                            },
                            scales: {
                                y: {
                                    beginAtZero: true,
                                    grid: {
                                        color: 'rgba(0,0,0,0.1)'
                                    }
                                },
                                x: {
                                    grid: {
                                        display: false
                                    },
                                    ticks: {
                                        padding: 10
                                    }
                                }
                            },
                            layout: {
                                padding: {
                                    bottom: 20
                                }
                            }
                        }
                    });
                    console.log('✅ Trend chart created');
                }
                
                console.log('=== ALL CHARTS CREATED ===');
                
            } catch (error) {
                console.error('❌ Chart error:', error);
                console.log('Error details:', error);
            }
        }
        
        // Initialize dashboard
        function initializeDashboard() {
            console.log('🚀 Dashboard başlatılıyor...');
            
            // İstatistikleri yükle
            loadDashboardStats();
            
            console.log('✅ Dashboard başlatıldı');
        }
        
        // Only run once when DOM is ready
        if (document.readyState === 'loading') {
            document.addEventListener('DOMContentLoaded', initializeDashboard);
        } else {
            initializeDashboard();
        }
        
        console.log('=== SCRIPT END ===');
    </script>
    
    <!-- SON TEST -->
    <script>
        console.log('🎯 SON TEST - Bu mesaj görünüyorsa JavaScript çalışıyor!');
    </script>
</body>
</html>