fix loading spinner

This commit is contained in:
hackerESQ
2024-08-26 20:26:15 -05:00
parent 8508f55cea
commit 1e665dcd02
@@ -62,20 +62,22 @@ new class extends Component {
<x-table <x-table
:headers="$headers" :headers="$headers"
:rows="$this->transactions()" :rows="$this->transactions()"
x-data="{ loading: false, timeout: null }" x-data="{ loadingId: null, timeout: null }"
@row-click=" @row-click="
timeout = setTimeout(() => { loading = true }, 200); timeout = setTimeout(() => { loadingId = $event.detail.id }, 200);
$wire.showTransactionDialog($event.detail.id).then(() => { $wire.showTransactionDialog($event.detail.id).then(() => {
clearTimeout(timeout); clearTimeout(timeout);
loading = false; loadingId = null;
}) })
" "
:sort-by="$sortBy" :sort-by="$sortBy"
with-pagination with-pagination
> >
@scope('cell_symbol', $row) @scope('cell_symbol', $row)
{{ $row->symbol }} <span class="flex">
<x-loading x-show="loading" x-cloak class="text-gray-400 ml-2" /> {{ $row->symbol }}
<x-loading x-show="loadingId === '{{ $row->id }}'" x-cloak class="text-gray-400 ml-2" />
</span>
@endscope @endscope
@scope('cell_date', $row) @scope('cell_date', $row)
{{ $row->date->format('M d, Y') }} {{ $row->date->format('M d, Y') }}