Index: app/Http/Controllers/GenericModelController.php
===================================================================
--- app/Http/Controllers/GenericModelController.php	(revision f5f9406e9e4be48f97b260a58bf9209fe9ab82bb)
+++ app/Http/Controllers/GenericModelController.php	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
@@ -27,4 +27,8 @@
     public function index(Request $request, string $model)
     {
+        if ($model === 'orders') {
+            return app(OrderController::class)->index($request);
+        }
+
         $modelClass = $this->getModelClass($model);
         if (!$modelClass) {
Index: app/Http/Controllers/OrderController.php
===================================================================
--- app/Http/Controllers/OrderController.php	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
+++ app/Http/Controllers/OrderController.php	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
@@ -0,0 +1,394 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Models\Order;
+use App\Models\Invoice;
+use App\Models\PackingList;
+use App\Models\Payment;
+use App\Models\Client;
+use App\Models\Transport;
+use App\Models\Batch;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\DB;
+use Inertia\Inertia;
+
+class OrderController extends Controller
+{
+    /**
+     * Display a listing of the resource.
+     */
+    public function index(Request $request)
+    {
+        $model = 'Order';
+
+        // Get paginated orders with all necessary relationships
+        $query = Order::with([
+            'buyer',
+            'receiver',
+            'transport',
+            'payment',
+            'invoice',
+            'packingList',
+            'batches' => function($query) {
+                $query->with('product');
+            }
+        ]);
+
+        // Search functionality
+        if ($request->has('search') && $request->search) {
+            $search = $request->search;
+            $query->where(function($q) use ($search) {
+                $q->where('id', 'like', "%{$search}%")
+                    ->orWhere('status', 'like', "%{$search}%")
+                    ->orWhereHas('buyer', function($q) use ($search) {
+                        $q->where('name', 'like', "%{$search}%");
+                    })
+                    ->orWhereHas('receiver', function($q) use ($search) {
+                        $q->where('name', 'like', "%{$search}%");
+                    });
+            });
+        }
+
+        // Sorting
+        $sortBy = $request->get('sort_by', 'date');
+        $sortDirection = $request->get('sort_direction', 'desc');
+        $query->orderBy($sortBy, $sortDirection);
+
+        // Pagination
+        $perPage = $request->get('per_page', 10);
+        $items = $query->paginate($perPage);
+
+        // Foreign key map for the frontend
+        $fkMap = [
+            'buyer_id' => 'clients',
+            'receiver_id' => 'clients',
+            'transport_id' => 'transports',
+            'payment_id' => 'payments',
+        ];
+
+        // Related options for form dropdowns
+        $relatedOptions = [
+            'buyer_id' => Client::select('id', 'name')->get()->toArray(),
+            'receiver_id' => Client::select('id', 'name')->get()->toArray(),
+            'transport_id' => Transport::select('id', 'name')->get()->toArray(),
+        ];
+
+        // If the request is for the OrderPage (custom view)
+        if ($request->wantsJson() || $request->header('X-Inertia')) {
+            return Inertia::render('OrderPage', [
+                'model' => $model,
+                'items' => $items,
+                'filters' => [
+                    'search' => $request->search,
+                    'sort_by' => $sortBy,
+                    'sort_direction' => $sortDirection,
+                    'per_page' => $perPage,
+                    'open_id' => $request->open_id,
+                ],
+                'fkMap' => $fkMap,
+                'relatedOptions' => $relatedOptions,
+            ]);
+        }
+
+        // Fallback to generic model page
+        return Inertia::render('GenericModelPage', [
+            'model' => $model,
+            'items' => $items,
+            'filters' => [
+                'search' => $request->search,
+                'sort_by' => $sortBy,
+                'sort_direction' => $sortDirection,
+                'per_page' => $perPage,
+                'open_id' => $request->open_id,
+            ],
+            'fkMap' => $fkMap,
+            'relatedOptions' => $relatedOptions,
+        ]);
+    }
+
+    /**
+     * Show the form for creating a new resource.
+     */
+    public function create()
+    {
+        //
+    }
+
+    /**
+     * Store a newly created resource in storage.
+     */
+    public function store(Request $request)
+    {
+        $validated = $request->validate(Order::getValidationRules());
+
+        try {
+            DB::beginTransaction();
+
+            $order = Order::create($validated);
+
+            // If batches are provided, attach them to the order
+            if ($request->has('batches')) {
+                foreach ($request->batches as $batchData) {
+                    $order->batches()->attach($batchData['batch_id'], [
+                        'quantity' => $batchData['quantity'],
+                        'price_per_unit' => $batchData['price_per_unit'],
+                        'total_price' => $batchData['quantity'] * $batchData['price_per_unit']
+                    ]);
+                }
+            }
+
+            DB::commit();
+
+            return redirect()->route('orders.index')
+                ->with('success', 'Order created successfully.');
+
+        } catch (\Exception $e) {
+            DB::rollBack();
+            return back()->with('error', 'Failed to create order: ' . $e->getMessage());
+        }
+    }
+
+    /**
+     * Display the specified resource.
+     */
+    public function show(Order $order)
+    {
+        $order->load([
+            'buyer',
+            'receiver',
+            'transport',
+            'payment',
+            'invoice',
+            'packingList',
+            'batches' => function($query) {
+                $query->with('product');
+            }
+        ]);
+
+        return Inertia::render('OrderShow', [
+            'order' => $order,
+        ]);
+    }
+
+    /**
+     * Show the form for editing the specified resource.
+     */
+    public function edit(Order $order)
+    {
+        //
+    }
+
+    /**
+     * Update the specified resource in storage.
+     */
+    public function update(Request $request, Order $order)
+    {
+        $validated = $request->validate(Order::getValidationRules($order->id));
+
+        try {
+            DB::beginTransaction();
+
+            $order->update($validated);
+
+            // Update batches if provided
+            if ($request->has('batches')) {
+                $order->batches()->detach();
+                foreach ($request->batches as $batchData) {
+                    $order->batches()->attach($batchData['batch_id'], [
+                        'quantity' => $batchData['quantity'],
+                        'price_per_unit' => $batchData['price_per_unit'],
+                        'total_price' => $batchData['quantity'] * $batchData['price_per_unit']
+                    ]);
+                }
+            }
+
+            DB::commit();
+
+            return redirect()->route('orders.index')
+                ->with('success', 'Order updated successfully.');
+
+        } catch (\Exception $e) {
+            DB::rollBack();
+            return back()->with('error', 'Failed to update order: ' . $e->getMessage());
+        }
+    }
+
+    /**
+     * Remove the specified resource from storage.
+     */
+    public function destroy(Order $order)
+    {
+        try {
+            DB::beginTransaction();
+
+            // Delete related records first
+            $order->batches()->detach();
+
+            // Delete the order
+            $order->delete();
+
+            DB::commit();
+
+            return redirect()->route('orders.index')
+                ->with('success', 'Order deleted successfully.');
+
+        } catch (\Exception $e) {
+            DB::rollBack();
+            return back()->with('error', 'Failed to delete order: ' . $e->getMessage());
+        }
+    }
+
+    /**
+     * Generate invoice for an order
+     */
+    public function generateInvoice(Order $order)
+    {
+        try {
+            DB::beginTransaction();
+
+            // Check if invoice already exists
+            if ($order->invoice) {
+                return back()->with('error', 'Invoice already exists for this order.');
+            }
+
+            // Calculate total amount from batches
+            $totalAmount = $order->batches->sum(function($batch) {
+                return $batch->pivot->quantity * $batch->pivot->price_per_unit;
+            });
+
+            // Create invoice
+            $invoice = Invoice::create([
+                'order_id' => $order->id,
+                'invoice_date' => now(),
+                'status' => 'draft',
+                'total_amount' => $totalAmount,
+            ]);
+
+            // Create payment record if it doesn't exist
+            if (!$order->payment) {
+                $payment = Payment::create([
+                    'order_id' => $order->id,
+                    'amount' => $totalAmount,
+                    'currency' => 'USD', // Default currency
+                    'due_date' => now()->addDays(30),
+                    'exchange_rate' => 1.0,
+                    'payment_date' => null,
+                    'payment_method' => 'bank_transfer',
+                    'payment_status' => 'pending'
+                ]);
+
+                // Update order with payment_id
+                $order->update(['payment_id' => $payment->id]);
+            }
+
+            DB::commit();
+
+            return back()->with('success', 'Invoice generated successfully.');
+
+        } catch (\Exception $e) {
+            DB::rollBack();
+            return back()->with('error', 'Failed to generate invoice: ' . $e->getMessage());
+        }
+    }
+
+    /**
+     * Generate packing list for an order
+     */
+    public function generatePackingList(Order $order)
+    {
+        try {
+            DB::beginTransaction();
+
+            // Check if packing list already exists
+            if ($order->packingList) {
+                return back()->with('error', 'Packing list already exists for this order.');
+            }
+
+            // Create packing list
+            $packingList = PackingList::create([
+                'order_id' => $order->id,
+                'packing_list_date' => now(),
+                'status' => 'draft',
+            ]);
+
+            DB::commit();
+
+            return back()->with('success', 'Packing list generated successfully.');
+
+        } catch (\Exception $e) {
+            DB::rollBack();
+            return back()->with('error', 'Failed to generate packing list: ' . $e->getMessage());
+        }
+    }
+
+    /**
+     * Add batch to order
+     */
+    public function addBatch(Request $request, Order $order)
+    {
+        $validated = $request->validate([
+            'batch_id' => 'required|exists:batches,id',
+            'quantity' => 'required|integer|min:1',
+            'price_per_unit' => 'required|numeric|min:0',
+        ]);
+        try {
+            $order->batches()->attach($validated['batch_id'], [
+                'quantity' => $validated['quantity'],
+                'price_per_unit' => $validated['price_per_unit'],
+                'total_price' => $validated['quantity'] * $validated['price_per_unit']
+            ]);
+
+            return back()->with('success', 'Batch added to order successfully.');
+
+        } catch (\Exception $e) {
+            return back()->with('error', 'Failed to add batch to order: ' . $e->getMessage());
+        }
+    }
+
+    /**
+     * Remove batch from order
+     */
+    public function removeBatch(Order $order, Batch $batch)
+    {
+        try {
+            $order->batches()->detach($batch->id);
+
+            return back()->with('success', 'Batch removed from order successfully.');
+
+        } catch (\Exception $e) {
+            return back()->with('error', 'Failed to remove batch from order: ' . $e->getMessage());
+        }
+    }
+
+    /**
+     * Get available batches for order
+     */
+    public function getAvailableBatches(Order $order)
+    {
+        $availableBatches = Batch::whereDoesntHave('orders', function($query) use ($order) {
+            $query->where('order_id', $order->id);
+        })->with('product')->get();
+
+        return response()->json($availableBatches);
+    }
+
+    /**
+     * Update order status
+     */
+    public function updateStatus(Request $request, Order $order)
+    {
+        $validated = $request->validate([
+            'status' => 'required|in:pending,confirmed,processing,shipped,delivered,cancelled'
+        ]);
+
+        try {
+            $order->update(['status' => $validated['status']]);
+
+            return back()->with('success', 'Order status updated successfully.');
+
+        } catch (\Exception $e) {
+            return back()->with('error', 'Failed to update order status: ' . $e->getMessage());
+        }
+    }
+}
Index: app/Models/Client.php
===================================================================
--- app/Models/Client.php	(revision f5f9406e9e4be48f97b260a58bf9209fe9ab82bb)
+++ app/Models/Client.php	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
@@ -27,18 +27,4 @@
         'shipping_address',
     ];
-
-//    public static function getValidationRules($id = null): array
-//    {
-//        return [
-//            'name' => 'required|string|max:255|unique:clients,name,' . $id,
-//            'country' => 'required|string|max:255',
-//            'registration_number' => 'nullable|string|max:255|unique:clients,registration_number,' . $id,
-//            'tax_code' => 'nullable|string|max:255|unique:clients,tax_code,' . $id,
-//            'contact_person' => 'nullable|string|max:255',
-//            'phone_number' => 'nullable|string|max:255|regex:/^[\+]?[0-9\s\-\(\)]+$/',
-//            'billing_address' => 'nullable|string|max:1000',
-//            'shipping_address' => 'nullable|string|max:1000',
-//        ];
-//    }
 
     public static function getValidationRules($id = null): array
Index: resources/js/Pages/Dashboard.vue
===================================================================
--- resources/js/Pages/Dashboard.vue	(revision f5f9406e9e4be48f97b260a58bf9209fe9ab82bb)
+++ resources/js/Pages/Dashboard.vue	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import { computed } from 'vue';
-import { Head } from '@inertiajs/vue3';
 import App from '@/Layout/App.vue';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 import LineChart from '@/components/ui/chart/LineChart.vue';
+import { Head } from '@inertiajs/vue3';
+import { computed } from 'vue';
 
 /* ---------- types ---------- */
@@ -94,9 +94,15 @@
 
 const totalPendingOrders = computed(() => {
-    return props.pendingOrders.reduce((sum, order) => sum + order.pending_orders, 0);
+    return props.pendingOrders.reduce(
+        (sum, order) => sum + order.pending_orders,
+        0,
+    );
 });
 
 const totalPendingValue = computed(() => {
-    return props.pendingOrders.reduce((sum, order) => sum + order.total_pending_value, 0);
+    return props.pendingOrders.reduce(
+        (sum, order) => sum + order.total_pending_value,
+        0,
+    );
 });
 
@@ -113,11 +119,13 @@
     <Head title="Dashboard" />
     <App>
-        <h1 class="text-3xl font-bold mb-6">Dashboard</h1>
+        <h1 class="mb-6 text-3xl font-bold">Dashboard</h1>
 
         <!-- Revenue & Key Metrics -->
-        <div class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4 mb-6">
+        <div class="mb-6 grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-4">
             <!-- Total Revenue Card with Chart -->
             <Card class="lg:col-span-2">
-                <CardHeader class="flex flex-row items-center justify-between space-y-0 pb-2">
+                <CardHeader
+                    class="flex flex-row items-center justify-between space-y-0 pb-2"
+                >
                     <CardTitle class="text-sm font-medium">
                         Total Revenue
@@ -131,7 +139,9 @@
                         stroke-linejoin="round"
                         stroke-width="2"
-                        class="h-4 w-4 text-muted-foreground"
+                        class="text-muted-foreground h-4 w-4"
                     >
-                        <path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6" />
+                        <path
+                            d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"
+                        />
                     </svg>
                 </CardHeader>
@@ -140,5 +150,5 @@
                         ${{ currentRevenue.toLocaleString() }}
                     </div>
-                    <p class="text-xs text-muted-foreground mb-4">
+                    <p class="text-muted-foreground mb-4 text-xs">
                         {{ revenueDelta }} from last month
                     </p>
@@ -146,6 +156,6 @@
                     <!-- Line chart inside the revenue card -->
                     <LineChart
-                        :labels="monthlyRevenue.map(r => r.month)"
-                        :data="monthlyRevenue.map(r => r.revenue)"
+                        :labels="monthlyRevenue.map((r) => r.month)"
+                        :data="monthlyRevenue.map((r) => r.revenue)"
                     />
                 </CardContent>
@@ -153,15 +163,30 @@
 
             <Card>
-                <CardHeader class="flex flex-row items-center justify-between space-y-0 pb-2">
+                <CardHeader
+                    class="flex flex-row items-center justify-between space-y-0 pb-2"
+                >
                     <CardTitle class="text-sm font-medium">
                         Pending Orders
                     </CardTitle>
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="h-4 w-4 text-muted-foreground">
-                        <path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6" />
+                    <svg
+                        xmlns="http://www.w3.org/2000/svg"
+                        viewBox="0 0 24 24"
+                        fill="none"
+                        stroke="currentColor"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        stroke-width="2"
+                        class="text-muted-foreground h-4 w-4"
+                    >
+                        <path
+                            d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"
+                        />
                     </svg>
                 </CardHeader>
                 <CardContent>
-                    <div class="text-2xl font-bold">{{ totalPendingOrders }}</div>
-                    <p class="text-xs text-muted-foreground">
+                    <div class="text-2xl font-bold">
+                        {{ totalPendingOrders }}
+                    </div>
+                    <p class="text-muted-foreground text-xs">
                         ${{ totalPendingValue.toLocaleString() }} total value
                     </p>
@@ -170,15 +195,30 @@
 
             <Card>
-                <CardHeader class="flex flex-row items-center justify-between space-y-0 pb-2">
+                <CardHeader
+                    class="flex flex-row items-center justify-between space-y-0 pb-2"
+                >
                     <CardTitle class="text-sm font-medium">
                         Unpaid Invoices
                     </CardTitle>
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="h-4 w-4 text-muted-foreground">
-                        <path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6" />
+                    <svg
+                        xmlns="http://www.w3.org/2000/svg"
+                        viewBox="0 0 24 24"
+                        fill="none"
+                        stroke="currentColor"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        stroke-width="2"
+                        class="text-muted-foreground h-4 w-4"
+                    >
+                        <path
+                            d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"
+                        />
                     </svg>
                 </CardHeader>
                 <CardContent>
-                    <div class="text-2xl font-bold">{{ totalUnpaidInvoices }}</div>
-                    <p class="text-xs text-muted-foreground">
+                    <div class="text-2xl font-bold">
+                        {{ totalUnpaidInvoices }}
+                    </div>
+                    <p class="text-muted-foreground text-xs">
                         Requiring attention
                     </p>
@@ -188,5 +228,5 @@
 
         <!-- Payment Status Overview -->
-        <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">
+        <div class="mb-6 grid grid-cols-1 gap-6 lg:grid-cols-2">
             <!-- Payment Status Chart -->
             <Card>
@@ -196,11 +236,20 @@
                 <CardContent>
                     <div class="space-y-2">
-                        <div v-for="status in paymentStatusOverview" :key="status.payment_status"
-                             class="flex justify-between items-center p-2 border rounded">
-                            <span class="capitalize">{{ status.payment_status }}</span>
+                        <div
+                            v-for="status in paymentStatusOverview"
+                            :key="status.payment_status"
+                            class="flex items-center justify-between rounded border p-2"
+                        >
+                            <span class="capitalize">{{
+                                status.payment_status
+                            }}</span>
                             <div class="text-right">
-                                <div class="font-medium">{{ status.count_payments }} payments</div>
-                                <div class="text-sm text-muted-foreground">
-                                    {{ status.percentage_of_payments }}% • ${{ status.total_amount.toLocaleString() }}
+                                <div class="font-medium">
+                                    {{ status.count_payments }} payments
+                                </div>
+                                <div class="text-muted-foreground text-sm">
+                                    {{ status.percentage_of_payments }}% • ${{
+                                        status.total_amount.toLocaleString()
+                                    }}
                                 </div>
                             </div>
@@ -217,11 +266,20 @@
                 <CardContent>
                     <div class="space-y-2">
-                        <div v-for="country in ordersByCountry.slice(0, 5)" :key="country.country"
-                             class="flex justify-between items-center p-2 border rounded">
-                            <span class="font-medium">{{ country.country || 'Unknown' }}</span>
+                        <div
+                            v-for="country in ordersByCountry.slice(0, 5)"
+                            :key="country.country"
+                            class="flex items-center justify-between rounded border p-2"
+                        >
+                            <span class="font-medium">{{
+                                country.country || 'Unknown'
+                            }}</span>
                             <div class="text-right">
-                                <div class="font-medium">{{ country.total_orders }} orders</div>
-                                <div class="text-sm text-muted-foreground">
-                                    ${{ country.total_revenue.toLocaleString() }}
+                                <div class="font-medium">
+                                    {{ country.total_orders }} orders
+                                </div>
+                                <div class="text-muted-foreground text-sm">
+                                    ${{
+                                        country.total_revenue.toLocaleString()
+                                    }}
                                 </div>
                             </div>
@@ -233,5 +291,5 @@
 
         <!-- Top Performers Section -->
-        <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">
+        <div class="mb-6 grid grid-cols-1 gap-6 lg:grid-cols-2">
             <!-- Top Buyers -->
             <Card>
@@ -241,9 +299,16 @@
                 <CardContent>
                     <div class="space-y-3">
-                        <div v-for="buyer in topBuyers" :key="buyer.id"
-                             class="flex justify-between items-center p-3 border rounded">
+                        <div
+                            v-for="buyer in topBuyers"
+                            :key="buyer.id"
+                            class="flex items-center justify-between rounded border p-3"
+                        >
                             <div>
-                                <div class="font-medium">{{ buyer.company_name }}</div>
-                                <div class="text-sm text-muted-foreground">{{ buyer.total_orders }} orders</div>
+                                <div class="font-medium">
+                                    {{ buyer.company_name }}
+                                </div>
+                                <div class="text-muted-foreground text-sm">
+                                    {{ buyer.total_orders }} orders
+                                </div>
                             </div>
                             <div class="text-right font-bold">
@@ -262,10 +327,16 @@
                 <CardContent>
                     <div class="space-y-3">
-                        <div v-for="product in bestSellingProducts" :key="product.id"
-                             class="flex justify-between items-center p-3 border rounded">
+                        <div
+                            v-for="product in bestSellingProducts"
+                            :key="product.id"
+                            class="flex items-center justify-between rounded border p-3"
+                        >
                             <div>
-                                <div class="font-medium">{{ product.product_name }}</div>
-                                <div class="text-sm text-muted-foreground">
-                                    {{ product.producer_name }} • {{ product.times_ordered }} orders
+                                <div class="font-medium">
+                                    {{ product.product_name }}
+                                </div>
+                                <div class="text-muted-foreground text-sm">
+                                    {{ product.producer_name }} •
+                                    {{ product.times_ordered }} orders
                                 </div>
                             </div>
@@ -280,5 +351,5 @@
 
         <!-- Additional Reports Section -->
-        <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
+        <div class="grid grid-cols-1 gap-6 lg:grid-cols-3">
             <!-- Revenue by Producer -->
             <Card>
@@ -288,7 +359,12 @@
                 <CardContent>
                     <div class="space-y-3">
-                        <div v-for="producer in revenueByProducer" :key="producer.id"
-                             class="flex justify-between items-center p-3 border rounded">
-                            <div class="font-medium">{{ producer.company_name }}</div>
+                        <div
+                            v-for="producer in revenueByProducer"
+                            :key="producer.id"
+                            class="flex items-center justify-between rounded border p-3"
+                        >
+                            <div class="font-medium">
+                                {{ producer.company_name }}
+                            </div>
                             <div class="text-right font-bold">
                                 ${{ producer.total_revenue.toLocaleString() }}
@@ -306,12 +382,21 @@
                 <CardContent>
                     <div class="space-y-3">
-                        <div v-for="order in pendingOrders" :key="order.id"
-                             class="flex justify-between items-center p-3 border rounded">
+                        <div
+                            v-for="order in pendingOrders"
+                            :key="order.id"
+                            class="flex items-center justify-between rounded border p-3"
+                        >
                             <div>
-                                <div class="font-medium">{{ order.company_name }}</div>
-                                <div class="text-sm text-muted-foreground">{{ order.pending_orders }} pending</div>
+                                <div class="font-medium">
+                                    {{ order.company_name }}
+                                </div>
+                                <div class="text-muted-foreground text-sm">
+                                    {{ order.pending_orders }} pending
+                                </div>
                             </div>
                             <div class="text-right font-bold text-orange-600">
-                                ${{ order.total_pending_value.toLocaleString() }}
+                                ${{
+                                    order.total_pending_value.toLocaleString()
+                                }}
                             </div>
                         </div>
@@ -325,11 +410,19 @@
                     <CardTitle>Products Needing Attention</CardTitle>
                 </CardHeader>
-                <CardContent>
+                <CardContent
+                    >n
                     <div class="space-y-3">
-                        <div v-for="product in poorPerformingProducts" :key="product.id"
-                             class="flex justify-between items-center p-3 border rounded">
+                        <div
+                            v-for="product in poorPerformingProducts"
+                            :key="product.id"
+                            class="flex items-center justify-between rounded border p-3"
+                        >
                             <div>
-                                <div class="font-medium">{{ product.product_name }}</div>
-                                <div class="text-sm text-muted-foreground">{{ product.producer_name }}</div>
+                                <div class="font-medium">
+                                    {{ product.product_name }}
+                                </div>
+                                <div class="text-muted-foreground text-sm">
+                                    {{ product.producer_name }}
+                                </div>
                             </div>
                             <div class="text-right font-bold text-red-600">
Index: resources/js/Pages/GenericModelPage.vue
===================================================================
--- resources/js/Pages/GenericModelPage.vue	(revision f5f9406e9e4be48f97b260a58bf9209fe9ab82bb)
+++ resources/js/Pages/GenericModelPage.vue	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
@@ -232,4 +232,5 @@
 };
 
