<?php
ini_set('display_errors', 0);
error_reporting(E_ALL);
ini_set('log_errors', 1);
ini_set('error_log', 'php_errors.log');

session_start();
require_once("../config/config.php");

// Handle Delete
$success = $error = "";
if (isset($_GET['delete'])) {
    $id = (int)$_GET['delete'];
    $stmt = $conn->prepare("DELETE FROM wbs_master WHERE id = ?");
    $stmt->bind_param("i", $id);
    if ($stmt->execute()) {
        $success = "WBS task deleted successfully.";
    } else {
        $error = "Error deleting WBS task.";
    }
    $stmt->close();
}

// Search functionality
$search = trim($_GET['search'] ?? '');
$where = "";
$params = [];
$types = "";

if (!empty($search)) {
    $where = "WHERE (wbs_code LIKE ? 
                   OR task LIKE ? 
                   OR wbs_action LIKE ? 
                   OR wbs_status LIKE ?)";
    $like = "%$search%";
    $params = [$like, $like, $like, $like];
    $types = "ssss";
}

// Fetch WBS tasks
$query = "SELECT * FROM wbs_master $where ORDER BY id DESC";
$stmt = $conn->prepare($query);

if (!empty($params)) {
    $stmt->bind_param($types, ...$params);
}
$stmt->execute();
$result = $stmt->get_result();
?>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Work Breakdown Structure Management</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
    <style>
        :root {
            --primary: #8b5cf6;
            --primary-dark: #7c3aed;
            --success: #22c55e;
            --error: #ef4444;
            --text: #ffffff;
            --glass-bg: rgba(255, 255, 255, 0.12);
            --glass-border: rgba(255, 255, 255, 0.25);
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }

        body {
            font-family: 'Segoe UI', system-ui, sans-serif;
            min-height: 100vh;
            background: linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.7)),
                        url('../background.jpeg') center/cover no-repeat fixed;
            color: var(--text);
            padding: 20px;
        }

        .container { max-width: 1200px; margin: 0 auto; }

        .header {
            text-align: center;
            margin-bottom: 30px;
            padding: 20px;
        }

        .header h1 {
            font-size: 36px;
            font-weight: 700;
            margin-bottom: 10px;
            text-shadow: 0 2px 10px rgba(0,0,0,0.4);
        }

        .header p { opacity: 0.9; font-size: 18px; }

        .controls {
            display: flex;
            flex-wrap: wrap;
            gap: 15px;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 30px;
        }

        .search-box {
            position: relative;
            flex: 1;
            min-width: 280px;
        }

        .search-box input {
            width: 100%;
            padding: 16px 50px 16px 20px;
            background: rgba(255, 255, 255, 0.15);
            border: 1px solid rgba(255, 255, 255, 0.3);
            border-radius: 14px;
            color: white;
            font-size: 16px;
            backdrop-filter: blur(8px);
            transition: all 0.3s ease;
        }

        .search-box input::placeholder { color: rgba(255, 255, 255, 0.6); }

        .search-box input:focus {
            outline: none;
            border-color: var(--primary);
            box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.3);
        }

        .search-box i {
            position: absolute;
            right: 18px;
            top: 50%;
            transform: translateY(-50%);
            color: rgba(255, 255, 255, 0.7);
            font-size: 18px;
        }

        .add-btn {
            display: inline-flex;
            align-items: center;
            padding: 14px 28px;
            background: linear-gradient(135deg, var(--primary), #a78bfa);
            color: white;
            text-decoration: none;
            border-radius: 14px;
            font-weight: 600;
            font-size: 16px;
            box-shadow: 0 10px 30px rgba(139, 92, 246, 0.4);
            transition: all 0.4s ease;
        }

        .add-btn:hover {
            transform: translateY(-4px);
            box-shadow: 0 20px 40px rgba(139, 92, 246, 0.5);
        }

        .add-btn i { margin-right: 10px; }

        .message {
            padding: 16px 20px;
            border-radius: 14px;
            margin-bottom: 30px;
            display: flex;
            align-items: center;
            font-weight: 600;
            backdrop-filter: blur(8px);
            max-width: 600px;
            margin-left: auto;
            margin-right: auto;
        }

        .success { background: rgba(34, 197, 94, 0.25); border: 1px solid rgba(74, 222, 128, 0.5); color: #86efac; }
        .error { background: rgba(239, 68, 68, 0.25); border: 1px solid rgba(252, 165, 165, 0.5); color: #fca5a5; }

        .message i { margin-right: 12px; font-size: 20px; }

        .results-info {
            margin-bottom: 20px;
            opacity: 0.9;
            font-size: 15px;
            text-align: center;
        }

        .table-container {
            background: var(--glass-bg);
            backdrop-filter: blur(16px);
            border-radius: 20px;
            border: 1px solid var(--glass-border);
            overflow: hidden;
            box-shadow: 0 25px 60px rgba(0, 0, 0, 0.5);
            overflow-x: auto;
        }

        table {
            width: 100%;
            min-width: 900px;
            border-collapse: collapse;
        }

        th {
            background: rgba(255, 255, 255, 0.15);
            padding: 20px 16px;
            text-align: left;
            font-weight: 600;
            font-size: 15px;
        }

        td {
            padding: 18px 16px;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
        }

        tr:hover { background: rgba(255, 255, 255, 0.08); }

        .status {
            padding: 8px 16px;
            border-radius: 50px;
            font-size: 14px;
            font-weight: 600;
            text-align: center;
            min-width: 100px;
            display: inline-block;
        }

        .status.completed { background: rgba(34, 197, 94, 0.3); color: #86efac; }
        .status.pending { background: rgba(245, 158, 11, 0.3); color: #fcd34d; }

        .percentage {
            font-weight: 600;
            color: #c4b5fd;
        }

        .actions { display: flex; gap: 10px; flex-wrap: wrap; }

        .btn {
            padding: 10px 14px;
            border: none;
            border-radius: 10px;
            cursor: pointer;
            font-size: 14px;
            font-weight: 600;
            transition: all 0.3s ease;
            display: inline-flex;
            align-items: center;
            gap: 6px;
            text-decoration: none;
        }

        .btn-view { background: rgba(34, 197, 94, 0.3); color: #86efac; }
        .btn-view:hover { background: rgba(34, 197, 94, 0.5); transform: translateY(-2px); }

        .btn-edit { background: rgba(139, 92, 246, 0.3); color: #c4b5fd; }
        .btn-edit:hover { background: rgba(139, 92, 246, 0.5); transform: translateY(-2px); }

        .btn-delete { background: rgba(239, 68, 68, 0.3); color: #fca5a5; }
        .btn-delete:hover { background: rgba(239, 68, 68, 0.5); transform: translateY(-2px); }

        .no-tasks {
            text-align: center;
            padding: 80px 20px;
            opacity: 0.8;
            font-size: 18px;
        }

        @media (max-width: 768px) {
            .controls { flex-direction: column; align-items: stretch; }
            .search-box { min-width: auto; }
            .header h1 { font-size: 30px; }
            th, td { padding: 14px 10px; font-size: 14px; }
        }

        @media (max-width: 480px) {
            .header h1 { font-size: 26px; }
            .add-btn { width: 100%; justify-content: center; }
            .actions { flex-direction: column; }
            .btn { width: 100%; justify-content: center; }
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <h1>Work Breakdown Structure</h1>
            <p>Manage all WBS tasks and track progress</p>
        </div>

        <div class="controls">
            <div class="search-box">
                <form action="" method="get">
                    <input type="text" 
                           name="search" 
                           placeholder="Search by code, task, action or status..." 
                           value="<?= htmlspecialchars($search) ?>">
                    <i class="fas fa-search"></i>
                </form>
            </div>

            <a href="add-wbs.php" class="add-btn">
                <i class="fas fa-plus"></i> Add New WBS Task
            </a>
        </div>

        <?php if ($success): ?>
            <div class="message success">
                <i class="fas fa-check-circle"></i>
                <?= htmlspecialchars($success) ?>
            </div>
        <?php endif; ?>

        <?php if ($error): ?>
            <div class="message error">
                <i class="fas fa-exclamation-triangle"></i>
                <?= htmlspecialchars($error) ?>
            </div>
        <?php endif; ?>

        <?php if (!empty($search)): ?>
            <div class="results-info">
                Search results for: <strong>"<?= htmlspecialchars($search) ?>"</strong>
                (<?= $result->num_rows ?> found)
            </div>
        <?php endif; ?>

        <div class="table-container">
            <?php if ($result->num_rows > 0): ?>
                <table>
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>WBS Code</th>
                            <th>Task Name</th>
                            <th>Start Date</th>
                            <th>End Date</th>
                            <th>% Done</th>
                            <th>Status</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php while ($row = $result->fetch_assoc()): 
                            $status_class = strtolower($row['wbs_status']);
                        ?>
                            <tr>
                                <td><?= htmlspecialchars($row['id']) ?></td>
                                <td><strong><?= htmlspecialchars($row['wbs_code']) ?></strong></td>
                                <td><?= htmlspecialchars($row['task']) ?></td>
                                <td><?= $row['wbs_start_date'] ? date('d M Y', strtotime($row['wbs_start_date'])) : '—' ?></td>
                                <td><?= $row['wbs_end_date'] ? date('d M Y', strtotime($row['wbs_end_date'])) : '—' ?></td>
                                <td class="percentage">
                                    <?= $row['wbs_percentage_done'] !== null ? number_format($row['wbs_percentage_done'], 1) . '%' : '—' ?>
                                </td>
                                <td>
                                    <span class="status <?= $status_class ?>">
                                        <?= htmlspecialchars($row['wbs_status']) ?>
                                    </span>
                                </td>
                                <td class="actions">
                                    <a href="view-wbs.php?id=<?= $row['id'] ?>" class="btn btn-view" title="View">
                                        <i class="fas fa-eye"></i> View
                                    </a>
                                    <a href="edit-wbs.php?id=<?= $row['id'] ?>" class="btn btn-edit" title="Edit">
                                        <i class="fas fa-edit"></i> Edit
                                    </a>
                                    <a href="?delete=<?= $row['id'] ?>&search=<?= urlencode($search) ?>" 
                                       class="btn btn-delete" 
                                       onclick="return confirm('Are you sure you want to delete this WBS task?')"
                                       title="Delete">
                                        <i class="fas fa-trash"></i> Delete
                                    </a>
                                </td>
                            </tr>
                        <?php endwhile; ?>
                    </tbody>
                </table>
            <?php else: ?>
                <div class="no-tasks">
                    <i class="fas fa-tasks fa-3x" style="opacity: 0.5; margin-bottom: 20px;"></i>
                    <p>
                        <?php if (!empty($search)): ?>
                            No WBS tasks found matching "<strong><?= htmlspecialchars($search) ?></strong>"
                        <?php else: ?>
                            No WBS tasks added yet. Click "Add New WBS Task" to begin!
                        <?php endif; ?>
                    </p>
                </div>
            <?php endif; ?>
        </div>
    </div>
</body>
</html>