Added stock data table livewire pages

app/Livewire/StockDataTable.php

@@ -0,0 +1,429 @@
+<?php
+
+namespace App\Livewire;
+
+use App\Models\Item;
+use App\Models\NotInStock;
+use App\Models\StickerMaster;
+use App\Models\StockDataMaster;
+use Filament\Notifications\Notification;
+use Livewire\Component;
+use Livewire\WithPagination;
+
+class StockDataTable extends Component
+{
+    public $invoiceData = [];
+
+        use WithPagination;
+
+    protected $paginationTheme = 'tailwind';
+
+    // public $invoiceRecords;
+
+    public $plantId = 0;
+
+    public $package = [];
+
+    public $scannedIds = [];
+
+    public $scannedRecords = [];
+
+    public $scannedSerials = [];
+
+    public $packageCount = 0;
+
+    public string $location = '';
+
+    public bool $completedInvoice = false;
+
+    public bool $isSerial = false;
+
+    public $isnonQuanSfg = false;
+
+    public bool $onCapFocus = false;
+
+    public bool $emptyInvoice = false;
+
+    public bool $hasSearched = false;
+
+    public bool $materialInvoice = false;
+
+    public bool $showCapacitorInput = false;
+
+    public bool $isSfg = false;
+
+    public $itemCode, $serialNumber;
+
+    public $scannedSfgData = [];
+
+    // protected $listeners = ['refreshInvoiceData' => 'loadData',];
+
+    protected $listeners = [
+        'refreshEmptyInvoice' => 'loadEmptyData',
+        'refreshInvoiceData' => 'loadData',
+        'refreshSfgData' => 'loadSfgData',
+        'refreshSfgNonData' => 'loadSfgNonQuanData',
+        'confirmStockUpdate',
+    ];
+
+    public $capacitorInput = '';
+
+    public $panel_box_supplier;
+
+    public $panel_box_code;
+
+    public $panel_box_serial_number;
+
+    public string $currentItemCode = '';
+
+    public string $currentSerialNumber = '';
+
+    public $stickerMasterId;
+
+    public function confirmStockUpdate($plantId, $location, $bin, $stickerMasterId, $batch, $docNo, $quantity)
+    {
+
+        $record = NotInStock::where('plant_id', $plantId)
+            ->where('location', $location)
+            ->where('sticker_master_id', $stickerMasterId)
+            ->where('doc_no', $docNo)
+            ->first();
+
+        if (!$record) {
+
+            NotInStock::create([
+                'plant_id' => $plantId,
+                'location' => $location,
+                'bin' => $bin,
+                'sticker_master_id' => $stickerMasterId,
+                'type' => '1',
+                'serial_number' => $this->serialNumber ?? null,
+                'batch' => $batch ?? null,
+                'doc_no' => $docNo ?? null,
+                'scanned_quantity' => $quantity ?? '0',
+            ]);
+
+            Notification::make()
+                ->title('Record inserted successfully in not in stock table.')
+                ->success()
+                ->send();
+
+        } else {
+
+            $record->update([
+                'scanned_quantity' => $record->scanned_quantity + $quantity,
+                'batch' => $batch ?? null,
+                'doc_no' => $docNo ?? null,
+            ]);
+
+            Notification::make()
+                ->title('Record updated in not in stock table.')
+                ->success()
+                ->send();
+        }
+    }
+
+    public function loadCompletedData($location, $plantId, $isSerial)
+    {
+        $this->plantId = $plantId;
+        $this->location = $location;
+        $this->completedInvoice = true;
+        $this->isSerial = $isSerial;
+        $this->onCapFocus = false;
+        $this->emptyInvoice = false;
+        $this->hasSearched = false;
+        $this->materialInvoice = false;
+        $this->packageCount = 0;
+        // $this->showCapacitorInput = false;
+        $this->dispatch('focus-invoice-number');
+    }
+
+    public function loadEmptyData($location, $plantId)
+    {
+        $this->plantId = $plantId;
+        $this->location = $location;
+        $this->completedInvoice = false;
+        $this->onCapFocus = false;
+        $this->emptyInvoice = true;
+        $this->hasSearched = false;
+        $this->materialInvoice = false;
+        $this->packageCount = 0;
+        // $this->showCapacitorInput = false;
+    }
+
+    public function loadSfgData($location, $plantId, $itemCode,$docNo)
+    {
+        $this->isSfg = true;
+        $this->hasSearched = false;
+        // $this->materialInvoice = false;
+        // $this->completedInvoice = false;
+        // $this->emptyInvoice = false;
+
+        $item = Item::where('plant_id', $plantId)
+                ->where('code', $itemCode)
+                ->first();
+
+        $itemId = $item->id;
+
+        $stickerMaster = StickerMaster::where('plant_id', $plantId)
+            ->where('item_id', $itemId)
+            ->first();
+
+        $stickerMasterId = $stickerMaster->id;
+
+        $record = StockDataMaster::with('stickerMaster.item')
+            ->where('plant_id', $plantId)
+            ->where('location', $location)
+            ->where('sticker_master_id', $stickerMasterId)
+            ->where('doc_no', $docNo)
+            ->where('type', '1')
+            ->first();
+
+        if ($record) {
+
+            $itemCode = optional($record->stickerMaster->item)->code;
+
+            $foundIndex = null;
+
+            foreach ($this->scannedSfgData as $index => $row) {
+
+                if (
+                    $row['location'] == $record->location &&
+                    $row['doc_no'] == $record->doc_no &&
+                    $row['item_code'] == $itemCode
+                ) {
+                    $foundIndex = $index;
+                    break;
+                }
+            }
+
+            if ($foundIndex !== null) {
+
+                $this->scannedSfgData[$foundIndex]['scanned_quantity'] = $record->scanned_quantity;
+
+            } else {
+
+                if (count($this->scannedSfgData) >= 100) {
+                    return;
+                }
+
+                $this->scannedSfgData[] = [
+                    'serial_number'     => $record->serial_number,
+                    'bin'               => $record->bin,
+                    'item_code'         => $itemCode,
+                    'batch'             => $record->batch,
+                    'doc_no'            => $record->doc_no,
+                    'quantity'          => $record->quantity,
+                    'scanned_quantity'  => $record->scanned_quantity,
+                    'location'          => $record->location,
+                    'updated_by'        => $record->updated_by,
+                ];
+            }
+        }
+    }
+
+    public function loadSfgNonQuanData($location, $plantId, $serialNumber, $itemCode){
+
+        $this->isnonQuanSfg = true;
+
+        $record = StockDataMaster::with('stickerMaster.item')
+            ->where('plant_id', $plantId)
+            ->where('location', $location)
+            ->where('serial_number', $serialNumber)
+            ->whereHas('stickerMaster.item', function ($q) use ($itemCode) {
+                $q->where('code', $itemCode);
+            })
+            ->where('type', '1')
+            ->orderBy('updated_at', 'desc')
+            ->first();
+
+        if ($record) {
+
+            // foreach ($this->scannedSerials as $row) {
+            //     if ($row['serial_number'] == $serialNumber) {
+            //         continue;
+            //     }
+            // }
+
+            // $this->scannedSerials[] = [
+            array_unshift($this->scannedSerials, [
+                'location' => $record->location,
+                'bin' => $record->bin ?? '',
+                'item_code' => $record->stickerMaster->item->code ?? '',
+                'serial_number' => $serialNumber,
+                'batch' => $record->batch ?? '',
+                'doc_no' => $record->doc_no ?? '',
+                'quantity' => $record->quantity ?? '',
+                'scanned_quantity' => $record->scanned_quantity ?? '',
+                'updated_by' => $record->updated_by ?? '',
+            ]);
+            // ];
+        }
+
+    }
+
+    public function loadData($location, $plantId, $itemCode, $serialNumber)
+    {
+        $this->location = $location;
+        $this->plantId = $plantId;
+        $this->itemCode = $itemCode;
+        $this->serialNumber = $serialNumber;
+
+
+        $this->completedInvoice = false;
+        $this->isSerial = true;
+        $this->emptyInvoice = false;
+        $this->hasSearched = true;
+        $this->materialInvoice = false;
+
+        $this->resetPage();
+        $this->packageCount = 0;
+
+        $item = Item::where('plant_id', $plantId)
+                ->where('code', $this->itemCode)
+                ->first();
+
+        $itemId = $item->id;
+
+        $stickerMaster = StickerMaster::where('plant_id', $plantId)
+            ->where('item_id', $itemId)
+            ->first();
+
+        $stickerMasterId = $stickerMaster->id;
+
+        $records = StockDataMaster::with('stickerMasterRelation')
+            ->where('location', $this->location)
+            ->where('type', '=', '0')
+            ->where('plant_id', $this->plantId)
+            ->where('sticker_master_id', $stickerMasterId)
+            ->where('serial_number', $this->serialNumber)
+            ->orderBy('updated_at', 'desc')
+            ->limit(100)
+            ->get();
+
+        foreach ($records as $record) {
+
+            if ($record->scanned_status == 'Scanned') {
+
+                if (!in_array($record->id, $this->scannedIds)) {
+                    $this->scannedIds[] = $record->id;
+                }
+
+            }
+        }
+
+        $this->scannedIds = array_slice(array_unique($this->scannedIds), 0, 100);
+
+
+        $this->packageCount = $records->sum(function ($record) {
+
+            $sm = $record->stickerMasterRelation;
+
+            if (! $sm) {
+                return 0;
+            }
+
+            $stickCount = 0;
+            $scannedCount = 0;
+
+
+            if ($sm->tube_sticker_motor == 1 || $sm->tube_sticker_pump == 1 || $sm->tube_sticker_pumpset == 1) {
+
+                if ($sm->tube_sticker_motor == 1) {
+                    $stickCount++;
+                    if ($record->motor_scanned_status == 1) {
+                        $scannedCount++;
+                    }
+                }
+
+                if (
+                    $sm->tube_sticker_pump == 1 ||
+                    ($sm->tube_sticker_pumpset != 1 &&
+                    $sm->tube_sticker_pump != 1 &&
+                    $sm->pack_slip_pump == 1)
+                ) {
+                    $stickCount++;
+                    if ($record->pump_scanned_status == 1) {
+                        $scannedCount++;
+                    }
+                }
+
+                if ($sm->tube_sticker_pumpset == 1) {
+                    $stickCount++;
+                    if ($record->scanned_status_set == 1) {
+                        $scannedCount++;
+                    }
+                }
+            } elseif ($sm->pack_slip_motor == 1 || $sm->pack_slip_pump == 1 || $sm->pack_slip_pumpset == 1) {
+                if ($sm->pack_slip_motor == 1) {
+                    $stickCount++;
+                    if ($record->motor_scanned_status == 1) {
+                        $scannedCount++;
+                    }
+                }
+
+                if ($sm->pack_slip_pump == 1) {
+                    $stickCount++;
+                    if ($record->pump_scanned_status == 1) {
+                        $scannedCount++;
+                    }
+                }
+
+                if ($sm->pack_slip_pumpset == 1) {
+                    $stickCount++;
+                    if ($record->scanned_status_set == 1) {
+                        $scannedCount++;
+                    }
+                }
+            }
+
+            return max($stickCount - $scannedCount, 0);
+        });
+
+        // $this->dispatch(
+        //     $onCapFocus ? 'focus-capacitor-input' : 'focus-serial-number'
+        // );
+    }
+
+    // public function getInvoiceRecordsProperty()
+    // {
+    //     return StockDataMaster::with('stickerMasterRelation.item')
+    //         ->where('plant_id', $this->plantId)
+    //         ->where('location', $this->location)
+    //         ->where('type', '=', '0')
+    //         ->where('scanned_status', 'Scanned')
+    //         // ->where(function ($query) {
+    //         //     $query->whereNull('scanned_status')
+    //         //         ->orWhere('scanned_status', 'Scanned');
+    //         // })
+    //         // ->when($this->hasSearched, function ($query) {
+    //         //     $query->where('invoice_number', $this->invoiceNumber)
+    //         //         ->where('plant_id', $this->plantId)
+    //         //         ->where('scanned_status', '=', '');
+    //         // })
+    //         ->orderBy('updated_at', 'desc')
+    //         ->paginate(6);
+    // }
+
+
+    public function getInvoiceRecordsProperty()
+    {
+        if (empty($this->scannedIds)) {
+            return collect();
+        }
+
+        return StockDataMaster::with('stickerMasterRelation.item')
+            ->whereIn('id', $this->scannedIds)
+            ->orderBy('updated_at', 'desc')
+            ->paginate(6);
+    }
+    public function render()
+    {
+        // return view('livewire.stock-data-table');
+        return view('livewire.stock-data-table', [
+            'records' => $this->invoiceRecords,
+            'scannedSfgData' => $this->scannedSfgData,
+            'scannedSerials' => $this->scannedSerials
+        ]);
+    }
+}

