Designed report table for production quantity
This commit is contained in:
dhanabalan
82
app/Livewire/SelectPlant.php
Normal file
82
app/Livewire/SelectPlant.php
Normal file
@@ -0,0 +1,82 @@
|
|||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Livewire;
|
||||||
|
|
||||||
|
use App\Models\Line;
|
||||||
|
use App\Models\Plant;
|
||||||
|
use App\Models\ProductionQuantity;
|
||||||
|
use Carbon\Carbon;
|
||||||
|
use Livewire\Component;
|
||||||
|
|
||||||
|
class SelectPlant extends Component
|
||||||
|
{
|
||||||
|
|
||||||
|
protected $listeners = [
|
||||||
|
'plant-line-updated' => 'updatePlantLine',
|
||||||
|
'productionUpdated' => '$refresh'
|
||||||
|
];
|
||||||
|
|
||||||
|
public $plantId;
|
||||||
|
public $lineId;
|
||||||
|
|
||||||
|
public $hourlyData = [];
|
||||||
|
|
||||||
|
public function updatePlantLine($plantId, $lineId)
|
||||||
|
{
|
||||||
|
session(['plantId' => $plantId, 'lineId' => $lineId]);
|
||||||
|
$this->plantId = $plantId;
|
||||||
|
$this->lineId = $lineId;
|
||||||
|
$this->loadData();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Method to load hourly production data
|
||||||
|
public function loadData()
|
||||||
|
{
|
||||||
|
// Define the time range from today 8:00 AM to the next day 8:00 AM
|
||||||
|
$today = now()->startOfDay()->addHours(8); // Today 8:00 AM
|
||||||
|
$nextDay = $today->copy()->addDay(); // Next day 8:00 AM
|
||||||
|
|
||||||
|
// Initialize the array to hold the hourly data
|
||||||
|
$productionCounts = [];
|
||||||
|
|
||||||
|
// Loop through each hour from today 8:00 AM to the next day 8:00 AM
|
||||||
|
for ($i = 0; $i < 24; $i++) {
|
||||||
|
// Define the start and end time for the current hour
|
||||||
|
$startOfHour = $today->copy()->addHours($i); // Start of the hour
|
||||||
|
$endOfHour = $startOfHour->copy()->addHour()->subSeconds(1); // End of the hour
|
||||||
|
|
||||||
|
// Query the production counts for the current hour (between start and end time)
|
||||||
|
$count = ProductionQuantity::query()
|
||||||
|
->where('plant_id', $this->plantId)
|
||||||
|
->where('line_id', $this->lineId)
|
||||||
|
->whereBetween('created_at', [$startOfHour, $endOfHour])
|
||||||
|
->count(); // Count the number of records in the current hour
|
||||||
|
|
||||||
|
// Store the count for the current hour in the production counts array
|
||||||
|
$productionCounts[$i] = $count;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// Set the hourly data to be used in the component's view
|
||||||
|
$this->hourlyData = $productionCounts;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// public function render()
|
||||||
|
// {
|
||||||
|
// return view('livewire.select-plant', [
|
||||||
|
// 'hourlyData' => $this->hourlyData,
|
||||||
|
// ]);
|
||||||
|
// }
|
||||||
|
|
||||||
|
public function mount()
|
||||||
|
{
|
||||||
|
$this->plantId = session('plantId');
|
||||||
|
$this->lineId = session('lineId');
|
||||||
|
|
||||||
|
if ($this->plantId && $this->lineId) {
|
||||||
|
$this->loadData();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
170
resources/views/livewire/select-plant.blade.php
Normal file
170
resources/views/livewire/select-plant.blade.php
Normal file
@@ -0,0 +1,170 @@
|
|||||||
|
|
||||||
|
|
||||||
|
<div class="flex-none md:flex space-x-4 w-full">
|
||||||
|
|
||||||
|
<!-- First Table (08:00 AM to 19:00 PM) -->
|
||||||
|
<div class="w-full px-2 py-2">
|
||||||
|
<table class="w-full divide-y divide-gray-200 border-1 rounded-lg overflow-hidden">
|
||||||
|
<thead class="bg-gray-100">
|
||||||
|
<tr>
|
||||||
|
<th class="px-2 py-2 text-center border text-xs font-bold text-gray-700 uppercase tracking-wider">No</th>
|
||||||
|
<th class="px-2 py-2 text-center border text-xs font-bold text-gray-700 uppercase tracking-wider">Time Range</th>
|
||||||
|
<th class="px-2 py-2 text-center border text-xs font-bold text-gray-700 uppercase tracking-wider">Production Quantity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
@php
|
||||||
|
// Static time range for the first 12 hours (08:00 AM to 07:00 PM)
|
||||||
|
$timeRanges = [
|
||||||
|
'08:00 AM - 09:00 AM',
|
||||||
|
'09:00 AM - 10:00 AM',
|
||||||
|
'10:00 AM - 11:00 AM',
|
||||||
|
'11:00 AM - 12:00 PM',
|
||||||
|
'12:00 PM - 13:00 PM',
|
||||||
|
'13:00 PM - 14:00 PM',
|
||||||
|
'14:00 PM - 15:00 PM',
|
||||||
|
'15:00 PM - 16:00 PM',
|
||||||
|
'16:00 PM - 17:00 PM',
|
||||||
|
'17:00 PM - 18:00 PM',
|
||||||
|
'18:00 PM - 19:00 PM',
|
||||||
|
'19:00 PM - 20:00 PM',
|
||||||
|
];
|
||||||
|
@endphp
|
||||||
|
|
||||||
|
@foreach ($timeRanges as $index => $timeRange)
|
||||||
|
<tr>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $index + 1 }}</td>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $timeRange }}</td>
|
||||||
|
<td class="px-3 py-2 border text-xs text-center whitespace-nowrap">
|
||||||
|
{{ $hourlyData[$index] ?? 0 }}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
@endforeach
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full px-2 py-2">
|
||||||
|
<table class="w-full divide-y divide-gray-200 border-1 rounded-lg overflow-hidden">
|
||||||
|
<thead class="bg-gray-100">
|
||||||
|
<tr>
|
||||||
|
<th class="px-2 py-2 text-center border text-xs font-bold text-gray-700 uppercase tracking-wider">No</th>
|
||||||
|
<th class="px-2 py-2 text-center border text-xs font-bold text-gray-700 uppercase tracking-wider">Time Range</th>
|
||||||
|
<th class="px-2 py-2 text-center border text-xs font-bold text-gray-700 uppercase tracking-wider">Production Quantity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
@php
|
||||||
|
// Static time range for the first 12 hours (08:00 AM to 07:00 PM)
|
||||||
|
$timeRanges = [
|
||||||
|
'20:00 PM - 21:00 PM',
|
||||||
|
'21:00 PM - 22:00 PM',
|
||||||
|
'22:00 PM - 23:00 PM',
|
||||||
|
'23:00 PM - 12:00 AM',
|
||||||
|
'12:00 AM - 01:00 AM',
|
||||||
|
'01:00 AM - 02:00 AM',
|
||||||
|
'02:00 AM - 03:00 AM',
|
||||||
|
'03:00 AM - 04:00 AM',
|
||||||
|
'04:00 AM - 05:00 AM',
|
||||||
|
'05:00 AM - 06:00 AM',
|
||||||
|
'06:00 AM - 07:00 AM',
|
||||||
|
'07:00 AM - 08:00 AM',
|
||||||
|
];
|
||||||
|
@endphp
|
||||||
|
|
||||||
|
@foreach ($timeRanges as $index => $timeRange)
|
||||||
|
<tr>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $index + 13 }}</td>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $timeRange }}</td>
|
||||||
|
<td class="px-3 py-2 border text-xs text-center whitespace-nowrap">
|
||||||
|
{{ $hourlyData[$index + 12] ?? 0 }}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
@endforeach
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Second Table (20:00 PM to 08:00 AM next day) -->
|
||||||
|
{{-- <div class="w-full px-2">
|
||||||
|
<table class="w-full divide-y divide-gray-200 border-1 rounded-lg overflow-hidden">
|
||||||
|
<thead class="bg-gray-100">
|
||||||
|
<tr>
|
||||||
|
<th class="px-3 py-2 border text-center text-xs font-bold text-gray-800 uppercase tracking-wider">No</th>
|
||||||
|
<th class="px-3 py-2 border text-center text-xs font-bold text-gray-800 uppercase tracking-wider">Time Range</th>
|
||||||
|
<th class="px-3 py-2 border text-center text-xs font-bold text-gray-800 uppercase tracking-wider">Production Quantity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">13</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">08:00 PM - 09:00 PM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[12] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">14</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">09:00 PM - 10:00 PM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[13] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">15</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">10:00 PM - 11:00 PM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[14] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">16</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">11:00 PM - 12:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[15] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">17</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">12:00 AM - 01:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[16] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">18</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">01:00 AM - 02:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[17] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">19</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">02:00 AM - 03:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[18] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">20</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">03:00 AM - 04:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[19] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">21</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">04:00 AM - 05:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[20] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">22</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">05:00 AM - 06:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[21] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">23</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">06:00 AM - 07:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[22] }}</td></tr>
|
||||||
|
<tr><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">24</td><td class="px-3 py-2 border text-center text-xs whitespace-nowrap">07:00 AM - 08:00 AM</td><td class="px-3 py-2 border text-xs text-center whitespace-nowrap">{{ $productionQuantities[23] }}</td></tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div> --}}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{{-- //..perfect logic --}}
|
||||||
|
|
||||||
|
{{-- <div class="flex space-x-4 w-full">
|
||||||
|
<!-- First Table: 08:00 AM to 07:00 PM -->
|
||||||
|
<div class="w-full px-2">
|
||||||
|
<table class="w-full divide-y divide-gray-200 border-1 rounded-lg border-black overflow-hidden">
|
||||||
|
<thead class="bg-gray-100">
|
||||||
|
<tr>
|
||||||
|
<th class="px-3 py-3 border text-center text-xs font-bold text-gray-700 uppercase tracking-wider">No</th>
|
||||||
|
<th class="px-3 py-3 border text-center text-xs font-bold text-gray-700 uppercase tracking-wider">Time Range</th>
|
||||||
|
<th class="px-3 py-3 border text-center text-xs font-bold text-gray-700 uppercase tracking-wider">Production Quantity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
@foreach ($hourlyData as $index => $data)
|
||||||
|
@if ($index < 12) <!-- First 12 time ranges (AM) -->
|
||||||
|
<tr>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $index + 1 }}</td>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $data['time'] }}</td>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $data['quantity'] ?: '0' }}</td> <!-- Show 0 if no data -->
|
||||||
|
</tr>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Second Table: 08:00 PM to 08:00 AM -->
|
||||||
|
<div class="w-full px-2">
|
||||||
|
<table class="w-full divide-y divide-gray-200 border-1 rounded-lg overflow-hidden">
|
||||||
|
<thead class="bg-gray-100">
|
||||||
|
<tr>
|
||||||
|
<th class="px-3 py-3 border text-center text-xs font-bold text-gray-700 uppercase tracking-wider">No</th>
|
||||||
|
<th class="px-3 py-3 border text-center text-xs font-bold text-gray-700 uppercase tracking-wider">Time Range</th>
|
||||||
|
<th class="px-3 py-3 border text-center text-xs font-bold text-gray-700 uppercase tracking-wider">Production Quantity</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
@foreach ($hourlyData as $index => $data)
|
||||||
|
@if ($index >= 12) <!-- Last 12 time ranges (PM to AM) -->
|
||||||
|
<tr>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $index + 1 }}</td>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $data['time'] }}</td>
|
||||||
|
<td class="px-3 py-2 border text-center text-xs whitespace-nowrap">{{ $data['quantity'] ?: '0' }}</td> <!-- Show 0 if no data -->
|
||||||
|
</tr>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div> --}}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Reference in New Issue
Block a user