Level 104
I can't see where you are attempting to unpack a variable; what file and line is complaining? We should be expecting to see something like ...$variable where $variable is expected to be an array, but is probably null.
Mar 2, 2025
8
Level 1
Only arrays and Traversables can be unpacked
Please i need help, i don't know why I keep getting this error "Only arrays and Traversables can be unpacked"
here is my file
livewire/ProcessedTransaction.php
namespace App\Livewire;
use Livewire\Component;
use App\Models\Transactions;
use App\Models\User;
class ProcessedTransactions extends Component
{
public $transactionId;
public $transaction;
// Listen for the emitted event to set the transaction ID
protected $listeners = ['setTransactionId' => 'setTransaction'];
// Method to set transaction ID and fetch transaction data
public function setTransaction($transactionId)
{
$this->transactionId = $transactionId;
$this->transaction = Transactions::findOrFail($transactionId);
}
public $transactions;
public $dataTransactions;
public $airtimeTransactions;
public $cableTransactions;
public $electricityTransactions;
public $examTransactions;
public function mount()
{
// Fetch all transactions
$this->transactions = Transactions::all(); // No need for an ID here
// Fetch categorized transactions
$this->dataTransactions = Transactions::where('service', 'Data')->get();
$this->airtimeTransactions = Transactions::where('service', 'Airtime')->get();
$this->cableTransactions = Transactions::where('service', 'Cable')->get();
$this->electricityTransactions = Transactions::where('service', 'Electricity')->get();
$this->examTransactions = Transactions::where('service', 'Exam')->get();
}
public function refund($id)
{
// Find the specific transaction by its ID
$transaction = Transactions::findOrFail($id);
// Log the current status for debugging
\Log::info('Checking transaction status:', [
'transaction_id' => $transaction->id,
'status' => $transaction->status,
]);
// Convert the status to lowercase for case-insensitive comparison
$status = strtolower($transaction->status);
// Check if THIS SPECIFIC TRANSACTION is already refunded
if ($status === 'refunded') {
\Log::warning('Transaction already refunded:', [
'transaction_id' => $transaction->id,
]);
return response()->json(['message' => 'This transaction has already been refunded'], 400);
}
// Find the user associated with this transaction
$user = User::where('username', $transaction->username)->first();
if (!$user) {
\Log::error('User not found for transaction:', [
'transaction_id' => $transaction->id,
'username' => $transaction->username,
]);
return response()->json(['message' => 'User not found'], 404);
}
// Refund the amount to the user's wallet
$user->wallet_balance += $transaction->amount;
$user->save();
// Update THIS SPECIFIC TRANSACTION'S status to "refunded"
$transaction->status = 'Refunded';
$transaction->save();
// Log the updated status for debugging
\Log::info('Transaction refunded successfully:', [
'transaction_id' => $transaction->id,
'new_status' => $transaction->status,
]);
return response()->json(['message' => 'Refund successful'], 200);
}
public function render()
{
return view('livewire.processed-transactions');
}
}```
## My HTML blade
```<div>
<h1>Transactions</h1>
<!-- Tabs -->
<ul class="nav trans-tab nav-tabs" id="transactionTabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="all-transaction-tab" data-toggle="tab" href="#all-transaction" role="tab" aria-controls="all-transaction" aria-selected="true">All Transactions</a>
</li>
<li class="nav-item">
<a class="nav-link" id="data-transaction-tab" data-toggle="tab" href="#data-transaction" role="tab" aria-controls="data-transaction" aria-selected="false">Data Transactions</a>
</li>
<li class="nav-item">
<a class="nav-link" id="airtime-transaction-tab" data-toggle="tab" href="#airtime-transaction" role="tab" aria-controls="airtime-transaction" aria-selected="false">Airtime Transactions</a>
</li>
<li class="nav-item">
<a class="nav-link" id="cable-transaction-tab" data-toggle="tab" href="#cable-transaction" role="tab" aria-controls="cable-transaction" aria-selected="false">Cable Transactions</a>
</li>
<li class="nav-item">
<a class="nav-link" id="electricity-transaction-tab" data-toggle="tab" href="#electricity-transaction" role="tab" aria-controls="electricity-transaction" aria-selected="false">Electricity Transactions</a>
</li>
<li class="nav-item">
<a class="nav-link" id="exam-pins-transaction-tab" data-toggle="tab" href="#exam-pins-transaction" role="tab" aria-controls="exam-pins-transaction" aria-selected="false">Exam Pins Transactions</a>
</li>
</ul>
<!-- Tab Content -->
<div class="tab-content" id="transactionTabsContent">
<!-- All Transaction Tab -->
<div class="tab-pane fade show active" id="all-transaction" role="tabpanel" aria-labelledby="all-transaction-tab">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Task Overview</h5>
<!-- Search Input -->
<div class="d-flex justify-content-end mb-3">
<div class="search-container">
<input type="text" id="searchInput" class="form-control search-box" placeholder="Search...">
<span class="search-icon"><i class="material-icons-outlined">search</i></span>
</div>
</div>
<div class="table-responsive">
<table class="table" id="all-transaction-table">
<thead>
<tr>
<th>Invoice</th>
<th>Status</th>
<th>Service</th>
<th>Username</th>
<th>Service Provider</th>
<th>Service Plan</th>
<th>Amount</th>
<th>Phone Number</th>
<th>Smart Card Number</th>
<th>Meter Number</th>
<th>Quantity</th>
<th>Electricity Token</th>
<th>ePIN</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@if (empty($this->transactions))
<tr>
<td colspan="15" class="text-center">No data available</td>
</tr>
@else
@foreach($transactions as $transaction)
<tr data-id="{{ $transaction->id }}"
data-invoice="{{ $transaction->transaction_id }}"
data-status="{{ $transaction->status }}"
data-service="{{ $transaction->service }}"
data-username="{{ $transaction->username }}"
data-provider="{{ $transaction->service_provider }}"
data-plan="{{ $transaction->service_plan }}"
data-amount="{{ $transaction->amount }}"
data-phone="{{ $transaction->phone_number }}"
data-card="{{ $transaction->smart_card_number }}"
data-meter="{{ $transaction->meter_number }}"
data-quantity="{{ $transaction->quantity }}"
data-token="{{ $transaction->electricity_token }}"
data-epin="{{ $transaction->epin }}">
<td>{{ $transaction->transaction_id }}</td>
<td><span class="status {{ strtolower($transaction->status) === 'successful' ? 'completed #198754' : 'cancel #dc3545' }}">
{{ ucfirst($transaction->status) }}
</span></td>
<td>
<div class="d-flex">
<span><img src="{{ $transaction->image }}" alt="User Image" class="img-thumbnails rounded-circle" width="40"></span>
<div class="ms-2"><span>{{ $transaction->service }}</span></div>
</div>
</td>
<td>{{ $transaction->username }}</td>
<td>{{ $transaction->service_provider }}</td>
<td>{{ $transaction->service_plan }}</td>
<td>{{ $transaction->amount }}</td>
<td>{{ $transaction->phone_number }}</td>
<td>{{ $transaction->smart_card_number }}</td>
<td>{{ $transaction->meter_number }}</td>
<td>{{ $transaction->quantity }}</td>
<td>{{ $transaction->electricity_token }}</td>
<td>{{ $transaction->epin }}</td>
<td>{{ $transaction->created_at }}</td>
<td>
<span class="material-icons-outlined visibility" wire:click="$dispatch('setTransactionId', {{ $transaction->id }})" data-toggle="modal" data-target="#transactionModal{{ $transaction->id }}">visibility</span>
</td>
</tr>
<!-- Transaction Details Modal -->
<div class="modal fade" id="transactionModal{{ $transaction->id }}" tabindex="-1" aria-labelledby="transactionModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form>
<div class="modal-header">
<h5 class="modal-title" id="transactionModalLabel">Transaction Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<p><strong>Invoice:</strong> <span>{{ $transaction->transaction_id }}</span></p>
<p><strong>Status:</strong> <span>{{ $transaction->status }}</span></p>
<p><strong>Service:</strong> <span>{{ $transaction->service }}</span></p>
<p><strong>Username:</strong> <span>{{ $transaction->username }}</span></p>
<p><strong>Service Provider:</strong> <span>{{ $transaction->service_provider }}</span></p>
<p><strong>Service Plan:</strong> <span>{{ $transaction->service_plan }}</span></p>
</div>
<div class="col-md-6">
<p><strong>Amount:</strong> <span>{{ $transaction->amount }}</span></p>
<p><strong>Phone Number:</strong> <span>{{ $transaction->phone_number }}</span></p>
<p><strong>Smart Card Number:</strong> <span>{{ $transaction->smart_card_number }}</span></p>
<p><strong>Meter Number:</strong> <span>{{ $transaction->meter_number }}</span></p>
<p><strong>Quantity:</strong> <span>{{ $transaction->quantity }}</span></p>
<p><strong>Electricity Token:</strong> <span>{{ $transaction->electricity_token }}</span></p>
<p><strong>ePIN:</strong> <span>{{ $transaction->epin }}</span></p>
</div>
</div>
</div>
<div class="modal-footer">
@if(session()->has('message'))
<div class="alert alert-info">
{{ session('message') }}
</div>
@endif
<button type="button" class="btn btn-danger" wire:click="refund" wire:loading.attr="disabled">Refund</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Data Transaction Tab -->
<div class="tab-pane fade" id="data-transaction" role="tabpanel" aria-labelledby="data-transaction-tab">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Task Overview</h5>
<!-- Search Input -->
<div class="d-flex justify-content-end mb-3">
<div class="search-container">
<input type="text" id="searchInput" class="form-control search-box" placeholder="Search...">
<span class="search-icon"><i class="material-icons-outlined">search</i></span>
</div>
</div>
<div class="table-responsive">
<table class="table" id="data-transaction-table">
<thead>
<tr>
<th>Invoice</th>
<th>Status</th>
<th>Service</th>
<th>Username</th>
<th>Amount</th>
<th>Phone Number</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@if (empty($this->dataTransactions))
<tr>
<td colspan="15" class="text-center">No data available</td>
</tr>
@else
@foreach($dataTransactions as $transaction)
<tr data-id="{{ $transaction->id }}"
data-invoice="{{ $transaction->transaction_id }}"
data-status="{{ $transaction->status }}"
data-service="{{ $transaction->service }}"
data-username="{{ $transaction->username }}"
data-amount="{{ $transaction->amount }}"
data-phone="{{ $transaction->phone_number }}">
<td>{{ $transaction->transaction_id }}</td>
<td>{{ $transaction->status }}</td>
<td>
<div class="d-flex">
<span><img src="{{ $transaction->image }}" alt="User Image" class="img-thumbnails rounded-circle" width="40"></span>
<div class="ms-2"><span>{{ $transaction->service }}</span></div>
</div>
</td>
<td>{{ $transaction->username }}</td>
<td>{{ $transaction->amount }}</td>
<td>{{ $transaction->phone_number }}</td>
<td>{{ $transaction->created_at }}</td>
<td>
<span class="material-icons-outlined datavisibility visib" wire:click="$dispatch('setTransactionId', {{ $transaction->id }})" data-toggle="modal" data-target="#datatransactionModal{{ $transaction->id }}">visibility</span>
</td>
</tr>
<!-- Data Details Modal -->
<div class="modal fade" id="datatransactionModal{{ $transaction->id }}" tabindex="-1" aria-labelledby="datatransactionModalLabel{{ $transaction->id }}" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form>
<div class="modal-header">
<h5 class="modal-title" id="transactionModalLabel{{ $transaction->id }}">Transaction Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<p><strong>Invoice:</strong> <span id="modalInvoices"></span></p>
<p><strong>Status:</strong> <span id="modalStatuss"></span></p>
<p><strong>Service:</strong> <span id="modalServices"></span></p>
<p><strong>Username:</strong> <span id="modalUsernames"></span></p>
</div>
<div class="col-md-6">
<p><strong>Amount:</strong> <span id="modalAmounts"></span></p>
<p><strong>Phone Number:</strong> <span id="modalPhones"></span></p>
</div>
</div>
</div>
<div class="modal-footer">
@if(session()->has('message'))
<div class="alert alert-info">
{{ session('message') }}
</div>
@endif
<button type="button" class="btn btn-danger" wire:click="refund" wire:loading.attr="disabled">Refund</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Airtime Transaction Tab -->
<div class="tab-pane fade" id="airtime-transaction" role="tabpanel" aria-labelledby="airtime-transaction-tab">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Task Overview</h5>
<!-- Search Input -->
<div class="d-flex justify-content-end mb-3">
<div class="search-container">
<input type="text" id="searchInput" class="form-control search-box" placeholder="Search...">
<span class="search-icon"><i class="material-icons-outlined">search</i></span>
</div>
</div>
<div class="table-responsive">
<table class="table" id="airtime-transaction-table">
<thead>
<tr>
<th>Invoice</th>
<th>Status</th>
<th>Service</th>
<th>Username</th>
<th>Amount</th>
<th>Phone Number</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@if (empty($this->airtimeTransactions))
<tr>
<td colspan="15" class="text-center">No data available</td>
</tr>
@else
@foreach($airtimeTransactions as $transaction)
<tr data-id="{{ $transaction->id }}"
data-invoice="{{ $transaction->transaction_id }}"
data-status="{{ $transaction->status }}"
data-service="{{ $transaction->service }}"
data-username="{{ $transaction->username }}"
data-amount="{{ $transaction->amount }}"
data-phone="{{ $transaction->phone_number }}">
<td>{{ $transaction->transaction_id }}</td>
<td>{{ $transaction->status }}</td>
<td>
<div class="d-flex">
<span><img src="{{ $transaction->image }}" alt="User Image" class="img-thumbnails rounded-circle" width="40"></span>
<div class="ms-2"><span>{{ $transaction->service }}</span></div>
</div>
</td>
<td>{{ $transaction->username }}</td>
<td>{{ $transaction->amount }}</td>
<td>{{ $transaction->phone_number }}</td>
<td>{{ $transaction->created_at }}</td>
<td>
<span class="material-icons-outlined airtimevisibility visib" wire:click="$dispatch('setTransactionId', {{ $transaction->id }})" data-toggle="modal" data-target="#airtimetransactionModal{{ $transaction->id }}">visibility</span>
</td>
</tr>
<!-- Airtime Details Modal -->
<div class="modal fade" id="airtimetransactionModal{{ $transaction->id }}" tabindex="-1" aria-labelledby="airtimetransactionModalLabel{{ $transaction->id }}" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form>
<div class="modal-header">
<h5 class="modal-title" id="transactionModalLabel{{ $transaction->id }}">Transaction Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<p><strong>Invoice:</strong> <span id="airtimemodalInvoice{{ $transaction->id }}">{{ $transaction->transaction_id }}</span></p>
<p><strong>Status:</strong> <span id="airtimemodalStatus{{ $transaction->id }}">{{ $transaction->status }}</span></p>
<p><strong>Service:</strong> <span id="airtimemodalService{{ $transaction->id }}">{{ $transaction->service }}</span></p>
<p><strong>Username:</strong> <span id="airtimemodalUsername{{ $transaction->id }}">{{ $transaction->username }}</span></p>
</div>
<div class="col-md-6">
<p><strong>Amount:</strong> <span id="airtimemodalAmount{{ $transaction->id }}">{{ $transaction->amount }}</span></p>
<p><strong>Phone Number:</strong> <span id="airtimemodalPhone{{ $transaction->id }}">{{ $transaction->phone_number }}</span></p>
</div>
</div>
</div>
<div class="modal-footer">
@if(session()->has('message'))
<div class="alert alert-info">
{{ session('message') }}
</div>
@endif
<button type="button" class="btn btn-danger" wire:click="refund" wire:loading.attr="disabled">Refund</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Cable Transactions Tab -->
<div class="tab-pane fade" id="cable-transaction" role="tabpanel" aria-labelledby="cable-transaction-tab">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Task Overview</h5>
<!-- Search Input -->
<div class="d-flex justify-content-end mb-3">
<div class="search-container">
<input type="text" id="searchInput" class="form-control search-box" placeholder="Search...">
<span class="search-icon"><i class="material-icons-outlined">search</i></span>
</div>
</div>
<div class="table-responsive">
<table class="table" id="cable-transaction-table">
<thead>
<tr>
<th>Invoice</th>
<th>Status</th>
<th>Service</th>
<th>Username</th>
<th>Amount</th>
<th>Phone Number</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@if (empty($this->cableTransactions))
<tr>
<td colspan="15" class="text-center">No data available</td>
</tr>
@else
@foreach($cableTransactions as $transaction)
<tr data-id="{{ $transaction->id }}"
data-invoice="{{ $transaction->transaction_id }}"
data-status="{{ $transaction->status }}"
data-service="{{ $transaction->service }}"
data-username="{{ $transaction->username }}"
data-amount="{{ $transaction->amount }}"
data-phone="{{ $transaction->phone_number }}">
<td>{{ $transaction->transaction_id }}</td>
<td>{{ $transaction->status }}</td>
<td>
<div class="d-flex">
<span><img src="{{ $transaction->image }}" alt="User Image" class="img-thumbnails rounded-circle" width="40"></span>
<div class="ms-2"><span>{{ $transaction->service }}</span></div>
</div>
</td>
<td>{{ $transaction->username }}</td>
<td>{{ $transaction->amount }}</td>
<td>{{ $transaction->phone_number }}</td>
<td>{{ $transaction->created_at }}</td>
<td>
<span class="material-icons-outlined cablevisibility visib" wire:click="$dispatch('setTransactionId', {{ $transaction->id }})" data-toggle="modal" data-target="#cabletransactionModal{{ $transaction->id }}">visibility</span>
</td>
</tr>
<!-- Cable Details Modal -->
<div class="modal fade" id="cabletransactionModal{{ $transaction->id }}" tabindex="-1" aria-labelledby="cabletransactionModalLabel{{ $transaction->id }}" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form>
<div class="modal-header">
<h5 class="modal-title" id="transactionModalLabel{{ $transaction->id }}">Transaction Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<p><strong>Invoice:</strong> <span id="cablemodalInvoice{{ $transaction->id }}">{{ $transaction->transaction_id }}</span></p>
<p><strong>Status:</strong> <span id="cablemodalStatus{{ $transaction->id }}">{{ $transaction->status }}</span></p>
<p><strong>Service:</strong> <span id="cablemodalService{{ $transaction->id }}">{{ $transaction->service }}</span></p>
<p><strong>Username:</strong> <span id="cablemodalUsername{{ $transaction->id }}">{{ $transaction->username }}</span></p>
</div>
<div class="col-md-6">
<p><strong>Amount:</strong> <span id="cablemodalAmount{{ $transaction->id }}">{{ $transaction->amount }}</span></p>
<p><strong>Phone Number:</strong> <span id="cablemodalPhone{{ $transaction->id }}">{{ $transaction->phone_number }}</span></p>
</div>
</div>
</div>
<div class="modal-footer">
@if(session()->has('message'))
<div class="alert alert-info">
{{ session('message') }}
</div>
@endif
<button type="button" class="btn btn-danger" wire:click="refund" wire:loading.attr="disabled">Refund</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Electricity Transactions Tab -->
<div class="tab-pane fade" id="electricity-transaction" role="tabpanel" aria-labelledby="electricity-transaction-tab">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Task Overview</h5>
<!-- Search Input -->
<div class="d-flex justify-content-end mb-3">
<div class="search-container">
<input type="text" id="searchInput" class="form-control search-box" placeholder="Search...">
<span class="search-icon"><i class="material-icons-outlined">search</i></span>
</div>
</div>
<div class="table-responsive">
<table class="table" id="electricity-transaction-table">
<thead>
<tr>
<th>Invoice</th>
<th>Status</th>
<th>Service</th>
<th>Username</th>
<th>Amount</th>
<th>Phone Number</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@if (empty($this->electricityTransactions))
<tr>
<td colspan="15" class="text-center">No data available</td>
</tr>
@else
@foreach($electricityTransactions as $transaction)
<tr data-id="{{ $transaction->id }}"
data-invoice="{{ $transaction->transaction_id }}"
data-status="{{ $transaction->status }}"
data-service="{{ $transaction->service }}"
data-username="{{ $transaction->username }}"
data-amount="{{ $transaction->amount }}"
data-phone="{{ $transaction->phone_number }}">
<td>{{ $transaction->transaction_id }}</td>
<td>{{ $transaction->status }}</td>
<td>
<div class="d-flex">
<span><img src="{{ $transaction->image }}" alt="User Image" class="img-thumbnails rounded-circle" width="40"></span>
<div class="ms-2"><span>{{ $transaction->service }}</span></div>
</div>
</td>
<td>{{ $transaction->username }}</td>
<td>{{ $transaction->amount }}</td>
<td>{{ $transaction->phone_number }}</td>
<td>{{ $transaction->created_at }}</td>
<td>
<span class="material-icons-outlined electricityvisibility visib" wire:click="$dispatch('setTransactionId', {{ $transaction->id }})" data-toggle="modal" data-target="#electricitytransactionModal{{ $transaction->id }}">visibility</span>
</td>
</tr>
<!-- Electricity Details Modal -->
<div class="modal fade" id="electricitytransactionModal{{ $transaction->id }}" tabindex="-1" aria-labelledby="electricitytransactionModalLabel{{ $transaction->id }}" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form>
<div class="modal-header">
<h5 class="modal-title" id="transactionModalLabel{{ $transaction->id }}">Transaction Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<p><strong>Invoice:</strong> <span id="electricitymodalInvoice{{ $transaction->id }}">{{ $transaction->transaction_id }}</span></p>
<p><strong>Status:</strong> <span id="electricitymodalStatus{{ $transaction->id }}">{{ $transaction->status }}</span></p>
<p><strong>Service:</strong> <span id="electricitymodalService{{ $transaction->id }}">{{ $transaction->service }}</span></p>
<p><strong>Username:</strong> <span id="electricitymodalUsername{{ $transaction->id }}">{{ $transaction->username }}</span></p>
</div>
<div class="col-md-6">
<p><strong>Amount:</strong> <span id="electricitymodalAmount{{ $transaction->id }}">{{ $transaction->amount }}</span></p>
<p><strong>Phone Number:</strong> <span id="electricitymodalPhone{{ $transaction->id }}">{{ $transaction->phone_number }}</span></p>
</div>
</div>
</div>
<div class="modal-footer">
@if(session()->has('message'))
<div class="alert alert-info">
{{ session('message') }}
</div>
@endif
<button type="button" class="btn btn-danger" wire:click="refund" wire:loading.attr="disabled">Refund</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Exam Pins Transactions Tab -->
<div class="tab-pane fade" id="exam-pins-transaction" role="tabpanel" aria-labelledby="exam-pins-transaction-tab">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h5 class="card-title">Task Overview</h5>
<!-- Search Input -->
<div class="d-flex justify-content-end mb-3">
<div class="search-container">
<input type="text" id="searchInput" class="form-control search-box" placeholder="Search...">
<span class="search-icon"><i class="material-icons-outlined">search</i></span>
</div>
</div>
<div class="table-responsive">
<table class="table" id="exam-transaction-table">
<thead>
<tr>
<th>Invoice</th>
<th>Status</th>
<th>Service</th>
<th>Username</th>
<th>Amount</th>
<th>Phone Number</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@if (empty($this->examTransactions))
<tr>
<td colspan="15" class="text-center">No data available</td>
</tr>
@else
@foreach($examTransactions as $transaction)
<tr data-id="{{ $transaction->id }}"
data-invoice="{{ $transaction->transaction_id }}"
data-status="{{ $transaction->status }}"
data-service="{{ $transaction->service }}"
data-username="{{ $transaction->username }}"
data-amount="{{ $transaction->amount }}"
data-phone="{{ $transaction->phone_number }}">
<td>{{ $transaction->transaction_id }}</td>
<td>{{ $transaction->status }}</td>
<td>
<div class="d-flex">
<span><img src="{{ $transaction->image }}" alt="User Image" class="img-thumbnails rounded-circle" width="40"></span>
<div class="ms-2"><span>{{ $transaction->service }}</span></div>
</div>
</td>
<td>{{ $transaction->username }}</td>
<td>{{ $transaction->amount }}</td>
<td>{{ $transaction->phone_number }}</td>
<td>{{ $transaction->created_at }}</td>
<td>
<span class="material-icons-outlined examvisibility visib" wire:click="$dispatch('setTransactionId', {{ $transaction->id }})" data-toggle="modal" data-target="#examtransactionModal{{ $transaction->id }}">visibility</span>
</td>
</tr>
<!-- Exam Details Modal -->
<div class="modal fade" id="examtransactionModal{{ $transaction->id }}" tabindex="-1" aria-labelledby="examtransactionModalLabel{{ $transaction->id }}" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form>
<div class="modal-header">
<h5 class="modal-title" id="transactionModalLabel{{ $transaction->id }}">Transaction Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6">
<p><strong>Invoice:</strong> <span id="exammodalInvoice{{ $transaction->id }}">{{ $transaction->transaction_id }}</span></p>
<p><strong>Status:</strong> <span id="exammodalStatus{{ $transaction->id }}">{{ $transaction->status }}</span></p>
<p><strong>Service:</strong> <span id="exammodalService{{ $transaction->id }}">{{ $transaction->service }}</span></p>
<p><strong>Username:</strong> <span id="exammodalUsername{{ $transaction->id }}">{{ $transaction->username }}</span></p>
</div>
<div class="col-md-6">
<p><strong>Amount:</strong> <span id="exammodalAmount{{ $transaction->id }}">{{ $transaction->amount }}</span></p>
<p><strong>Phone Number:</strong> <span id="exammodalPhone{{ $transaction->id }}">{{ $transaction->phone_number }}</span></p>
</div>
</div>
</div>
<div class="modal-footer">
@if(session()->has('message'))
<div class="alert alert-info">
{{ session('message') }}
</div>
@endif
<button type="button" class="btn btn-danger" wire:click="refund" wire:loading.attr="disabled">Refund</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</form>
</div>
</div>
</div>
@endforeach
@endif
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
Level 1
@tykus If you check my html file, you will see a modal. when I click the visibility icon in my table it brings out the modal. when the modal pops up I then see the error on top of my modal. Or am I not retrieving it correctly?
<td><span class="material-icons-outlined visibility" wire:click="$dispatch('setTransactionId', {{ $transaction->id }})" data-toggle="modal" data-target="#transactionModal{{ $transaction->id }}">visibility</span></td>
Level 104
@Megatech I don't know ¯\_(ツ)_/¯ - there is nothing in the markup itself that would lead to that message. What file and line are associated with the error message; if not in the rendered modal, then something useful should be available from the application logs.
Level 1
@tykus this is what i rendered
{
// Fetch the required transactions based on service type
$transactions = Transactions::all();
$dataTransactions = Transactions::where('service', 'Data')->get();
$airtimeTransactions = Transactions::where('service', 'Airtime')->get();
$cableTransactions = Transactions::where('service', 'Cable')->get();
$electricityTransactions = Transactions::where('service', 'Electricity')->get();
$examTransactions = Transactions::where('service', 'Exam')->get();
// Render the view and pass the necessary data
return view('livewire.processed-transactions', compact(
'transactions', // Add this line
'dataTransactions',
'airtimeTransactions',
'cableTransactions',
'electricityTransactions',
'examTransactions'
));
}```
Level 104
@Megatech again, there is nothing obvious in the code you are sharing. Again, I will ask you which file and line does the error message point to?
Level 1
@tykus here is the line of code, which is the visibility button present in my HTML file
wire:click="$dispatch('setTransactionId', {{ $transaction->id }})
Level 104
@Megatech nope!
Please check your application's log file.
Level 80
If you check my html file, you will see a modal.
@Megatech You’ve just dumped a massive wall of code without any syntax highlighting, and expecting strangers to know exactly where the problem is.
If you’re getting an error in the browser, then it will also be highlighting the file and line number where the error is originating. Try looking there?
Please or to participate in this conversation.