@extends('website.layouts.web-layouts')
@section('title', 'FBCCI | Member')
@section('description', 'FBCCI Member')
@section('image', $siteSetting->logo)
@section('url', url()->full())
@section('content')
    {{-- bread-cumb --}}
    <x-bread-crumb module="Member list" :extra="false" />

    <section class="member-list">
        <div class="container">
            <div class="member-list-main">
                <div class="member-top-search p-4">
                    <form action="{{route('web.member.search')}}">
                        <div class="search-top">
                            <div class="title pb-3">
                                <h2 class="text-start">Search Member</h2>
                            </div>
                            <div class="d-md-flex gap-4">
                                <div class="sort-by">
                                    <select name="key" class="form-select shadow-none">
                                        <option disabled value="" selected></option>
                                        @foreach($search_key as $keeeey)
                                            <option value="{{ $keeeey['value'] }}" {{ ($keeeey['value'] == $key) ? 'selected' : '' }}>{{ $keeeey['key'] }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="text-title flex-grow-1">
                                    <div class="input-group">
                                        <input name="keyword" value="{{$keyword}}" class="form-control shadow-none py-2" type="text" placeholder="Search your comany name...">
                                    </div>
                                </div>
                                <div class="search-button">
                                    <button class="search-btn" type="submit">
                                        Search</button>
                                </div>
                            </div>
                        </div>
        
                        <div class="advance-search">
                            <div class="article mt-4">
                                <button type="button" class="moreless-button">
                                    Advance Search
                                </button>
                                <div class="moretext" style="display: {{ $membership_type ? 'block' : '' }};">
                                    <div class="row">
                                        <div class="col-lg-12 mb-3">
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input shadow-none" type="radio" name="membership_type"
                                                id="inlineRadio1" value="all" {{($membership_type == 'all') ? 'checked' : ''}}>
                                                <label class="form-check-label" for="inlineRadio1">All</label>
                                            </div>
                                            @foreach($types as $type)
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input shadow-none" type="radio" name="membership_type"
                                                id="inlineRadio3{{$type->id}}" value="{{ $type->id }}" {{($type->id == $membership_type) ? 'checked' : ''}}>
                                                <label class="form-check-labe" for="inlineRadio3{{$type->id}}">{{ $type->title }}</label>
                                            </div>
                                            @endforeach
                                    
                                        </div>
                                    </div>
                                    
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="member-list-body">

                    @if(empty($members))
                        <x-empty-component></x-empty-component>
                    @endif

                    @foreach($members as $member)
                        <div class="member-list-item mb-2 mb-sm-0">
                            <div class="row">
                                <div class="col-xl-2 col-lg-3 col-md-4 col-sm-5">
                                    <div class="img p-1">
                                        <img src="{{ $member->logo }}" alt="{{ $member->organization_name }}" class="img-fluid w-100">
                                    </div>
                                </div>
                                <div class="col-xl-2 col-lg-2 col-md-4 col-sm-7">
                                    <div class="item-mini-info ps-3 ps-sm-0 mt-3 mt-lg-0">
                                        <h4>{{ $member->membership_no }}</h4>
                                        <span class="d-block">{{ $member->type->title }}</span>
                                        {{-- <a href="#">PDF Profile</a> --}}
                                    </div>
                                </div>
                                <div class="col-xl-8 col-lg-7">
                                    <div class="item-big-info ps-3 ps-lg-0 mt-3 mt-lg-0">
                                    <h3>{{ $member->organization_name }}</h3>
                                    <h5>Enrolment Date: {{date('M Y')}} </h5>
                                    <ul>
                                        <ul class="list-unstyled">
                                        <li>
                                            <i class="fas fa-map-marker-alt"></i>
                                            <span>{{ $member->address }}</span>
                                        </li>
                                        </ul>
                                    </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>

                <div class="pagination my-4 d-flex justify-content-end">
                    {{ $members->links('website.custom.paginate') }}
                </div>
            </div>
        </div>
    </section>

@endsection