<!DOCTYPE html>
<html lang="vi">

<head>
    <?php require_once('head.php');?>
    <title>AdminLTE 3 | Thêm Mã Nguồn Cao Cấp</title>
    <?php require_once('nav.php');?>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">

    <style>
        /* Định hình phông chữ chuẩn Modern UI */
        body {
            font-family: 'Inter', sans-serif !important;
            background-color: #f8fafc;
        }
        .content-wrapper {
            background: #f8fafc !important;
        }

        /* Giao diện Card bo góc đổ bóng mềm */
        .premium-card {
            border: none !important;
            box-shadow: 0 20px 25px -5px rgba(15, 23, 42, 0.05), 0 8px 10px -6px rgba(15, 23, 42, 0.05) !important;
            border-radius: 16px !important;
            background: #ffffff;
            border: 1px solid #e2e8f0 !important;
        }
        
        .card-header-premium {
            background: #ffffff !important;
            border-bottom: 1px solid #f1f5f9 !important;
            padding: 24px !important;
        }

        /* Tối ưu hóa Label chữ nhỏ, đậm nét */
        label {
            font-weight: 600 !important;
            color: #475569 !important;
            margin-bottom: 8px !important;
            font-size: 0.8rem !important;
            text-transform: uppercase;
            letter-spacing: 0.05em;
        }

        /* Thiết kế các Input Group liền mạch */
        .input-group-custom {
            display: flex;
            align-items: center;
            background: #f8fafc;
            border: 1px solid #cbd5e1;
            border-radius: 10px;
            padding: 4px 12px;
            transition: all 0.25s ease;
        }
        .input-group-custom:focus-within {
            border-color: #6366f1;
            background: #ffffff;
            box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1);
        }
        .input-group-custom i {
            color: #94a3b8;
            margin-right: 10px;
            font-size: 1rem;
        }
        .input-group-custom .form-control-modern {
            border: none !important;
            background: transparent !important;
            padding: 10px 0 !important;
            height: auto !important;
            font-size: 0.92rem !important;
            color: #1e293b;
            width: 100%;
        }
        .input-group-custom .form-control-modern:focus {
            outline: none !important;
            box-shadow: none !important;
        }

        /* Khu vực nhập danh sách ảnh thiết kế dạng Upload Box */
        .textarea-list-img {
            background: #f8fafc !important;
            border: 2px dashed #cbd5e1 !important;
            border-radius: 12px !important;
            padding: 14px !important;
            font-size: 0.9rem !important;
            transition: all 0.2s ease;
        }
        .textarea-list-img:focus {
            border-color: #6366f1 !important;
            background: #ffffff !important;
            outline: none !important;
            box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1) !important;
        }

        /* Nút bấm thiết kế phẳng (Flat Design) giống Apple/Stripe */
        .btn-modern {
            border-radius: 10px !important;
            padding: 12px 24px;
            font-size: 0.9rem;
            font-weight: 600;
            transition: all 0.2s ease;
            border: none;
            display: inline-flex;
            align-items: center;
            gap: 8px;
        }
        .btn-modern-primary {
            background: #4f46e5;
            color: #fff !important;
            box-shadow: 0 4px 12px rgba(79, 70, 229, 0.15);
        }
        .btn-modern-primary:hover {
            background: #4338ca;
            transform: translateY(-1px);
            box-shadow: 0 6px 20px rgba(79, 70, 229, 0.2);
        }
        .btn-modern-secondary {
            background: #f1f5f9;
            color: #475569 !important;
        }
        .btn-modern-secondary:hover {
            background: #e2e8f0;
            color: #1e293b !important;
        }

        /* Cấu trúc phân tách khu vực rõ ràng */
        .form-section-title {
            font-size: 0.95rem;
            color: #6366f1;
            font-weight: 700;
            margin-bottom: 20px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .form-section-title::after {
            content: '';
            flex: 1;
            height: 1px;
            background: #f1f5f9;
        }
    </style>
</head>

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST["submit"])) {
    $title    = htmlspecialchars($_POST['title'] ?? '', ENT_QUOTES, 'UTF-8');
    $noidung  = $_POST['noidung'] ?? ''; 
    $gia      = htmlspecialchars($_POST['gia'] ?? '0', ENT_QUOTES, 'UTF-8');
    $link     = htmlspecialchars($_POST['link'] ?? '', ENT_QUOTES, 'UTF-8');
    $list_img = htmlspecialchars($_POST['list_img'] ?? '', ENT_QUOTES, 'UTF-8');
    $status   = htmlspecialchars($_POST['status'] ?? 'ON', ENT_QUOTES, 'UTF-8');
    $img      = htmlspecialchars($_POST['img'] ?? '', ENT_QUOTES, 'UTF-8');

    $stmt = $ketnoi->prepare("INSERT INTO `khocode` (`title`, `noidung`, `gia`, `link`, `list_img`, `status`, `img`) VALUES (?, ?, ?, ?, ?, ?, ?)");
    $stmt->bind_param("sssssss", $title, $noidung, $gia, $link, $list_img, $status, $img);

    if ($stmt->execute()) {
        echo '<script>
            document.addEventListener("DOMContentLoaded", function() {
                Swal.fire({
                    icon: "success",
                    title: "Thêm Thành Công",
                    text: "Mã nguồn đã được thêm thành công vào hệ thống.",
                    timer: 1800,
                    showConfirmButton: false
                }).then(() => {
                    window.location.href = "chuyen-muc.php";
                });
            });
        </script>';
    } else {
        echo '<script>
            document.addEventListener("DOMContentLoaded", function() {
                Swal.fire({
                    icon: "error",
                    title: "Lỗi Thêm Code",
                    text: "Đã xảy ra lỗi kết nối với cơ sở dữ liệu.",
                    confirmButtonText: "Đóng"
                });
            });
        </script>';
    }
    $stmt->close();
}
?>

