mapper ok

resources/views/livewire/confirm-mapping.blade.php

@@ -2,22 +2,12 @@
     use Illuminate\Support\Carbon;
 
     $e = Carbon::parse($event->starttime);
+
     $m = Carbon::parse($mapper->starttime);
 
-    $seconds = $e->diffInSeconds($m);
-
-    $diff = gmdate('H:i:s', $seconds);
-
-    if ($seconds == 0) {
-        $color = 1;
-    } elseif ($seconds < 1800) {
-        $color = 2;
-    } elseif ($seconds < 7200) {
-        $color = 3;
-    } else {
-        $color = 4;
-    }
+    $seconds = $m->diffInSeconds($e);
 
+    $text = $m->diffForHumans($e, ['parts' => 4], true);
 @endphp
 
 <div>
@@ -26,23 +16,15 @@
         <div>Startime Difference</div>
         <div></div>
         <div class="bg-gray-100 p-1 border rounded-lg">{{ $e->format('d-m-y H:i') }}</div>
-        @switch($color)
-            @case(1)
-                <div class="bg-green-100 text-green-500 p-1 border rounded-lg">{{ $diff }}</div>
-            @break
-
-            @case(2)
-                <div class="bg-blue-100 text-blue-500 p-1 border rounded-lg">{{ $diff }}</div>
-            @break
-
-            @case(3)
-                <div class="bg-amber-100 text-amber-500 p-1 border rounded-lg">{{ $diff }}</div>
-            @break
-
-            @case(4)
-                <div class="bg-red-100 text-red-500 p-1 border rounded-lg">{{ $diff }}</div>
-            @break
-        @endswitch
+        @if ($seconds == 0)
+            <div class="bg-green-100 text-green-500 p-1 border rounded-lg">Starttime is matching</div>
+        @elseif ($seconds < 1800 && $seconds > -1800)
+            <div class="bg-blue-100 text-blue-500 p-1 border rounded-lg">{{ $text }}</div>
+        @elseif ($seconds < 7200 && $seconds > -7200)
+            <div class="bg-amber-100 text-amber-500 p-1 border rounded-lg">{{ $text }}</div>
+        @else
+            <div class="bg-red-100 text-red-500 p-1 border rounded-lg">{{ $text }}</div>
+        @endif
         <div class="bg-gray-100 p-1 border rounded-lg">{{ $m->format('d-m-y H:i') }}</div>
         <div class="col-span-3 flex justify-center gap-2 mt-6">
             <div>