<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="POS Web - Profesyonel Yazar Kasa Sistemi">
    <meta name="theme-color" content="#1e3a5f">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <title>Ürün Listesi - POS Web Market</title>
    
    <!-- Google Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
    
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
    
    <!-- CSS Dosyaları -->
    <link rel="stylesheet" href="/assets/css/theme.css?v=1783112822">
    <link rel="stylesheet" href="/assets/css/layout.css?v=1783112822">
    <link rel="stylesheet" href="/assets/css/style.css?v=1783112822">
    
    <!-- Favicon -->
    <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ctext y='.9em' font-size='90'%3E🛒%3C/text%3E%3C/svg%3E">
</head>
<body data-page="pages_products">

<!-- Navbar -->
<nav class="navbar" id="navbar">
    <div class="navbar-left">
        <button class="sidebar-toggle" id="sidebarToggle" title="Menüyü Aç/Kapat">
            <i class="fas fa-bars"></i>
        </button>
        <a href="/index.php" class="navbar-brand">
            <div class="brand-icon">
                <i class="fas fa-cash-register"></i>
            </div>
            <div class="brand-text">
                <span class="brand-title">POS Web</span>
                <span class="brand-subtitle">Yazar Kasa Sistemi</span>
            </div>
        </a>
    </div>
    
    <div class="navbar-center">
        <div class="navbar-search">
            <i class="fas fa-search search-icon"></i>
            <input type="text" 
                   id="globalSearch" 
                   placeholder="Ürün, barkod veya kategori ara..." 
                   autocomplete="off">
            <kbd class="search-shortcut">Ctrl+K</kbd>
        </div>
    </div>
    
    <div class="navbar-right">
        <!-- Barkod Hızlı Arama -->
        <div class="navbar-action" id="barcodeScanBtn" title="Barkod Tara (Ctrl+B)">
            <i class="fas fa-barcode"></i>
            <span class="action-label">Barkod</span>
        </div>
        
        <!-- Stok Uyarıları -->
        <div class="navbar-action has-badge" id="stockAlertBtn" title="Düşük Stok Uyarıları">
            <i class="fas fa-bell"></i>
            <span class="badge" id="stockAlertCount" style="display:none;">0</span>
            <span class="action-label">Uyarılar</span>
        </div>
        
        <!-- Tam Ekran -->
        <div class="navbar-action" id="fullscreenBtn" title="Tam Ekran (F11)">
            <i class="fas fa-expand"></i>
            <span class="action-label">Tam Ekran</span>
        </div>
        
        <!-- Kullanıcı Menüsü -->
        <div class="navbar-user" id="userMenuBtn">
            <div class="user-avatar">
                <i class="fas fa-user"></i>
            </div>
            <div class="user-info">
                <span class="user-name">Yönetici</span>
                <span class="user-role">Admin</span>
            </div>
            <i class="fas fa-chevron-down user-chevron"></i>
            
            <!-- Açılır Menü -->
            <div class="user-dropdown" id="userDropdown">
                <a href="/pages/settings.php" class="dropdown-item">
                    <i class="fas fa-cog"></i>
                    <span>Ayarlar</span>
                </a>
                <div class="dropdown-divider"></div>
                <a href="/pages/settings.php#backup" class="dropdown-item">
                    <i class="fas fa-database"></i>
                    <span>Yedekleme</span>
                </a>
                <div class="dropdown-divider"></div>
                <a href="#" class="dropdown-item text-danger" id="logoutBtn">
                    <i class="fas fa-sign-out-alt"></i>
                    <span>Çıkış</span>
                </a>
            </div>
        </div>
    </div>
</nav>

<!-- Barkod Tarama Modalı -->
<div class="modal" id="barcodeModal">
    <div class="modal-content modal-sm">
        <div class="modal-header">
            <h3><i class="fas fa-barcode"></i> Barkod Tara</h3>
            <button class="modal-close" data-modal="barcodeModal"><i class="fas fa-times"></i></button>
        </div>
        <div class="modal-body">
            <div class="form-group">
                <label for="barcodeInput">Barkod</label>
                <div class="input-group">
                    <input type="text" 
                           id="barcodeInput" 
                           class="form-control form-control-lg" 
                           placeholder="Barkodu okutun veya yazın..." 
                           autocomplete="off" 
                           autofocus>
                    <button class="btn btn-primary" id="barcodeSearchBtn">
                        <i class="fas fa-search"></i>
                    </button>
                </div>
                <small class="form-text">Barkod okuyucu ile okutun veya manuel girin</small>
            </div>
        </div>
    </div>
