@extends('layouts.admin')

@section('css')
    <link rel="stylesheet" type="text/css" href="{{asset('assets/styles/apps/crm/users-list.min.css')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('libs/datatables-net/media/css/dataTables.bootstrap4.min.css')}}"> <!-- original -->
    <link rel="stylesheet" type="text/css" href="{{asset('assets/styles/libs/datatables-net/datatables.min.css')}}"> <!-- customization -->
    <link rel="stylesheet" type="text/css" href="{{asset('assets/styles/apps/crm/contact.min.css')}}">
@endsection

@section('content')

    <div class="ks-column ks-page">
        <div class="ks-page-header">
            <section class="ks-title">
                <h3>{{$pageTitle}}</h3>
            </section>
        </div>
        <div class="ks-page-content">
            <div class="ks-page-content-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-xl-3">
                            <div class="card ks-crm-contact-user-column">
                                <div class="ks-crm-contact-user-column-main-info">
                                    <section>
                                        <img src="{{asset($client->avatar)}}" width="100" height="100" class="ks-crm-contact-user-avatar rounded-circle">
                                    </section>
                                    <section>
                                        <div class="ks-crm-contact-user-name">
                                            {{$client->full_name}}
                                        </div>
                                        <div class="ks-crm-contact-user-location">{{$client->city. ' - ' ?? ''}} {{$client->country->title ?? ''}}</div>
                                    </section>
                                </div>
                                <div class="ks-crm-contact-user-column-custom-info">
                                    <h6 class="ks-custom-info-header">Contact Information</h6>
                                    <div class="ks-custom-info-item">
                                        <div class="ks-custom-info-item-name">Email</div>
                                        <div class="ks-custom-info-item-content"><a href="mailto:{{$client->email}}=">{{$client->email}}</a></div>
                                    </div>
                                    <div class="ks-custom-info-item">
                                        <div class="ks-custom-info-item-name">Phone Number</div>
                                        <div class="ks-custom-info-item-content">{{$client->phone_number}}</div>
                                    </div>
                                    <div class="ks-custom-info-item">
                                        <div class="ks-custom-info-item-name">Address</div>
                                        <div class="ks-custom-info-item-content">{{$client->address}}</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-9">
                            <div class="ks-crm-contact-user-tabs-column">
                                <div class="ks-tabs-container ks-tabs-default ks-tabs-no-separator">
                                    <ul class="nav ks-nav-tabs">
                                        <li class="nav-item">
                                            <a class="nav-link active" href="#" data-toggle="tab" data-target="#crm-tab-account" aria-expanded="false">Account</a>
                                        </li>
                                        <li class="nav-item">
                                            <a class="nav-link" href="#" data-toggle="tab" data-target="#crm-tab-policies" aria-expanded="false">Policies</a>
                                        </li>
                                        <li class="nav-item">
                                            <a class="nav-link" href="#" data-toggle="tab" data-target="#crm-tab-invoices" aria-expanded="false">Invoices</a>
                                        </li>
                                        <li class="nav-item">
                                            <a class="nav-link" href="#" data-toggle="tab" data-target="#crm-tab-activity" aria-expanded="true">Activities</a>
                                        </li>
                                    </ul>
                                    <div class="tab-content">

                                        <div class="tab-pane active" id="crm-tab-account" role="tabpanel" aria-expanded="false" data-height="735">


                                            <div class="ks-task-details">
                                                <div class="ks-wrapper">

                                                    <div class="ks-collapse-block">
                                                        <div class="nav-item dropdown">
                                                            <a class="dropdown-toggle collapsed" data-toggle="collapse" data-target="#ks-details-collapse-block-content">
                                                                Details
                                                            </a>
                                                        </div>

                                                        <div class="collapse in show" id="ks-details-collapse-block-content">
                                                            <table class="ks-table-details">
                                                                <tr>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            Full Name
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            {{$client->full_name}}
                                                                        </div>
                                                                    </td>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            Gender
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            {{isset($client->gender->title) ? ucwords(lang($client->gender->title)) : '-'}}
                                                                        </div>
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            DOB
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            {{\Carbon\Carbon::parse($client->dob)->format('M d, Y')}}
                                                                        </div>
                                                                    </td>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            Email
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            <a href="mailto:{{$client->email}}=">{{$client->email}}</a>
                                                                        </div>
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            City
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            {{$client->city ?? '-'}}
                                                                        </div>
                                                                    </td>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            Country
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            {{$client->country->title ?? '-'}}
                                                                        </div>
                                                                    </td>
                                                                </tr>
                                                                <tr>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            Address
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            {{$client->address ?? '-'}}
                                                                        </div>
                                                                    </td>
                                                                    <td>
                                                                        <div class="ks-header">
                                                                            Phone Number
                                                                        </div>
                                                                        <div class="ks-body">
                                                                            {{$client->phone_number}}
                                                                        </div>
                                                                    </td>
                                                                </tr>
                                                                @if(\Auth::user()->can('edit-client'))
                                                                    <tr>
                                                                        <td colspan="2">
                                                                            <a data-refresh-on-success="true" class="editRecord btn btn-outline-primary ks-light btn-sm" href="#!" data-href="{{route('clients.edit', ['id' => $client->id, 'model' => getModelName($client)])}}">
                                                                                Edit
                                                                            </a>
                                                                        </td>
                                                                    </tr>
                                                                @endif
                                                            </table>
                                                        </div>
                                                    </div>

                                                </div>
                                            </div>


                                        </div>



                                        <div class="tab-pane" id="crm-tab-policies" role="tabpanel" aria-expanded="false" data-height="735">
                                            Policies
                                        </div>

                                        <div class="tab-pane" id="crm-tab-invoices" role="tabpanel" aria-expanded="false" data-height="735">


                                            @if(\Auth::user()->can('browse-orderitem'))
                                                {{--<div class="tab-pane ks-column-section" id="invoices" role="tabpanel">--}}

			                                                                                            {{--<div class="ks-user-list-view-table">--}}
                                                        {{--<div class="ks-full-table container-fluid">--}}
                                                            <table id="{{$dataTableId1}}" class="display table table-striped table-bordered" width="100%" data-url="{{route('order-items.list', ['user_id'=>$client->id])}}">
                                                                <thead>
                                                                <tr>
                                                                    @foreach(\App\Http\Controllers\Admin\OrderItemController::columns() as $col)
                                                                        <th class="text-center">{{$col['title']}}</th>
                                                                    @endforeach
                                                                </tr>
                                                                </thead>
                                                                <tfoot>
                                                                <tr>
                                                                    @foreach(\App\Http\Controllers\Admin\OrderItemController::columns() as $col)
                                                                        <th class="text-center" title="{{$col['title']}}"></th>
                                                                    @endforeach
                                                                </tr>
                                                                </tfoot>
                                                            </table>
                                                        {{--</div>--}}
                                                    {{--</div>--}}

                                                {{--</div>--}}
                                            @endif


                                        </div>
                                        <div class="tab-pane ks-scrollable" id="crm-tab-activity" role="tabpanel" aria-expanded="true" data-height="735">
                                            <div class="ks-crm-user-view-activity-block">
                                                <h4 class="ks-crm-user-view-activity-header">October, 2016</h4>

                                                <div class="ks-crm-user-view-activity-items">
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-info"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 12</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-check-circle-o"></span>
                                                                <span class="ks-text">Task added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Prepare for a bi-weekly meeting to discuss new features
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-purple"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 11</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-plus-circle"></span>
                                                                <span class="ks-text">Deal added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Deal for the property in Malibu with Casey Brother Real Estate
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 AM</div>
                                                        </div>
                                                    </div>
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-success"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 9</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-clock-o"></span>
                                                                <span class="ks-text">Event completed</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Deal for the property in Malibu with Casey Brother Real Estate
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                </div>

                                                <h4 class="ks-crm-user-view-activity-header">September, 2016</h4>

                                                <div class="ks-crm-user-view-activity-items">
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-info"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 12</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-check-circle-o"></span>
                                                                <span class="ks-text">Task added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Prepare for a bi-weekly meeting to discuss new features
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-purple"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 12</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-check-circle-o"></span>
                                                                <span class="ks-text">Task added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Prepare for a bi-weekly meeting to discuss new features
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-success"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 12</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-check-circle-o"></span>
                                                                <span class="ks-text">Task added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Prepare for a bi-weekly meeting to discuss new features
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                </div>

                                                <h4 class="ks-crm-user-view-activity-header">August, 2016</h4>

                                                <div class="ks-crm-user-view-activity-items">
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-info"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 12</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-check-circle-o"></span>
                                                                <span class="ks-text">Task added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Prepare for a bi-weekly meeting to discuss new features
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-purple"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 12</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-check-circle-o"></span>
                                                                <span class="ks-text">Task added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Prepare for a bi-weekly meeting to discuss new features
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                    <div class="ks-crm-user-view-activity-item">
                                                        <div class="ks-crm-user-view-activity-item-badge">
                                                            <span class="badge ks-circle badge-success"></span>
                                                        </div>
                                                        <div class="ks-crm-user-view-activity-item-date">Oct 12</div>
                                                        <div class="ks-crm-user-view-activity-item-action">
                                                            <div class="ks-crm-user-view-activity-item-action-name">
                                                                <span class="ks-icon la la-check-circle-o"></span>
                                                                <span class="ks-text">Task added</span>
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-description">
                                                                Prepare for a bi-weekly meeting to discuss new features
                                                            </div>
                                                            <div class="ks-crm-user-view-activity-item-action-time">12:22 PM</div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@stop

@include('admin.partials.datatables')

@section('javascript')
    @if(\Auth::user()->can('browse-orderitem'))
        <script>
			var myTable1;
			var columnOptions = [
                    @foreach(\App\Http\Controllers\Admin\OrderItemController::columns() as $col)
				{ "data": "{{$col['data']}}", "name": '{{$col['name']}}', "orderable": '{{$col['orderable']}}', "searchable": '{{$col['searchable']}}', "className": '{{$col['className']}}' },
                @endforeach
			];
			loadDataTable(myTable1,'{{$dataTableId1}}', columnOptions);
        </script>
    @endif
@stop