@extends('frontend.master')
@section('right')
    <div class="card right_side text-center">
        <div class="card-header right_side-header">
            @if($type == 0) জন প্রতিনিধিগণ @elseif($type == 1)কর্মকর্তা ও কর্মচারীগণ@endif
        </div>
        <div class="card-body" style="background: #f5ffdf;">
            <div class="page_protinidhi_body">
                <div class="row row-cols-2 row-cols-md-4 g-2">
                    @foreach($officers as $key => $item)
                        <div class="col">
                            <div class="card-header">
                                @if($item->officer_type == 0)মেয়র@elseif($item->officer_type == 1)সচিব@elseif($item->officer_type == 2)মহিলা কাউন্সিলর@elseif($item->officer_type == 3)কাউন্সিলর@elseif($item->officer_type == 4)কর্মকর্তা ও কর্মচারীগণ@endif
                            </div>
                            <div class="card">
                                <img src="{{ asset($item->photo) }}" alt="...">
                                <div class="card-body" type="button"  data-bs-toggle="modal" data-bs-target="#protinidhi{{ $key }}">
                                    <h3 class="card-title">{{ $item->name }}</h3>
                                    <h4 class="card-text">{{ $item->designation }}</h4>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    <!-- protinidhi trigger modal -->
    @foreach($officers as $key => $item)
    <div class="modal fade" id="protinidhi{{ $key }}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered bodyBoxLeftSide">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="row g-0 modal-body">
                    <div class="bodyBoxLeftImg col-md-2">
                        <div style="margin: 1rem 0;">
                            <img src="{{ asset($item->photo) }}" class="img-fluid" alt="...">
                            <div class="bodyBoxLeftImg-text">
                                <h2>{{ $item->name }}</h2>
                                <h4>{{ $item->designation }}</h4>
                            </div>
                        </div>
                    </div>
                    <div class="row col-md-10 g-2 bodyBox">
                        <div class="list_group1 col-md-4">
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">নাম </li>
                                    <li class="list-group-item Name">{{ $item->name }}</li>
                                </ul>
                            </div>
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">@if($item->gender == 2 && $item->marital_status == 1) স্বামীর@else পিতার@endif নাম</li>
                                    <li class="list-group-item Name">{{ $item->father_name }}</li>
                                </ul>
                            </div>
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">মাতার নাম </li>
                                    <li class="list-group-item Name">{{ $item->mother_name }}</li>
                                </ul>
                            </div>
                        </div>
                        <div class="list_group2 col-md-4">
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">মোবাইল নং </li>
                                    <li class="list-group-item Name">{{ $item->phone }}</li>
                                </ul>
                            </div>
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">ই-মেইল </li>
                                    <li class="list-group-item Name">{{ $item->email }}</li>
                                </ul>
                            </div>
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">জাতীয় পরিচয়পত্র </li>
                                    <li class="list-group-item Name">{{ $item->nid }}</li>
                                </ul>
                            </div>
                        </div>
                        <div class="list_group3 col-md-4">
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">জন্মতারিখ </li>
                                    <li class="list-group-item Name">{{ date('d M, Y', strtotime($item->date_of_birth)) }}</li>
                                </ul>
                            </div>
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">লিঙ্গ </li>
                                    <li class="list-group-item Name">@if($item->gender == 1)পুরুষ @elseif($item->gender == 2)মহিলা @elseif($item->gender == 3)তৃতীয় লিঙ্গ @endif</li>
                                </ul>
                            </div>
                            <div class="">
                                <ul class="list-group list-group-horizontal">
                                    <li class="list-group-item Title">বৈবাহিক অবস্থা </li>
                                    <li class="list-group-item Name">@if($item->marital_status == 1)বিবাহিত @elseif($item->marital_status == 2)অবিবাহিত @elseif($item->marital_status == 3)তালাক প্রাপ্ত @elseif($item->marital_status == 4)বিধবা @elseif($item->marital_status == 5)অন্যান্য @endif</li>
                                </ul>
                            </div>
                        </div>
                        <div class="list_group4">
                            <ul class="list-group list-group-horizontal">
                                <li class="list-group-item Title">ঠিকানা </li>
                                <li class="list-group-item">{{ $item->address }}</li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-success" data-bs-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
    @endforeach
@endsection