Lernfortschritt hinzugefügt

src/_ide_helper_models.php

@@ -23,6 +23,7 @@
  * @property \Illuminate\Support\Carbon|null $updated_at
  * @property-read \App\Models\Task $task
  * @property-read \App\Models\User $user
+ * @method static \Illuminate\Database\Eloquent\Builder|AnsweredTasks currentUser()
  * @method static \Illuminate\Database\Eloquent\Builder|AnsweredTasks newModelQuery()
  * @method static \Illuminate\Database\Eloquent\Builder|AnsweredTasks newQuery()
  * @method static \Illuminate\Database\Eloquent\Builder|AnsweredTasks query()
@@ -45,6 +46,8 @@ class AnsweredTasks extends \Eloquent {}
  * @property string $name
  * @property \Illuminate\Support\Carbon|null $created_at
  * @property \Illuminate\Support\Carbon|null $updated_at
+ * @property-read \Illuminate\Database\Eloquent\Collection|\App\Models\AnsweredTasks[] $answeredTasks
+ * @property-read int|null $answered_tasks_count
  * @property-read \Illuminate\Database\Eloquent\Collection|\App\Models\Task[] $tasks
  * @property-read int|null $tasks_count
  * @method static \Illuminate\Database\Eloquent\Builder|License newModelQuery()

src/app/Http/Controllers/ShowLicenseController.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Models\License;
+use Carbon\CarbonPeriod;
+use DB;
+use Illuminate\Http\Request;
+
+class ShowLicenseController extends Controller
+{
+    /**
+     * Handle the incoming request.
+     *
+     * @param  \Illuminate\Http\Request  $request
+     * @return \Illuminate\Http\Response
+     */
+    public function __invoke(License $license)
+    {
+        $answered = $license->answeredTasks()->currentUser()->count();
+        $answeredCorrectly = $license->answeredTasks()->currentUser()->where('answered_correctly', true)->count();
+
+        return view('license', [
+            'license' => $license,
+            'stats' => [
+                'total' => $license->tasks()->count(),
+                'answered' => $answered,
+                'answered_correctly' => $answeredCorrectly,
+            ]
+        ]);
+    }
+}

src/app/Http/Livewire/LicenseHistory.php

@@ -0,0 +1,38 @@
+<?php
+
+namespace App\Http\Livewire;
+
+use App\Models\License;
+use DB;
+use Livewire\Component;
+use Livewire\WithPagination;
+
+class LicenseHistory extends Component
+{
+    use WithPagination;
+    public License $license;
+    public function mount(){
+        // $this->data = DB::table('answered_tasks')
+        // ->selectRaw('DATE(answered_at) as date, count(*) as total, sum(answered_correctly) as correct, (count(*)-sum(answered_correctly)) as wrong')
+        // ->join('tasks', 'tasks.id', 'answered_tasks.task_id')
+        // ->where('license_id', $this->license->id)
+        // ->where('user_id', auth()->user()->id)
+        // ->orderBy('date')
+        // ->groupBy('date')
+        // ->paginate(10);
+    }
+    public function render()
+    {
+
+        return view('livewire.license-history', [
+            'data' => DB::table('answered_tasks')
+            ->selectRaw('DATE(answered_at) as date, count(*) as total, sum(answered_correctly) as correct, (count(*)-sum(answered_correctly)) as wrong')
+            ->join('tasks', 'tasks.id', 'answered_tasks.task_id')
+            ->where('license_id', $this->license->id)
+            ->where('user_id', auth()->user()->id)
+            ->orderByDesc('date')
+            ->groupBy('date')
+            ->paginate(10)
+        ]);
+    }
+}

src/app/Http/Livewire/Question.php