+// FIXED: Added back the isDateField function - it's used for detecting date fields by name pattern
 const isDateField = (field: string): boolean => {
     return /date$/i.test(field);
@@ -244,5 +245,5 @@
     }
 
-    // If it's an array from calendar, take first element
+    // If it's an array from calendar, take the first element
     if (Array.isArray(date) && date.length > 0) {
         const firstDate = date[0];
@@ -495,163 +496,183 @@
                         <template v-if="items.data.length">
                             <template v-for="item in items.data" :key="item.id">
-                                <TableRow
-                                    class="hover:bg-muted/50 cursor-pointer"
-                                    @click="toggleRowExpansion(item.id)"
-                                >
-                                    <TableCell
-                                        v-for="field in tableFields"
-                                        :key="field"
-                                        class="max-w-[200px] truncate overflow-hidden font-medium whitespace-nowrap"
+                                <!-- Slot for custom table rows -->
+                                <slot
+                                    v-if="$slots['table-row']"
+                                    name="table-row"
+                                    :item="item"
+                                    :tableFields="tableFields"
+                                    :isForeignKey="isForeignKey"
+                                    :getRelatedModelName="getRelatedModelName"
+                                    :navigateToRelatedModel="navigateToRelatedModel"
+                                    :formatValue="formatValue"
+                                    :toggleRowExpansion="toggleRowExpansion"
+                                    :expandedRows="expandedRows"
+                                    :openEditDialog="openEditDialog"
+                                    :deleteItem="deleteItem"
+                                    :isDateField="isDateField"
+                                />
+
+                                <!-- Default table row (when no slot provided) -->
+                                <template v-else>
+                                    <TableRow
+                                        class="hover:bg-muted/50 cursor-pointer"
+                                        @click="toggleRowExpansion(item.id)"
                                     >
-                                        <template
-                                            v-if="
-                                                isForeignKey(field) &&
-                                                item[field]
-                                            "
+                                        <TableCell
+                                            v-for="field in tableFields"
+                                            :key="field"
+                                            class="max-w-[200px] truncate overflow-hidden font-medium whitespace-nowrap"
                                         >
-                                            <span
-                                                class="fk-link"
+                                            <template
+                                                v-if="
+                                                    isForeignKey(field) &&
+                                                    item[field]
+                                                "
+                                            >
+                                                <span
+                                                    class="fk-link"
+                                                    @click.stop="
+                                                        navigateToRelatedModel(
+                                                            field,
+                                                            item[field],
+                                                        )
+                                                    "
+                                                >
+                                                    {{
+                                                        getRelatedModelName(
+                                                            item,
+                                                            field,
+                                                        )
+                                                    }}
+                                                    <ExternalLink class="h-3 w-3" />
+                                                </span>
+                                            </template>
+                                            <template v-else>
+                                                {{ formatValue(item[field]) }}
+                                            </template>
+                                        </TableCell>
+                                        <TableCell>
+                                            {{
+                                                new Date(
+                                                    item.created_at,
+                                                ).toLocaleDateString()
+                                            }}
+                                        </TableCell>
+                                        <TableCell class="flex space-x-2">
+                                            <Button
+                                                variant="outline"
+                                                size="sm"
                                                 @click.stop="
-                                                    navigateToRelatedModel(
-                                                        field,
-                                                        item[field],
-                                                    )
+                                                    toggleRowExpansion(item.id)
                                                 "
                                             >
                                                 {{
-                                                    getRelatedModelName(
-                                                        item,
-                                                        field,
-                                                    )
+                                                    expandedRows.has(item.id)
+                                                        ? 'Hide'
+                                                        : 'Show'
                                                 }}
-                                                <ExternalLink class="h-3 w-3" />
-                                            </span>
-                                        </template>
-                                        <template v-else>
-                                            {{ formatValue(item[field]) }}
-                                        </template>
-                                    </TableCell>
-                                    <TableCell>
-                                        {{
-                                            new Date(
-                                                item.created_at,
-                                            ).toLocaleDateString()
-                                        }}
-                                    </TableCell>
-                                    <TableCell class="flex space-x-2">
-                                        <Button
-                                            variant="outline"
-                                            size="sm"
-                                            @click.stop="
-                                                toggleRowExpansion(item.id)
-                                            "
+                                            </Button>
+                                            <Button
+                                                variant="outline"
+                                                size="sm"
+                                                @click.stop="openEditDialog(item)"
+                                            >
+                                                Edit
+                                            </Button>
+                                            <Button
+                                                variant="destructive"
+                                                size="sm"
+                                                @click.stop="deleteItem(item)"
+                                            >
+                                                Delete
+                                            </Button>
+                                        </TableCell>
+                                    </TableRow>
+
+                                    <TableRow
+                                        v-if="expandedRows.has(item.id)"
+                                        class="bg-muted/20"
+                                    >
+                                        <TableCell
+                                            :colspan="tableFields.length + 2"
+                                            class="p-4"
                                         >
-                                            {{
-                                                expandedRows.has(item.id)
-                                                    ? 'Hide'
-                                                    : 'Show'
-                                            }}
-                                        </Button>
-                                        <Button
-                                            variant="outline"
-                                            size="sm"
-                                            @click.stop="openEditDialog(item)"
-                                        >
-                                            Edit
-                                        </Button>
-                                        <Button
-                                            variant="destructive"
-                                            size="sm"
-                                            @click.stop="deleteItem(item)"
-                                        >
-                                            Delete
-                                        </Button>
-                                    </TableCell>
-                                </TableRow>
-
-                                <TableRow
-                                    v-if="expandedRows.has(item.id)"
-                                    class="bg-muted/20"
-                                >
-                                    <TableCell
-                                        :colspan="tableFields.length + 2"
-                                        class="p-4"
-                                    >
-                                        <div class="space-y-3">
-                                            <h4 class="font-semibold">
-                                                {{ model }} Details
-                                            </h4>
-                                            <div
-                                                class="grid grid-cols-2 gap-4 text-sm"
-                                            >
+                                            <div class="space-y-3">
+                                                <h4 class="font-semibold">
+                                                    {{ model }} Details
+                                                </h4>
                                                 <div
-                                                    v-for="field in detailFields"
-                                                    :key="field"
+                                                    class="grid grid-cols-2 gap-4 text-sm"
                                                 >
-                                                    <strong>
-                                                        {{
-                                                            formatLabel(
-                                                                field.replace(
-                                                                    '_id',
-                                                                    '',
-                                                                ),
-                                                            )
-                                                        }}:
-                                                    </strong>
-                                                    <template
-                                                        v-if="
-                                                            isForeignKey(
-                                                                field,
-                                                            ) && item[field]
-                                                        "
+                                                    <div
+                                                        v-for="field in detailFields"
+                                                        :key="field"
                                                     >
-                                                        <span
-                                                            class="fk-link ml-2"
-                                                            @click.stop="
-                                                                navigateToRelatedModel(
+                                                        <strong>
+                                                            {{
+                                                                formatLabel(
+                                                                    field.replace(
+                                                                        '_id',
+                                                                        '',
+                                                                    ),
+                                                                )
+                                                            }}:
+                                                        </strong>
+                                                        <template
+                                                            v-if="
+                                                                isForeignKey(
                                                                     field,
+                                                                ) && item[field]
+                                                            "
+                                                        >
+                                                            <span
+                                                                class="fk-link ml-2"
+                                                                @click.stop="
+                                                                    navigateToRelatedModel(
+                                                                        field,
+                                                                        item[field],
+                                                                    )
+                                                                "
+                                                            >
+                                                                {{
+                                                                    getRelatedModelName(
+                                                                        item,
+                                                                        field,
+                                                                    )
+                                                                }}
+                                                                <ExternalLink
+                                                                    class="h-3 w-3"
+                                                                />
+                                                            </span>
+                                                        </template>
+                                                        <template v-else>
+                                                            {{
+                                                                formatValue(
                                                                     item[field],
                                                                 )
-                                                            "
-                                                        >
-                                                            {{
-                                                                getRelatedModelName(
-                                                                    item,
-                                                                    field,
-                                                                )
                                                             }}
-                                                            <ExternalLink
-                                                                class="h-3 w-3"
-                                                            />
-                                                        </span>
-                                                    </template>
-                                                    <template v-else>
-                                                        {{
-                                                            formatValue(
-                                                                item[field],
-                                                            )
-                                                        }}
-                                                    </template>
+                                                        </template>
+                                                    </div>
+                                                </div>
+                                                <div
+                                                    class="text-muted-foreground mt-2 text-xs"
+                                                >
+                                                    Created:
+                                                    {{
+                                                        new Date(
+                                                            item.created_at,
+                                                        ).toLocaleString()
+                                                    }}
+                                                    | Updated:
+                                                    {{
+                                                        new Date(
+                                                            item.updated_at,
+                                                        ).toLocaleString()
+                                                    }}
                                                 </div>
                                             </div>
-                                            <div
-                                                class="text-muted-foreground mt-2 text-xs"
-                                            >
-                                                Created:
-                                                {{
-                                                    new Date(
-                                                        item.created_at,
-                                                    ).toLocaleString()
-                                                }}
-                                                | Updated:
-                                                {{
-                                                    new Date(
-                                                        item.updated_at,
-                                                    ).toLocaleString()
-                                                }}
-                                            </div>
-                                        </div>
-                                    </TableCell>
-                                </TableRow>
+                                        </TableCell>
+                                    </TableRow>
+                                </template>
                             </template>
                         </template>
@@ -776,9 +797,9 @@
                                             createForm[field]
                                                 ? format(
-                                                      new Date(
-                                                          createForm[field],
-                                                      ),
-                                                      'PPP',
-                                                  )
+                                                    new Date(
+                                                        createForm[field],
+                                                    ),
+                                                    'PPP',
+                                                )
                                                 : 'Pick a date'
                                         }}
@@ -885,7 +906,7 @@
                                             editForm[field]
                                                 ? format(
-                                                      new Date(editForm[field]),
-                                                      'PPP',
-                                                  )
+                                                    new Date(editForm[field]),
+                                                    'PPP',
+                                                )
                                                 : 'Pick a date'
                                         }}