</div>

<!-- Stok Uyarıları Modalı -->
<div class="modal" id="stockAlertModal">
    <div class="modal-content modal-md">
        <div class="modal-header">
            <h3><i class="fas fa-exclamation-triangle text-warning"></i> Düşük Stok Uyarıları</h3>
            <button class="modal-close" data-modal="stockAlertModal"><i class="fas fa-times"></i></button>
        </div>
        <div class="modal-body">
            <div id="stockAlertList" class="stock-alert-list">
                <div class="loading-spinner">
                    <i class="fas fa-spinner fa-spin"></i>
                    <span>Yükleniyor...</span>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Sidebar -->
<aside class="sidebar" id="sidebar">
    <div class="sidebar-header">
        <div class="sidebar-brand">
            <div class="brand-icon">
                <i class="fas fa-cash-register"></i>
            </div>
            <div class="brand-text">
                <span class="brand-title">POS Web</span>
                <span class="brand-subtitle">Profesyonel POS</span>
            </div>
        </div>
        <button class="sidebar-close" id="sidebarClose">
            <i class="fas fa-times"></i>
        </button>
    </div>
    
    <!-- Menü Grupları -->
    <nav class="sidebar-nav">
                <div class="menu-group">
            <span class="menu-group-title">Ana Menü</span>
            <ul class="menu-list">
                                <li class="menu-item " data-page="index">
                    <a href="/index.php" class="menu-link">
                        <i class="fas fa-cash-register menu-icon"></i>
                        <span class="menu-label">Satış Ekranı</span>
                                            </a>
                </li>
                                <li class="menu-item " data-page="pages_dashboard">
                    <a href="/pages/dashboard.php" class="menu-link">
                        <i class="fas fa-chart-line menu-icon"></i>
                        <span class="menu-label">Dashboard</span>
                                            </a>
                </li>
                            </ul>
        </div>
                <div class="menu-group">
            <span class="menu-group-title">Ürün Yönetimi</span>
            <ul class="menu-list">
                                <li class="menu-item active" data-page="pages_products">
                    <a href="/pages/products.php" class="menu-link">
                        <i class="fas fa-boxes-stacked menu-icon"></i>
                        <span class="menu-label">Ürünler</span>
                                            </a>
                </li>
                                <li class="menu-item " data-page="pages_product_add">
                    <a href="/pages/product_add.php" class="menu-link">
                        <i class="fas fa-plus-circle menu-icon"></i>
                        <span class="menu-label">Yeni Ürün Ekle</span>
                                            </a>
                </li>
                            </ul>
        </div>
                <div class="menu-group">
            <span class="menu-group-title">Müşteri &amp; Satış</span>
            <ul class="menu-list">
                                <li class="menu-item " data-page="pages_customers">
                    <a href="/pages/customers.php" class="menu-link">
                        <i class="fas fa-users menu-icon"></i>
                        <span class="menu-label">Müşteriler</span>
                                            </a>
                </li>
                                <li class="menu-item " data-page="pages_credit">
                    <a href="/pages/credit.php" class="menu-link">
                        <i class="fas fa-hand-holding-dollar menu-icon"></i>
                        <span class="menu-label">Veresiye</span>
                                                <span class="menu-badge credit-badge" id="credit-badge"></span>
                                            </a>
                </li>
                            </ul>
        </div>
                <div class="menu-group">
            <span class="menu-group-title">Finans</span>
            <ul class="menu-list">
                                <li class="menu-item " data-page="pages_cash">
                    <a href="/pages/cash.php" class="menu-link">
                        <i class="fas fa-vault menu-icon"></i>
                        <span class="menu-label">Kasa</span>
                                            </a>
                </li>
                                <li class="menu-item " data-page="pages_reports">
                    <a href="/pages/reports.php" class="menu-link">
                        <i class="fas fa-file-invoice-dollar menu-icon"></i>
                        <span class="menu-label">Raporlar</span>
                                            </a>
                </li>
                            </ul>
        </div>
                <div class="menu-group">
            <span class="menu-group-title">Sistem</span>
            <ul class="menu-list">
                                <li class="menu-item " data-page="pages_settings">
                    <a href="/pages/settings.php" class="menu-link">
                        <i class="fas fa-cog menu-icon"></i>
                        <span class="menu-label">Ayarlar</span>
                                            </a>
                </li>
                            </ul>
        </div>
            </nav>
    
    <!-- Kısayollar -->
    <div class="sidebar-shortcuts">
        <span class="shortcuts-title"><i class="fas fa-keyboard"></i> Kısayollar</span>
        <div class="shortcuts-list">
                        <div class="shortcut-item">
                <kbd>F1</kbd>
                <span>Yardım</span>
            </div>
                        <div class="shortcut-item">
                <kbd>F2</kbd>
                <span>Hızlı Satış</span>
            </div>
                        <div class="shortcut-item">
                <kbd>F9</kbd>
                <span>Ödeme</span>
            </div>
                        <div class="shortcut-item">
                <kbd>Ctrl+K</kbd>
                <span>Arama</span>
            </div>
                        <div class="shortcut-item">
                <kbd>Ctrl+B</kbd>
                <span>Barkod</span>
            </div>
                        <div class="shortcut-item">
                <kbd>Esc</kbd>
                <span>Kapat</span>
            </div>
                    </div>
    </div>
    
    <!-- Sidebar Footer -->
    <div class="sidebar-footer">
        <div class="system-info">
            <span class="version">v1.0.0</span>
            <span class="status online"><i class="fas fa-circle"></i> Çevrimiçi</span>
        </div>
    </div>
