@extends('layouts.app')

@section('title', "The Wealth Finder")

@section('header_css')
<link href="{{url('/css/easy-autocomplete.css')}}" rel="stylesheet"/>
<style>
.loadingImg {
    background-image: url("../images/loading-smll.gif");
    background-repeat: no-repeat;
    background-position: 98% 50%
}

.searcHeading {
    text-align: center;
    padding-top: 20px;
    font-size: 53px;
    font-family: ui-sans-serif;
   
    margin-top: 0px!important;
}
.bg-card{background: #fff; border-radius: 15px;}
.searcHeading span{display: block;font-size: 15px;font-family: arial;}
.easy-autocomplete input{box-shadow:unset;}

</style>

@stop

@section('content')
<div class="container" style="max-width: 100%;">
<div class="row justify-content-center">

<div class="col-md-12">    

<div class="card">

<article class="card-body">

@include('includes.advanved-search')

<div class="form-row">
<div class="form-group col-md-12" style="text-align: center;">
<div class="card-body">
<div class="table-responsive-lg table-responsive-sm table-responsive-md table-responsive">

<div class="col-lg-12" style="float:right; text-align:right;">
<div class="table-responsive-lg table-responsive-sm table-responsive-md table-responsive">
    <div class="form-group btn-block-header btn-group">
        <!-- &nbsp;<strong>Showing {{$investorDataList->firstItem()}} to {{$investorDataList->lastItem()}} of {{$investorDataList->total()}} entries</strong> &nbsp;&nbsp;&nbsp;&nbsp; -->

        @if(is_array($requestData) && count($requestData)>0)
        &nbsp;<strong>Total {{$investorDataList->total()}} Records Found.</strong> &nbsp;&nbsp;&nbsp;&nbsp;
        @endif

        {!! $investorDataList->appends($requestData)->links('pagination::bootstrap-4') !!}

        &nbsp;
    </div>
</div>
</div>

<table class="table table-bordered table-hover table-striped card-table table-vcenter">
<thead>

<tr>
<th class="w-1" style="width:10%">Investor Name
    <a href="{{url()->current()}}{{$urlParameter}}&investortypesort=asc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-up"></i></a>
    <a href="{{url()->current()}}{{$urlParameter}}&investortypesort=desc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-down"></i></a>
</th>
<th style="width:10%">Father Name
    <a href="{{url()->current()}}{{$urlParameter}}&fathertypesort=asc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-up"></i></a>
    <a href="{{url()->current()}}{{$urlParameter}}&fathertypesort=desc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-down"></i></a>
</th>
<th style="width:10%">Company Name
    <a href="{{url()->current()}}{{$urlParameter}}&companytypesort=asc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-up"></i></a>
    <a href="{{url()->current()}}{{$urlParameter}}&companytypesort=desc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-down"></i></a>
</th>
<th style="width:30%">Address
    <a href="{{url()->current()}}{{$urlParameter}}&addresstypesort=asc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-up"></i></a>
    <a href="{{url()->current()}}{{$urlParameter}}&addresstypesort=desc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-down"></i></a>
</th>
<th style="width:10%">No. of Shares
    <a href="{{url()->current()}}{{$urlParameter}}&numofsharetypesort=asc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-up"></i></a>
    <a href="{{url()->current()}}{{$urlParameter}}&numofsharetypesort=desc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-down"></i></a>
</th>
<th style="width:10%">Market Value of Share
    <a href="{{url()->current()}}{{$urlParameter}}&numofsharecmptypesort=asc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-up"></i></a>
    <a href="{{url()->current()}}{{$urlParameter}}&numofsharecmptypesort=desc" class="btn btn-xs btn-link p-0"><i class="fa fa-sort-down"></i></a>
</th>
<th style="width:10%">Action</th>
</tr>
</thead>
<tbody>
@if(!empty($investorDataList) && $investorDataList->count())
@foreach($investorDataList as $key => $value)
<tr>
    <td>{{ $value->investor_fullname }} </td>
    <td>{{ $value->father_fullname }}</td>
    <td>{{ $value->company_name }}</td>

    <td><div class="address">{{$value->address}} {{ $value->district }} {{ $value->state }} {{ $value->country }} - {{ $value->pin_code }}</div></td>

    <td>{{ $value->no_of_share }}</td>

    <td>{{ $value->no_of_share_cmp }}</td>

    <td><span class="btn btn-sm btn-outline-primary"> <a href="{{url('/investor')}}/{{$value->id}}/{{$value->folio_no}}/{{$value->security_code}}"> View </a></span></td>
</tr>
@endforeach

@else
<tr>
<td colspan="12">No Data Found !!</td>
</tr>
@endif

</tbody>
</table>
</div>
</div>
</div>

<div class="col-lg-12" style="float:right; text-align:right;">
<div class="table-responsive-lg table-responsive-sm table-responsive-md table-responsive">
    <div class="form-group btn-block-header btn-group">

        @if(is_array($requestData) && count($requestData)>0)
            &nbsp;<strong>Total {{$investorDataList->total()}} Records Found.</strong> &nbsp;&nbsp;&nbsp;&nbsp;
        @endif

        {!! $investorDataList->appends($requestData)->links('pagination::bootstrap-4') !!}

        &nbsp;
    </div>
</div>
</div>

</div>
</article>

</div>
</div>
</div>
</div>
@stop

@section('footer_scripts')
<script src="{{url('/js/easy-autocomplete.js')}}"></script>
<script type="text/javascript">
$(document).ready(function () {

    var todaySearchPlace = {
        url: function(phrase) {
            $("#company_name").addClass("loadingImg");
            return "{{url('/search-company-name')}}?search_value=" + phrase + "&&format=json";
        },
        getValue: function(item) {
            if((item.company_name != "")){
                return item.company_name;
            }
        },
        template: {
            type: "custom",
            method: function(value, item) {
                $("#company_name").removeClass("loadingImg");
                return "<span class='searchName'>"+item.company_name +" </span>";
            }
        },
        list: {
            maxNumberOfElements: 10,
            match: {
                enabled: false
            },
            onChooseEvent: function() {
                var searchList = $("#company_name").getSelectedItemData();

                var selectedNameVal = searchList.company_name;
                $("#company_name").val(selectedNameVal);
            }
        },
        highlightPhrase: true,
        theme: "square",
        minCharNumber: 1
    };
    $("#company_name").easyAutocomplete(todaySearchPlace);

});


$(function() {
    $('input[name="datefiltertimes"]').daterangepicker({
        autoUpdateInput: false,
        "autoApply": true,
        locale: {
            cancelLabel: 'Clear'
        }
    });

    $('input[name="datefiltertimes"]').on('apply.daterangepicker', function(ev, picker) {
        $(this).val(picker.startDate.format('MM/DD/YYYY') + ' - ' + picker.endDate.format('MM/DD/YYYY'));
    });

    $('input[name="datefiltertimes"]').on('cancel.daterangepicker', function(ev, picker) {
        $(this).val('');
    });
});
</script>
@stop