<div wire:ignore.self>
    <div class="">
        <div class="card-body">
            <table id="example" class="my-table" style="width:100%">
                <thead>
                    <tr>
                        <th style="border-top-left-radius: .5rem">#</th>
                        <th>No Promo</th>
                        <th>Code Voucher</th>
                        <th>Value</th>
                        <th>Created By Invoice</th>
                        <th>From</th>
                        <th>To</th>
                        <th>Used By Invoice</th>
                        <th style="border-top-right-radius: .5rem">Sync</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($data as $item)
                        <tr>
                            <td>{{ $loop->iteration }}</td>
                            <td>{{ $item->no }}</td>
                            <td>{{ $item->voucher }}</td>
                            <td>{{ $item->value }}</td>
                            <td>{{ $item->createdBy ?? 'Admin' }}</td>
                            <td>{{ $item->voucher_from_date ?? '-' }}</td>
                            <td>{{ $item->voucher_to_date ?? '-' }}</td>
                            <td>
                                @if ($item->used != 'N')
                                    {{ $item->usedBy }}
                                @else
                                    Not Used
                                @endif
                            </td>
                            <td>
                                @if($item->sync != 'N')
                                <button class="btn-sm badge button-custom-success">Sync</button>
                                @else
                                <button class="btn-sm badge button-custom-danger">Not Sync</button>

                                @endif
                            </td>
                        </tr>
                    @endforeach

                </tbody>
            </table>
        </div>
    </div>


</div>
