Added comment to customer model. Comment in frontend

app/Http/Controllers/CustomerController.php

@@ -82,6 +82,24 @@ class CustomerController extends Controller
         return redirect('customer/' . $customer->id);
     }
 
+     /**
+     * Update the specified resource in storage.
+     */
+    public function updateComment(Request $request)
+    {
+        $request->validate([
+            'customer_id' => 'required',
+            'comment' => 'required',
+        ]);
+        
+        $customer = Customer::findOrFail($request->customer_id);
+
+        $customer->comment = $request->comment;
+        $customer->save();
+        
+        return redirect('customer/' . $customer->id);
+    }
+
     /**
      * Remove the specified resource from storage.
      */

app/Models/Customer.php

@@ -20,6 +20,7 @@ class Customer extends Model
         'amount used',
         'deposit',
         'give_leftover',
+        'comment'
     ];
 
     /**

database/migrations/2025_09_20_164540_add_comment_to_customer_table.php

@@ -0,0 +1,28 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('customers', function (Blueprint $table) {
+            $table->mediumText('comment')->nullable();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('customers', function (Blueprint $table) {
+            $table->dropColumn('comment');
+        });
+    }
+};

resources/css/app.scss

@@ -11,6 +11,15 @@
     color: var(--button-link-color);
 }
 
+.button.is-info {
+    border: 1px solid var(--button-link-background-color); 
+    color: var(--button-link-background-color);
+
+    &:hover {
+        border: 2px solid var(--button-link-background-color); 
+    }
+}
+
 .button.letter {
     background-color: #fff;
     color: #000;

resources/js/Pages/Customer.tsx

@@ -1,5 +1,6 @@
 import TextInput from '@/Components/TextInput';
 import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout';
+import { Textarea } from '@headlessui/react';
 import { Head, useForm } from '@inertiajs/react';
 import axios from 'axios';
 import { FormEventHandler } from 'react';
@@ -12,6 +13,7 @@ interface CustomerProps {
         amount_left: number
         give_leftover: number
         guardian_name: string
+        comment: string;
         purchases: [{
             id: number
             amount: number
@@ -29,7 +31,8 @@ export default function Customer({customer}: CustomerProps) {
         amount: "",
         customer_id: customer.id,
         deposit: "",
-        id: customer.id
+        id: customer.id,
+        comment: ""
     });
 
     const submit: FormEventHandler = (e) => {
@@ -46,6 +49,12 @@ export default function Customer({customer}: CustomerProps) {
         }); 
     }
 
+    const updateComment: FormEventHandler = (e) => {
+        e.preventDefault()
+        post(route('update_comment'), {
+        }); 
+    }
+
     const deleteCustomer = (id: string | number) => {
        axios.delete('/api/customer/' + id)
         .then(response => {
@@ -119,6 +128,30 @@ export default function Customer({customer}: CustomerProps) {
                                 </form>
                             </div>
 
+                            <div className="box">
+                                <h2 className='title is-4'>Kommentar</h2>
+                                <form onSubmit={updateComment}>
+                                    <div className="field">
+                                        <div className="control">
+                                            <textarea
+                                                required
+                                                className="textarea" 
+                                                name="comment" 
+                                                defaultValue={customer.comment}
+                                                value={data.comment}
+                                                //placeholder="Kommentar"
+                                                onChange={(e) => setData('comment', e.target.value)}
+                                            />
+                                        </div>
+                                    </div>
+                                    <div className="field is-grouped">
+                                        <div className="control">
+                                            <button className="button">Spara</button>
+                                        </div>
+                                    </div>
+                                </form>
+                            </div>
+
                             <details className="box">
                                 <summary className='title is-4 my-3'>
                                     <span>Köp</span>
@@ -160,7 +193,7 @@ export default function Customer({customer}: CustomerProps) {
                                 </div>
                             </details>
                         </div>
-                    <button onClick={() => deleteCustomer(customer.id)} className="button mt-4 is-danger is-outlined is-small">
+                    <button onClick={() => deleteCustomer(customer.id)} className="button mt-4 mr-3 is-danger is-outlined is-small">
                         <span>Radera deltagare</span>
                     </button>
                 </div>

routes/api.php

@@ -10,6 +10,7 @@ Route::post('register_customer', [CustomerController::class, 'store'])->name('re
 
 Route::middleware('auth:sanctum')->group(function () {
     Route::post('register_deposit', [DepositController::class, 'store'])->name('register_deposit');
+    Route::post('update_comment', [CustomerController::class, 'updateComment'])->name('update_comment');
     Route::post('register_purchase', [PurchaseController::class, 'store'])->name('register_purchase'); 
     Route::delete('customer/{id}', [CustomerController::class, 'destroy'])->name('delete_customer'); 
 });