@extends('../layout/' . $layout)

@section('subhead')
    <title>Atarud MIS - Branches List</title>
@endsection
<style type="text/css">
    .stu_pro tr td {
        padding: 1px;
    }
</style>
@section('subcontent')
    <div class="flex items-center mt-8">
        <h2 class="intro-y text-lg font-medium mr-auto">Branches List</h2>
        <a href="javascript:;" data-tw-toggle="modal" data-tw-target="#new-branch" class="btn btn-primary w-24 ml-auto">
            <i data-lucide="plus-circle" class="w-4 h-4 mr-1"></i> Add
        </a>
    </div>

    <div class="grid grid-cols-12 gap-6 mt-5">
        <div class="intro-y col-span-12 flex flex-wrap sm:flex-nowrap items-center mt-2">

            <div class="hidden md:block mx-auto text-slate-500"></div>
            <div class="w-full sm:w-auto mt-3 sm:mt-0 sm:ml-auto md:ml-0">
                <div class="w-56 relative text-slate-500">
                    <input type="text" class="form-control w-56 box pr-10" placeholder="Search...">
                    <i class="w-4 h-4 absolute my-auto inset-y-0 mr-3 right-0" data-lucide="search"></i>
                </div>
            </div>
        </div>
        <!-- BEGIN: Data List -->

        <div class="intro-y col-span-12 overflow-auto lg:overflow-visible">
            <table class="table table-report -mt-2">
                <thead>
                    <tr>
                        <th class="whitespace-nowrap">#</th>
                        <th class="whitespace-nowrap">Name</th>
                        <th class="whitespace-nowrap">Code</th>
                        <th class="whitespace-nowrap">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @php
                        $i = 0;
                    @endphp
                    @foreach ($branches as $row)

                        <tr>
                            <td>{{ ++$i }}</td>

                            <td>{{ $row->name }}</td>
                            <td>{{ $row->code }}</td>

                            <td class="table-report__action w-56">
                                <a class="flex items-center mr-3" href="{{ route('branch.edit', $row->id) }}">
                                    <i data-lucide="check-square" class="w-7 h-7 mr-1"></i> Edit
                                </a>
                                <a class="flex items-center text-danger" href="javascript:;" onclick="return deleteRecord({{ $row->id }});"
                                data-tw-toggle="modal" data-tw-target="#delete-confirmation-modal">
                                <i data-lucide="trash-2" class="w-7 h-7 mr-1"></i> Delete
                            </a>

                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>


        </div>
        <!-- END: Data List -->
    </div>

@endsection
@include('../pages/branch/delete')
@include('../pages/branch/create')
@section('script')
<script>
    function deleteRecord(id){
        document.getElementById('id').value = id;
    }
</script>
@endsection