[add] hide btn on submit

public/admin/css/custom-admin.css

@@ -1,5 +1,5 @@
 .sb{
-    background: #13a64f;
+    background: #326cbf;
     padding-bottom: 50px;
 }
 .sidebar-dark-primary .nav-sidebar>.nav-item>.nav-link.active{
@@ -28,7 +28,7 @@
     margin-top: 10px;
 }
 .main-header{
-    background: #13a64f;
+    background: #326cbf;
 }
 .nav-link i{
     color:#fff;
@@ -206,10 +206,7 @@ svg{
 .create-button{
     margin-top:10px;
 }
-.create-button .col-md-12{
+
-    /* display:flex;
-    justify-content:center; */
-}
 .create-button .col-md-12 button{
     padding:10px 50px;
 }
@@ -265,11 +262,6 @@ svg{
     background: none;
 
 }
-
-
-.table-search{
-    /* width: fit-content; */
-}
 .search-form .table-search input{
     /* margin-right: 10px; */
     border-radius: 5px!important;
@@ -277,7 +269,6 @@ svg{
 .ds-input:focus{
     border-color: #1850b7;
 }
-
 /* new edit */
 
 .table td{
@@ -320,9 +311,6 @@ svg{
     background: none;
     border:none;
     color:#fff;
-}
-.dropdown-menubar .dropdown-menu[data-bs-popper]{
-
 }
 .dropdown-menubar button:active{
     background-color: none;
@@ -362,13 +350,13 @@ svg{
 }
 .btn-green{
     color:#fff;
-    background: #13a64f;
+    background: #326cbf;
-    border-color:#13a64f;
+    border-color:#326cbf;
 }
 .btn-green:hover{
     color:#fff;
-    background: #ea8937;
+    background: #D933A2;
-    border-color:#ea8937;
+    border-color:#D933A2;
 }
 .card-header{
     padding: 1rem 1rem!important;
@@ -453,7 +441,7 @@ p .font-medium{
     font-weight: 700;
     font-size: 16px;
     color: #000;
-    width: 400px;
+    width: 300px;
 }
 .contact-info{
     display: inline-block;
@@ -485,3 +473,9 @@ p .font-medium{
     font-size: 1rem;
     padding: 0.6rem 1rem;
 }
+.contact-info h2{
+    font-weight: bold;
+    font-size: 28px;
+    color: #326CBF;
+    margin-bottom: 1rem;
+}

public/frontend/css/style.css

@@ -2000,6 +2000,9 @@ table.lightgrey-weekends tbody td:nth-child(n+6) {
 .displayBtn{
     display: block;
 }
+.displayEnqBtn{
+    display: inline-block;
+}
 /* Footer Css */
 /* mobile view css */
 @media only screen and (min-width: 320px) and (max-width: 480px) {

resources/views/admin/enquiry/show.blade.php

@@ -24,8 +24,10 @@
                     <div class="card-body">
                         @include('success.success')
                         @include('errors.error')
-                        <h2>Personal Details</h2>
+                        <div class="row">
+                            <div class="col-md-6">
                             <ul class="contact-info">
+                                <h2>Personal Details</h2>
                                 <li class="d-flex">
                                     <span>Full Name:</span>
                                     <span>{{$enquiry->first_name . ' ' .(!is_null($enquiry->middle_name) ? $enquiry->middle_name .' ' :''). $enquiry->last_name}}</span>
@@ -56,9 +58,6 @@
                                     <span>Country of Birth:</span>
                                     <span>{{$enquiry->cob}} </span>
                                 </li>
-                        </ul>
-                        <h2>Additional Details</h2>
-                        <ul class="contact-info">
                                 <li class="d-flex">
                                     <span>Highest Qualification:</span>
                                     <span>{{$enquiry->highest_qualification}}</span>
@@ -73,7 +72,11 @@
                                     <span>% or GPA:</span>
                                     <span>{{$enquiry->gpa}} </span>
                                 </li>
-
+                            </ul>
+                            </div>
+                            <div class="col-md-6">
+                                <ul class="contact-info">
+                                    <h2>Additional Details</h2>
                                     <li class="d-flex">
                                         <span>Graduate Year:</span>
                                         <span>{{$enquiry->graduate_year}}</span>
@@ -148,6 +151,8 @@
                                     </li>
 
                                 </ul>
+                            </div>
+                        </div>
 
             {!! Form::close() !!}
             </div>

resources/views/admin/index.blade.php

@@ -12,7 +12,7 @@
                     <div class="col-sm-6">
                         <ol class="breadcrumb float-sm-right">
                             <li class="breadcrumb-item"><a href="#">Home</a></li>
-                            <li class="breadcrumb-item active">Agility Homecare Dashboard</li>
+                            <li class="breadcrumb-item active">ET Education | Visas Dashboard</li>
                         </ol>
                     </div><!-- /.col -->
                 </div><!-- /.row -->

resources/views/admin/layouts/app.blade.php

@@ -6,6 +6,7 @@
     <meta name="csrf-token" content="{{ csrf_token() }}">
     <title>ET-Education | Admin Dashboard</title>
 
+    <link rel="icon" href="{{url('frontend/icons/favicon.ico')}}">
     <!-- Google Font: Source Sans Pro -->
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
     {!! Html::style('admin/plugins/fontawesome-free/css/all.min.css') !!}

resources/views/appointment.blade.php

@@ -81,15 +81,18 @@
                         <input type="hidden" name="appointment_id" id="appointment_id">
                         <div class="form-group mb-2">
                             <label for="name">Name</label>
-                            <input type="text" class="form-control mt-1" id="name" name="name" required>
+                            <input type="text" class="form-control mt-1" id="app-name" name="name" onkeyup="validateAppName()">
+                            <span class="error" id="app-name-error"></span>
                         </div>
                         <div class="form-group mb-2">
                             <label for="email">Email</label>
-                            <input type="email" class="form-control mt-1" id="email" name="email" required>
+                            <input type="email" class="form-control mt-1" id="app-email" name="email" onkeyup="validateAppEmail()">
+                            <span class="error" id="app-email-error"></span>
                         </div>
                         <div class="form-group mb-2">
                             <label for="phone">Phone</label>
-                            <input type="tel" class="form-control mt-1" id="phone" name="phone" required>
+                            <input type="tel" class="form-control mt-1" id="app-phone" name="phone" onkeyup="validateAppPhone()">
+                            <span class="error" id="app-phone-error"></span>
                         </div>
                         <div class="form-group mb-2">
                             <label for="notes">Notes</label>
@@ -99,7 +102,10 @@
                     </div>
                     <div class="modal-footer">
                         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
-                        <button type="button" onclick = "submitAppointment(event)" class="btn btn-primary">Book Appointment</button>
+                        <button type="button" onclick = "submitAppointment()" class="btn btn-primary" id="appointmentbtn">Book Appointment</button>
+                        <button class="buttonload btn btn-primary" id="buttonenqload" disabled>
+                            <i class="fas fa-spinner fa-pulse"></i> Submiting
+                        </button>
                     </div>
                 </div>
             </div>
@@ -241,8 +247,58 @@
 
     }
 
-    function submitAppointment(event){
+    appNameError = document.getElementById('app-name-error');
-        event.preventDefault();
+    appEmailError = document.getElementById('app-email-error');
+    appPhoneError = document.getElementById('app-phone-error');
+    loaderenqBtn = document.getElementById('buttonenqload');
+    appointmentBtn = document.getElementById('appointmentbtn');
+    function validateAppName(){
+        var appName = document.getElementById('app-name').value;
+        if(appName.length == 0){
+            $('#name-email').focus();
+            appNameError.innerHTML = "Name Field is required !";
+            return false;
+        }
+        appNameError.innerHTML = '';
+        return true;
+    }
+
+    function validateAppEmail(){
+        var appEmail = document.getElementById('app-email').value;
+        if(appEmail.length == 0){
+            $('#name-email').focus();
+            appEmailError.innerHTML = "Email Field is required !";
+            return false;
+        }
+        if(!appEmail.match(/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(.\w{2,3})+$/)){
+            appEmailError.innerHTML = "Invalid email address";
+            return false;
+        }
+        appEmailError.innerHTML = '';
+        return true;
+    }
+
+    function validateAppPhone(){
+        var appPhone = document.getElementById('app-phone').value;
+        if(appPhone.length == 0){
+            $('#app-phone').focus();
+            appPhoneError.innerHTML = "Phone Field is required !";
+            return false;
+        }
+        if(!appPhone.match(/^\d{10}$/)){
+            appPhoneError.innerHTML = "Invalid mobile number";
+            return false;
+        }
+        appPhoneError.innerHTML = '';
+        return true;
+    }
+
+    function submitAppointment(){
+        if(!validateAppName() || !validateAppEmail() || !validateAppPhone()){
+            return false;
+        }else{
+            loaderenqBtn.classList.add('displayBtn')
+            appointmentBtn.classList.add('buttonload')
             $.ajax({
                 url: "/appointment_submit",
                 type: "post",
@@ -252,6 +308,7 @@
                     // var isAmStart = response.appointment.start_time < '12:00:00';
                     // var isAmEnd = response.appointment.end_time < '12:00:00';
 
+                    loaderenqBtn.classList.remove('displayBtn');
                     Swal.fire({
                     title: 'Booked!!',
                     text: 'Appointment Successfully Booked for '+response.appointment_detail['name']+' at '+response.formated_date +'('+response.appointment['start_time']+' - ' + response.appointment['end_time']+' )',
@@ -262,7 +319,7 @@
                     )
                 }
             });
-
+        }
     }
 
 </script>

resources/views/enquiry-form.blade.php

@@ -256,7 +256,10 @@
                     </div>
                 </div>
                 <div class="col-md-12 text-center">
-                    <button type="submit" class="enquiry-from-btn">Submit</button>
+                    <button type="submit" class="enquiry-from-btn" id="enquirybtn">Submit</button>
+                    <button type="submit" class="enquiry-from-btn buttonload" id="enquirybutnload" disabled>
+                        <i class="fas fa-spinner fa-pulse"></i> Submiting
+                    </button>
                 </div>
             </div>
         </form>
@@ -533,6 +536,8 @@ if(php_var.length !== 0){
             return true;
         }
 
+        var enqloaderBtn = document.getElementById('enquirybutnload');
+        var enquirybtn = document.getElementById('enquirybtn');
         function submitEnquiry(){
             if(!validatefName() || !validatelName() || !validateDob() || !eCob() || !eGender() ||
             !validateAddress() || !validateEmail() || !validatePhone() || !validateQualification() ||
@@ -540,7 +545,8 @@ if(php_var.length !== 0){
             !wExperience() || !validateImmigrationHistory() || !validateStudyField()){
                 return false;
             }else{
-
+                enqloaderBtn.classList.add('displayEnqBtn');
+                enquirybtn.classList.add('buttonload')
             }
         }
     </script>