Use d.m.Y. instead of Y-m-dv1.0.1

3 files changed, 49 insertions, 5 deletions

diff --git a/app/Models/Reservation.php b/app/Models/Reservation.php
index 021f3d6..733571e 100644
--- a/app/Models/Reservation.php
+++ b/app/Models/Reservation.php
@@ -5,7 +5,36 @@ namespace App\Models;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 
+use Carbon\Carbon;
+
 class Reservation extends Model
 {
     use HasFactory;
+
+    public function getFromTimeAttribute() {
+        return Carbon::parse($this->attributes['fromTime'])->format('d.m.Y. H:i');
+    }
+
+    public function setFromTimeAttribute($value) {
+        $this->attributes['fromTime'] = Carbon::createFromFormat('d.m.Y. H:i', $value)->toDateTimeString();
+    }
+
+    public function getToTimeAttribute() {
+        return Carbon::parse($this->attributes['toTime'])->format('d.m.Y. H:i');
+    }
+
+    public function setToTimeAttribute($value) {
+        $this->attributes['toTime'] = Carbon::createFromFormat('d.m.Y. H:i', $value)->toDateTimeString();
+    }
+
+    // I am quite sure this not working is a bug.
+    //protected function serializeDate(\DateTimeInterface $date)
+    //{
+        //return $date->format('d.m.Y. H:i');
+    //}
+
+    protected $casts = [
+      'fromTime' => 'datetime:d.m.Y. H:i',
+      'toTime' => 'datetime:d.m.Y. H:i',
+    ];
 }
diff --git a/public/js/activities.js b/public/js/activities.js
index 4d46374..eacf4d3 100644
--- a/public/js/activities.js
+++ b/public/js/activities.js
@@ -9,7 +9,7 @@ jQuery(document).ready(fillTable);
 
 function fillTable() {
   tableData = jQuery('table#ajax-table>tbody').first();
-  tableData.html('<tr><td class="font-weight-bold text-center" colspan="6">Loading...</td></tr>');
+  tableData.html('<tr><td class="font-weight-bold text-center" colspan="7">Loading...</td></tr>');
 
   sign = jQuery('select#call-sign').first().val();
 
diff --git a/resources/views/pages/reserve.blade.php b/resources/views/pages/reserve.blade.php
index fc7f16f..823e8b9 100644
--- a/resources/views/pages/reserve.blade.php
+++ b/resources/views/pages/reserve.blade.php
@@ -42,7 +42,7 @@
   <!-- START TIME -->
 <div class="form-group">
   <label for="start-date">Start date:</label>
-  <input class="form-control @error('sdate') is-invalid @enderror" type="date" id="start-date" name="sdate" value="{{ old('sdate') }}" required>
+  <input class="jquery-date form-control @error('sdate') is-invalid @enderror" type="text" placeholder="DD.MM.YYYY." id="start-date" name="sdate" value="{{ old('sdate') }}" required>
   @error('sdate')
     <div class="alert alert-danger mt-2">{{ $message }}</div>
   @enderror
@@ -50,7 +50,7 @@
 
 <div class="form-group">
   <label for="start-time">Start time:</label>
-  <input class="form-control @error('stime') is-invalid @enderror" type="time" id="start-time" name="stime" value="{{ old('stime') }}" required>
+  <input class="jquery-time form-control @error('stime') is-invalid @enderror" type="text" placeholder="HH:MM" id="start-time" name="stime" value="{{ old('stime') }}" required>
   @error('stime')
     <div class="alert alert-danger mt-2">{{ $message }}</div>
   @enderror
@@ -59,7 +59,7 @@
   <!-- END TIME -->
 <div class="form-group">
   <label for="end-date">End date:</label>
-  <input class="form-control @error('edate') is-invalid @enderror" type="date" id="end-date" name="edate" value="{{ old('edate') }}" required>
+  <input class="jquery-date form-control @error('edate') is-invalid @enderror" type="text" placeholder="DD.MM.YYYY." id="end-date" name="edate" value="{{ old('edate') }}" required>
   @error('edate')
     <div class="alert alert-danger mt-2">{{ $message }}</div>
   @enderror
@@ -67,7 +67,7 @@
 
 <div class="form-group">
   <label for="end-time">End time:</label>
-  <input class="form-control @error('etime') is-invalid @enderror" type="time" id="end-time" name="etime" value="{{ old('etime') }}" required>
+  <input class="jquery-time form-control @error('etime') is-invalid @enderror" type="text" placeholder="HH:MM" id="end-time" name="etime" value="{{ old('etime') }}" required>
   @error('etime')
     <div class="alert alert-danger mt-2">{{ $message }}</div>
   @enderror
@@ -147,6 +147,21 @@
 </form>
 @endsection()
 
+@section('styles')
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.min.css" integrity="sha512-f0tzWhCwVFS3WeYaofoLWkTP62ObhewQ1EZn65oSYDZUg1+CyywGKkWzm8BxaJj5HGKI72PnMH9jYyIFz+GH7g==" crossorigin="anonymous" />
+@endsection
+
 @section('scripts')
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js" integrity="sha512-AIOTidJAcHBH2G/oZv9viEGXRqDNmfdPVPYOYKGy3fti0xIplnlgMHUGfuNRzC6FkzIo0iIxgFnr9RikFxK+sw==" crossorigin="anonymous"></script>
+  <script>
+    jQuery('.jquery-date').datetimepicker({
+      timepicker: false,
+      format: 'd.m.Y.'
+    });
+    jQuery('.jquery-time').datetimepicker({
+      datepicker: false,
+      format: 'H:i'
+    });
+  </script>
   <script src="{{ asset('js/reserve.js') }}"></script>
 @endsection