Add Todos, SweetAlert and Axios

Controller/api.php

@@ -0,0 +1,78 @@
+<?php
+
+if (route(1) == 'addtodo') {
+    $post = filter($_POST);
+    $start_date = date('Y-m-d H:i:s');
+    $end_date = date('Y-m-d H:i:s');
+
+    if (!$post['title']) {
+
+        $status = 'error';
+        $title = 'Ops! Error!';
+        $msg = 'Please enter a title.';
+        echo json_encode(['status' => $status, 'title' => $title, 'msg' => $msg]);
+        exit();
+
+    }
+
+    if (!$post['description']) {
+
+        $status = 'error';
+        $title = 'Ops! Error!';
+        $msg = 'Please enter a description.';
+        echo json_encode(['status' => $status, 'title' => $title, 'msg' => $msg]);
+        exit();
+
+    }
+
+    if ($post['start_date_time'] && $post['start_date']) {
+        $start_date = $post['start_date'] . ' ' . $post['start_date_time'];
+    }
+
+    if ($post['end_date_time'] && $post['end_date']) {
+        $end_date = $post['end_date'] . ' ' . $post['end_date_time'];
+    }
+
+    if ($post['category_id']){
+        $user_id = get_session('user_id');
+        $category_id = $post['category_id'];
+        // We need to check if the category exists and belongs to the user.
+        // Variables are filtered so we can use them directly in the query.
+        $q = $db -> query("SELECT category_id FROM categories WHERE user_id = '$user_id' AND category_id = '$category_id'");
+        $get = $q -> fetch(PDO::FETCH_ASSOC);
+        if (!$get) {
+            $status = 'error';
+            $title = 'Ops! Error!';
+            $msg = 'The category does not exist or does not belong to you.';
+            echo json_encode(['status' => $status, 'title' => $title, 'msg' => $msg]);
+            exit();
+        }
+    }
+
+
+    $q = $db -> prepare("INSERT INTO todos SET todo_title = ?, todo_description = ?, todo_color = ?, todo_start_date = ?, todo_end_date = ?, category_id = ?, user_id = ?");
+    $insert = $q -> execute([
+        $post['title'],
+        $post['description'],
+        $post['color'] ?? '#007bff',
+        $start_date,
+        $end_date,
+        $post['category_id'] ?? 0,
+        get_session('user_id')
+    ]);
+
+    if ($insert) {
+        $status = 'success';
+        $title = 'Success!';
+        $msg = 'The todo has been added successfully.';
+        echo json_encode(['status' => $status, 'title' => $title, 'msg' => $msg, 'redirect' => url('todo/list')]);
+        exit();
+    } else {
+        $status = 'error';
+        $title = 'Ops! Error!';
+        $msg = 'An error occurred while adding the todo.';
+        echo json_encode(['status' => $status, 'title' => $title, 'msg' => $msg]);
+        exit();
+    }
+
+}

Controller/todo.php

@@ -0,0 +1,92 @@
+<?php
+
+if(!get_session('login') || get_session('login') != true) {
+    redirect('login');
+}
+
+if (route(0) == 'categories' && !route(1)) {
+    /*
+    if (isset($_POST['submit'])) {
+
+        $_SESSION['post'] = $_POST;
+
+        $email = post('email');
+        $password = post('password');
+
+
+        $return = model('auth/login', [
+            'email' => $email,
+            'password' => $password
+        ], 'login');
+
+        if($return['success'] == true) {
+            add_session('error', [
+                'type' => $return['type'] ?? '',
+                'message' => $return['message'] ?? ''
+            ]);
+            if (isset($return['redirect'])) {
+                redirect($return['redirect']);
+            }
+        } else {
+            add_session('error', [
+                'type' => $return['type'] ?? '',
+                'message' => $return['message'] ?? ''
+            ]);
+        }
+    } 
+    */
+
+    view('categories/home');
+
+} elseif (route(0) == 'todo' && route(1) == 'add') {
+
+    $return = model('categories', [], 'list');
+
+    view('todo/add', $return['data']);
+
+} elseif (route(0) == 'categories' && route(1) == 'list') {
+
+    $return = model('categories', [], 'list');
+
+    view('categories/list', $return['data']);
+
+} elseif (route(0) == 'categories' && route(1) == 'edit' && is_numeric(route(2))) {
+
+    if (isset($_POST['submit'])) {
+
+        $_SESSION['post'] = $_POST;
+
+        $category_title = post('category_title');
+        $category_id = post('category_id');
+
+        $return = model('categories', [
+            'category_title' => $category_title,
+            'category_id' => $category_id
+        ], 'edit');
+
+        if($return['success'] == true) {
+            add_session('error', [
+                'type' => $return['type'] ?? '',
+                'message' => $return['message'] ?? ''
+            ]);
+            if (isset($return['redirect'])) {
+                redirect($return['redirect']);
+            }
+        } else {
+            add_session('error', [
+                'type' => $return['type'] ?? '',
+                'message' => $return['message'] ?? ''
+            ]);
+        }
+    }
+
+    $return = model('categories', ['category_id' => route(2)], 'getsingle');
+
+    view('categories/edit', $return['data']);
+
+} elseif (route(0) == 'categories' && route(1) == 'remove' && is_numeric(route(2))) {
+
+    $return = model('categories', ['category_id' => route(2)], 'remove');
+
+    redirect('categories/list/?type='. $return['type'].'&message='.$return['message']);
+}

View/todo/add.php

