From 933c384e49a25a5cf006d70ae48aa53bcc925b8a Mon Sep 17 00:00:00 2001
From: Flatlogic Bot <support@flatlogic.com>
Date: Sat, 27 Sep 2025 08:49:28 +0000
Subject: [PATCH] feat: Implement Create Mission functionality

- Add a database setup script to create the `missions` table.
- Implement a modal form for creating new missions.
- Add backend PHP logic to handle form submission and save missions to the database.
- Display the list of missions dynamically from the database.
---
 assets/js/main.js |  13 ++--
 db/setup.php      |  33 +++++++++++
 index.php         | 148 ++++++++++++++++++++++++++++++++++++----------
 3 files changed, 154 insertions(+), 40 deletions(-)
 create mode 100644 db/setup.php

diff --git a/assets/js/main.js b/assets/js/main.js
index a6186fc..ad5cb41 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -1,9 +1,4 @@
-
-document.addEventListener('DOMContentLoaded', function() {
-    const createMissionBtn = document.getElementById('createMissionBtn');
-    if (createMissionBtn) {
-        createMissionBtn.addEventListener('click', function() {
-            alert('This feature is coming soon!');
-        });
-    }
-});
+document.addEventListener('DOMContentLoaded', function () {
+    // You can add any interactive scripts here in the future.
+    // For example, handling view button clicks to show mission details.
+});
\ No newline at end of file
diff --git a/db/setup.php b/db/setup.php
new file mode 100644
index 0000000..6bd2468
--- /dev/null
+++ b/db/setup.php
@@ -0,0 +1,33 @@
+<?php
+require_once 'config.php';
+
+try {
+    $pdo = db();
+    $sql = "
+    CREATE TABLE IF NOT EXISTS missions (
+        id INT AUTO_INCREMENT PRIMARY KEY,
+        name VARCHAR(255) NOT NULL,
+        drone VARCHAR(255) NOT NULL,
+        status VARCHAR(50) NOT NULL,
+        mission_date DATE NOT NULL,
+        created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
+    ) ENGINE=INNODB;
+    ";
+    $pdo->exec($sql);
+    echo "Table 'missions' created successfully." . PHP_EOL;
+
+    // Add some initial data for demonstration
+    $stmt = $pdo->query("SELECT COUNT(*) FROM missions");
+    if ($stmt->fetchColumn() == 0) {
+        $pdo->exec("
+            INSERT INTO missions (name, drone, status, mission_date) VALUES
+            ('Vineyard Survey', 'DJI Agras T30', 'Completed', '2025-09-25'),
+            ('Pest Control', 'XAG P40', 'In Progress', '2025-09-27'),
+            ('Crop Dusting', 'DJI Agras T30', 'Scheduled', '2025-09-29');
+        ");
+        echo "Initial data inserted into 'missions' table." . PHP_EOL;
+    }
+
+} catch (PDOException $e) {
+    die("DB ERROR: " . $e->getMessage());
+}
diff --git a/index.php b/index.php
index b5e5a16..d0ad0cb 100644
--- a/index.php
+++ b/index.php
@@ -1,3 +1,56 @@
+<?php
+require_once 'db/config.php';
+
+// Handle form submission
+if ($_SERVER['REQUEST_METHOD'] === 'POST') {
+    $name = $_POST['name'] ?? '';
+    $drone = $_POST['drone'] ?? '';
+    $status = $_POST['status'] ?? '';
+    $mission_date = $_POST['mission_date'] ?? '';
+
+    if ($name && $drone && $status && $mission_date) {
+        try {
+            $pdo = db();
+            $sql = "INSERT INTO missions (name, drone, status, mission_date) VALUES (:name, :drone, :status, :mission_date)";
+            $stmt = $pdo->prepare($sql);
+            $stmt->execute([
+                ':name' => $name,
+                ':drone' => $drone,
+                ':status' => $status,
+                ':mission_date' => $mission_date,
+            ]);
+            // Redirect to avoid form resubmission
+            header("Location: index.php");
+            exit;
+        } catch (PDOException $e) {
+            // For a real app, you'd log this error
+            die("Error saving mission: " . $e->getMessage());
+        }
+    }
+}
+
+// Fetch all missions
+try {
+    $pdo = db();
+    $stmt = $pdo->query("SELECT id, name, drone, status, DATE_FORMAT(mission_date, '%Y-%m-%d') as mission_date FROM missions ORDER BY mission_date DESC");
+    $missions = $stmt->fetchAll();
+} catch (PDOException $e) {
+    die("Error fetching missions: " . $e->getMessage());
+}
+
+function getStatusClass($status) {
+    switch (strtolower($status)) {
+        case 'completed':
+            return 'status-completed';
+        case 'in progress':
+            return 'status-in-progress';
+        case 'scheduled':
+            return 'status-pending';
+        default:
+            return 'status-pending';
+    }
+}
+?>
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -32,10 +85,10 @@
         </div>
     </header>
 
-    <main class="container">
+    <main class="container my-5">
         <div class="d-flex justify-content-between align-items-center mb-4">
             <h2 class="h4">Mission Dashboard</h2>
-            <button id="createMissionBtn" class="btn btn-primary">
+            <button id="createMissionBtn" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#createMissionModal">
                 <i data-feather="plus" class="me-1"></i> Create New Mission
             </button>
         </div>
@@ -52,34 +105,21 @@
                     </tr>
                 </thead>
                 <tbody>
-                    <tr>
-                        <td>Vineyard Spraying - Block A</td>
-                        <td>AG-Drone 01</td>
-                        <td><span class="status-badge status-completed">Completed</span></td>
-                        <td>2025-09-26</td>
-                        <td><button class="btn btn-sm btn-outline-secondary"><i data-feather="eye"></i> View</button></td>
-                    </tr>
-                    <tr>
-                        <td>Row Monitoring - Section 3</td>
-                        <td>AG-Drone 02</td>
-                        <td><span class="status-badge status-in-progress">In Progress</span></td>
-                        <td>2025-09-27</td>
-                        <td><button class="btn btn-sm btn-outline-secondary"><i data-feather="eye"></i> View</button></td>
-                    </tr>
-                    <tr>
-                        <td>Pest Analysis - North Field</td>
-                        <td>AG-Drone 01</td>
-                        <td><span class="status-badge status-pending">Pending</span></td>
-                        <td>2025-09-28</td>
-                        <td><button class="btn btn-sm btn-outline-secondary"><i data-feather="eye"></i> View</button></td>
-                    </tr>
-                     <tr>
-                        <td>Soil Sampling - West Ridge</td>
-                        <td>AG-Drone 03</td>
-                        <td><span class="status-badge status-pending">Pending</span></td>
-                        <td>2025-09-29</td>
-                        <td><button class="btn btn-sm btn-outline-secondary"><i data-feather="eye"></i> View</button></td>
-                    </tr>
+                    <?php if (empty($missions)): ?>
+                        <tr>
+                            <td colspan="5" class="text-center">No missions found. Create one to get started!</td>
+                        </tr>
+                    <?php else: ?>
+                        <?php foreach ($missions as $mission): ?>
+                            <tr>
+                                <td><?php echo htmlspecialchars($mission['name']); ?></td>
+                                <td><?php echo htmlspecialchars($mission['drone']); ?></td>
+                                <td><span class="status-badge <?php echo getStatusClass($mission['status']); ?>"><?php echo htmlspecialchars($mission['status']); ?></span></td>
+                                <td><?php echo htmlspecialchars($mission['mission_date']); ?></td>
+                                <td><button class="btn btn-sm btn-outline-secondary"><i data-feather="eye"></i> View</button></td>
+                            </tr>
+                        <?php endforeach; ?>
+                    <?php endif; ?>
                 </tbody>
             </table>
         </div>
@@ -89,6 +129,52 @@
         <p>&copy; <?php echo date("Y"); ?> AgroDrone Control. All Rights Reserved.</p>
     </footer>
 
+    <!-- Create Mission Modal -->
+    <div class="modal fade" id="createMissionModal" tabindex="-1" aria-labelledby="createMissionModalLabel" aria-hidden="true">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h5 class="modal-title" id="createMissionModalLabel">New Mission</h5>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+                    <form id="createMissionForm" method="POST" action="index.php">
+                        <div class="mb-3">
+                            <label for="name" class="form-label">Mission Name</label>
+                            <input type="text" class="form-control" id="name" name="name" required>
+                        </div>
+                        <div class="mb-3">
+                            <label for="drone" class="form-label">Drone</label>
+                            <select class="form-select" id="drone" name="drone" required>
+                                <option value="DJI Agras T30">DJI Agras T30</option>
+                                <option value="XAG P40">XAG P40</option>
+                                <option value="AG-Drone 01">AG-Drone 01</option>
+                                <option value="AG-Drone 02">AG-Drone 02</option>
+                                <option value="AG-Drone 03">AG-Drone 03</option>
+                            </select>
+                        </div>
+                        <div class="mb-3">
+                            <label for="status" class="form-label">Status</label>
+                            <select class="form-select" id="status" name="status" required>
+                                <option value="Scheduled">Scheduled</option>
+                                <option value="In Progress">In Progress</option>
+                                <option value="Completed">Completed</option>
+                            </select>
+                        </div>
+                        <div class="mb-3">
+                            <label for="mission_date" class="form-label">Date</label>
+                            <input type="date" class="form-control" id="mission_date" name="mission_date" required>
+                        </div>
+                    </form>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                    <button type="submit" form="createMissionForm" class="btn btn-primary">Save Mission</button>
+                </div>
+            </div>
+        </div>
+    </div>
+
     <!-- Bootstrap 5 JS -->
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
     <!-- Custom JS -->
@@ -99,4 +185,4 @@
     </script>
 
 </body>
-</html>
\ No newline at end of file
+</html>