</aside>

<!-- Sidebar Overlay (mobil) -->
<div class="sidebar-overlay" id="sidebarOverlay"></div>

<main class="main-content">
    <!-- Page Header -->
    <div class="page-header">
        <div class="page-header-left">
            <div class="page-header-icon">
                <i class="fas fa-boxes-stacked"></i>
            </div>
            <div>
                <h1 class="page-header-title">Ürünler</h1>
                <p class="page-header-subtitle">Tüm ürünleri yönetin</p>
            </div>
        </div>
        <div class="page-header-actions">
            <a href="/pages/product_add.php" class="btn btn-primary">
                <i class="fas fa-plus"></i> Yeni Ürün
            </a>
        </div>
    </div>
    
    <!-- Toolbar -->
    <div class="toolbar">
        <div class="toolbar-left">
            <div class="search-box" style="width: 280px;">
                <i class="fas fa-search"></i>
                <input type="text" id="productSearch" placeholder="Ürün ara..." autocomplete="off">
            </div>
            <select id="categoryFilter" class="form-control form-control-sm" style="width: 160px;">
                <option value="">Tüm Kategoriler</option>
            </select>
            <select id="stockFilter" class="form-control form-control-sm" style="width: 140px;">
                <option value="">Tüm Stoklar</option>
                <option value="low">Düşük Stok</option>
                <option value="out">Stok Tükendi</option>
            </select>
        </div>
        <div class="toolbar-right">
            <span class="text-sm text-secondary" id="productCount">Yükleniyor...</span>
        </div>
    </div>
    
    <!-- Products Table -->
    <div class="content-card">
        <div class="table-container">
            <table class="table" id="productsTable">
                <thead>
                    <tr>
                        <th>Barkod</th>
                        <th>Ürün Adı</th>
                        <th>Kategori</th>
                        <th>Alış Fiyatı</th>
                        <th>Satış Fiyatı</th>
                        <th>Stok</th>
                        <th>KDV</th>
                        <th>Durum</th>
                        <th style="width: 120px;">İşlemler</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td colspan="9" class="table-empty">
                            <div style="display:flex; flex-direction:column; align-items:center; gap:var(--space-3);">
                                <div class="skeleton" style="width:100%; height:40px;"></div>
                                <div class="skeleton" style="width:100%; height:40px;"></div>
                                <div class="skeleton" style="width:100%; height:40px;"></div>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        
        <!-- Pagination -->
        <div class="content-card-footer">
            <span class="text-sm text-secondary" id="paginationInfo"></span>
            <div class="pagination" id="pagination"></div>
        </div>
    </div>
    