@@ -0,0 +1,158 @@
+<?php view('static/header'); ?>
+
+<div class="wrapper">
+
+  <!-- Navbar -->
+  <nav class="main-header navbar navbar-expand navbar-white navbar-light">
+
+    <!-- Right navbar links -->
+    <ul class="navbar-nav ml-auto">
+      <!-- Navbar Search -->
+      <li class="nav-item d-none d-sm-inline-block">
+        <a href="<?= URL . 'logout'; ?>" class="nav-link">Logout</a>
+      </li>
+
+    </ul>
+  </nav>
+  <!-- /.navbar -->
+
+  <!-- Main Sidebar Container -->
+  <?php view('static/sidebar'); ?>
+
+  <!-- Content Wrapper. Contains page content -->
+  <div class="content-wrapper p-5">
+    <!-- Main content -->
+    <div class="content">
+      <div class="container-fluid">
+        <div class="row">
+          <div class="col-lg-12">
+            <div class="card card-primary">
+              <div class="card-header">
+                <h3 class="card-title">Add ToDo</h3>
+              </div>
+              <!-- /.card-header -->
+              <!-- form start -->
+
+              <?php
+              echo get_session('error') ? '<div class="alert alert-' . $_SESSION['error']['type'] . '">' . $_SESSION['error']['message'] . '</div>' : null;
+              ?>
+
+              <form id="todo" action="" method="POST">
+
+                <div class="card-body">
+                  <div class="form-group">
+                    <label for="category_id">Categories</label>
+                    <select class="form-control" id="category_id" name="category_id">
+                      <option value="0">Select Category</option>
+                      <?php foreach ($data as $category): ?>
+                        <option value="<?= $category['category_id']; ?>"><?= $category['category_title']; ?></option>
+                      <?php endforeach; ?>
+                    </select>
+                  </div>
+                  <div class="form-group">
+                    <label for="title">Title</label>
+                    <input type="text" class="form-control" id="title" name="todo_title" placeholder="Enter ToDo title">
+                  </div>
+                  <div class="form-group">
+                    <label for="description">Description</label>
+                    <input type="text" class="form-control" id="description" name="todo_description" placeholder="Enter ToDo title">
+                  </div>
+                  <div class="form-group">
+                    <label for="color">Color</label>
+                    <input type="color" class="form-control" id="color" name="todo_color" value="#007bff">
+                  </div>
+                  <div class="form-group">
+                    <label for="start_date">Start Date</label>
+                    <div class="row">
+                      <input type="date" class="form-control col-8" id="start_date" name="todo_start_date">
+                      <input type="time" class="form-control col-4" id="start_date_time" name="todo_start_date_time">
+                    </div>
+
+                  </div>
+                  <div class="form-group">
+                    <label for="end_date">End Date</label>
+                    <div class="row">
+                      <input type="date" class="form-control col-8" id="end_date" name="todo_end_date">
+                      <input type="time" class="form-control col-4" id="end_date_time" name="todo_end_date_time">
+                    </div>
+                  </div>
+                </div>
+                <!-- /.card-body -->
+
+                <div class="card-footer">
+                  <button type="submit" name="submit" value="1" class="btn btn-primary">Submit</button>
+                </div>
+
+              </form>
+            </div>
+          </div>
+
+        </div>
+        <!-- /.row -->
+      </div><!-- /.container-fluid -->
+    </div>
+    <!-- /.content -->
+  </div>
+  <!-- /.content-wrapper -->
+
+
+  <?php view('static/footer'); ?>
+
+</div>
+<!-- ./wrapper -->
+<!-- REQUIRED SCRIPTS -->
+
+<!-- jQuery -->
+<script src="<?= assets('plugins/jquery/jquery.min.js'); ?>"></script>
+<!-- Bootstrap 4 -->
+<script src="<?= assets('plugins/bootstrap/js/bootstrap.bundle.min.js'); ?>"></script>
+<!-- Sweetalert -->
+<script src="<?= assets('plugins/sweetalert2/sweetalert2.all.min.js'); ?>"></script>
+<!-- AdminLTE App -->
+<script src="<?= assets('js/adminlte.min.js'); ?>"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.7.2/axios.min.js" integrity="sha512-JSCFHhKDilTRRXe9ak/FJ28dcpOJxzQaCd3Xg8MyF6XFjODhy/YMCM8HW0TFDckNHWUewW+kfvhin43hKtJxAw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script>
+  const todo = document.getElementById('todo');
+
+  todo.addEventListener('submit', (e) => {
+
+    let title = document.getElementById('title').value;
+    let description = document.getElementById('description').value;
+    let color = document.getElementById('color').value;
+    let start_date = document.getElementById('start_date').value;
+    let start_date_time = document.getElementById('start_date_time').value;
+    let end_date = document.getElementById('end_date').value;
+    let end_date_time = document.getElementById('end_date_time').value;
+    let category_id = document.getElementById('category_id').value;
+
+    let formData = new FormData();
+    formData.append('title', title);
+    formData.append('description', description);
+    formData.append('color', color);
+    formData.append('start_date', start_date);
+    formData.append('start_date_time', start_date_time);
+    formData.append('end_date', end_date);
+    formData.append('end_date_time', end_date_time);
+    formData.append('category_id', category_id);
+
+    axios.post('<?= url('api/addtodo'); ?>', formData).then(res => {
+
+      if (res.data.redirect) {
+        window.location.href = res.data.redirect;
+      } else {
+          Swal.fire(
+          res.data.title,
+          res.data.msg,
+          res.data.status
+        )
+      }
+
+    }).catch(err => console.log(err));
+
+    e.preventDefault();
+
+  })
+</script>
+</body>
+
+</html>