<body class="hold-transition sidebar-mini layout-fixed">
    <div class="wrapper">
        <div class="content-wrapper">
            <div class="content-header">
                <div class="container-fluid">
                    <div class="row mb-2">
                        <div class="col-sm-6">
                            <h1 class="m-0 font-weight-bold" style="color: #0f172a; font-size: 1.6rem;">Khu vực quản trị</h1>
                        </div>
                        <div class="col-sm-6">
                            <ol class="breadcrumb float-sm-right">
                                <li class="breadcrumb-item"><a href="#" class="text-muted">Home</a></li>
                                <li class="breadcrumb-item active">Thêm Mã Nguồn</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>

            <section class="content">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-md-10 mx-auto"> <div class="card premium-card">
                                <div class="card-header card-header-premium">
                                    <h3 class="card-title font-weight-bold mb-0" style="font-size: 1.2rem; color: #0f172a;">
                                        <i class="fas fa-cloud-upload-alt mr-2 text-indigo" style="color: #4f46e5;"></i> Đăng tải sản phẩm mã nguồn mới
                                    </h3>
                                </div>
                                
                                <div class="card-body p-4">
                                    <form role="form" action="" method="POST">
                                        
                                        <div class="form-section-title">
                                            <i class="fas fa-info-circle"></i> Thông tin cơ bản
                                        </div>
                                        <div class="row">
                                            <div class="col-md-8 form-group mb-4">
                                                <label>Tên sản phẩm mã nguồn:</label>
                                                <div class="input-group-custom">
                                                    <i class="fas fa-tag"></i>
                                                    <input type="text" class="form-control-modern" name="title" placeholder="Nhập tên mã nguồn hiển thị trên website..." required>
                                                </div>
                                            </div>
                                            <div class="col-md-4 form-group mb-4">
                                                <label>Giá bán hàng (VNĐ):</label>
                                                <div class="input-group-custom">
                                                    <i class="fas fa-wallet"></i>
                                                    <input type="number" class="form-control-modern" name="gia" placeholder="Ví dụ: 250000" required>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-section-title">
                                            <i class="fas fa-link"></i> Dữ liệu đường dẫn & File vận chuyển
                                        </div>
                                        <div class="row">
                                            <div class="col-md-6 form-group mb-4">
                                                <label>Link download file nguồn (Zip/Rar):</label>
                                                <div class="input-group-custom">
                                                    <i class="fas fa-download"></i>
                                                    <input type="url" class="form-control-modern" name="link" placeholder="https://drive.google.com/... (Nếu có)">
                                                </div>
                                            </div>
                                            <div class="col-md-6 form-group mb-4">
                                                <label>Ảnh bìa đại diện (Thumbnail URL):</label>
                                                <div class="input-group-custom">
                                                    <i class="fas fa-image"></i>
                                                    <input type="url" class="form-control-modern" name="img" placeholder="https://i.imgur.com/your-thumbnail.png">
                                                </div>
                                            </div>
                                        </div>

                                        <div class="form-group mb-4">
                                            <label>Bộ sưu tập ảnh mô tả sản phẩm (Mỗi dòng một liên kết ảnh):</label>
                                            <textarea class="form-control textarea-list-img" name="list_img" placeholder="https://i.imgur.com/slide-image-1.png&#10;https://i.imgur.com/slide-image-2.png" rows="4"></textarea>
                                        </div>

                                        <div class="form-section-title">
                                            <i class="fas fa-sliders-h"></i> Cấu hình hiển thị & Chi tiết
                                        </div>
                                        <div class="form-group mb-4">
                                            <label>Trạng thái phân phối sản phẩm:</label>
                                            <div class="input-group-custom">
                                                <i class="fas fa-toggle-on"></i>
                                                <select class="form-control-modern" name="status" style="border:none; background:transparent;">
                                                    <option value="ON">Kích hoạt hiển thị và mở bán công khai (ON)</option>
                                                    <option value="OFF">Bảo trì / Tạm ẩn khỏi giao diện người dùng (OFF)</option>
                                                </select>
                                            </div>
                                        </div>

                                        <div class="form-group mb-5">
                                            <label>Nội dung giới thiệu chi tiết (Tính năng, Hướng dẫn cài đặt):</label>
                                            <textarea class="textarea" name="noidung" placeholder="Nhập bài viết mô tả chi tiết sản phẩm tại đây..."
                                                style="width: 100%; height: 260px; font-size: 14px; line-height: 18px; border: 1px solid #cbd5e1; border-radius: 12px; padding: 14px; background: #f8fafc;"></textarea>
                                        </div>

                                        <div class="d-flex justify-content-between align-items-center pt-3" style="border-top: 1px solid #f1f5f9;">
                                            <a href="chuyen-muc.php" class="btn btn-modern btn-modern-secondary">
                                                <i class="fas fa-arrow-left"></i> Trở về kho
                                            </a>
                                            <button type="submit" name="submit" class="btn btn-modern btn-modern-primary">
                                                <i class="fas fa-check-circle"></i> Xác nhận thêm mã nguồn
                                            </button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </div>
    </div>

    <?php require_once('foot.php');?>
</body>

</html>