Step 01: Setting up web.php in routes for order_item resource and also moving out calculateOrderPrice ( which we implemented in this post ) from is_admin middleware to auth middleware so that these order manipulation can be done by both admin and customer
Route::group(['middleware'=> [ 'auth']], function() { Route::resource('orders', \App\Http\Controllers\OrderController::class); Route::post('/order_items/cal_cost', [\App\Http\Controllers\OrderItemController::class, 'calculateOrderPrice'])->name('calCost'); // both admin and customer will use this route Route::resource('order_items', \App\Http\Controllers\OrderItemController::class); // resource route for order item... both admin and customer will use this route Route::group(['middleware'=> ['is_admin']], function() { Route::resource('users', \App\Http\Controllers\UserController::class); Route::post('/products/save_order/{product}', [\App\Http\Controllers\ProductController::class, 'saveOrder'])->name('products.save_order'); Route::post('/profiles/save_order/{profile}', [\App\Http\Controllers\ProfileController::class, 'saveOrder'])->name('profiles.save_order'); Route::post('/frame_widths/save_order/{frame_width}', [\App\Http\Controllers\FrameWidthController::class, 'saveOrder'])->name('frame_widths.save_order'); Route::resource('products', \App\Http\Controllers\ProductController::class); Route::resource('profiles', \App\Http\Controllers\ProfileController::class); Route::resource('frame_widths', \App\Http\Controllers\FrameWidthController::class); }); });
Step 02: Changing OrderItemController.php adding index() method like below
public function index( Request $request ) { $orderId = $request->post( 'order_id' ); $order_items = OrderItem::with(['order','product','fwidth','profile'])->where( 'order_id', $orderId)->get(); $meta_title = 'Preview Order for company "' . $order_items[0]->order->company_name. '" and job/po "'. $order_items[0]->order->job_number. '"'; //dd($meta_title); return view( 'order_items.preview', compact( 'meta_title', 'order_items' ) ); }
Above, we have used eager loading on order, product, fwidth and profile for order items so that query does not repeatedly run in foreach loop in view.
Step 03: Adding preview.blade.php under resources/views/order_items
@extends('layouts.app') @section('content') <div class="container"> <div class="row justify-content-center"> <div class="col-md-10"> <div class="row"> <div class="col-md-10"> <h2 class="">Preview Order for company "{{ $order_items[0]->order->company_name }}" and JOB/PO "{{ $order_items[0]->order->job_number }}"</h2> </div> <div class="col-md-2 pt-1" > <a class="btn btn-sm btn-primary float-end" href="{{ route('order_items.create').'?order_id='.$order_items[0]->order_id }}"> Add More Item <br> into Order</a> </div> </div> <table class="table mt-3"> <thead class="table-dark"> <tr> <th class="text-center">Product</th> <th class="text-center">Profiler </th> <th class="text-center">Width(In) </th> <th class="text-center">Height(In) </th> <th class="text-center">Fr. Width </th> <th class="text-center">Fr. Width Percentage(%) </th> <th class="text-center">Total Sq. Ft </th> <th class="text-center">Qty </th> <th class="text-center">Cost </th> <th class="text-center">Additional Req. </th> <th class="text-center">Actions</th> </tr> </thead> <tbody> @php $totalCost = 0; $totalsqf = 0; @endphp @foreach ($order_items as $orderItem) @php $priceParams = ['quantity' => $orderItem->quantity, 'cost' => $orderItem->cost, 'percentage' => $orderItem->fwidth->percentage, 'total_square_feet' => $orderItem->total_square_feet ]; $cost = $orderItem->calculateOrderPrice($priceParams); $totalCost = $totalCost + $cost; $totalsqf = $totalsqf + $orderItem->total_square_feet; @endphp <tr> <td>{{$orderItem->product->name}}</td> <td class="text-center">{{ $orderItem->profile->name }}</td> <td class="text-center">{{ $orderItem->width }}</td> <td class="text-center">{{ $orderItem->height }}</td> <td class="text-center">{{ $orderItem->fwidth->name }}</td> <td class="text-center">{{ $orderItem->fwidth->percentage }}</td> <td class="text-center">{{ $orderItem->total_square_feet }}</td> <td class="text-center">{{ $orderItem->quantity }}</td> <td class="text-center"><span class="badge bg-success">${{ number_format($cost, 2) }}</span></td> <td class="text-center"> <small><a class="additional-request-link align-items-center" id="addi-req-link-{{ $orderItem->id }}" href="javascript:void(0);" data-rowid="{{ $orderItem->id }}" > {{ !empty($orderItem->additional_request) ? '' : 'Not Given' }} </a></small> </td> <td class="text-center"> <a class="text-black" href="{{ route('order_items.edit', $orderItem->id) }}"><i class="bi bi-pencil"></i></a> <a class="text-black delete-row" href="javascript:void(0);" data-base-url="{{ url('') }}" data-rowname="{{ $orderItem->id }}" data-rowid="{{ $orderItem->id }}" data-resource="order_items"><i class="bi bi-trash"></i></a></td> </td> </tr> @endforeach @if (count($order_items) == 0) <tr> <td colspan="10">No Item in this order</td> </tr> @else <tr> <td colspan="6"></td> <td> {{ number_format($totalsqf, 2) }} </td> <td class="text-right">Total Cost</td> <td class="text-center"><span class="badge bg-success">${{ number_format($totalCost, 2) }}</span> </td> <td></td> </tr> @endif </tbody> </table> </div> </div> </div> <div id="modal-delete-confirm" class="modal fade"> <div class="modal-dialog modal-md modal-dialog-centered" > <div class="modal-content" > <div class="modal-header"> <h4><strong >Confirm Delete </strong></h4> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-hidden="true"></button> </div> <div class="modal-body text-center"> <p>Would you like to delete this row <span id="modal-delete-title"></span>? <br>Once deleted it cannot be reverted.</p> <div class="row justify-content-center"> <div class="col-3"> <form id="list-frm-modal" class="float-start" method="POST" action=""> @csrf @method('DELETE') <button type="submit" class="btn btn-sm btn-danger white">Yes</button> </form> <a href="javascript:void(0);" class="btn btn-sm btn-info white float-end" data-bs-dismiss="modal">No</a> </div> </div> </div> </div> </div> </div> @endsection
Above, we have used OrderItem model method calculateOrderPrice() like we previously used for calculating total order price dynamically using ajax.
Additionally, we have used product name, profile name and frame width name through belongsTo relationship with order item which is eager loaded from controller.