</main>

<!-- Ürün Düzenleme Modalı -->
<div class="modal" id="editProductModal">
    <div class="modal-content modal-lg">
        <div class="modal-header">
            <h3><i class="fas fa-edit"></i> Ürün Düzenle</h3>
            <button class="modal-close" data-modal="editProductModal"><i class="fas fa-times"></i></button>
        </div>
        <div class="modal-body">
            <form id="editProductForm">
                <input type="hidden" id="editProductId">
                <div class="form-row">
                    <div class="form-group">
                        <label class="required">Barkod</label>
                        <input type="text" id="editBarcode" class="form-control">
                    </div>
                    <div class="form-group">
                        <label class="required">Ürün Adı</label>
                        <input type="text" id="editName" class="form-control" required>
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group">
                        <label>Kategori</label>
                        <select id="editCategory" class="form-control">
                            <option value="">Kategorisiz</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>Birim</label>
                        <select id="editUnit" class="form-control">
                            <option value="adet">Adet</option>
                            <option value="kg">Kilogram</option>
                            <option value="lt">Litre</option>
                            <option value="paket">Paket</option>
                            <option value="koli">Koli</option>
                            <option value="metre">Metre</option>
                        </select>
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group">
                        <label>Alış Fiyatı (₺)</label>
                        <input type="number" id="editPurchasePrice" class="form-control" min="0" step="0.01">
                    </div>
                    <div class="form-group">
                        <label class="required">Satış Fiyatı (₺)</label>
                        <input type="number" id="editSalePrice" class="form-control" min="0" step="0.01" required>
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group">
                        <label>Stok Miktarı</label>
                        <input type="number" id="editStock" class="form-control" min="0" step="0.01">
                    </div>
                    <div class="form-group">
                        <label>Min. Stok</label>
                        <input type="number" id="editMinStock" class="form-control" min="0" step="0.01">
                    </div>
                    <div class="form-group">
                        <label>KDV Oranı (%)</label>
                        <input type="number" id="editKdvRate" class="form-control" min="0" max="100" step="0.01" value="18">
                    </div>
                </div>
                <div class="form-group">
                    <label>Açıklama</label>
                    <textarea id="editDescription" class="form-control" rows="2"></textarea>
                </div>
            </form>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" data-modal="editProductModal">İptal</button>
            <button class="btn btn-primary" id="saveProductBtn">
                <i class="fas fa-save"></i> Kaydet
            </button>
        </div>
    </div>
</div>

<!-- Stok Güncelleme Modalı -->
<div class="modal" id="stockModal">
    <div class="modal-content modal-sm">
        <div class="modal-header">
            <h3><i class="fas fa-cubes"></i> Stok Güncelle</h3>
            <button class="modal-close" data-modal="stockModal"><i class="fas fa-times"></i></button>
        </div>
        <div class="modal-body">
            <input type="hidden" id="stockProductId">
            <div class="form-group">
                <label>İşlem</label>
                <select id="stockType" class="form-control">
                    <option value="in">Stok Girişi</option>
                    <option value="out">Stok Çıkışı</option>
                </select>
            </div>
            <div class="form-group">
                <label>Miktar</label>
                <input type="number" id="stockQuantity" class="form-control" min="0.01" step="0.01" required>
            </div>
            <div class="form-group">
                <label>Açıklama</label>
                <input type="text" id="stockDescription" class="form-control" placeholder="Stok hareketi açıklaması">
            </div>
        </div>
        <div class="modal-footer">
            <button class="btn btn-secondary" data-modal="stockModal">İptal</button>
            <button class="btn btn-primary" id="updateStockBtn">Güncelle</button>
        </div>
    </div>
</div>

<script>
let productsData = [];
let categoriesData = [];
let currentPage = 1;
const itemsPerPage = 20;

document.addEventListener('DOMContentLoaded', () => {
    loadCategories();
    loadProducts();
    bindEvents();
});