Index: resources/js/Pages/OrderPage.vue
===================================================================
--- resources/js/Pages/OrderPage.vue	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
+++ resources/js/Pages/OrderPage.vue	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
@@ -0,0 +1,390 @@
+<script setup lang="ts">
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import { formatLabel } from '@/lib/utils';
+import { router } from '@inertiajs/vue3';
+import GenericModelPage from './GenericModelPage.vue';
+
+interface Props {
+    model: string;
+    items: any;
+    filters: any;
+    fkMap: any;
+    relatedOptions: any;
+}
+
+const props = defineProps<Props>();
+
+// Custom methods for Order-specific actions
+const generateInvoice = (order: any) => {
+    if (confirm('Generate invoice for this order?')) {
+        router.post(
+            `/orders/${order.id}/generate-invoice`,
+            {},
+            {
+                onSuccess: () => {
+                    // Refresh the page to show the new invoice
+                    router.reload();
+                },
+            },
+        );
+    }
+};
+
+const generatePackingList = (order: any) => {
+    if (confirm('Generate packing list for this order?')) {
+        router.post(
+            `/orders/${order.id}/generate-packing-list`,
+            {},
+            {
+                onSuccess: () => {
+                    // Refresh the page to show the new packing list
+                    router.reload();
+                },
+            },
+        );
+    }
+};
+
+const viewInvoice = (order: any) => {
+    if (order.invoice) {
+        router.get(`/invoices?open_id=${order.invoice.id}`);
+    }
+};
+
+const viewPackingList = (order: any) => {
+    if (order.packing_list) {
+        router.get(`/packing-lists?open_id=${order.packing_list.id}`);
+    }
+};
+
+// Format order status with colors
+const getStatusBadgeVariant = (status: string) => {
+    switch (status) {
+        case 'pending':
+            return 'secondary';
+        case 'confirmed':
+            return 'default';
+        case 'processing':
+            return 'default';
+        case 'shipped':
+            return 'default';
+        case 'delivered':
+            return 'success';
+        case 'cancelled':
+            return 'destructive';
+        default:
+            return 'secondary';
+    }
+};
+</script>
+
+<template>
+    <GenericModelPage
+        :model="model"
+        :items="items"
+        :filters="filters"
+        :fkMap="fkMap"
+        :relatedOptions="relatedOptions"
+    >
+        <!-- Override the table row to add custom Order functionality -->
+        <template
+            #table-row="{
+                item,
+                tableFields,
+                isForeignKey,
+                getRelatedModelName,
+                navigateToRelatedModel,
+                formatValue,
+                toggleRowExpansion,
+                expandedRows,
+                openEditDialog,
+                deleteItem,
+            }"
+        >
+            <tr
+                class="hover:bg-muted/50 cursor-pointer"
+                @click="toggleRowExpansion(item.id)"
+            >
+                <td
+                    v-for="field in tableFields"
+                    :key="field"
+                    class="max-w-[200px] truncate overflow-hidden p-2 font-medium whitespace-nowrap"
+                >
+                    <!-- Custom status display -->
+                    <template v-if="field === 'status'">
+                        <Badge :variant="getStatusBadgeVariant(item[field])">
+                            {{ formatValue(item[field]) }}
+                        </Badge>
+                    </template>
+
+                    <template v-else-if="isForeignKey(field) && item[field]">
+                        <span
+                            class="fk-link"
+                            @click.stop="
+                                navigateToRelatedModel(field, item[field])
+                            "
+                        >
+                            {{ getRelatedModelName(item, field) }}
+                            <ExternalLink class="h-3 w-3" />
+                        </span>
+                    </template>
+                    <template v-else>
+                        {{ formatValue(item[field]) }}
+                    </template>
+                </td>
+                <td class="p-2">
+                    {{ new Date(item.created_at).toLocaleDateString() }}
+                </td>
+                <td class="flex space-x-1 p-2">
+                    <!-- Show/Hide Details Button -->
+                    <Button
+                        variant="outline"
+                        size="sm"
+                        @click.stop="toggleRowExpansion(item.id)"
+                    >
+                        {{ expandedRows.has(item.id) ? 'Hide' : 'Show' }}
+                    </Button>
+
+                    <!-- Custom Order Actions -->
+                    <Button
+                        v-if="!item.invoice"
+                        variant="outline"
+                        size="sm"
+                        @click.stop="generateInvoice(item)"
+                    >
+                        Invoice
+                    </Button>
+                    <Button
+                        v-else
+                        variant="outline"
+                        size="sm"
+                        @click.stop="viewInvoice(item)"
+                    >
+                        View Invoice
+                    </Button>
+
+                    <Button
+                        v-if="!item.packing_list"
+                        variant="outline"
+                        size="sm"
+                        @click.stop="generatePackingList(item)"
+                    >
+                        Packing List
+                    </Button>
+                    <Button
+                        v-else
+                        variant="outline"
+                        size="sm"
+                        @click.stop="viewPackingList(item)"
+                    >
+                        View Packing
+                    </Button>
+
+                    <Button
+                        variant="outline"
+                        size="sm"
+                        @click.stop="openEditDialog(item)"
+                    >
+                        Edit
+                    </Button>
+                    <Button
+                        variant="destructive"
+                        size="sm"
+                        @click.stop="deleteItem(item)"
+                    >
+                        Delete
+                    </Button>
+                </td>
+            </tr>
+
+            <!-- Expanded Row with Order Details -->
+            <tr v-if="expandedRows.has(item.id)" class="bg-muted/20">
+                <td :colspan="tableFields.length + 2" class="p-4">
+                    <div class="space-y-4">
+                        <h4 class="text-lg font-semibold">Order Details</h4>
+
+                        <!-- Basic Order Information -->
+                        <div class="mb-4 grid grid-cols-2 gap-4 text-sm">
+                            <div
+                                v-for="field in [
+                                    'date',
+                                    'status',
+                                    'estimated_delivery_date',
+                                ]"
+                                :key="field"
+                            >
+                                <strong>{{ formatLabel(field) }}:</strong>
+                                {{ formatValue(item[field]) }}
+                            </div>
+                        </div>
+
+                        <!-- Batches Section -->
+                        <div class="rounded-lg border p-4">
+                            <h5 class="mb-3 font-semibold">
+                                Batches in this Order
+                            </h5>
+                            <div v-if="item.batches && item.batches.length">
+                                <div
+                                    v-for="batch in item.batches"
+                                    :key="batch.id"
+                                    class="flex items-center justify-between border-b p-2 last:border-b-0"
+                                >
+                                    <div>
+                                        <div class="font-medium">
+                                            {{ batch.batch_code }} -
+                                            {{ batch.product?.name }}
+                                        </div>
+                                        <div
+                                            class="text-muted-foreground text-sm"
+                                        >
+                                            Quantity:
+                                            {{ batch.pivot.quantity }} • Price:
+                                            ${{ batch.pivot.price_per_unit }} •
+                                            Total: ${{
+                                                batch.pivot.total_price
+                                            }}
+                                        </div>
+                                    </div>
+                                    <Button
+                                        variant="outline"
+                                        size="sm"
+                                        @click.stop="
+                                            router.get(
+                                                `/batches?open_id=${batch.id}`,
+                                            )
+                                        "
+                                    >
+                                        View Batch
+                                    </Button>
+                                </div>
+                            </div>
+                            <div v-else class="text-muted-foreground">
+                                No batches associated with this order.
+                            </div>
+                        </div>
+
+                        <!-- Payment Information -->
+                        <div class="rounded-lg border p-4">
+                            <h5 class="mb-3 font-semibold">
+                                Payment Information
+                            </h5>
+                            <div v-if="item.payment">
+                                <div class="grid grid-cols-2 gap-4 text-sm">
+                                    <div>
+                                        <strong>Status:</strong>
+                                        <Badge
+                                            :variant="
+                                                item.payment.payment_status ===
+                                                'paid'
+                                                    ? 'success'
+                                                    : 'secondary'
+                                            "
+                                        >
+                                            {{ item.payment.payment_status }}
+                                        </Badge>
+                                    </div>
+                                    <div>
+                                        <strong>Amount:</strong> ${{
+                                            item.payment.amount
+                                        }}
+                                    </div>
+                                    <div>
+                                        <strong>Due Date:</strong>
+                                        {{
+                                            new Date(
+                                                item.payment.due_date,
+                                            ).toLocaleDateString()
+                                        }}
+                                    </div>
+                                    <div>
+                                        <strong>Payment Date:</strong>
+                                        {{
+                                            item.payment.payment_date
+                                                ? new Date(
+                                                      item.payment.payment_date,
+                                                  ).toLocaleDateString()
+                                                : 'Not paid'
+                                        }}
+                                    </div>
+                                </div>
+                            </div>
+                            <div v-else class="text-muted-foreground">
+                                No payment information available.
+                            </div>
+                        </div>
+
+                        <!-- Related Documents -->
+                        <div class="rounded-lg border p-4">
+                            <h5 class="mb-3 font-semibold">
+                                Related Documents
+                            </h5>
+                            <div class="flex space-x-2">
+                                <Button
+                                    v-if="item.invoice"
+                                    variant="outline"
+                                    size="sm"
+                                    @click="viewInvoice(item)"
+                                >
+                                    View Invoice #{{ item.invoice.id }}
+                                </Button>
+                                <Button
+                                    v-else
+                                    variant="outline"
+                                    size="sm"
+                                    @click="generateInvoice(item)"
+                                >
+                                    Create Invoice
+                                </Button>
+
+                                <Button
+                                    v-if="item.packing_list"
+                                    variant="outline"
+                                    size="sm"
+                                    @click="viewPackingList(item)"
+                                >
+                                    View Packing List
+                                </Button>
+                                <Button
+                                    v-else
+                                    variant="outline"
+                                    size="sm"
+                                    @click="generatePackingList(item)"
+                                >
+                                    Create Packing List
+                                </Button>
+                            </div>
+                        </div>
+
+                        <!-- Metadata -->
+                        <div class="text-muted-foreground text-xs">
+                            Created:
+                            {{ new Date(item.created_at).toLocaleString() }} |
+                            Updated:
+                            {{ new Date(item.updated_at).toLocaleString() }}
+                        </div>
+                    </div>
+                </td>
+            </tr>
+        </template>
+    </GenericModelPage>
+</template>
+
+<style scoped>
+.fk-link {
+    color: #2563eb;
+    text-decoration: underline;
+    cursor: pointer;
+    display: inline-flex;
+    align-items: center;
+    gap: 0.25rem;
+    transition: all 0.2s ease;
+}
+
+.fk-link:hover {
+    color: #1d4ed8;
+    background-color: #eff6ff;
+    padding: 0.125rem 0.25rem;
+    border-radius: 0.25rem;
+}
+</style>
Index: routes/web.php
===================================================================
--- routes/web.php	(revision f5f9406e9e4be48f97b260a58bf9209fe9ab82bb)
+++ routes/web.php	(revision ed7071d5c174a996a48ee7b4df938b0d2d067c6c)
@@ -5,4 +5,5 @@
 use App\Http\Controllers\DashboardController;
 use App\Http\Controllers\AuthController;
+use App\Http\Controllers\OrderController;
 use Illuminate\Http\Request;
 
@@ -35,4 +36,5 @@
     });
 
+    // Generic model routes (including orders)
     Route::prefix('{model}')->where([
         'model' => '^(?!users$).*$'