@extends('front.user-dash.layout.app')

@section('content')
<style>
.nk-content {
    margin-top: 120px;
}
.card {
    background-color: #fff !important;
}
</style>

        <!-- content @s -->
    <div class="nk-content ">
    <div class="container-fluid">
        <div class="nk-content-inner">
            <div class="nk-content-body">
                @if(isset($projects))
                <div class="nk-block-head nk-block-head-sm">
                    <div class="nk-block-between">
                        <div class="nk-block-head-content">
                            <h3 class="nk-block-title page-title">Proposal Lists</h3>
                            <div class="nk-block-des text-soft">
                                <p>You have total {{ Auth::guard('procurement')->user()->proposals()->count() }} Proposal.</p>
                            </div>
                        </div><!-- .nk-block-head-content -->
              
                    </div><!-- .nk-block-between -->
                </div><!-- .nk-block-head -->
                <div class="nk-block">
                    <div class="card card-bordered card-stretch">
                        <div class="card-inner-group">
                            
                            <div class="card-inner position-relative card-tools-toggle">
                                <div class="card-title-group">
                                    <div class="card-tools">
                                        <div class="form-inline flex-nowrap gx-3">
                                            <div class="form-wrap w-250px">
                                                <select class="form-select form-select-sm" data-search="off"
                                                    data-placeholder="Select your projects">
                                                    <option value="" selected disabled="" choose="">Select your
                                                        projects</option>
                                                    
                                                    @foreach($projects as $project)
                                                    @if(count($project->proposals) > 0 )
                                                    <option value="{{ $project->id }}">{{ $project->title }}</option>
                                                    @endif
                                                    @endforeach
                                                </select>
                                            </div>
                                            <div class="btn-wrap">
                                                <span class="d-none d-md-block"><button
                                                        class="btn btn-dim btn-outline-light disabled">Apply</button></span>
                                                <span class="d-md-none"><button
                                                        class="btn btn-dim btn-outline-light btn-icon disabled"><em
                                                            class="icon ni ni-arrow-right"></em></button></span>
                                            </div>
                                        </div><!-- .form-inline -->
                                    </div><!-- .card-tools -->
                                    <div class="card-tools mr-n1">
                                        <ul class="btn-toolbar gx-1">
                                            <li>
                                                <a href="javascript:;"
                                                    class="btn btn-icon search-toggle toggle-search"
                                                    data-target="search"><em class="icon ni ni-search"></em></a>
                                            </li><!-- li -->
                                            <li class="btn-toolbar-sep"></li><!-- li -->
                                            <li>
                                                <div class="toggle-wrap">
                                                    <a href="javascript:;"
                                                        class="btn btn-icon btn-trigger toggle"
                                                        data-target="cardTools"><em
                                                            class="icon ni ni-menu-right"></em></a>
                                                    <div class="toggle-content" data-content="cardTools">
                                                        <ul class="btn-toolbar gx-1">
                                                            <li class="toggle-close">
                                                                <a href="javascript:;"
                                                                    class="btn btn-icon btn-trigger toggle"
                                                                    data-target="cardTools"><em
                                                                        class="icon ni ni-arrow-left"></em></a>
                                                            </li><!-- li -->

                                                        </ul><!-- .btn-toolbar -->
                                                    </div><!-- .toggle-content -->
                                                </div><!-- .toggle-wrap -->
                                            </li><!-- li -->
                                        </ul><!-- .btn-toolbar -->
                                    </div><!-- .card-tools -->
                                </div><!-- .card-title-group -->
                                <div class="card-search search-wrap" data-search="search">
                                    <div class="card-body">
                                        <div class="search-content">
                                            <a href="javascript:;"
                                                class="search-back btn btn-icon toggle-search"
                                                data-target="search"><em class="icon ni ni-arrow-left"></em></a>
                                            <input type="text"
                                                class="form-control border-transparent form-focus-none"
                                                placeholder="Search by user or email">
                                            <button class="search-submit btn btn-icon"><em
                                                    class="icon ni ni-search"></em></button>
                                        </div>
                                    </div>
                                </div><!-- .card-search -->
                            </div><!-- .card-inner -->
                            <div class="card-inner p-0">
                                <div class="nk-tb-list nk-tb-ulist is-compact">
                                    <div class="nk-tb-item nk-tb-head">
                                        <div class="nk-tb-col nk-tb-col-check">
                                            <div
                                                class="custom-control custom-control-sm custom-checkbox notext">
                                                <label class="custom-control-label" for="uid">ID</label>
                                            </div>
                                        </div>
                                        <div class="nk-tb-col"><span class="sub-text">Client</span></div>
                                        <div class="nk-tb-col tb-col-md"><span class="sub-text">Role</span>
                                        </div>
                                        <div class="nk-tb-col tb-col-sm"><span class="sub-text">Email</span>
                                        </div>
                                        <div class="nk-tb-col tb-col-md"><span class="sub-text">Budget</span>
                                        </div>
                                        <div class="nk-tb-col tb-col-md"><span class="sub-text">Cover
                                                Letter</span>
                                        </div>

                                    </div><!-- .nk-tb-item -->
                                    @php $i=1; @endphp
                                    @foreach($projects as $project)
                                    @foreach($project->proposals as $proposal)
                                    <div class="nk-tb-item">
                                        <div class="nk-tb-col nk-tb-col-check">
                                            <div
                                                class="custom-control custom-control-sm custom-checkbox notext">
                                                <label class="custom-control-label" for="uid1">{{ $i++ }}</label>
                                            </div>
                                        </div>
                                        <div class="nk-tb-col">
                                            <div class="user-card">
                                                <div class="user-avatar xs bg-primary">
                                                    <span>AM</span>
                                                </div>
                                                <div class="user-name">
                                                    <span class="tb-lead">{{ $proposal->procurement->name }}</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="nk-tb-col tb-col-md">
                                            <span>{{ $proposal->procurement->occupation->name }}</span>
                                        </div>
                                        <div class="nk-tb-col tb-col-sm">
                                            <span>{{ $proposal->procurement->email }}</span>
                                        </div>
                                        <div class="nk-tb-col tb-col-md">
                                            @if($proposal->rate == "hourly")
                                            <span>${{ $proposal->budget }} / Hour</span>
                                            @else
                                            <span>${{ $proposal->budget }} - Fixed</span>
                                            @endif
                                        </div>
                                        <div class="nk-tb-col tb-col-md foruns">
                                            <span>{{ \Illuminate\Support\Str::limit($proposal->letter, 300, '...') }}</span>
                                        </div>
                                        <div class="nk-tb-col nk-tb-col-tools">
                                            <ul class="nk-tb-actions gx-2">
                                                <li>
                                                    <div class="drodown">
                                                        <a href="javascript:;"
                                                            class="btn btn-sm btn-icon btn-trigger dropdown-toggle"
                                                            data-toggle="dropdown"><em
                                                                class="icon ni ni-more-h"></em></a>
                                                        <div class="dropdown-menu dropdown-menu-right">
                                                            <ul class="link-list-opt no-bdr">
                                                                <li><a href="{{ route('project.viewProposal', $proposal->id) }}"><em
                                                                            class="icon ni ni-eye"></em><span>View
                                                                            Proposal</span></a></li>
                                                            </ul>
                                                        </div>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </div><!-- .nk-tb-item -->
                                    @endforeach
                                    @endforeach
                                </div><!-- .nk-tb-list -->
                            </div><!-- .card-inner -->
                            <div class="card-inner">
                                <ul class="pagination justify-content-center justify-content-md-start">
                                    <li class="page-item"><a class="page-link" href="javascript:;">Prev</a></li>
                                    <li class="page-item"><a class="page-link" href="javascript:;">1</a></li>
                                    <li class="page-item"><a class="page-link" href="javascript:;">2</a></li>
                                    <li class="page-item"><span class="page-link"><em
                                                class="icon ni ni-more-h"></em></span></li>
                                    <li class="page-item"><a class="page-link" href="javascript:;">6</a></li>
                                    <li class="page-item"><a class="page-link" href="javascript:;">7</a></li>
                                    <li class="page-item"><a class="page-link" href="javascript:;">Next</a></li>
                                </ul><!-- .pagination -->
                            </div><!-- .card-inner -->
                           
                        </div><!-- .card-inner-group -->
                    </div><!-- .card -->
                </div><!-- .nk-block -->
                @endif
            </div>
        </div>
    </div>
</div>
        <!-- content @e -->

@endsection