javier/investbrain
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:mobile responsive for holdings table

Browse Source
This commit is contained in:
hackerESQ
2024-10-22 12:13:36 -05:00
parent 3fd66d1138
commit 6b424e2dcc
2 changed files with 48 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/livewire/holdings-table.blade.php
+47 -49
View File
@@ -18,19 +18,19 @@ new class extends Component {
public function mount() public function mount()
{ {
$this->headers = [ $this->headers = [
['key' => 'symbol', 'label' => __('Symbol'), 'class' => ''], ['key' => 'symbol', 'label' => __('Symbol')],
['key' => 'market_data_name', 'label' => __('Name'), 'sortable' => true], ['key' => 'market_data_name', 'label' => __('Name'), 'sortable' => true, 'class' => 'hidden md:block'],
['key' => 'quantity', 'label' => __('Quantity')], ['key' => 'quantity', 'label' => __('Quantity')],
['key' => 'average_cost_basis', 'label' => __('Average Cost Basis')], ['key' => 'average_cost_basis', 'label' => __('Average Cost Basis')],
['key' => 'total_cost_basis', 'label' => __('Total Cost Basis')], ['key' => 'total_cost_basis', 'label' => __('Total Cost Basis'), 'class' => 'hidden md:block'],
['key' => 'market_data_market_value', 'label' => __('Market Value')], ['key' => 'market_data_market_value', 'label' => __('Market Value')],
['key' => 'total_market_value', 'label' => __('Total Market Value')], ['key' => 'total_market_value', 'label' => __('Total Market Value'), 'class' => 'hidden md:block'],
['key' => 'market_gain_dollars', 'label' => __('Market Gain/Loss')], ['key' => 'market_gain_dollars', 'label' => __('Market Gain/Loss')],
['key' => 'market_gain_percent', 'label' => __('Market Gain/Loss')], ['key' => 'market_gain_percent', 'label' => __('Market Gain/Loss'), 'class' => 'hidden md:block'],
['key' => 'realized_gain_dollars', 'label' => __('Realized Gain/Loss')], ['key' => 'realized_gain_dollars', 'label' => __('Realized Gain/Loss')],
['key' => 'dividends_earned', 'label' => __('Dividends Earned')], ['key' => 'dividends_earned', 'label' => __('Dividends Earned')],
['key' => 'market_data_fifty_two_week_low', 'label' => __('52 week low')], ['key' => 'market_data_fifty_two_week_low', 'label' => __('52 week low'), 'class' => 'hidden md:block'],
['key' => 'market_data_fifty_two_week_high', 'label' => __('52 week high')], ['key' => 'market_data_fifty_two_week_high', 'label' => __('52 week high'), 'class' => 'hidden md:block'],
['key' => 'num_transactions', 'label' => __('Number of Transactions')], ['key' => 'num_transactions', 'label' => __('Number of Transactions')],
['key' => 'market_data_updated_at', 'label' => __('Last Refreshed')], ['key' => 'market_data_updated_at', 'label' => __('Last Refreshed')],
]; ];
@@ -58,46 +58,44 @@ new class extends Component {
}; ?> }; ?>
<div class="">
<x-table <x-table
:headers="$headers" :headers="$headers"
:rows="$this->holdings()" :rows="$this->holdings()"
:sort-by="$sortBy" :sort-by="$sortBy"
@row-click="$wire.goToHolding($event.detail)" @row-click="$wire.goToHolding($event.detail)"
> >
@scope('cell_average_cost_basis', $row) @scope('cell_average_cost_basis', $row)
{{ Number::currency($row->average_cost_basis ?? 0) }} {{ Number::currency($row->average_cost_basis ?? 0) }}
@endscope @endscope
@scope('cell_total_cost_basis', $row) @scope('cell_total_cost_basis', $row)
{{ Number::currency($row->total_cost_basis ?? 0) }} {{ Number::currency($row->total_cost_basis ?? 0) }}
@endscope @endscope
@scope('cell_realized_gain_dollars', $row) @scope('cell_realized_gain_dollars', $row)
{{ Number::currency($row->realized_gain_dollars ?? 0) }} {{ Number::currency($row->realized_gain_dollars ?? 0) }}
@endscope @endscope
@scope('cell_market_gain_dollars', $row) @scope('cell_market_gain_dollars', $row)
{{ Number::currency($row->market_gain_dollars ?? 0) }} {{ Number::currency($row->market_gain_dollars ?? 0) }}
@endscope @endscope
@scope('cell_market_gain_percent', $row) @scope('cell_market_gain_percent', $row)
<x-gain-loss-arrow-badge :percent="$row->market_gain_percent" /> <x-gain-loss-arrow-badge :percent="$row->market_gain_percent" />
@endscope @endscope
@scope('cell_market_data_market_value', $row) @scope('cell_market_data_market_value', $row)
{{ Number::currency($row->market_data_market_value ?? 0) }} {{ Number::currency($row->market_data_market_value ?? 0) }}
@endscope @endscope
@scope('cell_market_data_fifty_two_week_low', $row) @scope('cell_market_data_fifty_two_week_low', $row)
{{ Number::currency($row->market_data_fifty_two_week_low ?? 0) }} {{ Number::currency($row->market_data_fifty_two_week_low ?? 0) }}
@endscope @endscope
@scope('cell_market_data_fifty_two_week_high', $row) @scope('cell_market_data_fifty_two_week_high', $row)
{{ Number::currency($row->market_data_fifty_two_week_high ?? 0) }} {{ Number::currency($row->market_data_fifty_two_week_high ?? 0) }}
@endscope @endscope
@scope('cell_total_market_value', $row) @scope('cell_total_market_value', $row)
{{ Number::currency($row->total_market_value ?? 0) }} {{ Number::currency($row->total_market_value ?? 0) }}
@endscope @endscope
@scope('cell_dividends_earned', $row) @scope('cell_dividends_earned', $row)
{{ Number::currency($row->dividends_earned ?? 0) }} {{ Number::currency($row->dividends_earned ?? 0) }}
@endscope @endscope
@scope('cell_market_data_updated_at', $row) @scope('cell_market_data_updated_at', $row)
{{ \Carbon\Carbon::parse($row->market_data_updated_at)->diffForHumans() }} {{ \Carbon\Carbon::parse($row->market_data_updated_at)->diffForHumans() }}
@endscope @endscope
</x-table> </x-table>
</div>
resources/views/portfolio/show.blade.php
+1 -1
View File
@@ -87,7 +87,7 @@
<div class="mt-6 grid md:grid-cols-7 gap-5"> <div class="mt-6 grid md:grid-cols-7 gap-5">
<x-ib-card title="{{ __('Holdings') }}" class="md:col-span-4"> <x-ib-card title="{{ __('Holdings') }}" class="md:col-span-4 overflow-scroll">
@if($portfolio->holdings->isEmpty()) @if($portfolio->holdings->isEmpty())
<div class="flex justify-center items-center h-full pb-10 text-secondary"> <div class="flex justify-center items-center h-full pb-10 text-secondary">