@extends('admin.layout.master')

@section('title', __('admin.coupons'))

@section('styles')
    <style>
        table th, table td {
            text-align: center;
            vertical-align: middle;
        }

        .status-badge {
            padding: 5px 10px;
            border-radius: 20px;
            font-weight: 600;
            text-transform: uppercase;
            font-size: 14px;
            cursor: pointer;
        }

        .status-badge.active {
            background-color: #28a745;
            color: white;
        }

        .status-badge.inactive {
            background-color: #dc3545;
            color: white;
        }
    </style>
@endsection

@section('content')
    <div class="container-xxl flex-grow-1 container-p-y">

        <div class="card mb-4">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0">{{ __('admin.coupons') }}</h5>
                <button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#couponModal">
                    {{ __('admin.add_coupon') }}
                </button>
            </div>

            <div class="card-body">
                <table class="table">
                    <thead>
                        <tr>
                            <th>{{ __('admin.name') }}</th>
                            <th>{{ __('admin.code') }}</th>
                            <th>{{ __('admin.type') }}</th>
                            <th>{{ __('admin.value') }}</th>
                            <th>{{ __('admin.usage_limit') }}</th>
                            <th>{{ __('admin.minimum_amount') }}</th>
                            <th>{{ __('admin.start_date') }}</th>
                            <th>{{ __('admin.expire_date') }}</th>
                            <th>{{ __('admin.status') }}</th>
                            <th>{{ __('admin.action') }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @if($coupons->count() > 0)
                        @foreach ($coupons as $coupon)
                            <tr>
                                <td>{{ $coupon->name }}</td>
                                <td>{{ $coupon->code }}</td>
                                <td>{{ ucfirst($coupon->type) }}</td>
                                <td>{{ $coupon->value }}</td>
                                <td>{{ $coupon->usage_limit ?? '-' }}</td>
                                <td>{{ $coupon->min_amount ?? '-' }}</td>
                                <td>{{ $coupon->start_date }}</td>
                                <td>{{ $coupon->expire_date }}</td>
                                <td>
                                    <span class="status-badge {{ $coupon->status ? 'active' : 'inactive' }}">
                                        {{ $coupon->status ? __('admin.active') : __('admin.inactive') }}
                                    </span>
                                </td>
                                <td>
                                  <button class="btn btn-primary btn-sm"
        onclick='editCoupon(@json($coupon))'>
    <i class="fa fa-edit"></i>
</button>

                                    <form action="{{ route('admin.coupons.destroy', $coupon->id) }}" method="POST"
                                          style="display:inline-block">
                                        @csrf
                                        @method('DELETE')
                                        <button class="btn btn-danger btn-sm" >
                                            <i class="fa fa-trash"></i>
                                        </button>
                                    </form>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                    @endif
                </table>

                <div class="mt-3">
                    {{ $coupons->links() }}
                </div>
            </div>
        </div>
    </div>

    {{-- Modal --}}
{{-- Add Coupon Modal --}}
@include('admin.coupons._form_modal')

{{-- Edit Coupon Modal --}}
@include('admin.coupons._form_edit_modal')
@endsection

@section('scripts')
   <script>
    function editCoupon(coupon) {
        $('#editCouponForm').attr('action', '/admin/coupons/' + coupon.id);
        $('#editMethodField').val('PUT');
        $('#couponEditModalLabel').text("{{ __('admin.edit_coupon') }}");

        $('#edit_name').val(coupon.name);
        $('#edit_code').val(coupon.code);
        $('#edit_type').val(coupon.type);
        $('#edit_value').val(coupon.value);
        $('#edit_usage_limit').val(coupon.usage_limit);
        $('#edit_minimum_amount').val(coupon.minimum_amount);
        $('#edit_start_date').val(coupon.start_date);
        $('#edit_expire_date').val(coupon.expire_date);
        $('#edit_status').val(coupon.status);

        const modal = new bootstrap.Modal(document.getElementById('couponEditModal'));
        modal.show();
    }
</script>

@endsection