function bindEvents() {
    // Arama
    document.getElementById('productSearch')?.addEventListener('input', debounce(() => {
        currentPage = 1;
        renderProducts();
    }, 300));
    
    // Kategori filtresi
    document.getElementById('categoryFilter')?.addEventListener('change', () => {
        currentPage = 1;
        renderProducts();
    });
    
    // Stok filtresi
    document.getElementById('stockFilter')?.addEventListener('change', () => {
        currentPage = 1;
        renderProducts();
    });
    
    // Kaydet butonu
    document.getElementById('saveProductBtn')?.addEventListener('click', saveProduct);
    document.getElementById('updateStockBtn')?.addEventListener('click', updateStock);
}

async function loadCategories() {
    try {
        const result = await get('/ajax/products.php', { action: 'categories' });
        if (result.success) {
            categoriesData = result.categories || [];
            
            // Filtre dropdown
            const filterSelect = document.getElementById('categoryFilter');
            categoriesData.forEach(c => {
                filterSelect?.insertAdjacentHTML('beforeend', `<option value="${c.id}">${c.name}</option>`);
            });
            
            // Edit modal dropdown
            const editSelect = document.getElementById('editCategory');
            categoriesData.forEach(c => {
                editSelect?.insertAdjacentHTML('beforeend', `<option value="${c.id}">${c.name}</option>`);
            });
        }
    } catch (e) {
        console.error('Categories load error:', e);
    }
}

async function loadProducts() {
    try {
        showLoading('Ürünler yükleniyor...');
        const result = await get('/ajax/products.php', { action: 'list' });
        hideLoading();
        
        if (result.success) {
            productsData = result.products || [];
            renderProducts();
        }
    } catch (e) {
        hideLoading();
        showToast('Ürünler yüklenirken hata oluştu', 'error');
    }
}

function getFilteredProducts() {
    const searchTerm = document.getElementById('productSearch')?.value.toLowerCase() || '';
    const categoryId = document.getElementById('categoryFilter')?.value || '';
    const stockFilter = document.getElementById('stockFilter')?.value || '';
    
    return productsData.filter(p => {
        if (searchTerm && !p.name.toLowerCase().includes(searchTerm) && !(p.barcode || '').includes(searchTerm)) return false;
        if (categoryId && p.category_id != categoryId) return false;
        if (stockFilter === 'low' && parseFloat(p.stock) > parseFloat(p.min_stock || 0)) return false;
        if (stockFilter === 'out' && parseFloat(p.stock) > 0) return false;
        return true;
    });
}

function renderProducts() {
    const filtered = getFilteredProducts();
    const total = filtered.length;
    const start = (currentPage - 1) * itemsPerPage;
    const pageItems = filtered.slice(start, start + itemsPerPage);
    
    document.getElementById('productCount').textContent = `${total} ürün`;
    document.getElementById('paginationInfo').textContent = `${start + 1}-${Math.min(start + itemsPerPage, total)} / ${total}`;
    
    const tbody = document.querySelector('#productsTable tbody');
    
    if (pageItems.length === 0) {
        tbody.innerHTML = `
            <tr><td colspan="9" class="table-empty">
                <i class="fas fa-search"></i>
                <p>Ürün bulunamadı</p>
            </td></tr>
        `;
        renderPagination(0);
        return;
    }
    
    tbody.innerHTML = pageItems.map(p => {
        const stockVal = parseFloat(p.stock || 0);
        const minStock = parseFloat(p.min_stock || 0);
        const isLow = stockVal <= minStock && stockVal > 0;
        const isOut = stockVal <= 0;
        
        return `
            <tr>
                <td><code class="text-sm">${p.barcode || '-'}</code></td>
                <td>
                    <strong>${p.name}</strong>
                    ${p.description ? `<br><small class="text-muted">${p.description.substring(0, 50)}</small>` : ''}
                </td>
                <td>
                    ${p.category_name ? `<span class="badge badge-secondary"><i class="fas fa-tag"></i> ${p.category_name}</span>` : '-'}
                </td>
                <td>${formatMoney(p.purchase_price || 0)}</td>
                <td><strong class="text-primary">${formatMoney(p.sale_price || 0)}</strong></td>
                <td>
                    <span class="font-semibold ${isOut ? 'text-danger' : isLow ? 'text-warning' : ''}">
                        ${formatNumber(p.stock || 0)} ${p.unit || 'adet'}
                    </span>
                    ${isLow ? ' <i class="fas fa-exclamation-triangle text-warning"></i>' : ''}
                </td>
                <td>${p.kdv_rate || 18}%</td>
                <td>
                    ${parseInt(p.is_active) ? 
                        '<span class="badge badge-success">Aktif</span>' : 
                        '<span class="badge badge-secondary">Pasif</span>'}
                </td>
                <td>
                    <div class="table-actions">
                        <button class="btn btn-icon btn-sm" onclick="editProduct(${p.id})" title="Düzenle">
                            <i class="fas fa-edit"></i>
                        </button>
                        <button class="btn btn-icon btn-sm" onclick="openStockModal(${p.id})" title="Stok">
                            <i class="fas fa-cubes"></i>
                        </button>
                        <button class="btn btn-icon btn-sm text-danger" onclick="deleteProduct(${p.id})" title="Sil">
                            <i class="fas fa-trash"></i>
                        </button>
                    </div>
                </td>
            </tr>
        `;
    }).join('');
    
    renderPagination(total);
}

