@extends('backend.layouts.master')

@section('title')
Quản lý Tích điểm
@endsection

@section('styles')
@include('backend.pages.partials.style_index')
@endsection

@section('page-header')
<div class="row g-2 align-items-center">
    <div class="col">
        <h2 class="page-title">
            Tất cả Tích điểm
        </h2>
    </div>
</div>
@endsection

@section('admin-content')
<form action="{{ route('admin.point.scan') }}" method="POST">
    @csrf
    <div class="card">
        <div class="card-body">
            <div class="row">
                <div class="col-md-9 col-xl-9">
                    <input type="text" class="form-control" name="barcode" autofocus>
                </div>
                <div class="col-md-3 col-xl-3">
                    <button class="btn btn-primary ms-auto" type="submit">Tìm kiếm</button>
                </div>
            </div>
        </div>
    </div>
</form>

<div class="card">
    <div class="card-body">
        <div class="row">
            <div class="col-sm-5">
                <h4 class="card-title mb-0">
                    Danh sách Tích điểm
                </h4>
            </div>
            <!--col-->
        </div>
        <!--row-->
        <div class="row mt-4">
            <div class="col">
                <div class="table-responsive" style="overflow-y:visible;overflow-x:visible;">
                    @include('backend.layouts.partials.messages')
                    <table class="table" id="dataTable">
                        <thead>
                            <tr>
                                <th width="5%">No</th>
                                <th width="20%">Khách hàng</th>
                                <th width="20%">Số điện thoại</th>
                                <th width="10%">Mã đơn hàng</th>
                                <th width="15%">Điểm</th>
                                <th width="15%">Ngày tích</th>
                                <th width="15%"></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($points as $point)
                            <tr>
                                <td>{{ $loop->index+1 }}</td>
                                <td>{{ $point->customer->name }}</td>
                                <td>{{ $point->customer->phone }}</td>
                                <td>{{ $point->order_id }}</td>
                                <td>{{ $point->point }}</td>
                                <td>{{ $point->created_at->format('d-m-Y') }}</td>
                                <td>
                                    @if (Auth::guard('admin')->user()->can('admin.edit'))
                                    <a class="btn btn-success text-white btn-edit"
                                        href="{{ route('admin.point.edit', $point->id) }}">Sửa</a>
                                    @endif

                                    @if (Auth::guard('admin')->user()->can('admin.edit'))
                                    <form method="POST" action="{{ route('admin.point.destroy', $point->id) }}">
                                        @method('DELETE')
                                        @csrf
                                        <input name="_method" type="hidden" value="DELETE">
                                        <button type="submit" class="btn btn-danger btn-flat remove_row"
                                            data-toggle="tooltip" title="Delete">
                                            <i class="fa fa-trash"></i> Xóa
                                        </button>
                                    </form>
                                    @endif
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
            <!--col-->
        </div>
        <!--row-->
    </div>
    <!--card-body-->
</div>
@endsection


@section('scripts')
@include('backend.pages.partials.script_index')
<script>
    /*================================
    datatable active
    ==================================*/
    if ($('#dataTable').length) {
        $('#dataTable').DataTable({
            dom: "Bfrtip",
            buttons: [
                { extend: 'csv', text: 'Export CSV', title: 'Danh sách Tích điểm', className: 'btn-primary', exportOptions: { columns: ':not(:last-child)' } },
            ],
            responsive: false
        });
    }

    $('.remove_row').click(function(event) {
        event.preventDefault();

        Swal.fire({
            title: "Bạn có chắc muốn xóa dòng này không?",
            text: "Nếu như bạn xóa, dòng dữ liệu này sẽ không thể khôi phục.",
            icon: "warning",
            showCancelButton: true,
            confirmButtonColor: "#3085d6",
            cancelButtonColor: "#d33",
            confirmButtonText: "Xóa"
        }).then((result) => {
            if (result.isConfirmed) {
                $(this).closest("form").submit();
            }
        });
    });
</script>
@endsection