update car view

app/Http/Controllers/CarController.php

@@ -169,9 +169,11 @@ class CarController extends Controller
                     ->orderBy('date', 'desc')
                     ->paginate(10)
                     ->through(fn ($contract) => [
+                        'id' => $contract->id,
                         'date' => $contract->date,
                         'price' => $contract->price,
-                        'seller' => $contract->contact->name,
+                        'contact' => $contract->contact,
+                        'type' => 'Ankaufsvertrag',
                         'link' => route('contacts.edit', $contract->contact->id),
                     ]),
                 'sell_contracts' => $car->sellContracts()
@@ -179,9 +181,11 @@ class CarController extends Controller
                     ->orderBy('date', 'desc')
                     ->paginate(10)
                     ->through(fn ($contract) => [
+                        'id' => $contract->id,
                         'date' => $contract->date,
                         'price' => $contract->price,
-                        'buyer' => $contract->contact->name,
+                        'contact' => $contract->contact,
+                        'type' => 'Verkaufsvertrag',
                         'link' => route('contacts.edit', $contract->contact->id),
                         'insurance_type' => InsuranceType::fromValue((int)$contract->insurance_type)->key,
                     ]),
@@ -212,27 +216,6 @@ class CarController extends Controller
                 'known_damage' => $car->known_damage,
                 'notes' => $car->notes,
                 'deleted_at' => $car->deleted_at,
