Enhanced PHP File Manager

⬆️ Go Up (..)

📊 Server Information

Server:

LiteSpeed

System:

Linux 5.14.0-503.34.1.el9_5.x86_64

PHP Version:

8.3.30

User:

u231988116

Directory:

/home/u231988116/domains/ominteriorstudio.in/public_html/crm

Free Space:

7.42 TB

🔧 Quick Actions

✏️ Editing: taskmanager.php

<?php
session_start();

require_once 'db.php';

// Verify role-based access
// For AJAX calls we must not output HTML/redirects; checkAccess() may redirect
// so we enforce JSON-only behavior below for any request that includes `action`.
checkAccess();

$user_id = $_SESSION['user_id'];
$user_name = isset($_SESSION['user_name']) ? $_SESSION['user_name'] : 'Admin User';
$user_role = isset($_SESSION['user_role']) ? $_SESSION['user_role'] : 'Designer'; // Default to Designer for new logic

// Fetch Employees for the dropdown (Only Users with Role 'Employee')
$employees = [];
try {
$stmt = mysqli_prepare($conn, "SELECT id, name, email FROM users WHERE role = 'Designer' AND id != ? ORDER BY name ASC");
    if ($stmt) {
        mysqli_stmt_bind_param($stmt, "i", $user_id);
        mysqli_stmt_execute($stmt);
        $result = mysqli_stmt_get_result($stmt);
        $employees = mysqli_fetch_all($result, MYSQLI_ASSOC);
        mysqli_stmt_close($stmt);
    }
} catch (Exception $e) {
    // Handle silently
}

// Handle AJAX requests
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action'])) {
    header('Content-Type: application/json; charset=utf-8');

// Disable output buffering surprises/notices breaking JSON.
    // Any fatal/notice should still be caught as a JSON response.
ob_start();

// Make PHP warnings/notices become Exceptions so we always return valid JSON.
    set_error_handler(function($severity, $message, $file, $line) {
        throw new ErrorException($message, 0, $severity, $file, $line);
    });

