@extends('front.layouts.main')
@section('content')
<h2 class="h2-main mt-0 mb-15">{{@$gcompany->company_name}}</h2>
 @if($msg=Session::get('success'))
<script type="text/javascript">
    swal("", "{{ Session::get('success') }}", "");</script>
@endif  
@if($msg=Session::get('info'))
<script type="text/javascript">
    swal("", "{{ Session::get('info') }}", "");</script>
@endif  
    <!-- <div class="c-toptab  pad_bottom_10 clearfix">
        @include('front.includes.dashboard-menu')
        <div class="pad_top_10 right">
            @if($company->sub_type == '2')
                <a href="javascript:void(0);" class="round-btn ripple-btn other" onclick="alerMessage()"><i class="icon-add"></i></a>
            @else 
            <a href="#" class="round-btn ripple-btn other" data-attribute="inviteMember"><i class="icon-add"></i></a>
            @endif    
        </div>
    </div> -->

    <!-- <div class="search-member">
        <h3>Team Members</h3>
        <div class="search-sec">
            {!! Form::open(['method'=>'GET', 'class'=>'navbar-form navbar-left','role'=>'search'])  !!}
            <div class="search-input">
                <input class="left" type="search" name="search_text" placeholder="Search">
            </div>
            <button type="submit" class="c-btn ripple-btn right">Search</button>
            {!! Form::close() !!}
        </div>
    </div> -->
    {!! Form::open(['method'=>'GET', 'class'=>'navbar-form navbar-left','role'=>'search'])  !!}
    <div class="mb-15 flex flex-sb flex-middle">
        <div class="search-input-wrap">
            <span class="icon-search search-box"></span>
            <input class="form-group-input" type="search" name="search_text" placeholder="Search">
        </div>
        <div class="mar_left_10 flex-shrink-0">
             @if($company->sub_type == '2')
            <button type="button" class="btn-new btn-new-primary" onclick="alerMessage()" title="Add Team Member"><i class="icon-add mar_right_5"></i> Team Member</button>
             @else 
             <button type="button" class="btn-new btn-new-primary"  data-attribute="inviteMember" title="Add Team Member"><i class="icon-add mar_right_5"></i>Team Member</button>
             @endif  
        </div>
    </div>
    {!! Form::close() !!}
    <div class="mb-15">Total No. of Team Members : <b>{{$team_membersCount}}</b></div>
    <img id="ajxloader" src="{{asset('images/preloader.gif')}}" style="display: none; margin-left: auto; margin-right: auto;"/>
    <div class="card-c mb-15">
        <div class="table-new-responsive">
            <table class="table-new">
                <thead>
                    <tr>
                        <th></th>
                        <th>Name</th>
                        <th>Email</th>
                        <th>User Role</th>
                        <th>Phone #</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @if(count($team_members) > 0)
                                        @foreach($team_members as $key=>$team_member)
                    <tr>
                        <td>{{ $key + $team_members->firstItem() }}</td>
                        <td><a class="team-member f-medium" href="javascript:void(0);" id="{{ $team_member->id }}">{{ $team_member->name }}</a></td>
                        <td class="text-break">{{ $team_member->email }}</td>
                        <td>@if($team_member->user_role->user_type == 2) 
                                Administrator 
                            @else 
                                Project Member
                            @endif
                        </td>
                        <td>{{ $team_member->mobile_no }}</td>
                        <td>
                            <button type="button" class="remove-row-btn" title="Delete" onclick="deleteAttribute('{{route('team-member-delete',['id'=>$team_member->id])}}','Delete')">
                                <i class="icon-delete"></i>
                            </button>
                        </td>
                    </tr>

                    @endforeach
                    @else
                    <tr>
                        <td colspan="8"><center>Result not found</center></td>
                    </tr>
                @endif
                </tbody>
            </table>
        </div>
        {{$team_members->appends(request()->input())->links() }}
    </div>
@include('front.member.modal.invite-member')
<div id="show-popup" class="modal-custom modal-large block-show opend-pop" style="display: none;">
    <div class="close modal-close-btn">
        <i class="icon-cancel close-pop" onclick="$('#show-popup').hide()"></i>
    </div>
    <div id="member-data"></div>
</div>
@endsection

@section('js')
<script>

    function alerMessage() {
  alert("In app purchase subscriptions are restricted from adding users Please contact support if you would like to add users to your account.\n Email: Support@ConstructionDailyReports.com \n Phone: 619-631-8820");
}
    

    $('.team-member').on('click', function () {
        var id = this.id;
        $("#ajxloader").css('display', 'block');
        $.ajax({
            url: "{{route('team-member-edit')}}",
            type: "GET",
            data: {'id': id},
            success: function (result) {
                //console.log(result);
                $('#member-data').html(result);
                $('.block-show').show();
                $('body').addClass('overlay');
                $("#ajxloader").css('display', 'none');
            }
        });

    });

    $('.close-pop, body.overlay').on('click', function () {
        $('#show-popup').hide();
        $('body').removeClass('overlay');
    });

    $(document).on('click', '#project', function () {
        $('#profile').removeClass("active");
        $(this).addClass("active");
        $('#member-user').hide();
        $('#member-project').show();
    });
    $(document).on('click', '#profile', function () {
        $('#project').removeClass("active");
        $(this).addClass("active");
        $('#member-user').show();
        $('#member-project').hide();
    })
    $(document).on('keyup', '#search_text', function () {
        var user_id = $('#user_id').val();
        var member_id = $('#member_id').val();
        var search_text = $('#search_text').val();
       
        $.ajax({
            url: "{{route('team-member-search')}}",
            type: "GET",
            data: {'user_id': user_id, 'member_id': member_id, 'search_text': search_text},
            success: function (result) {
                // alert(result)
                console.log(result);
				$('#service-data').html(result);
                //$('.block-show').show();
            }
        });
    });
   
   
   $(document).ready(function () {