all api and ui to create permits reminder

app/Http/Controllers/PermitsReminder/CreatePermitsReminderController.php

@@ -0,0 +1,59 @@
+<?php
+
+namespace App\Http\Controllers\PermitsReminder;
+
+use App\Classes\Exceptions\RequestValidationException;
+use App\Models\PermitsReminder;
+use Carbon\Carbon;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Validator;
+
+class CreatePermitsReminderController
+{
+    /**
+     * @param Request $request
+     * @return JsonResponse
+     */
+    public function create(Request $request): JsonResponse
+    {
+        // Define validation rules
+        $rules = [
+            'model' => 'required',
+            'expiry_date' => 'required|date|after_or_equal:today',
+            'reminder_date' => 'required|date|after_or_equal:today',
+        ];
+
+        // Perform validation
+        $validator = Validator::make($request->all(), $rules);
+
+        if ($validator->fails()) {
+            $validationErrors = $validator->errors()->all();
+            $validationError = implode("<br>", $validationErrors);
+
+            // Return validation error response
+            return response()->json([
+                'title' => 'Create Permits Reminder Failed',
+                'message' => $validationError,
+                "payload" => []
+            ], 422); // 422 Unprocessable Entity status code for validation errors
+        }
+
+        // If validation passes, create the record
+        $record = PermitsReminder::create([
+            'expiry_date' => Carbon::parse($request->input('expiry_date'))->format('Y-m-d'),
+            'reminder_date' => Carbon::parse($request->input('reminder_date'))->format('Y-m-d'),
+            'model' => $request->input('model'),
+        ]);
+
+        $response = [
+            "title" => "Create Permits Reminder Successful",
+            "message" => "You have successfully created a Permits Reminder",
+            "payload" => [
+                "data" => $record
+            ]
+        ];
+
+        return response()->json($response);
+    }
+}

app/Http/Controllers/PermitsReminder/ListPermitsReminderController.php

@@ -18,7 +18,7 @@ class ListPermitsReminderController
         $page = request('page', 1); // Get the current page from the request
 
         // Paginate the PermitsReminder model
-        $query = PermitsReminder::query();
+        $query = PermitsReminder::orderBy('id', 'desc');
         $paginator = $query->paginate($perPage, ['*'], 'page', $page);
 
         // Convert paginated data to an array

resources/assets/vue/components/settings/elements/PermitsReminderComponent.vue

@@ -1,10 +1,24 @@
 <template>
-    <div class="row">
+    <div class="row parentContainer">
         <div class="col">
-
             <div class="row" v-if="!returnData">
                 <div class="col">
-                    <div class="row m-b-50">
+                    <div class="row m-b-20">
+                        <div class="col">
+                            <div class="btn btn-sm btn-primary rounded b-rad-none"
+                                @click="isUploadingCsv = !isUploadingCsv">{{ isUploadingCsv ? "Cancel" : "Upload Excel" }}
+                            </div>
+                            <div class="btn btn-sm btn-primary rounded b-rad-none requestModal"
+                                data-type="addPermitsReminder"><i class="fa fa-plus m-r-5"></i>Add
+                                Permits</div>
+                            <modal-component class="animate__animated animate__fast animate__fadeIn"
+                                type="addPermitsReminder">
+                                <add-permits-reminder-form-component
+                                    :section="section"></add-permits-reminder-form-component>
+                            </modal-component>
+                        </div>
+                    </div>
+                    <div class="row m-b-50" v-if="isUploadingCsv">
                         <div class="col-12 col-md-6">
                             <div class="row bg-white">
                                 <div class="col">
@@ -30,9 +44,8 @@
                             </div>
                         </div>
                     </div>
-
+                    <div v-else>
                         <div class="font-heading fs-16 all-caps bold m-b-15">Permits Reminder</div>
-
                         <list-component :key="key" :section="section" :endpoint="route('api.permits_reminder.list')">
                             <template slot="list" slot-scope="{data}">
                                 <permits-reminder-item-component :data="data"
@@ -41,7 +54,7 @@
                         </list-component>
                     </div>
                 </div>
-
+            </div>
             <div v-if="returnData">
                 <div class="font-heading fs-16 all-caps bold m-b-15">Upload Summary</div>
                 <div class="font-heading fs-12 all-caps bold">Total Completed Rows: {{ returnData.completedRows }}</div>
