[Vuejs]-Laravel API pass to Vuejs query join nested transaction and order Ttbles

Follow the steps below:

1.Creating models and adding relationship between them.

You can create models for transaction , order & product using phpartisan.

php artisan make:model Transaction
php artisan make:model Order
php artisan make:model Product

configure them according to your mysql tables structure.

Adding relationships.

Transaction Model

public function order(){
  return $this->hasOne(Order::class, 'transaction_id', 'id');
}

Order Model

public function transaction(){
  return $this->belongsTo(Transaction::class);
}

public function products(){
  return $this->hasMany(Product::class, 'id', 'product_id');
}

Product Model

public function order(){
  return $this->belongsTo(Order::class);
}

2.Creating a controller to handle the results.

You can create a controller using phpartisan.

php artisan make:controller TransactionController -r

Setting up our controller.

public function TransactionDetails($transactionID){

   $transaction = Transaction::where('id',$transactionID)->firstOrFail();
   $order = $transaction->order;
   $products = $order->products;

   $result = array();
   $result['transaction'] = $transaction;
   $result['transaction']['order'] = $order;
   $result['transaction']['order']['products'] = $products;

   return response()->json($result);

}

This should work and give you your desired output , if any error occurs let me know.

generating models.

php artisan make:model Transaction
php artisan make:model Order
php artisan make:model Product

TransactionModel

public function orders()
{
    return $this->hasMany(Order::class, 'transaction_id', 'id');
}

ProductModel

public function orders()
{
    return $this->hasMany(Order:class, 'product_id', 'id');
}

OrderMode

public function product()
{
    return $this->belongsTo(Product::class, 'product_id', 'id');
}

public function transaction()
{
    return $this->belongsTo(Transaction::class, 'transaction_id', 'id');
}

You can create a ResourceCollection to generate your desired JSON output.

php artisan make:resource TransactionCollection

this will create a ResourceCollecion in app\Http\Resource\TransactionCollection

TransactionCollection

class TransactionCollection extends ResourceCollection
{
    /**
     * Transform the resource collection into an array.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return array
     */
    public function toArray($request)
    {
        $transactions = [];

        foreach($this->collection as $transaction) {

            $jsonTransaction = [
                'id'     => $transaction->id,
                'date'   => $transaction->transaction_date,
                'total'  => $transaction->transaction_total,
                'change' => $transaction->transaction_change,
                'orders' => []
            ];

            foreach($transaction->orders as $order) {

                $product = $order->product;

                array_push($jsonTransaction['orders'], [
                    'id'           => $order->id,
                    'product_name' => $product->product_name,
                    'category'     => $product->product_category,
                    'price'        => $order->order_price,
                    'quantity'     => $order->order_quantity
                ]);
            }

            array_push($transactions, $jsonTransaction);
        }
    }
}

TransactionController

public function getAllTransactions()
{
    // this will return your desired json result as you posted in the question.
    return TransactionCollection::make(Transaction::all());
}