@@ -25,8 +25,9 @@ public function mount()
     {
         // $this->task = $this->getTask();
         $this->selected = 0;
-        $this->task = Task::find(23);
-        $this->assignTaskMisc();
+        $this->locked = false;
+        $this->assignTask();
+        $this->emit("scrollToQuestion");
     }
 
     public function answer(){
@@ -46,8 +47,7 @@ public function answer(){
     public function next(){
         $this->showSolution = 0;
         $this->selected = 0;
-        $this->task = $this->getTask();
-        $this->assignTaskMisc();
+        $this->assignTask();
         $this->emit("scrollToQuestion");
         $this->locked = false;
     }
@@ -57,7 +57,8 @@ public function render()
         return view('livewire.question');
     }
 
-    private function assignTaskMisc(): void{
+    private function assignTask(): void{
+        $this->task = $this->getTask();
         $this->responses = $this->task->responses->shuffle();
         $this->media = $this->task->getMedia();
     }

src/composer.json

@@ -10,6 +10,7 @@
     "require": {
         "php": "^7.3",
         "blade-ui-kit/blade-heroicons": "^0.2.2",
+        "davaxi/sparkline": "^1.2",
         "fideloper/proxy": "^4.2",
         "fruitcake/laravel-cors": "^2.0",
         "guzzlehttp/guzzle": "^7.0.1",

src/config/jetstream.php

@@ -30,7 +30,7 @@
 
     'features' => [
         Features::profilePhotos(),
-        Features::api(),
+        // Features::api(),
         // Features::teams(),
     ],
 

src/public/css/app.css

@@ -42097,6 +42097,10 @@ video {
           animation: bounce 1s infinite;
 }
 
+.animate-spin-reverse {
+  animation: spin 1s linear infinite reverse;
+}
+
 @media (min-width: 640px) {
   .sm\:container {
     width: 100%;
@@ -83297,6 +83301,10 @@ video {
     -webkit-animation: bounce 1s infinite;
             animation: bounce 1s infinite;
   }
+
+  .sm\:animate-spin-reverse {
+    animation: spin 1s linear infinite reverse;
+  }
 }
 
 @media (min-width: 768px) {
@@ -124499,6 +124507,10 @@ video {
     -webkit-animation: bounce 1s infinite;
             animation: bounce 1s infinite;
   }
+
+  .md\:animate-spin-reverse {
+    animation: spin 1s linear infinite reverse;
+  }
 }
 
 @media (min-width: 1024px) {
@@ -165701,6 +165713,10 @@ video {
     -webkit-animation: bounce 1s infinite;
             animation: bounce 1s infinite;
   }
+
+  .lg\:animate-spin-reverse {
+    animation: spin 1s linear infinite reverse;
+  }
 }
 
 @media (min-width: 1280px) {
@@ -206903,4 +206919,8 @@ video {
     -webkit-animation: bounce 1s infinite;
             animation: bounce 1s infinite;
   }
+
+  .xl\:animate-spin-reverse {
+    animation: spin 1s linear infinite reverse;
+  }
 }

src/resources/views/components/sparkline.blade.php

@@ -0,0 +1,66 @@
+@props(['data', 'id' => Str::uuid()])
+
+<canvas id="{{ $id }}" class="max-w-full max-h-full"></canvas>
+<script>
+    var el = document.getElementById('{{ $id }}')
+    var ctx = el.getContext("2d");
+    console.log(el.clientHeight)
+    gradient = ctx.createLinearGradient(0, 0, 0, el.clientHeight);
+    gradient.addColorStop(0, 'rgba(45, 55, 72, 1)');
+    gradient.addColorStop(1, 'rgba(255, 0, 0, 0)');
+    var myChart = new Chart(ctx, {
+        type: 'line',
+        data: {
+            datasets: [{
+                backgroundColor: gradient,
+                lineTension: 0.2,
+                data: [
+                    {
+                        x: "2020-01-01",
+                        y: 1
+                    },
+                    {
+                        t: "2020-01-02",
+                        y: 10
+                    },
+                    {
+                        t: "2020-01-03",
+                        y: 5
+                    },
+                    {
+                        t: "2020-01-15",
+                        y: 12
+                    },
+                    {
+                        t: "2020-01-20",
+                        y: 25
+                    },
+                    {
+                        t: "2020-01-31",
+                        y: 4
+                    },
+                ]
+            }]
+        },
+        options: {
+            legend: {
+                display: false
+            },
+            scales: {
+                xAxes: [{
+                    display: false,
+                    type: 'time'
+                }],
+                yAxes: [{
+                    display: false,
+                }]
+            },
+            elements: {
+                point: {
+                    radius: 0
+                }
+            }
+        }
+    });
+
+</script>

src/resources/views/dashboard.blade.php

@@ -1,25 +1,32 @@
 <x-app-layout>
-    <x-slot name="header">
-        <h2 class="text-xl font-semibold leading-tight text-gray-800">
-            Dashboard
-        </h2>
-    </x-slot>
-
     <div class="py-6">
         <div class="max-w-xl px-4 mx-auto space-y-4 sm:px-6 lg:px-8">
-                <h1 class="text-4xl font-semibold tracking-wide">Hallo, {{ auth()->user()->name }}</h1>
-                <div class="w-full h-64 p-4 bg-white rounded-md">
-                    <h2 class="text-xl font-semibold">Deine Statistik</h2>
-                </div>
-                @foreach ($licenses as $license)
-                <div>
-                    <a href="{{ route('task', ['license' => $license]) }}">
-                        <div class="items-center w-full px-4 py-2 text-xl font-semibold tracking-wide text-white transition duration-150 ease-in-out bg-gray-800 border border-transparent rounded-md hover:bg-gray-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:shadow-outline-gray disabled:opacity-25">
+            <h1 class="text-4xl font-semibold tracking-wide">Hallo, {{ auth()->user()->name }}</h1>
+            <div class="w-full h-64 p-4 bg-white rounded-md">
+                <h2 class="text-xl font-semibold">Deine Statistik</h2>
+            </div>
+            @foreach ($licenses as $license)
+            <div>
+
+                <div
+                    class="w-full px-4 py-2 space-y-4 tracking-wide text-white transition duration-150 ease-in-out bg-gray-800 border border-transparent rounded-md disabled:opacity-25">
+                    <div class="flex flex-col justify-between w-full space-y-4 sm:items-center sm:flex-row">
+
+                        <div class="text-xl font-semibold">
                             {{ $license->name }}
                         </div>
-                    </a>
+                        <div class="flex w-full sm:w-1/3">
+
+                            <a href="{{ route('task', ['license' => $license]) }}"
+                                class="flex flex-row items-center justify-between w-full px-6 py-3 text-xs font-semibold tracking-widest text-gray-800 uppercase transition duration-150 ease-in-out bg-white border border-transparent rounded-md hover:bg-gray-200 disabled:opacity-25">
+                                <span>Fragen üben</span>
+                                <x-heroicon-s-chevron-right class="w-5 h-5 -m-4" />
+                            </a>
+                        </div>
+                    </div>
                 </div>
-                @endforeach
+            </div>
+            @endforeach
         </div>
     </div>
 </x-app-layout>