<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Agenda de Tareas</title>
<style>
body {
font-family: 'Arial', sans-serif;
background-color: #f37f70;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
}
h1 {
color: #333;
}
form {
margin: 20px 0;
display: flex;
flex-direction: column;
align-items: center;
}
label {
margin-bottom: 5px;
color: #333;
}
input {
padding: 8px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 4px;
}
button {
padding: 10px 15px;
background-color: #000000;
color: #fff;
border: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s;
margin-bottom: 5%
}
button:hover {
background-color: #a6574c;
}
table {
border-collapse: collapse;
width: 50%;
margin-top: 20px;
}
table, th, td {
border: 1px solid #ddd;
}
th, td {
padding: 12px;
text-align: left;
}
th {
background-color: #000000;
color: white;
}
tr:nth-child(even) {
background-color: #f37f70;
}
p {
color: #333;
}
</style>
</head>
<body>
<?php
// Función para obtener las tareas almacenadas
function obtenerTareas() {
if (isset($_SESSION['tareas'])) {
return $_SESSION['tareas'];
} else {
return [];
}
}
// Función para mostrar las tareas en formato tabular
function mostrarTareas() {
$tareas = obtenerTareas();
if (empty($tareas)) {
echo "<p>No hay tareas en la lista.</p>";
return;
}
echo "<table>";
echo "<tr><th>Número</th><th>Nombre</th><th>Completada</th></tr>";
foreach ($tareas as $numero => $tarea) {
echo "<tr>";
echo "<td>$numero</td>";
echo "<td>{$tarea['nombre']}</td>";
echo "<td>{$tarea['completada']}</td>";
echo "</tr>";
}
echo "</table>";
}
// Iniciar la sesión
session_start();
// Procesar el formulario para agregar nuevas tareas
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (isset($_POST['agregar'])) {
$nombre = $_POST['nombre'];
if (!empty($nombre)) {
$tareas = obtenerTareas();
$tareas[] = ['nombre' => $nombre, 'completada' => 'No'];
$_SESSION['tareas'] = $tareas;
} else {
echo "<p style='color: red;'>¡Advertencia! El nombre de la tarea no puede estar vacío.</p>";
}
}
}
// Procesar el formulario para cambiar el estado de una tarea o borrarla
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (isset($_POST['cambiarEstado'])) {
$numeroTarea = $_POST['numeroTarea'];
$tareas = obtenerTareas();
if (isset($tareas[$numeroTarea])) {
$tareas[$numeroTarea]['completada'] = ($tareas[$numeroTarea]['completada'] == 'Sí') ? 'No' : 'Sí';
$_SESSION['tareas'] = $tareas;
} else {
echo "<p style='color: red;'>¡Advertencia! Número de tarea no válido.</p>";
}
} elseif (isset($_POST['borrarTarea'])) {
$numeroTarea = $_POST['numeroTarea'];
$tareas = obtenerTareas();
if (isset($tareas[$numeroTarea])) {
unset($tareas[$numeroTarea]);
$_SESSION['tareas'] = array_values($tareas);
} else {
echo "<p style='color: red;'>¡Advertencia! Número de tarea no válido.</p>";
}
}
}
// Procesar la solicitud para vaciar la agenda completamente
if ($_SERVER['REQUEST_METHOD'] === 'GET' && isset($_GET['vaciarAgenda'])) {
$_SESSION['tareas'] = [];
header("Location: {$_SERVER['PHP_SELF']}");
exit();
}
?>
<h1>Agenda de Tareas</h1>
<form method="post">
<label for="nombre">Nueva Tarea:</label>
<input type="text" name="nombre" id="nombre">
<button type="submit" name="agregar">Agregar Tarea</button>
</form>
<?php mostrarTareas(); ?>
<form method="post">
<label for="numeroTarea">Número de Tarea:</label>
<input type="number" name="numeroTarea" id="numeroTarea" min="0" max="<?php echo count(obtenerTareas()) ?>">
<button type="submit" name="cambiarEstado">Cambiar Estado</button>
<button type="submit" name="borrarTarea">Borrar Tarea</button>
</form>
<form method="get" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<button type="submit" name="vaciarAgenda" formaction="<?php echo $_SERVER['PHP_SELF']; ?>">Vaciar Agenda</button>
</form>
</body>
</html>