To address your problem of creating a table that combines notes for each day and shows them in stage columns, while also providing buttons to show summary rows for a day, week, or month, you can follow these steps:
-
Custom CSS for Text Wrapping: Ensure that your custom CSS is correctly applied to the table columns to handle text wrapping.
-
Dynamic Filtering: Use Livewire to dynamically filter and update the table based on the selected time period (day, week, month).
-
Summarizing Notes: Ensure that the summarization logic correctly groups and formats the notes.
Here is a more detailed solution:
Step 1: Custom CSS for Text Wrapping
Ensure that your CSS class for text wrapping is correctly defined and applied. You can add the following CSS to your project:
.summary-field {
white-space: pre-wrap; /* This will ensure that the text wraps */
word-wrap: break-word; /* This will break long words */
}
Step 2: Livewire Component for Dynamic Filtering
Create a Livewire component to handle the dynamic filtering and updating of the table.
Livewire Component (ScheduleTable.php)
namespace App\Http\Livewire;
use Livewire\Component;
use App\Models\Schedule;
use Illuminate\Support\Carbon;
class ScheduleTable extends Component
{
public $timePeriod = 'day'; // default time period
public $currentDate;
public function mount()
{
$this->currentDate = Carbon::today();
}
public function changeTimePeriod($period)
{
$this->timePeriod = $period;
$this->currentDate = Carbon::today(); // reset to today
}
public function previous()
{
$this->currentDate = $this->currentDate->sub($this->timePeriod, 1);
}
public function next()
{
$this->currentDate = $this->currentDate->add($this->timePeriod, 1);
}
public function render()
{
$schedules = Schedule::query()
->whereBetween('schedule_date', [$this->currentDate->startOf($this->timePeriod), $this->currentDate->endOf($this->timePeriod)])
->get()
->groupBy('schedule_date');
return view('livewire.schedule-table', compact('schedules'));
}
}
Livewire Blade View (schedule-table.blade.php)
<div>
<div class="flex justify-between mb-4">
<div>
<button wire:click="changeTimePeriod('day')">Day</button>
<button wire:click="changeTimePeriod('week')">Week</button>
<button wire:click="changeTimePeriod('month')">Month</button>
</div>
<div>
<button wire:click="previous">Previous</button>
<button wire:click="next">Next</button>
</div>
</div>
<table>
<thead>
<tr>
<th>Date</th>
<th>Stage 5 Notes</th>
<th>Stage 6 Notes</th>
</tr>
</thead>
<tbody>
@foreach($schedules as $date => $scheduleGroup)
<tr>
<td>{{ $date }}</td>
<td class="summary-field">
{{ $scheduleGroup->where('schedule_stage', 5)->pluck('schedule_note')->implode("\n") }}
</td>
<td class="summary-field">
{{ $scheduleGroup->where('schedule_stage', 6)->pluck('schedule_note')->implode("\n") }}
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
Step 3: Register Livewire Component
Ensure that you register the Livewire component in your web.php routes file or in your Livewire service provider.
use App\Http\Livewire\ScheduleTable;
Route::get('/schedule-table', ScheduleTable::class);
Step 4: Update Filament Resource
Update your Filament resource to use the Livewire component.
ScheduleResource.php
use App\Http\Livewire\ScheduleTable;
public static function table(Table $table): Table
{
return $table
->columns([
Tables\Columns\TextColumn::make('schedule_date')
->date()
->sortable(),
Tables\Columns\TextColumn::make('stage_5')
->summarize(Summarizer::make()
->using(fn(Builder $query): string => $query
->where('schedule_stage', '5')
->get()
->pluck('schedule_note')
->implode("\n")
)
->extraAttributes(['class' => 'summary-field'])
),
Tables\Columns\TextColumn::make('stage_6')
->summarize(Summarizer::make()
->using(fn(Builder $query): string => $query
->where('schedule_stage', '6')
->get()
->pluck('schedule_note')
->implode("\n")
)
->extraAttributes(['class' => 'summary-field'])
),
]);
}
This solution should help you create a table that combines notes for each day and shows them in stage columns, with buttons to show summary rows for a day, week, or month, and allows for navigation between previous and next periods.