function renderPagination(total) {
    const totalPages = Math.ceil(total / itemsPerPage);
    const container = document.getElementById('pagination');
    
    if (totalPages <= 1) {
        container.innerHTML = '';
        return;
    }
    
    let html = '';
    
    // Previous
    html += `<button class="page-btn" ${currentPage === 1 ? 'disabled' : ''} onclick="goToPage(${currentPage - 1})"><i class="fas fa-chevron-left"></i></button>`;
    
    // Pages
    for (let i = 1; i <= totalPages; i++) {
        if (i === 1 || i === totalPages || (i >= currentPage - 1 && i <= currentPage + 1)) {
            html += `<button class="page-btn ${i === currentPage ? 'active' : ''}" onclick="goToPage(${i})">${i}</button>`;
        } else if (i === currentPage - 2 || i === currentPage + 2) {
            html += `<span class="text-muted" style="padding:0 var(--space-2);">...</span>`;
        }
    }
    
    // Next
    html += `<button class="page-btn" ${currentPage === totalPages ? 'disabled' : ''} onclick="goToPage(${currentPage + 1})"><i class="fas fa-chevron-right"></i></button>`;
    
    container.innerHTML = html;
}

function goToPage(page) {
    currentPage = page;
    renderProducts();
}

async function editProduct(id) {
    const product = productsData.find(p => p.id === id);
    if (!product) return;
    
    document.getElementById('editProductId').value = product.id;
    document.getElementById('editBarcode').value = product.barcode || '';
    document.getElementById('editName').value = product.name || '';
    document.getElementById('editCategory').value = product.category_id || '';
    document.getElementById('editUnit').value = product.unit || 'adet';
    document.getElementById('editPurchasePrice').value = product.purchase_price || '';
    document.getElementById('editSalePrice').value = product.sale_price || '';
    document.getElementById('editStock').value = product.stock || '';
    document.getElementById('editMinStock').value = product.min_stock || '';
    document.getElementById('editKdvRate').value = product.kdv_rate || 18;
    document.getElementById('editDescription').value = product.description || '';
    
    openModal('editProductModal');
}

async function saveProduct() {
    const id = document.getElementById('editProductId').value;
    const data = {
        id: id,
        barcode: document.getElementById('editBarcode').value,
        name: document.getElementById('editName').value,
        category_id: document.getElementById('editCategory').value,
        unit: document.getElementById('editUnit').value,
        purchase_price: document.getElementById('editPurchasePrice').value,
        sale_price: document.getElementById('editSalePrice').value,
        stock: document.getElementById('editStock').value,
        min_stock: document.getElementById('editMinStock').value,
        kdv_rate: document.getElementById('editKdvRate').value,
        description: document.getElementById('editDescription').value
    };
    
    if (!data.name || !data.sale_price) {
        showToast('Ürün adı ve satış fiyatı zorunludur', 'error');
        return;
    }
    
    showLoading('Kaydediliyor...');
    
    try {
        const result = await post('/ajax/products.php', {
            action: 'update',
            ...data
        });
        
        hideLoading();
        
        if (result.success) {
            closeModal('editProductModal');
            showToast('Ürün güncellendi', 'success');
            loadProducts();
        } else {
            showToast(result.message, 'error');
        }
    } catch (e) {
        hideLoading();
        showToast('Kaydetme hatası', 'error');
    }
}

