@extends("admin.admin_app")

@section("content")

<!-- Page Header -->
<div class="content bg-gray-lighter">
    <div class="row items-push">
        <div class="col-sm-7">
            <h1 class="page-heading">
                {{ ucfirst($model) }} List
            </h1>
        </div>
        <div class="col-sm-5 text-right hidden-xs">
            <ol class="breadcrumb push-10-t">
                <li><a href="{{ URL::to('admin/dashboard') }}">Dashboard</a></li>
                <li><a class="link-effect" href="">Menu Types</a></li>
            </ol>
        </div>
    </div>
</div>
<!-- END Page Header -->

<!-- Page Content -->
<div class="content">
    <div class="block">
        <div class="block-header">
            <h3 class="block-title">All Records for {{ ucfirst($model) }}</h3>
            <div class="block-options">
                <button class="btn btn-success btn-sm" data-toggle="modal" data-target="#typeModal" onclick="openAddModal()">
                    <i class="fa fa-plus"></i> Add {{ ucfirst($model) }}
                </button>
            </div>
        </div>

        <div class="block-content">
            <table class="table table-hover table-header-bg cat-dataTable-full">
                <thead>
                    <tr>
                        <th>S.No.</th>
                        <th>Name</th>
                          <th>Status</th>
                        <th class="text-center" style="width: 10%;">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($resTypes as $i => $type)
                        <tr>
                            <td>{{ $i + 1 }}</td>
                            <td>{{ $type->name ?? 'N/A' }}</td>
                            <td>
    @php
        $active = isset($type->is_active)
            ? $type->is_active
            : (isset($type->status) ? $type->status : 0);
    @endphp

    <a href="{{ url('admin/update-type-status/'.$type->id).'?model='.$model.'&status='.($active ? 0 : 1) }}"
       class="btn btn-xs {{ $active ? 'btn-success' : 'btn-danger' }}"
       title="Click to {{ $active ? 'Deactivate' : 'Activate' }}"
       onclick="return confirm('Are you sure you want to change status?');">
        {{ $active ? 'Active' : 'Inactive' }}
    </a>
</td>

                            <td class="text-center">
                                <div class="btn-group">
                                    <button 
                                        class="btn btn-xs btn-default" 
                                        title="Edit"
                                        onclick="openEditModal({{ $type->id }}, '{{ $type->name ?? '' }}', '{{ $type->description ?? '' }}', {{ $active }})">
                                        <i class="fa fa-pencil"></i>
                                    </button>
                                    <a href="{{ url('admin/delete-type/'.$type->id).'?model='.$model }}" 
                                       class="btn btn-xs btn-default" title="Delete"
                                       onclick="return confirm('Are you sure you want to delete this record?');">
                                        <i class="fa fa-times"></i>
                                    </a>
                                </div>
                            </td>
                        </tr>
                    @endforeach

                    @if($resTypes->isEmpty())
                        <tr>
                            <td colspan="5" class="text-center text-muted">No records found for {{ ucfirst($model) }}.</td>
                        </tr>
                    @endif
                </tbody>
            </table>
        </div>
    </div>
</div>

<!-- Modal -->
<div class="modal fade" id="typeModal" tabindex="-1" role="dialog" aria-labelledby="typeModalLabel">
    <div class="modal-dialog" role="document">
        <form method="POST" id="typeForm" action="{{ url('admin/save-type?model='.$model) }}">
            @csrf
            <input type="hidden" name="id" id="type_id">
            <div class="modal-content">
                <div class="modal-header bg-primary-dark text-white">
                    <h4 class="modal-title" id="typeModalLabel">Add {{ ucfirst($model) }}</h4>
                    <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                        <span>&times;</span>
                    </button>
                </div>

                <div class="modal-body">
                    <div class="form-group">
                        <label>Name <span class="text-danger">*</span></label>
                        <input type="text" name="name" id="type_name" class="form-control" required>
                    </div>
                </div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-success">Save</button>
                </div>
            </div>
        </form>
    </div>
</div>

<script>
function openAddModal() {
    document.getElementById('typeForm').reset();
    document.getElementById('type_id').value = '';
    document.getElementById('typeModalLabel').innerText = 'Add {{ ucfirst($model) }}';
}

function openEditModal(id, name, description, status) {
    document.getElementById('type_id').value = id;
    document.getElementById('type_name').value = name;
    // document.getElementById('type_description').value = description;
    // document.getElementById('type_status').value = status ? 1 : 0;
    document.getElementById('typeModalLabel').innerText = 'Edit {{ ucfirst($model) }}';
    $('#typeModal').modal('show');
}
</script>
@endsection