resources/views/livewire/stock-data-table.blade.php

@@ -0,0 +1,308 @@
+<div>
+    <div class="mb-4">
+        <h2 class="text-lg font-bold text-gray-800">
+            @if ($hasSearched)
+                FG STOCK DATA TABLE
+            @elseif ($isSfg)
+                SFG STOCK DATA TABLE
+            @elseif ($isnonQuanSfg)
+                SFG STOCK DATA TABLE
+            @else
+                STOCK DATA TABLE
+            @endif
+        </h2>
+
+    </div>
+
+    <div class="mt-2">
+        <hr class="border-t-2 border-gray-300">
+    </div>
+
+
+    @if ($hasSearched)
+    <div class="overflow-x-auto" style="height: 385px;">
+        <table class="min-w-full text-sm text-center border border-gray-300">
+            <table class="table-fixed min-w-[1500px] text-sm text-center border border-gray-300">
+                <thead class="bg-gray-100 font-bold">
+                <tr>
+                    <th class="border px-4 py-2">No</th>
+                    <th class="border px-4 py-2">Material Code</th>
+                    <th class="border px-4 py-2">Serial Number</th>
+                    <th class="border px-4 py-2">Motor Scanned Status</th>
+                    <th class="border px-4 py-2">Pump Scanned Status</th>
+                    <th class="border px-4 py-2">Scanned Status Set</th>
+                    <th class="border px-4 py-2">Scanned Status</th>
+                    <th class="border px-4 py-2 w-[300px] whitespace-nowrap">Time Stamp</th>
+                    <th class="border px-4 py-2">Operator ID</th>
+                </tr>
+            </thead>
+
+            <tbody>
+                @forelse ($records as $index => $record)
+                    <tr wire:key="inv-{{ $record->id }}" class="border-t">
+                        <td class="border px-2 py-2">{{ $records->firstItem() + $index }}</td>
+                        <td class="border px-2 py-2">{{ $record->stickerMasterRelation?->item?->code ?? 'N/A' }}</td>
+                        <td class="border px-2 py-2">{{ $record->serial_number ?? 'N/A' }}</td>
+                        <td class="border px-2 py-2">{{ $record->motor_scanned_status ? '1' : '' }}</td>
+                        <td class="border px-2 py-2">{{ $record->pump_scanned_status ? '1' : '' }}</td>
+                        <td class="border px-2 py-2">{{ $record->scanned_status_set ? '1' : '' }}</td>
+                        <td class="border px-2 py-2">{{ $record->scanned_status ?? '' }}</td>
+                        <td class="border px-2 py-2 whitespace-nowrap">{{ optional($record->created_at)->format('d-m-Y H:i:s') }}</td>
+                        <td class="border px-2 py-2">{{ $record->updated_by ?? '' }}</td>
+                    </tr>
+                @empty
+                    <tr>
+                        <td colspan="12" class="py-4 text-gray-500">
+                            No scanned data found for location <strong>{{ $location }}</strong>
+                        </td>
+                    </tr>
+                @endforelse
+            </tbody>
+        </table>
+        {{-- <div class="mt-3 flex justify-center">
+            {{ $records->onEachSide(3)->links() }}
+        </div> --}}
+    </div>
+    @endif
+
+    @if($isSfg)
+
+        <div class="w-full overflow-x-auto" style="height:385px">
+
+            <table class="w-full text-sm text-center border border-gray-300">
+
+                    <thead class="bg-gray-100 font-bold">
+                    <tr>
+                        <th class="border px-4 py-2">No</th>
+                        <th class="border px-4 py-2">Location</th>
+                        <th class="border px-4 py-2">Bin</th>
+                        <th class="border px-4 py-2">Item Code</th>
+                        <th class="border px-4 py-2">Serial Number</th>
+                        <th class="border px-4 py-2">Batch</th>
+                        <th class="border px-4 py-2">Document Number</th>
+                        <th class="border px-4 py-2">Total Quantity</th>
+                        <th class="border px-4 py-2">Scanned Quantity</th>
+                        <th class="border px-4 py-2">Operator ID</th>
+                    </tr>
+                    </thead>
+
+                <tbody>
+
+                    @forelse($scannedSfgData as $index => $row)
+
+                        <tr>
+                            <td class="border px-3 py-2">{{ $index+1 }}</td>
+                            <td class="border px-3 py-2">{{ $row['location'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['bin'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['item_code'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['serial_number'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['batch'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['doc_no'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['quantity'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['scanned_quantity'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['updated_by'] }}</td>
+                        </tr>
+
+                        @empty
+                        <tr>
+                            <td colspan="10" class="py-4 text-gray-500">
+                                No scanned SFG data
+                            </td>
+                        </tr>
+                    @endforelse
+                </tbody>
+            </table>
+        </div>
+    @endif
+
+    @if($isnonQuanSfg)
+
+        <div class="w-full overflow-x-auto" style="height:385px">
+
+            <table class="w-full text-sm text-center border border-gray-300">
+
+                    <thead class="bg-gray-100 font-bold">
+                    <tr>
+                        <th class="border px-4 py-2">No</th>
+                        <th class="border px-4 py-2">Location</th>
+                        <th class="border px-4 py-2">Bin</th>
+                        <th class="border px-4 py-2">Item Code</th>
+                        <th class="border px-4 py-2">Serial Number</th>
+                        <th class="border px-4 py-2">Batch</th>
+                        <th class="border px-4 py-2">Document Number</th>
+                        <th class="border px-4 py-2">Total Quantity</th>
+                        <th class="border px-4 py-2">Scanned Quantity</th>
+                        <th class="border px-4 py-2">Operator ID</th>
+                    </tr>
+                    </thead>
+
+                <tbody>
+
+                    @forelse($scannedSerials as $index => $row)
+
+                        <tr>
+                            <td class="border px-3 py-2">{{ $index+1 }}</td>
+                            <td class="border px-3 py-2">{{ $row['location'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['bin'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['item_code'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['serial_number'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['batch'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['doc_no'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['quantity'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['scanned_quantity'] }}</td>
+                            <td class="border px-3 py-2">{{ $row['updated_by'] }}</td>
+                        </tr>
+
+                        @empty
+                        <tr>
+                            <td colspan="10" class="py-4 text-gray-500">
+                                No scanned SFG data
+                            </td>
+                        </tr>
+                    @endforelse
+                </tbody>
+            </table>
+        </div>
+    @endif
+
+    {{-- Modal for Capacitor Input --}}
+    <div>
+        <button wire:click="$set('showCapacitorInput', true)"></button>
+        @if($showCapacitorInput)
+            <div class="fixed inset-0 z-[9999] bg-black bg-opacity-50 flex items-center justify-center">
+                <div style="background:white; border:4px solid orange;" class="p-6 rounded-xl shadow-2xl w-[450px]">
+                    <h3 class="text-xl font-semibold text-orange-700 mb-4">
+                        Scan the Panel Box Supplier/Item Code/Serial Number
+                    </h3>
+
+                    <input
+                        type="text"
+                        id="capacitorInput"
+                        autocomplete="off"
+                        wire:model.defer="capacitorInput"
+                        wire:keydown.enter.prevent="processCapacitorInput"
+                        class="w-full border border-orange-300 rounded px-3 py-2 focus:outline-none focus:ring-0 focus:border-orange-300"
+                        placeholder="Scan the panel box QR code"
+                        {{-- autofocus --}}
+                        onload="this.focus(); this.select();"
+                        {{-- onfocus="this.select();" --}}
+                    />
+
+                    <div class="flex justify-end gap-2 mt-4">
+                        <button type="button" wire:click="cancelCapacitorInput"
+                        class="mt-6 ml-10 bg-gray-300 hover:bg-gray-400 px-4 py-2 rounded transition">
+                            Cancel
+                        </button>
+                    </div>
+                </div>
+            </div>
+            {{-- Add this script to focus on the input --}}
+            <script>
+                document.getElementById('capacitorInput').focus();
+            </script>
+            {{-- <script>
+                document.addEventListener('livewire:initialized', () => {
+                    @this.on('focus-capacitor-input', () => {
+                        setTimeout(() => {
+                            const el = document.getElementById('capacitorInput');
+                            if (el) el.focus();
+                        }, 100);
+                    });
+                });
+            </script> --}}
+        @endif
+    </div>
+
+    {{-- Modal for material invoice--}}
+    @if($materialInvoice)
+        {{-- <div class="flex justify-center overflow-x-auto overflow-y-visible" style="height: 385px;"> --}}
+        <div class="overflow-x-auto overflow-y-visible" style="height: 385px;">
+            {{-- <table class="min-w-full text-sm text-center border border-gray-300"> --}}
+            <table class="min-w-full mx-auto text-sm text-center border border-gray-300">
+                <thead class="bg-gray-100 font-bold">
+                    <tr>
+                        <th class="border px-4 py-2">No</th>
+                        <th class="border px-4 py-2">Material Code</th>
+                        <th class="border px-4 py-2">Material Type</th>
+                        <th class="border px-4 py-2">Material Quantity</th>
+                        <th class="border px-4 py-2">Serial Number</th>
+                        <th class="border px-4 py-2">Batch Number</th>
+                        <th class="border px-4 py-2">TimeStamp</th>
+                        <th class="border px-4 py-2">Operator ID</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    @forelse ($invoiceData as $index => $row)
+                        <tr class="border-t">
+                            <td class="border px-4 py-2">{{ $index + 1 }}</td>
+                            <td class="border px-4 py-2">{{ $row['code'] ?? 'N/A' }}</td>
+                            <td class="border px-4 py-2">{{ $row['material_type'] ?? 'N/A' }}</td>
+                            <td class="border px-4 py-2">
+                                @if(($row['material_type'] ?? '') === 'Individual' || ($row['material_type'] ?? '') === 'Bundle')
+                                    {{ number_format((float)($row['quantity'] ?? 0), 0) }}
+                                @else
+                                    {{ $row['quantity'] ?? 'N/A' }}
+                                @endif
+                            </td>
+                            <td class="border px-4 py-2">{{ $row['serial_number'] ?? 'N/A' }}</td>
+                            <td class="border px-4 py-2">{{ $row['batch_number'] ?? 'N/A' }}</td>
+                            <td class="border px-4 py-2">{{ $row['created_at'] ?? 'N/A' }}</td>
+                            <td class="border px-4 py-2">{{ $row['operator_id'] ?? 'N/A' }}</td>
+                        </tr>
+                    @empty
+                        <tr>
+                            <td colspan="10" class="text-center py-4 text-gray-500">
+                                No data found for invoice number <strong>{{ $invoiceNumber }}</strong>.
+                            </td>
+                        </tr>
+                    @endforelse
+                </tbody>
+            </table>
+        </div>
+    @endif
+</div>
+{{-- <script>
+    // Clear input and set focus on form load
+    document.addEventListener('DOMContentLoaded', function () {
+        const input = document.getElementById('capacitorInput');
+        input.value = ''; // Clear the input field
+        input.focus(); // Set focus to the input field
+    });
+</script> --}}
+<script>
+    window.addEventListener('focus-capacitor-input', () => {
+        setTimeout(() => {
+            const input = document.getElementById('capacitorInput');
+            if (input) {
+                input.focus();
+                input.select();
+            }
+        }, 50);
+    });
+
+    window.addEventListener('focus-serial-number', () => {
+        setTimeout(() => {
+            const container = document.getElementById('serial_number_input');
+            const input = container?.querySelector('input'); // gets the actual input inside
+
+            if (input) {
+                input.focus();
+                input.select();
+            }
+        }, 50);
+    });
+
+    window.addEventListener('focus-invoice-number', () => {
+        setTimeout(() => {
+            const container = document.getElementById('invoice_number_input');
+            const input = container?.querySelector('input'); // gets the actual input inside
+
+            if (input) {
+                input.focus();
+                input.select();
+            }
+        }, 50);
+    });
+</script>
+
+