-                'buy_contracts' => $car->buyContracts()
-                    ->with('contact')
-                    ->orderBy('date', 'desc')
-                    ->paginate(10)
-                    ->through(fn ($contract) => [
-                        'date' => $contract->date,
-                        'price' => $contract->price,
-                        'seller' => $contract->contact->name,
-                        'link' => route('contacts.edit', $contract->contact->id),
-                    ]),
-                'sell_contracts' => $car->sellContracts()
-                    ->with('contact')
-                    ->orderBy('date', 'desc')
-                    ->paginate(10)
-                    ->through(fn ($contract) => [
-                        'date' => $contract->date,
-                        'price' => $contract->price,
-                        'buyer' => $contract->contact->name,
-                        'link' => route('contacts.edit', $contract->contact->id),
-                        'insurance_type' => InsuranceType::fromValue((int)$contract->insurance_type)->key,
-                    ]),
             ],
             'brands' => Brand::all()->map(function ($brand) {
                 return [
@@ -285,13 +268,12 @@ class CarController extends Controller
     public function destroy(Car $car)
     {
         $car->delete();
-        return Redirect::back()->with('success', 'Auto gelöscht.');
+        return Redirect::route('cars.show', $car)->with('success', 'Auto gelöscht.');
     }
 
     public function restore(Car $car)
     {
         $car->restore();
-
         return Redirect::back()->with('success', 'Auto wiederhergestellt.');
     }
 }

resources/js/Components/BuyContractCard.vue

@@ -0,0 +1,24 @@
+<template>
+    <contract-card :contract="contract" :meta="meta" />
+</template>
+
+<script>
+import ContractCard from '@/Components/ContractCard.vue'
+
+export default {
+    components: {
+        ContractCard,
+    },
+    props: {
+        contract: Object,
+    },
+    data() {
+        return {
+            meta: {
+                'title': 'Ankaufsvertrag',
+                'contact': 'Verkäufer',
+            },
+        }
+    },
+}
+</script>

resources/js/Components/ContractCard.vue

@@ -0,0 +1,73 @@
+<template>
+    <div class="py-6 grid grid-cols-12 gap-12 max-w-7xl">
+        <div v-if="contract.contact" class="col-span-4 xs:col-span-12">
+            <h3>{{ meta.contact }}</h3>
+            <contact-card :contact="contract.contact" />
+        </div>
+        <div class="col-span-4 xs:col-span-12">
+            <h3>{{ meta.title }}</h3>
+            <div class="mt-3 p-5 bg-white shadow rounded-md font-medium">
+                <div v-if="contract.date" class="font-bold">
+                    {{' vom ' + contract.date }}
+                </div>
+                <div v-if="contract.price">
+                    Preis: {{ contract.price }}
+                </div>
+                <div v-if="contract.insurance_type">
+                    Versicherungstyp: {{ contract.insurance_type }}
+                </div>
+            </div>
+        </div>
+        <div v-if="contract.car" class="col-span-4 xs:col-span-12">
+            <h3>{{ meta.car }}</h3>
+            <car-card :car="contract.car" />
+        </div>
+        <div class="col-span-2 xs:col-span-12 py-9">
+            <div class="w-full flex flex-col">
+                <inertia-link :href="route('contracts.print', contract.id)" class="mb-5 inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:ring focus:ring-gray-300 disabled:opacity-25 transition" >
+                    <unicon fill="white" class="mr-1" height="22" width="22" name="file-download"></unicon>
+                    ausdrucken
+                </inertia-link>
+            </div>
+        </div>
+    </div>
+    <div class="py-12">
+        <div class="max-w-7xl sm:px-6 lg:px-8">
+            <!-- <simple-table title="Ankaufverträge" :data="car.buy_contracts" :columns="buyContractsColumns" /> -->
+        </div>
+        <div class="max-w-7xl pt-6 sm:px-6 lg:px-8">    
+            <!-- <simple-table title="Verkaufverträge" :data="car.sell_contracts" :columns="sellContractsColumns" /> -->
+        </div>
+    </div>
+</template>
+
+<script>
+import SimpleTable from '@/Components/SimpleTable.vue'
+import ContactCard from '@/Components/ContactCard.vue'
+import CarCard from '@/Components/CarCard.vue'
+
+export default {
+    components: {
+        SimpleTable,
+        ContactCard,
+        CarCard,
+    },
+    props: {
+        contract: Object,
+        meta: Object,
+    },
+    computed: {
+
+    },
+    data() {
+        return {
+            sellContractsColumns: [
+                {key: 'buyer', value: 'Käufer'},
+                {key: 'date', value: 'Verkaufsdatum'},
+                {key: 'price', value: 'Verkaufspreis'},
+                {key: 'insurance_type', value: 'Versicherungstyp'},
+            ],
+        }
+    },
+}
+</script>

resources/js/Components/SellContractCard.vue

@@ -0,0 +1,24 @@
+<template>
+    <contract-card :contract="contract" :meta="meta" />
+</template>
+
+<script>
+import ContractCard from '@/Components/ContractCard.vue'
+
+export default {
+    components: {
+        ContractCard,
+    },
+    props: {
+        contract: Object,
+    },
+    data() {
+        return {
+            meta: {
+                'title': 'Verkaufsvertrag',
+                'contact': 'Käufer',
+            },
+        }
+    },
+}
+</script>

resources/js/Pages/Cars/Show.vue

@@ -16,20 +16,38 @@
                             <unicon fill="white" class="mr-1" height="22" width="22" name="pen"></unicon>
                             bearbeiten
                         </inertia-link>
-                        <inertia-link :href="route('cars.edit', car.id)" class="mb-5 inline-flex items-center px-4 py-2 bg-red-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-red-700 active:bg-red-900 focus:outline-none focus:border-red-900 focus:ring focus:ring-red-300 disabled:opacity-25 transition" >
+                        <inertia-link v-if="!car.deleted_at" :href="route('cars.destroy', car.id)" class="mb-5 inline-flex items-center px-4 py-2 bg-red-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-red-700 active:bg-red-900 focus:outline-none focus:border-red-900 focus:ring focus:ring-red-300 disabled:opacity-25 transition" >
                             <unicon fill="white" class="mr-1" height="22" width="22" name="trash-alt"></unicon>
                             löschen
                         </inertia-link>
+                        <inertia-link v-if="car.deleted_at" :href="route('cars.restore', car.id)" class="mb-5 inline-flex items-center px-4 py-2 bg-red-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-red-700 active:bg-red-900 focus:outline-none focus:border-red-900 focus:ring focus:ring-red-300 disabled:opacity-25 transition" >
+                            <unicon fill="white" class="mr-1" height="22" width="22" name="trash-alt"></unicon>
+                            wiederherstellen
+                        </inertia-link>
+                        <div v-if="car.deleted_at">
+                            gelöscht: {{ car.deleted_at }}
+                        </div>
                     </div>
                    
                 </div>
         </div>
         <div class="py-12">
             <div class="max-w-7xl sm:px-6 lg:px-8">
-                <simple-table title="Ankaufverträge" :data="car.buy_contracts" :columns="buyContractsColumns" />
+                <div class="whitespace-nowrap mb-3">
+                    <h1 class="mb-1 font-bold text-3xl">Ankaufsverträge</h1>
+                </div>
+                <div v-for="contract in car.buy_contracts.data" :key="contract.id">
+                    <buy-contract-card :contract="contract"/>
+                </div>
+                
             </div>
             <div class="max-w-7xl pt-6 sm:px-6 lg:px-8">  
-                <simple-table title="Verkaufverträge" :data="car.sell_contracts" :columns="sellContractsColumns" />
+                <div class="whitespace-nowrap mb-3">
+                    <h1 class="mb-1 font-bold text-3xl">Verkaufsverträge</h1>
+                </div>
+                <div v-for="contract in car.sell_contracts.data" :key="contract.id">
+                    <sell-contract-card :contract="contract"/>
+                </div>
             </div>
         </div>
     </layout>
@@ -39,7 +57,9 @@
 import Layout from '@/Layouts/Layout'
 import BreadCrumb from '@/Components/BreadCrumb.vue'
 import SimpleTable from '@/Components/SimpleTable.vue'
-import CarCard from './Components/CarCard.vue'
+import CarCard from '@/Components/CarCard.vue'
+import BuyContractCard from '@/Components/BuyContractCard.vue'
+import SellContractCard from '@/Components/SellContractCard.vue'
 
 export default {
     components: {
@@ -47,6 +67,8 @@ export default {
         Layout,
         SimpleTable,
         CarCard,
+        BuyContractCard,
+        SellContractCard,
     },
     props: {
         car: Object,
@@ -58,12 +80,12 @@ export default {
         return {
             currentRoute: 'cars.show',
             buyContractsColumns: [
-                {key: 'seller', value: 'Verkäufer'},
+                {key: 'contact', value: 'Verkäufer'},
                 {key: 'date', value: 'Kaufdatum'},
                 {key: 'price', value: 'Kaufpreis'},
             ],
             sellContractsColumns: [
-                {key: 'buyer', value: 'Käufer'},
+                {key: 'contact', value: 'Käufer'},
                 {key: 'date', value: 'Verkaufsdatum'},
                 {key: 'price', value: 'Verkaufspreis'},
                 {key: 'insurance_type', value: 'Versicherungstyp'},

routes/web.php

@@ -97,6 +97,14 @@ Route::put('cars/{car}', [CarController::class, 'update'])
     ->name('cars.update')
     ->middleware(['auth:sanctum', 'verified']);
 
+Route::get('cars/{car}/delete', [CarController::class, 'destroy'])
+    ->name('cars.destroy')
+    ->middleware(['auth:sanctum', 'verified']);
+
+Route::get('cars/{car}/restore', [CarController::class, 'restore'])
+    ->name('cars.restore')
+    ->middleware(['auth:sanctum', 'verified']);
+
 Route::post('cars', [CarController::class, 'store'])
     ->name('cars.store')
     ->middleware(['auth:sanctum', 'verified']);
@@ -113,6 +121,14 @@ Route::get('contracts', [ContractController::class, 'index'])
     ->name('contracts')
     ->middleware(['auth:sanctum', 'verified']);
 
+Route::get('contracts/{contract}', [ContractController::class, 'show'])
+    ->name('contracts.show')
+    ->middleware(['auth:sanctum', 'verified']);
+
+Route::get('contracts/{contract}/print', [ContractController::class, 'print'])
+    ->name('contracts.print')
+    ->middleware(['auth:sanctum', 'verified']);
+
 Route::get('contracts/ankaufvertraege', [ContractController::class, 'buyContracts'])
     ->name('contracts.buy_contracts')
     ->middleware(['auth:sanctum', 'verified']);