function openStockModal(id) {
    document.getElementById('stockProductId').value = id;
    document.getElementById('stockQuantity').value = '';
    document.getElementById('stockDescription').value = '';
    openModal('stockModal');
}

async function updateStock() {
    const productId = document.getElementById('stockProductId').value;
    const type = document.getElementById('stockType').value;
    const quantity = parseFloat(document.getElementById('stockQuantity').value);
    const description = document.getElementById('stockDescription').value;
    
    if (!quantity || quantity <= 0) {
        showToast('Geçerli bir miktar girin', 'error');
        return;
    }
    
    showLoading('Stok güncelleniyor...');
    
    try {
        const result = await post('/ajax/products.php', {
            action: 'update_stock',
            product_id: productId,
            type: type,
            quantity: quantity,
            description: description || 'Stok güncellemesi'
        });
        
        hideLoading();
        
        if (result.success) {
            closeModal('stockModal');
            showToast('Stok güncellendi', 'success');
            loadProducts();
        } else {
            showToast(result.message, 'error');
        }
    } catch (e) {
        hideLoading();
        showToast('Stok güncelleme hatası', 'error');
    }
}

function deleteProduct(id) {
    const product = productsData.find(p => p.id === id);
    if (!product) return;
    
    confirmDialog(`"${product.name}" ürününü silmek istediğinize emin misiniz?`, 'Ürün Sil', async () => {
        showLoading('Siliniyor...');
        
        try {
            const result = await post('/ajax/products.php', { action: 'delete', id: id });
            hideLoading();
            
            if (result.success) {
                showToast('Ürün silindi', 'success');
                loadProducts();
            } else {
                showToast(result.message, 'error');
            }
        } catch (e) {
            hideLoading();
            showToast('Silme hatası', 'error');
        }
    });
}
</script>

    </main>
    
    <!-- Toast Bildirimleri -->
    <div class="toast-container" id="toastContainer"></div>
    
    <!-- Yükleniyor Overlay -->
    <div class="loading-overlay" id="loadingOverlay" style="display:none;">
        <div class="loading-content">
            <div class="spinner"></div>
            <span class="loading-text">İşleniyor...</span>
        </div>
    </div>
    
    <!-- Onay Modalı -->
    <div class="modal" id="confirmModal">
        <div class="modal-content modal-sm">
            <div class="modal-header">
                <h3 id="confirmTitle"><i class="fas fa-question-circle"></i> Onay</h3>
                <button class="modal-close" data-modal="confirmModal"><i class="fas fa-times"></i></button>
            </div>
            <div class="modal-body">
                <p id="confirmMessage">Bu işlemi yapmak istediğinize emin misiniz?</p>
            </div>
            <div class="modal-footer">
                <button class="btn btn-secondary" data-modal="confirmModal">İptal</button>
                <button class="btn btn-primary" id="confirmBtn">Evet</button>
            </div>
        </div>
    </div>
    
    <!-- Bildirim Modalı -->
    <div class="modal" id="alertModal">
        <div class="modal-content modal-sm">
            <div class="modal-header">
                <h3 id="alertTitle"><i class="fas fa-info-circle"></i> Bilgi</h3>
                <button class="modal-close" data-modal="alertModal"><i class="fas fa-times"></i></button>
            </div>
            <div class="modal-body">
                <p id="alertMessage"></p>
            </div>
            <div class="modal-footer">
                <button class="btn btn-primary" data-modal="alertModal">Tamam</button>
            </div>
        </div>
    </div>

    <!-- JavaScript Dosyaları -->
    <script src="/assets/js/utils.js?v=1783112822"></script>
    <script src="/assets/js/app.js?v=1783112822"></script>
    
        
    <!-- Sayfaya Özel Script -->
    <script>
        // Aktif sayfa bilgisi
        window.POS_APP = {
            currentPage: 'pages_products',
            baseUrl: '',
            currency: '₺',
            vatRate: 18,
            shortcuts: {
                search: 'ctrl+k',
                barcode: 'ctrl+b',
                fullscreen: 'f11',
                cancel: 'escape'
            }
        };
    </script>
</body>
</html>
