<?php
require_once '../../config/database.php';
$database = new Database();
$conn = $database->getConnection();
$message = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['save'])) {
    $id = $_POST['id'] ?? null;
    try {
        if ($id) {
            $stmt = $conn->prepare("UPDATE packaging_materials SET name=?, type=?, size=?, material=?, quantity=?, unit_cost=? WHERE id=?");
            $stmt->execute([$_POST['name'], $_POST['type'], $_POST['size'], $_POST['material'], $_POST['quantity'], $_POST['unit_cost'], $id]);
        } else {
            $stmt = $conn->prepare("INSERT INTO packaging_materials (name, type, size, material, quantity, unit_cost) VALUES (?, ?, ?, ?, ?, ?)");
            $stmt->execute([$_POST['name'], $_POST['type'], $_POST['size'], $_POST['material'], $_POST['quantity'], $_POST['unit_cost']]);
        }
        $message = 'تم الحفظ بنجاح';
    } catch (Exception $e) {
        $message = 'خطأ: ' . $e->getMessage();
    }
}

if (isset($_GET['delete'])) {
    $stmt = $conn->prepare("DELETE FROM packaging_materials WHERE id = ?");
    $stmt->execute([$_GET['delete']]);
    $message = 'تم الحذف';
}

$stmt = $conn->query("SELECT * FROM packaging_materials ORDER BY name");
$materials = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
    <meta charset="UTF-8">
    <title>مواد التعبئة</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<body class="bg-gray-50">
    <div class="bg-gradient-to-r from-blue-600 to-blue-800 text-white p-6">
        <div class="max-w-7xl mx-auto flex justify-between items-center">
            <h1 class="text-3xl font-bold">📦 مواد التعبئة</h1>
            <a href="index.php" class="bg-white text-blue-600 px-6 py-2 rounded-lg">العودة</a>
        </div>
    </div>
    <div class="max-w-7xl mx-auto p-6">
        <?php if($message): ?>
        <div class="bg-green-100 p-4 rounded mb-4"><?php echo $message; ?></div>
        <?php endif; ?>
        
        <button onclick="document.getElementById('modal').classList.remove('hidden')" class="bg-blue-600 text-white px-6 py-2 rounded mb-4">
            <i class="fas fa-plus ml-2"></i> إضافة مادة تعبئة
        </button>

        <div class="bg-white rounded-lg shadow overflow-hidden">
            <table class="w-full">
                <thead class="bg-gray-50">
                    <tr>
                        <th class="px-6 py-3 text-right">المادة</th>
                        <th class="px-6 py-3 text-right">النوع</th>
                        <th class="px-6 py-3 text-right">الحجم</th>
                        <th class="px-6 py-3 text-right">المادة</th>
                        <th class="px-6 py-3 text-right">الكمية</th>
                        <th class="px-6 py-3 text-right">التكلفة</th>
                        <th class="px-6 py-3 text-right">إجراءات</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach($materials as $m): ?>
                    <tr class="border-t hover:bg-gray-50">
                        <td class="px-6 py-4"><?php echo htmlspecialchars($m['name']); ?></td>
                        <td class="px-6 py-4"><?php echo $m['type']; ?></td>
                        <td class="px-6 py-4"><?php echo htmlspecialchars($m['size']); ?></td>
                        <td class="px-6 py-4"><?php echo htmlspecialchars($m['material']); ?></td>
                        <td class="px-6 py-4 font-bold"><?php echo $m['quantity']; ?></td>
                        <td class="px-6 py-4"><?php echo number_format($m['unit_cost'], 2); ?> ج.م</td>
                        <td class="px-6 py-4">
                            <button onclick='edit(<?php echo json_encode($m); ?>)' class="bg-blue-600 text-white px-3 py-1 rounded mr-2">تعديل</button>
                            <a href="?delete=<?php echo $m['id']; ?>" class="bg-red-600 text-white px-3 py-1 rounded" onclick="return confirm('متأكد؟')">حذف</a>
                        </td>
                    </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
    </div>

    <div id="modal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center">
        <div class="bg-white rounded-lg p-8 max-w-2xl w-full mx-4">
            <h3 class="text-2xl font-bold mb-4">إضافة/تعديل مادة تعبئة</h3>
            <form method="POST">
                <input type="hidden" name="id" id="id">
                <div class="grid grid-cols-2 gap-4 mb-4">
                    <div>
                        <label class="block mb-2">اسم المادة</label>
                        <input type="text" name="name" id="name" required class="w-full px-4 py-2 border rounded">
                    </div>
                    <div>
                        <label class="block mb-2">النوع</label>
                        <select name="type" id="type" required class="w-full px-4 py-2 border rounded">
                            <option value="bottle">زجاجة</option>
                            <option value="jar">علبة</option>
                            <option value="cap">غطاء</option>
                            <option value="dropper">قطارة</option>
                            <option value="spray">بخاخ</option>
                            <option value="pump">مضخة</option>
                            <option value="tube">أنبوب</option>
                        </select>
                    </div>
                </div>
                <div class="grid grid-cols-2 gap-4 mb-4">
                    <div>
                        <label class="block mb-2">الحجم</label>
                        <input type="text" name="size" id="size" placeholder="30ml, 50ml, 100ml" class="w-full px-4 py-2 border rounded">
                    </div>
                    <div>
                        <label class="block mb-2">المادة</label>
                        <input type="text" name="material" id="material" placeholder="زجاج، بلاستيك، ألومنيوم" class="w-full px-4 py-2 border rounded">
                    </div>
                </div>
                <div class="grid grid-cols-2 gap-4 mb-4">
                    <div>
                        <label class="block mb-2">الكمية</label>
                        <input type="number" name="quantity" id="quantity" required class="w-full px-4 py-2 border rounded">
                    </div>
                    <div>
                        <label class="block mb-2">تكلفة الوحدة</label>
                        <input type="number" step="0.01" name="unit_cost" id="unit_cost" required class="w-full px-4 py-2 border rounded">
                    </div>
                </div>
                <div class="flex gap-4">
                    <button type="submit" name="save" class="flex-1 bg-blue-600 text-white px-6 py-3 rounded">حفظ</button>
                    <button type="button" onclick="document.getElementById('modal').classList.add('hidden')" class="flex-1 bg-gray-300 px-6 py-3 rounded">إلغاء</button>
                </div>
            </form>
        </div>
    </div>

    <script>
        function edit(m) {
            document.getElementById('id').value = m.id;
            document.getElementById('name').value = m.name;
            document.getElementById('type').value = m.type;
            document.getElementById('size').value = m.size || '';
            document.getElementById('material').value = m.material || '';
            document.getElementById('quantity').value = m.quantity;
            document.getElementById('unit_cost').value = m.unit_cost;
            document.getElementById('modal').classList.remove('hidden');
        }
    </script>
</body>
</html>