@@ -60,9 +73,9 @@
                         </tr>
                     </table>
                 </div>
-                <div class="fs-12 font-arial m-b-0 pointer bold m-t-20 text-primary" @click="refreshData()">Click here to refresh</div>
+                <div class="fs-12 font-arial m-b-0 pointer bold m-t-20 text-primary" @click="refreshData()">Click here to
+                    refresh</div>
             </div>
-
         </div>
     </div>
 </template>
@@ -78,6 +91,7 @@ export default {
             returnData: null,
             data: null,
             key: 1,
+            isUploadingCsv: false,
         }
     },
     computed: {

resources/assets/vue/components/settings/forms/AddPermitsReminderFormComponent.vue

@@ -0,0 +1,95 @@
+<template>
+    <div class="row" style="width: 450px; margin: auto;" @keyup.enter="submitForm">
+        <div class="col bg-white b-rad-lg">
+            <div class="row m-b-15">
+                <div class="col">
+                    <h6 class="all-caps m-b-5 bold no-margin">Add PERMITS REMINDER</h6>
+                </div>
+            </div>
+            <div class="row m-b-15 animate__animated animate__fadeInUpBig animate__fast" v-if="error">
+                <div class="col">
+                    <small class="bold fs-10 text-danger" v-html="error"></small>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col">
+                    <validation-wrapper-component class="m-b-15" :validator="$v.parameters.model">
+                        <label class="text-primary">Model</label>
+                        <div class="controls">
+                            <input type="text" class="form-control fs-12" v-model.trim="parameters.model">
+                        </div>
+                    </validation-wrapper-component>
+                    <div class="row m-auto mt-10 mb-10">
+                        <div class="col p-l-0 p-r-10">
+                            <validation-wrapper-component class="m-b-15" :validator="$v.parameters.expiry_date">
+                                <label class="text-primary">Expiry Date</label>
+                                <date-picker-component v-model="parameters.expiry_date"></date-picker-component>
+                            </validation-wrapper-component>
+                        </div>
+                    </div>
+                    <div class="row m-auto mt-10 mb-10">
+                        <div class="col p-l-0 p-r-10">
+                            <validation-wrapper-component class="m-b-15" :validator="$v.parameters.reminder_date">
+                                <label class="text-primary">Reminder Date</label>
+                                <date-picker-component v-model="parameters.reminder_date"></date-picker-component>
+                            </validation-wrapper-component>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="row m-t-15">
+                <div class="col p-r-5">
+                    <div class="btn btn-sm btn-default b-rad-none w-100" data-dismiss="modal">Cancel</div>
+                </div>
+                <div class="col p-l-5">
+                    <div class="btn btn-sm btn-primary w-100" @click="submitForm()">Confirm</div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+import FormHandler from '../../../general/mixins/formHandler';
+import { required } from "vuelidate/lib/validators";
+
+export default {
+    data() {
+        return {
+            parameters: {
+                expiry_date: '',
+                reminder_date: '',
+                model: ''
+            },
+        };
+    },
+    validations: {
+        parameters: {
+            expiry_date: { required },
+            reminder_date: { required },
+            model: { required },
+        }
+    },
+    methods: {
+        submitForm() {
+            this.submit(this.route('api.permits_reminder.create'), 'post', this.section, true, true)
+        },
+        errorHandler(error) {
+            this.formHandler(error.message);
+        },
+        successHandler() {
+            this.closeModal();
+
+            // Reset the validation state of the parameters object
+            this.$v.parameters.$reset();
+
+            this.parameters = {
+                expiry_date: '',
+                reminder_date: '',
+                model: ''
+            };
+        },
+    },
+    mixins: [FormHandler]
+}
+
+</script>

routes/permits_reminder.php

@@ -4,6 +4,7 @@ use Illuminate\Support\Facades\Route;
 
 Route::group(['prefix' => 'permits-reminder', 'as' => 'permits_reminder.', 'namespace' => 'PermitsReminder'], function () {
     Route::get('/list', 'ListPermitsReminderController@list')->name('list');
+    Route::post('/create', 'CreatePermitsReminderController@create')->name('create');
     Route::delete('/{id}/delete', 'DeletePermitsReminderController@delete')->name('delete');
 });