try {

// Lightweight endpoint used by Designer "Load Project" button (AJAX)
        if ($_POST['action'] === 'validate_project_access') {
            if ($user_role !== 'Designer') {
                echo json_encode(['success' => false, 'message' => 'Unauthorized']);
                exit;
            }

$project_id = isset($_POST['project_id']) ? (int)$_POST['project_id'] : 0;
            if ($project_id <= 0) {
                echo json_encode(['success' => false, 'message' => 'Invalid project']);
                exit;
            }

$stmt = mysqli_prepare($conn, "SELECT master_designer_id FROM projects WHERE id = ?");
            if (!$stmt) {
                throw new Exception('Prepare failed: ' . mysqli_error($conn));
            }
            mysqli_stmt_bind_param($stmt, "i", $project_id);
            mysqli_stmt_execute($stmt);
            $res = mysqli_stmt_get_result($stmt);
            $row = mysqli_fetch_assoc($res);
            mysqli_stmt_close($stmt);

if (!$row) {
                echo json_encode(['success' => false, 'message' => 'Project not found']);
                exit;
            }

$is_ok = ((int)$row['master_designer_id'] === (int)$user_id);
            if ($is_ok) {
                $_SESSION['isMasterDesigner'] = true;
                $_SESSION['loadedProjectId'] = $project_id;
                $_SESSION['loadedProjectName'] = null;

echo json_encode(['success' => true]);
            } else {
                unset($_SESSION['isMasterDesigner'], $_SESSION['loadedProjectId'], $_SESSION['loadedProjectName']);
                echo json_encode(['success' => false, 'message' => 'Unauthorized: You are not the Master Designer for this project.']);
            }
            exit;
        }

if ($_POST['action'] === 'add_task') {
            // We expect assigned_to to be an ID now. If 'Unassigned', we use 0 or NULL.
            if ($user_role === 'Designer') {
                // Verify if designer is master designer of this project
                $check_sql = "SELECT id FROM projects WHERE project_name = ? AND master_designer_id = ?";
                $check_stmt = mysqli_prepare($conn, $check_sql);
                mysqli_stmt_bind_param($check_stmt, "si", $_POST['project'], $user_id);
                mysqli_stmt_execute($check_stmt);
                $check_res = mysqli_stmt_get_result($check_stmt);
                if (mysqli_num_rows($check_res) === 0) {
                    throw new Exception("Unauthorized: You are not the Master Designer for this project.");
                }
                mysqli_stmt_close($check_stmt);
            }
            $assigned_to_id = !empty($_POST['assigned_to']) ? (int)$_POST['assigned_to'] : 0;
            
$stmt = mysqli_prepare($conn, "
                INSERT INTO tasks (title, project_name, priority, assigned_to, due_date, created_by_user_id)
                VALUES (?, ?, ?, ?, ?, ?)
            ");
            if (!$stmt) {
                throw new Exception("Prepare failed: " . mysqli_error($conn));
            }

// tasks.assigned_to is VARCHAR in schema. UI sends assigned_to as user id (string),
            // which works because the column accepts varchar.
            mysqli_stmt_bind_param(
                $stmt,
                "sssssi",
                $_POST['title'],
                $_POST['project'],
                $_POST['priority'],
                $assigned_to_id,
                $_POST['due_date'],
                $user_id
            );

// Note: We keep a text fallback in the column just in case, or we rely purely on ID. 
            // Given the schema wasn't fully provided, I am mapping the ID to the integer column.
            // If your schema expects a string in assigned_to, change 'i' to 's' in bind_param.
            // Assuming standard ID reference here.
            
            if (!mysqli_stmt_execute($stmt)) {
                throw new Exception("Execute failed: " . mysqli_stmt_error($stmt));
            }
            $new_id = mysqli_insert_id($conn);
            mysqli_stmt_close($stmt);
            
            // Fetch the full details of the new task to return to the UI (including names)
            $stmt = mysqli_prepare($conn, "
                SELECT t.*, 
                       u.name as assigned_to_name, u.email as assigned_to_email,
                       creator.name as created_by_name
                FROM tasks t
                LEFT JOIN users u ON t.assigned_to = u.id
                LEFT JOIN users creator ON t.created_by_user_id = creator.id
                WHERE t.id = ?
            ");
            mysqli_stmt_bind_param($stmt, "i", $new_id);
            mysqli_stmt_execute($stmt);
            $res = mysqli_stmt_get_result($stmt);
            $newTask = mysqli_fetch_assoc($res);
            mysqli_stmt_close($stmt);

echo json_encode(['success' => true, 'id' => $new_id, 'task' => $newTask]);
            exit;
        }

if ($_POST['action'] === 'edit_task') {
            // Note: Not used by current UI, but fixed to match schema types.
            $assigned_to_id = !empty($_POST['assigned_to']) ? (string)$_POST['assigned_to'] : 'Unassigned';

$taskId = isset($_POST['task_id']) ? (int)$_POST['task_id'] : 0;
            if ($taskId <= 0) {
                throw new Exception('Missing task_id');
            }
            
            if ($user_role === 'Designer') {
                // Verify if designer is master designer of the project the task belongs to
                $check_sql = "SELECT t.id FROM tasks t JOIN projects p ON t.project_name = p.project_name 
                             WHERE t.id = ? AND p.master_designer_id = ?";
                $check_stmt = mysqli_prepare($conn, $check_sql);
                mysqli_stmt_bind_param($check_stmt, "ii", $taskId, $user_id);
                mysqli_stmt_execute($check_stmt);
                $check_res = mysqli_stmt_get_result($check_stmt);
                if (mysqli_num_rows($check_res) === 0) {
                    throw new Exception("Unauthorized: You cannot edit tasks for this project.");
                }
                mysqli_stmt_close($check_stmt);
            }

$stmt = mysqli_prepare($conn, "
                UPDATE tasks SET title=?, project_name=?, priority=?, assigned_to=?, due_date=?
                WHERE id=?
            ");
            if (!$stmt) {
                throw new Exception("Prepare failed: " . mysqli_error($conn));
            }

// tasks.assigned_to is VARCHAR in schema
            mysqli_stmt_bind_param(
                $stmt,
                "sssssi",
                $_POST['title'],
                $_POST['project'],
                $_POST['priority'],
                $assigned_to_id,
                $_POST['due_date'],
                $taskId
            );

if (!mysqli_stmt_execute($stmt)) {
                throw new Exception("Execute failed: " . mysqli_stmt_error($stmt));
            }
            mysqli_stmt_close($stmt);
            echo json_encode(['success' => true]);
            exit;
        }

if ($_POST['action'] === 'complete_task') {
            $stmt = mysqli_prepare($conn, "
                UPDATE tasks SET status='Completed' WHERE id=?
            ");
            if (!$stmt) {
                throw new Exception("Prepare failed: " . mysqli_error($conn));
            }
            mysqli_stmt_bind_param($stmt, "i", $_POST['task_id']);
            if (!mysqli_stmt_execute($stmt)) {
                throw new Exception("Execute failed: " . mysqli_stmt_error($stmt));
            }
            mysqli_stmt_close($stmt);
            echo json_encode(['success' => true]);
            exit;
        }

if ($_POST['action'] === 'delete_task') {
            // Only Admins can delete tasks
            // This is a strict requirement from the prompt.
            // Designers should not have delete functionality.
            if ($user_role !== 'Admin') {
                throw new Exception("Unauthorized: Only Admins can delete tasks.");
            }
            
            $stmt = mysqli_prepare($conn, "
                DELETE FROM tasks WHERE id=?
            ");
            if (!$stmt) {
                throw new Exception("Prepare failed: " . mysqli_error($conn));
            }
            mysqli_stmt_bind_param($stmt, "i", $_POST['task_id']);
            if (!mysqli_stmt_execute($stmt)) {
                throw new Exception("Execute failed: " . mysqli_stmt_error($stmt));
            }
            mysqli_stmt_close($stmt);
            echo json_encode(['success' => true]);
            exit;
        }
    } catch (Exception $e) {
        echo json_encode(['success' => false, 'message' => $e->getMessage()]);
        exit;
    }
}

// Handle GET requests for AJAX data fetching
if ($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['action'])) {
    header('Content-Type: application/json');

try {
        if ($_GET['action'] === 'get_task' && isset($_GET['task_id'])) {
            $stmt = mysqli_prepare($conn, "
                SELECT t.*, u.name as assigned_to_name 
                FROM tasks t 
                LEFT JOIN users u ON t.assigned_to = u.id
                WHERE t.id=?
            ");
            if (!$stmt) {
                throw new Exception("Prepare failed: " . mysqli_error($conn));
            }
            mysqli_stmt_bind_param($stmt, "i", $_GET['task_id']);
            if (!mysqli_stmt_execute($stmt)) {
                throw new Exception("Execute failed: " . mysqli_stmt_error($stmt));
            }
            $result = mysqli_stmt_get_result($stmt);
            $task = mysqli_fetch_assoc($result);
            mysqli_stmt_close($stmt);

if ($task) {
                echo json_encode(['success' => true, 'task' => $task]);
            } else {
                echo json_encode(['success' => false, 'message' => 'Task not found']);
            }
            exit;
        }
    } catch (Exception $e) {
        echo json_encode(['success' => false, 'message' => $e->getMessage()]);
        exit;
    }
}

// Handle Project Loading logic
// Required behavior: validate master designer access and persist loaded project state.
$loaded_project_name = null;
$loadedProjectId = null;
$isMasterDesigner = false;

// Restore persisted loaded project state first
if (isset($_SESSION['loadedProjectId']) && (int)$_SESSION['loadedProjectId'] > 0) {
    $loadedProjectId = (int)$_SESSION['loadedProjectId'];
}

if ($loadedProjectId) {
    $stmt = mysqli_prepare($conn, "SELECT project_name, master_designer_id FROM projects WHERE id = ?");
    mysqli_stmt_bind_param($stmt, "i", $loadedProjectId);
    mysqli_stmt_execute($stmt);
    $res = mysqli_stmt_get_result($stmt);
    if ($prow = mysqli_fetch_assoc($res)) {
        $loaded_project_name = $prow['project_name'];
        // Validation rule: projects.master_designer_id = logged_in_user_id
        $isMasterDesigner = ((int)$prow['master_designer_id'] === (int)$user_id);
    }
    mysqli_stmt_close($stmt);
}

// If a project_id is selected via URL, re-validate and persist
if (isset($_GET['project_id'])) {
    $pid = (int)$_GET['project_id'];
    if ($pid > 0) {
        $stmt = mysqli_prepare($conn, "SELECT id, project_name, master_designer_id FROM projects WHERE id = ?");
        mysqli_stmt_bind_param($stmt, "i", $pid);
        mysqli_stmt_execute($stmt);
        $res = mysqli_stmt_get_result($stmt);

if ($project = mysqli_fetch_assoc($res)) {
            // Required validation:
            // projects.master_designer_id = logged_in_user_id
            if ((int)$project['master_designer_id'] === (int)$user_id) {
                // Required fix: ensure these are set after successful validation
                $isMasterDesigner = true;
                $loadedProjectId = (int)$project['id'];
                $loaded_project_name = $project['project_name'];

$_SESSION['isMasterDesigner'] = true;
                $_SESSION['loadedProjectId'] = $loadedProjectId;
                $_SESSION['loadedProjectName'] = $loaded_project_name;
            } else {
                // Not authorized for this project
                $isMasterDesigner = false;
                $loadedProjectId = null;
                $loaded_project_name = null;

unset($_SESSION['isMasterDesigner'], $_SESSION['loadedProjectId'], $_SESSION['loadedProjectName']);
            }
        }
        mysqli_stmt_close($stmt);
    }
}

// Backward compatibility for JS/PHP usage
if (isset($_SESSION['isMasterDesigner']) && $_SESSION['isMasterDesigner'] === true) {
    $isMasterDesigner = true;
}
if (isset($_SESSION['loadedProjectId']) && (int)$_SESSION['loadedProjectId'] > 0) {
    $loadedProjectId = (int)$_SESSION['loadedProjectId'];
    if (!$loaded_project_name && isset($_SESSION['loadedProjectName'])) {
        $loaded_project_name = $_SESSION['loadedProjectName'];
    }
}

// Fetch tasks from database with Role Logic
$tasks = [];
try {
    // Base query joining with users to get names
    $sql = "
        SELECT t.*, 
               u.name as assigned_to_name, u.email as assigned_to_email,
               creator.name as created_by_name
        FROM tasks t
        LEFT JOIN users u ON t.assigned_to = u.id
        LEFT JOIN users creator ON t.created_by_user_id = creator.id
    ";

// Apply Role Filter
    if ($user_role === 'Designer') {
        // Designer sees tasks assigned TO them OR tasks for projects where they are Master Designer
        $sql .= " WHERE t.assigned_to = ? OR t.project_name IN (SELECT project_name FROM projects WHERE master_designer_id = ?)";
    }
    
    $sql .= " ORDER BY t.due_date ASC";

$stmt = mysqli_prepare($conn, $sql);
    
    if ($user_role === 'Designer') {
        mysqli_stmt_bind_param($stmt, "ii", $user_id, $user_id);
    }
    
    mysqli_stmt_execute($stmt);
    $result = mysqli_stmt_get_result($stmt);
    $tasks = mysqli_fetch_all($result, MYSQLI_ASSOC);
    mysqli_stmt_close($stmt);
} catch (Exception $e) {
    // Handle error silently
}

// Get projects from database
$projects = [];
try {
    if ($user_role === 'Admin') {
        // Admin: all projects
        $stmt = mysqli_prepare($conn, "
            SELECT p.id, p.project_name, c.client_name FROM projects p JOIN clients c ON p.client_id = c.id
        ");
    } else {
        // Designer: only projects where they are master designer
        $stmt = mysqli_prepare($conn, "
            SELECT p.id, p.project_name, c.client_name FROM projects p JOIN clients c ON p.client_id = c.id 
            WHERE p.master_designer_id = ?
        ");
        mysqli_stmt_bind_param($stmt, "i", $user_id);
    }

mysqli_stmt_execute($stmt);
    $result = mysqli_stmt_get_result($stmt);
    $project_dropdown_list = mysqli_fetch_all($result, MYSQLI_ASSOC);

// Task assignment dropdown needs only project_name values
    $projects = array_column($project_dropdown_list, 'project_name');

mysqli_stmt_close($stmt);
} catch (Exception $e) {
    $projects = [];
}

?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Task Manager - ConstructCRM</title>
    
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
    
    <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&display=swap" rel="stylesheet">

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

body {
        font-family: 'Inter', sans-serif;
        background-color: #f5f7fa;
        color: #333;
        font-size: 14px;
        line-height: 1.4;
        overflow-x: hidden;
    }

/* Header */
    .header {
        background-color: #fff;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: var(--header-height);
        z-index: 1000;
        display: flex;
        align-items: center;
        padding: 0 20px;
    }

.logo {
        display: flex;
        align-items: center;
        font-weight: 700;
        font-size: 20px;
        color: var(--primary-color);
        text-decoration: none;
    }

.logo i {
        font-size: 24px;
        margin-right: 10px;
    }

.header-actions {
        margin-left: auto;
        display: flex;
        align-items: center;
    }

.mobile-menu-toggle {
        display: none;
        background: none;
        border: none;
        font-size: 24px;
        color: var(--primary-color);
        margin-right: 15px;
        cursor: pointer;
    }

/* User Dropdown */
    .user-dropdown {
        position: relative;
    }

.user-profile {
        display: flex;
        align-items: center;
        cursor: pointer;
        padding: 5px 10px;
        border-radius: var(--border-radius);
        transition: var(--transition);
    }

.user-profile:hover {
        background-color: #f8f9fa;
    }

.user-avatar {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background-color: var(--primary-color);
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        margin-right: 10px;
        font-size: 14px;
    }
    
    /* Role Badge */
    .role-badge {
        font-size: 10px;
        padding: 2px 6px;
        border-radius: 4px;
        text-transform: uppercase;
        font-weight: 700;
        letter-spacing: 0.5px;
        margin-left: 5px;
    }
    .role-admin {
        background-color: rgba(220, 53, 69, 0.1);
        color: var(--danger-color);
    }
    .role-employee {
        background-color: rgba(23, 162, 184, 0.1);
        color: var(--info-color);
    }

.user-name {
        font-weight: 500;
        margin-right: 5px;
    }

.dropdown-arrow {
        font-size: 12px;
        color: #666;
        transition: var(--transition);
    }

.user-dropdown.show .dropdown-arrow {
        transform: rotate(180deg);
    }

.user-dropdown-menu {
        position: absolute;
        top: 100%;
        right: 0;
        background-color: #fff;
        border-radius: var(--border-radius);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        min-width: 180px;
        padding: 8px 0;
        margin-top: 5px;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        transition: var(--transition);
        z-index: 1001;
    }

.user-dropdown.show .user-dropdown-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

.dropdown-item {
        display: flex;
        align-items: center;
        padding: 10px 20px;
        color: #555;
        text-decoration: none;
        transition: var(--transition);
    }

.dropdown-item:hover {
        background-color: #f8f9fa;
        color: var(--primary-color);
    }

.dropdown-item i {
        margin-right: 10px;
        font-size: 16px;
    }

.dropdown-divider {
        height: 1px;
        background-color: #eee;
        margin: 8px 0;
    }

/* Main Layout */
    .main-container {
        display: flex;
        min-height: calc(100vh - var(--header-height));
        margin-top: var(--header-height);
    }

/* Sidebar Navigation */
    .sidebar-nav {
        width: var(--nav-width);
        background-color: #fff;
        box-shadow: 2px 0 10px rgba(0, 0, 0, 0.05);
        position: fixed;
        top: var(--header-height);
        left: 0;
        bottom: 0;
        z-index: 999;
        overflow-y: auto;
        transition: var(--transition);
    }

.nav-section {
        padding: 15px 0;
    }

.nav-section:last-child {
        padding-bottom: 20px;
    }

.nav-title {
        font-size: 11px;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #999;
        padding: 0 20px;
        margin-bottom: 10px;
    }

.nav-list {
        list-style: none;
    }

.nav-item {
        margin-bottom: 5px;
    }

.nav-link {
        display: flex;
        align-items: center;
        padding: 12px 20px;
        color: #555;
        text-decoration: none;
        font-weight: 500;
        transition: var(--transition);
        position: relative;
    }

.nav-link i {
        font-size: 18px;
        margin-right: 12px;
        width: 20px;
        text-align: center;
    }

.nav-link:hover {
        background-color: rgba(151, 124, 73, 0.05);
        color: var(--primary-color);
    }

.nav-link.active {
        background-color: rgba(151, 124, 73, 0.1);
        color: var(--primary-color);
    }

.nav-link.active::before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        background-color: var(--primary-color);
    }

/* Content Wrapper */
    .content-wrapper {
        flex: 1;
        margin-left: var(--nav-width);
        display: flex;
        flex-direction: column;
        transition: var(--transition);
    }

.content-header {
        background-color: #fff;
        padding: 20px 30px;
        border-bottom: 1px solid #eee;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

.page-title {
        font-size: 24px;
        font-weight: 600;
        color: #333;
    }

.breadcrumb {
        background-color: transparent;
        padding: 0;
        margin: 0;
        font-size: 13px;
    }

.breadcrumb-item {
        color: #999;
    }

.breadcrumb-item a {
        color: #999;
        text-decoration: none;
        transition: var(--transition);
    }

.breadcrumb-item a:hover {
        color: var(--primary-color);
    }

.breadcrumb-item.active {
        color: var(--primary-color);
    }

.breadcrumb-item + .breadcrumb-item::before {
        content: "›";
        color: #ccc;
    }

/* Main Content */
    .main-content {
        flex: 1;
        padding: 30px;
    }

/* Task Form Container */
    .task-form-container {
        background-color: #fff;
        border-radius: var(--border-radius);
        box-shadow: var(--box-shadow);
        margin-bottom: 30px;
    overflow: visible; /* Ensure absolute dropdowns are not clipped */
    }

.form-header {
        background-color: var(--primary-color);
        color: white;
        padding: 20px 30px;
        display: flex;
        align-items: center;
    border-radius: var(--border-radius) var(--border-radius) 0 0;
    }

.form-title {
        font-size: 18px;
        font-weight: 600;
        margin: 0;
    }

.form-body {
        padding: 30px;
    }

/* Task Table Container */
    .task-table-container {
        background-color: #fff;
        border-radius: var(--border-radius);
        box-shadow: var(--box-shadow);
        overflow: hidden;
    }

.table-header {
        padding: 20px 30px;
        border-bottom: 1px solid #eee;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

.table-title {
        font-size: 18px;
        font-weight: 600;
        margin: 0;
        color: #333;
    }

.table-body {
        padding: 0;
    }

/* Form Controls */
    .form-group {
        margin-bottom: 20px;
    }

.form-label {
        font-weight: 500;
        color: #555;
        margin-bottom: 8px;
        font-size: 14px;
    }

.form-control, .form-select {
        border: 1px solid #ddd;
        border-radius: var(--border-radius);
        padding: 10px 15px;
        font-size: 14px;
        transition: var(--transition);
    }

.form-control:focus, .form-select:focus {
        border-color: var(--primary-color);
        box-shadow: 0 0 0 3px rgba(151, 124, 73, 0.2);
        outline: none;
    }

.btn {
        border-radius: var(--border-radius);
        font-weight: 500;
        padding: 10px 20px;
        font-size: 14px;
        transition: var(--transition);
        cursor: pointer;
    }

.btn-primary {
        background-color: var(--primary-color);
        border-color: var(--primary-color);
    }

.btn-primary:hover {
        background-color: var(--primary-dark);
        border-color: var(--primary-dark);
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(151, 124, 73, 0.3);
    }

.btn-outline-secondary {
        border-color: #ddd;
        color: #666;
    }

.btn-outline-secondary:hover {
        background-color: #f8f9fa;
        border-color: #ccc;
        color: #555;
    }

.btn-outline-success {
        border-color: var(--success-color);
        color: var(--success-color);
    }

.btn-outline-success:hover {
        background-color: var(--success-color);
        border-color: var(--success-color);
        color: white;
    }

.btn-outline-danger {
        border-color: var(--danger-color);
        color: var(--danger-color);
    }

.btn-outline-danger:hover {
        background-color: var(--danger-color);
        border-color: var(--danger-color);
        color: white;
    }

/* Table Styles */
    .table {
        margin-bottom: 0;
    }

.table th {
        border-top: none;
        font-weight: 600;
        color: #555;
        font-size: 14px;
    }

.task-row.completed {
        text-decoration: line-through;
        opacity: 0.6;
        background-color: #f8f9fa;
    }

.task-row td:last-child {
        white-space: nowrap;
    }

.priority-badge {
        font-size: 11px;
        padding: 3px 8px;
        border-radius: 12px;
    }

/* Small Avatar for Table */
    .table-avatar {
        width: 28px;
        height: 28px;
        border-radius: 50%;
        background-color: #e9ecef;
        color: #6c757d;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 11px;
        margin-right: 8px;
        font-weight: 600;
    }

/* Empty State */
    .empty-state {
        padding: 60px 20px;
        text-align: center;
        color: #999;
    }
    .empty-state i {
        font-size: 48px;
        margin-bottom: 20px;
        color: #ddd;
        display: block;
    }

/* Custom Searchable Dropdown */
    .searchable-select-wrapper {
        position: relative;
    }

.searchable-select-input {
        cursor: text;
    }

/* Ensure designer dropdown stays usable with many entries */

.searchable-select-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: white;
        border: 1px solid #ddd;
        border-top: none;
        border-radius: 0 0 var(--border-radius) var(--border-radius);
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        max-height: 220px;
        overflow-y: auto;
        z-index: 1000;
        display: none;
    }

.searchable-select-dropdown.show {
        display: block;
    }

.searchable-option {
        padding: 10px 15px;
        cursor: pointer;
        border-bottom: 1px solid #f8f9fa;
        display: flex;
        justify-content: space-between;
        align-items: center;
        transition: var(--transition);
    }

.searchable-option:hover {
        background-color: #f8f9fa;
    }

.option-name {
        font-weight: 500;
        color: #333;
    }

.option-email {
        font-size: 12px;
        color: #999;
    }

.option-avatar {
        width: 24px;
        height: 24px;
        border-radius: 50%;
        background-color: var(--primary-color);
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 10px;
        margin-right: 10px;
        float: left;
    }

/* Alert */
    .alert {
        border-radius: var(--border-radius);
        padding: 15px 20px;
        margin-bottom: 20px;
        border: none;
    }

.alert-success {
        background-color: rgba(40, 167, 69, 0.1);
        color: var(--success-color);
    }

.alert-info {
        background-color: rgba(23, 162, 184, 0.1);
        color: var(--info-color);
    }

.alert-danger {
        background-color: rgba(220, 53, 69, 0.1);
        color: var(--danger-color);
    }

.alert-fixed {
        position: fixed;
        top: 80px;
        right: 20px;
        z-index: 1050;
        width: 300px;
        opacity: 0;
        transform: translateX(100%);
        transition: all 0.5s ease-in-out;
    }

.alert-fixed.show {
        opacity: 1;
        transform: translateX(0);
    }

/* Responsive */
    @media (max-width: 768px) {
        .mobile-menu-toggle {
            display: block;
        }
        
        .sidebar-nav {
            transform: translateX(-100%);
            width: 280px;
            z-index: 1001;
        }
        
        .sidebar-nav.show {
            transform: translateX(0);
        }
        
        .content-wrapper {
            margin-left: 0;
        }

.overlay {
            z-index: 1000;
        }

.overlay.show {
            display: block;
        }

.content-header {
            padding: 15px 20px;
            flex-direction: column;
            align-items: flex-start;
        }

.page-title {
            font-size: 20px;
            margin-bottom: 10px;
        }

.main-content {
            padding: 20px;
        }

.form-body {
            padding: 20px;
        }

.header {
            padding: 0 15px;
        }

.logo {
            font-size: 18px;
        }

.logo i {
            font-size: 20px;
        }

.user-name {
            display: none;
        }
    }
    
    /* Overlay for mobile menu */
    .overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 998;
    }

.overlay.show {
        display: block;
    }
    </style>
</head>
<body>
    
    <header class="header">
        <button class="mobile-menu-toggle" id="mobileMenuToggle">
            <i class="bi bi-list"></i>
        </button>
        <a href="crmdashboard" class="logo">
            <img src="./assets/logo.png" alt="ConstructCRM Logo" style="height: 60px; width: 85px;">
        </a>
        <div class="header-actions">
            
            <div class="user-dropdown" id="userDropdown">
                <div class="user-profile" id="userProfile">
                    <div class="user-avatar"><?php echo htmlspecialchars(strtoupper(substr($user_name, 0, 1))); ?></div>
                    <span class="user-name"><?php echo htmlspecialchars($user_name); ?></span>
                    
                    <i class="bi bi-chevron-down dropdown-arrow"></i>
                </div>
                <div class="user-dropdown-menu">
                    <a href="profile" class="dropdown-item">
                        <i class="bi bi-person"></i>
                        <span>Profile</span>
                    </a>
                    <a href="settings" class="dropdown-item">
                        <i class="bi bi-gear"></i>
                        <span>Settings</span>
                    </a>
                    <div class="dropdown-divider"></div>
                    <a href="signin?logout=true" class="dropdown-item">
                        <i class="bi bi-box-arrow-right"></i>
                        <span>Logout</span>
                    </a>
                </div>
            </div>
        </div>
    </header>

<nav class="sidebar-nav" id="sidebarNav">
            <div class="nav-section">
                <div class="nav-title">Main</div>
                <ul class="nav-list">
                    <?php if ($user_role === 'Admin'): ?>
                    <li class="nav-item">
                        <a href="crmdashboard" class="nav-link">
                            <i class="bi bi-speedometer2"></i>
                            <span>Dashboard</span>
                        </a>
                    </li>
                    <?php endif; ?>
                    <li class="nav-item">
                        <a href="dashboard" class="nav-link">
                            <i class="bi bi-grid-1x2-fill"></i>
                            <span>Client</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="projectlist" class="nav-link">
                            <i class="bi bi-list-ul"></i>
                            <span>Project List</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="designimages" class="nav-link">
                            <i class="bi bi-palette-fill"></i>
                            <span>Design images</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="assignmentcalendar" class="nav-link">
                            <i class="bi bi-calendar-event-fill"></i>
                            <span>Assignment Calendar</span>
                        </a>
                    </li>
                    <?php if (($_SESSION['user_role'] ?? '') === 'Admin'): ?>
                    <li class="nav-item">
                        <a href="<?= BASE_URL ?>place_order" class="nav-link">
                            <i class="bi bi-cart-check"></i> 
                            <span>Place Order</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="financetracker" class="nav-link">
                            <i class="bi bi-cash-stack"></i>
                            <span>Finance Tracker</span>
                        </a>
                    </li>
                    <?php endif; ?>
                    <li class="nav-item">
                        <a href="imagepin" class="nav-link">
                            <i class="bi bi-pin-map-fill"></i>
                            <span>Image Pin & Comment</span>
                        </a>
                    </li>
                    <?php if ($user_role === 'Admin'): ?>
                    <li class="nav-item">
                        <a href="designcost" class="nav-link">
                            <i class="bi bi-palette-fill"></i>
                            <span>Designs Cost</span>
                        </a>
                    </li>
                    <?php endif; ?>
                </ul>
            </div>
            
            <div class="nav-section">
                <div class="nav-title">Management</div>
                <ul class="nav-list">
                    <li class="nav-item">
                        <a href="taskmanager" class="nav-link active">
                            <i class="bi bi-check2-square"></i>
                            <span>Task Manager</span>
                        </a>
                    </li>
                    <?php if ($user_role === 'Admin'): ?>
                    <li class="nav-item">
                        <a href="users" class="nav-link">
                            <i class="bi bi-people-fill"></i>
                            <span>Users</span>
                        </a>
                    </li>
                    <?php endif; ?>
                </ul>
            </div>
            
            <div class="nav-section">
                <?php if ($user_role === 'Admin'): ?>
                <div class="nav-title">Vendor Management</div>
                <ul class="nav-list">
                    <li class="nav-item">
                        <a href="addvendors" class="nav-link">
                            <i class="bi bi-person-plus-fill"></i>
                            <span>Add New Vendor</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="viewvendors" class="nav-link">
                            <i class="bi bi-card-list"></i>
                            <span>View All Vendors</span>
                        </a>
                    </li>
                </ul>
            </div>
            <?php endif; ?>
        </nav>

<div class="content-wrapper">
            
            <div class="content-header">
                <h1 class="page-title">Task Manager</h1>
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="#">Home</a></li>
                        <li class="breadcrumb-item"><a href="#">Management</a></li>
                        <li class="breadcrumb-item active" aria-current="page">Task Manager</li>
                    </ol>
                </nav>
            </div>

<div class="main-content">
                
                <div id="top-status-message" class="alert-fixed alert d-none" role="alert"></div>

<?php if ($user_role === 'Admin' || $user_role === 'Designer'): ?>

<div class="task-form-container" id="assignmentFormContainer">
                    <div class="form-header">
                        <h4 class="form-title">
                            <i class="bi bi-plus-circle-fill"></i> Assign New Task
                        </h4>
                    </div>
                    <div class="form-body">
                        <form id="addTaskForm">
                            <div class="row g-3">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="taskTitle" class="form-label">Task Title</label>
                                        <input type="text" class="form-control" id="taskTitle" placeholder="Enter task title" required>
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label for="taskProject" class="form-label">Project</label>
                                        <select class="form-select" id="taskProject" required>
                                            <option value="" selected disabled>Select Project</option>
                                            <?php foreach ($projects as $project): 
                                                // Skip the filter placeholder for assignment
                                                if ($project === 'All Sites') continue;
                                            ?>
                                                <option value="<?php echo htmlspecialchars($project); ?>" <?= ($loaded_project_name === $project) ? 'selected' : '' ?>><?php echo htmlspecialchars($project); ?></option>
                                            <?php endforeach; ?>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="taskPriority" class="form-label">Priority</label>
                                        <select class="form-select" id="taskPriority" required>
                                            <option value="" selected disabled>Select Priority</option>
                                            <option value="High">High</option>
                                            <option value="Medium">Medium</option>
                                            <option value="Low">Low</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="taskAssignedTo" class="form-label">Assign To</label>
                                        
                                    <div class="searchable-select-wrapper" id="assignToDropdown">

<input type="text" class="form-control searchable-select-input" id="taskAssignedToDisplay" placeholder="Search employee..." autocomplete="off">
                                            <input type="hidden" id="taskAssignedTo" name="assigned_to" value="">
                                            <input type="hidden" id="taskAssignedToNameFallback" name="assigned_to_name_fallback" value="">
                                            
                                        <div class="searchable-select-dropdown assign-to-dropdown">
                                                <?php if (!empty($employees)): ?>
                                                    <?php foreach ($employees as $emp): ?>
                                                        <div class="searchable-option" data-id="<?php echo $emp['id']; ?>" data-name="<?php echo htmlspecialchars($emp['name']); ?>" data-email="<?php echo htmlspecialchars($emp['email']); ?>">
                                                            <div>
                                                                <span class="option-avatar"><?php echo strtoupper(substr($emp['name'], 0, 1)); ?></span>
                                                                <span class="option-name"><?php echo htmlspecialchars($emp['name']); ?></span>
                                                            </div>
                                                            <span class="option-email"><?php echo htmlspecialchars($emp['email']); ?></span>
                                                        </div>
                                                    <?php endforeach; ?>
                                                <?php else: ?>
                                                    <div class="p-3 text-muted text-center small">No employees found.</div>
                                                <?php endif; ?>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label for="taskDueDate" class="form-label">Due Date</label>
                                        <input type="date" class="form-control" id="taskDueDate" required>
                                    </div>
                                </div>
                            </div>
                            <div class="form-actions mt-4 d-flex justify-content-end gap-2">
                                <button type="button" class="btn btn-outline-secondary" id="clearBtn">
                                    <i class="bi bi-x-circle"></i> Clear
                                </button>
                                <button type="submit" class="btn btn-primary">
                                    <i class="bi bi-check-circle"></i> Assign Task
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
                <?php endif; ?>

<div class="task-table-container">
                    <div class="table-header">
                        <h4 class="table-title">
                            <i class="bi bi-list-task"></i> Current Tasks
                        </h4>
                        <div class="table-actions">
                            <div class="btn-group" role="group">
                                <button type="button" class="btn btn-sm btn-outline-secondary active" id="allTasksBtn">All</button>
                                <button type="button" class="btn btn-sm btn-outline-secondary" id="pendingTasksBtn">Pending</button>
                                <button type="button" class="btn btn-sm btn-outline-secondary" id="completedTasksBtn">Completed</button>
                            </div>
                        </div>
                    </div>
                    <div class="table-body">
                        <div class="table-responsive">
                            <table class="table table-hover mb-0">
                                <thead class="table-light">
                                    <tr>
                                        <th style="width: 5%;">#</th>
                                        <th style="width: 25%;">Task</th>
                                        <th style="width: 15%;">Project</th>
                                        <th style="width: 15%;">Assigned To</th>
                                        <?php if ($user_role === 'Admin'): ?>
                                        <th style="width: 15%;">Created By</th>
                                        <?php endif; ?>
                                        <th style="width: 10%;">Due Date</th>
                                        <th style="width: 15%; text-align:right;">Actions</th>
                                    </tr>
                                </thead>
                                <tbody id="taskListBody">
                                    <?php if (empty($tasks)): ?>
                                        <tr>
                                            <td colspan="7">
                                                <div class="empty-state">
                                                    <i class="bi bi-clipboard-x"></i>
                                                    <p>No tasks assigned yet.</p>
                                                </div>
                                            </td>
                                        </tr>
                                    <?php else: ?>
                                        <?php foreach ($tasks as $task): ?>
                                        <tr id="task-row-<?= htmlspecialchars($task['id']) ?>" class="task-row <?= ($task['status'] == 'Completed' ? 'completed' : '') ?>" data-status="<?= htmlspecialchars($task['status']) ?>">
                                            <td><?= htmlspecialchars($task['id']) ?></td>
                                            <td>
                                                <div class="d-flex justify-content-between align-items-start">
                                                    <span class="fw-bold"><?= htmlspecialchars($task['title']) ?></span>
                                                    <span class="badge 
                                                        <?php 
                                                            if ($task['priority'] == 'High') echo 'bg-danger';
                                                            else if ($task['priority'] == 'Medium') echo 'bg-warning text-dark';
                                                            else echo 'bg-info';
                                                        ?> 
                                                        priority-badge"><?= htmlspecialchars($task['priority']) ?>
                                                    </span>
                                                </div>
                                            </td>
                                            <td><?= htmlspecialchars($task['project_name']) ?></td>
                                            <td>
                                                <?php 
                                                    $displayName = isset($task['assigned_to_name']) ? $task['assigned_to_name'] : 'Unassigned';
                                                    $initial = strtoupper(substr($displayName, 0, 1));
                                                ?>
                                                <span class="table-avatar"><?= $initial ?></span>
                                                <span class="small align-middle"><?= htmlspecialchars($displayName) ?></span>
                                            </td>
                                            
                                            <?php if ($user_role === 'Admin'): ?>
                                            <td>
                                                <?php 
                                                    $creatorName = isset($task['created_by_name']) ? $task['created_by_name'] : 'Unknown';
                                                ?>
                                                <span class="text-muted small"><?= htmlspecialchars($creatorName) ?></span>
                                            </td>
                                            <?php endif; ?>
                                            
                                            <td><?= htmlspecialchars($task['due_date']) ?></td>
                                            <td class="text-end">
                                                <?php if ($task['status'] !== 'Completed'): ?>
                                                    <button class="btn btn-sm btn-outline-success" onclick="markTaskComplete(<?= htmlspecialchars($task['id']) ?>, '<?= htmlspecialchars(addslashes($task['title'])) ?>')" <?= ($user_role === 'Designer' && $task['assigned_to'] != $user_id && (!$isMasterDesigner || $task['project_name'] !== $loaded_project_name)) ? 'disabled' : '' ?>>
                                                        <i class="bi bi-check"></i> Complete
                                                    </button>
                                                <?php else: ?>
                                                    <span class="text-success fw-bold small me-2"><i class="bi bi-check-all"></i> Done</span>
                                                    <?php if ($user_role === 'Admin'): ?>
                                                    <button class="btn btn-sm btn-outline-danger" onclick="deleteTask(<?= htmlspecialchars($task['id']) ?>, '<?= htmlspecialchars(addslashes($task['title'])) ?>')">
                                                        <i class="bi bi-trash"></i>
                                                    </button>
                                                    <?php endif; ?>
                                                <?php endif; ?>
                                            </td>
                                        </tr>
                                        <?php endforeach; ?>
                                    <?php endif; ?>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

document.addEventListener('DOMContentLoaded', function () {
            // --- DOM Elements ---
            const mobileMenuToggle = document.getElementById('mobileMenuToggle');
            const sidebarNav = document.getElementById('sidebarNav');
            const overlay = document.getElementById('overlay');
            const userDropdown = document.getElementById('userDropdown');
            const userProfile = document.getElementById('userProfile');
            const addTaskForm = document.getElementById('addTaskForm');
            const clearBtn = document.getElementById('clearBtn');
            const taskListBody = document.getElementById('taskListBody');
            const allTasksBtn = document.getElementById('allTasksBtn');
            const pendingTasksBtn = document.getElementById('pendingTasksBtn');
            const completedTasksBtn = document.getElementById('completedTasksBtn');
            
            // Custom Dropdown Elements
            const assignToWrapper = document.getElementById('assignToDropdown');
            const assignToInput = document.getElementById('taskAssignedToDisplay');
            const assignToHidden = document.getElementById('taskAssignedTo');
            const assignToNameFallback = document.getElementById('taskAssignedToNameFallback');
            const dropdownList = assignToWrapper.querySelector('.searchable-select-dropdown');
            const dropdownOptions = dropdownList.querySelectorAll('.searchable-option');

// Set today's date as default for due date
            const dateInput = document.getElementById('taskDueDate');
            if (dateInput) dateInput.valueAsDate = new Date();
            
            // --- Functions ---
            const clearForm = () => {
                if (addTaskForm) addTaskForm.reset();
                if (dateInput) dateInput.valueAsDate = new Date();
                // Clear custom dropdown
                assignToInput.value = '';
                assignToHidden.value = '';
                assignToNameFallback.value = '';
            };
            
            const showStatusMessage = (message, type = 'success') => {
                const statusMessage = document.getElementById('top-status-message');
                
                clearTimeout(window.messageTimeout);
                statusMessage.classList.remove('show', 'alert-success', 'alert-danger', 'alert-primary');

statusMessage.textContent = message;
                statusMessage.classList.add(`alert-${type}`);
                statusMessage.classList.remove('d-none');

void statusMessage.offsetWidth;

statusMessage.classList.add('show');

// --- User Dropdown (match place_order.php behavior) ---
            if (userDropdown && userProfile) {
                userProfile.addEventListener('click', (e) => {
                    e.stopPropagation();
                    userDropdown.classList.toggle('show');
                });

document.addEventListener('click', () => {
                    userDropdown.classList.remove('show');
                });
            }

// --- Custom Searchable Dropdown Logic ---
            // Prevent broken UI when Assign-to form is not rendered.
            if (assignToWrapper && assignToInput && dropdownList && dropdownOptions) {
                // Show list on focus
                assignToInput.addEventListener('focus', () => {
                    dropdownList.classList.add('show');
                });

// Filter list on type
                assignToInput.addEventListener('input', (e) => {
                    const val = e.target.value.toLowerCase();
                    dropdownOptions.forEach(opt => {
                        const name = opt.getAttribute('data-name').toLowerCase();
                        const email = opt.getAttribute('data-email').toLowerCase();
                        if (name.includes(val) || email.includes(val)) {
                            opt.style.display = 'flex';
                        } else {
                            opt.style.display = 'none';
                        }
                    });
                });

// Hide list when clicking outside
                document.addEventListener('click', (e) => {
                    if (!assignToWrapper.contains(e.target)) {
                        dropdownList.classList.remove('show');
                    }
                });

// Select Option
                dropdownOptions.forEach(opt => {
                    opt.addEventListener('click', () => {
                        const id = opt.getAttribute('data-id');
                        const name = opt.getAttribute('data-name');
                        const email = opt.getAttribute('data-email');

assignToInput.value = `${name} (${email})`;
                        assignToHidden.value = id;
                        assignToNameFallback.value = name; // Store name for potential legacy/fallback
                        dropdownList.classList.remove('show');
                    });
                });
            }

// Form submission
            if (addTaskForm) {
                addTaskForm.addEventListener('submit', function(event) {
                    event.preventDefault();

const titleInput = document.getElementById('taskTitle');
                    const projectSelect = document.getElementById('taskProject');
                    const prioritySelect = document.getElementById('taskPriority');
                    const dateInput = document.getElementById('taskDueDate');
                    
                    const title = titleInput.value.trim();
                    const project = projectSelect.value;
                    const priority = prioritySelect.value;
                    const dueDate = dateInput.value;
                    const assignedToId = assignToHidden.value;
                    const assignedToName = assignToNameFallback.value;
                    
                    // Validation
                    if (!title || !project || !priority || !dueDate) {
                        showStatusMessage('Please fill in all required fields.', 'danger');
                        return;
                    }

if (!assignedToId) {
                        showStatusMessage('Please select an employee to assign the task.', 'danger');
                        return;
                    }

const formData = new FormData();
                    formData.append('action', 'add_task');
                    formData.append('title', title);
                    formData.append('project', project);
                    formData.append('priority', priority);
                    formData.append('assigned_to', assignedToId);
                    formData.append('assigned_to_name_fallback', assignedToName);
                    formData.append('due_date', dueDate);

fetch('taskmanager.php', {
                        method: 'POST',
                        body: formData
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success) {
                            const task = data.task;
                            const newId = task.id;
                            let priorityClass = task.priority === 'High' ? 'bg-danger' : (task.priority === 'Medium' ? 'bg-warning text-dark' : 'bg-info');
                            
                            // Clean empty state if exists
                            const emptyState = taskListBody.querySelector('.empty-state');
                            if(emptyState) {
                                taskListBody.innerHTML = '';
                            }

const assignedName = task.assigned_to_name || assignedToName;
                            const initial = assignedName.charAt(0).toUpperCase();
                            const createdBy = task.created_by_name || 'You';

// Build Row HTML
                            let rowHtml = `
                                <tr id="task-row-${newId}" class="task-row" data-status="Pending">
                                    <td>${newId}</td>
                                    <td>
                                        <div class="d-flex justify-content-between align-items-start">
                                            <span class="fw-bold">${title}</span>
                                            <span class="badge ${priorityClass} priority-badge">${task.priority}</span>
                                        </div>
                                    </td>
                                    <td>${project}</td>
                                    <td>
                                        <span class="table-avatar">${initial}</span>
                                        <span class="small align-middle">${assignedName}</span>
                                    </td>
                            `;
                            
                            if (currentUserRole === 'Admin') {
                                rowHtml += `<td><span class="text-muted small">${createdBy}</span></td>`;
                            }
                            
                            rowHtml += `
                                    <td>${dueDate}</td>
                                    <td class="text-end">
                                        <button class="btn btn-sm btn-outline-success" onclick="markTaskComplete(${newId}, '${title.replace(/'/g, "\\'")}')">
                                            <i class="bi bi-check"></i> Complete
                                        </button>
                                    </td>
                                </tr>
                            `;

taskListBody.insertAdjacentHTML('afterbegin', rowHtml);
                            clearForm();
                            showStatusMessage(`Task assigned to ${assignedName}!`, 'success');
                        } else {
                            showStatusMessage('Error: ' + data.message, 'danger');
                        }
                    })
                    .catch(error => {
                        showStatusMessage('Error: ' + error.message, 'danger');
                    });
                });
            }
            
            if (clearBtn) clearBtn.addEventListener('click', clearForm);
            
            if (allTasksBtn) allTasksBtn.addEventListener('click', () => filterTasks('all'));
            if (pendingTasksBtn) pendingTasksBtn.addEventListener('click', () => filterTasks('pending'));
            if (completedTasksBtn) completedTasksBtn.addEventListener('click', () => filterTasks('completed'));
        });
        
        // Global functions for task actions
        function markTaskComplete(taskId, taskTitle) {
            const formData = new FormData();
            formData.append('action', 'complete_task');
            formData.append('task_id', taskId);

fetch('taskmanager.php', {
                method: 'POST',
                body: formData
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    const row = document.getElementById('task-row-' + taskId);
                    if (row) {
                        row.classList.add('completed');
                        row.dataset.status = 'Completed';
                        
                        // Find the actions cell (last cell)
                        const cells = row.querySelectorAll('td');
                        const actionCell = cells[cells.length - 1]; 
                        
                        let newActions = `<span class="text-success fw-bold small me-2"><i class="bi bi-check-all"></i> Done</span>`;
                        
                        // Only Admin can delete
                        if (currentUserRole === 'Admin') {
                            newActions += `
                            <button class="btn btn-sm btn-outline-danger" onclick="deleteTask(${taskId}, '${taskTitle.replace(/'/g, "\\'")}')">
                                <i class="bi bi-trash"></i>
                            </button>`;
                        }
                        
                        actionCell.innerHTML = newActions;
                        showStatusMessage(`Task "${taskTitle}" marked as completed!`, 'success');
                    }
                } else {
                    showStatusMessage('Error: ' + data.message, 'danger');
                }
            })
            .catch(error => {
                showStatusMessage('Error: ' + error.message, 'danger');
            });
        }
        
        function deleteTask(taskId, taskTitle) {
            if (!confirm(`Delete task "${taskTitle}"?`)) return;
            
            const formData = new FormData();
            formData.append('action', 'delete_task');
            formData.append('task_id', taskId);

fetch('taskmanager.php', {
                method: 'POST',
                body: formData
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    const row = document.getElementById('task-row-' + taskId);
                    if (row) {
                        row.remove();
                        
                        // Check if empty
                        const tbody = document.getElementById('taskListBody');
                        if(tbody.querySelectorAll('tr').length === 0) {
                            tbody.innerHTML = `
                                <tr>
                                    <td colspan="7">
                                        <div class="empty-state">
                                            <i class="bi bi-clipboard-x"></i>
                                            <p>No tasks assigned yet.</p>
                                        </div>
                                    </td>
                                </tr>
                            `;
                        }
                        
                        showStatusMessage(`Task "${taskTitle}" deleted.`, 'success');
                    }
                } else {
                    showStatusMessage('Error: ' + data.message, 'danger');
                }
            })
            .catch(error => {
                showStatusMessage('Error: ' + error.message, 'danger');
            });
        }
    </script>
</body>
</html>

❌ Cancel

🗂️ Enhanced PHP File Manager

📊 Server Information

🔧 Quick Actions

✏️ Editing: taskmanager.php

📤 Upload File

📁 Create Folder

📄 Create File

✏️ Rename Item

🗑️ Delete Confirmation