@extends('layouts.master')
@section('page_title')
    @if(isset($page_title))
        {{ $page_title }}
    @endif
@endsection
@section('css')
<link href="{{ url('public/assets/vendors/iCheck/skins/flat/green.css') }}" rel="stylesheet">
@endsection

@section('content')
@include('client.partials.new_notes')
@include('client.partials.edit-notes')
@include('client.partials.finance')
@include('client.partials.create-shortcodes')
@include('client.partials.edit-shortcodes')
@include('client.partials.edit-finance')
@include('client.partials.progress_indicator_details')
@include('client.partials.support_fees_form')
@include('client.partials.create-senderids')
<?php  ?>
<div class="">
  <div class="page-title">
    <div class="title_left">
      </div>
        <div class="title_left">
          <ol class="breadcrumb">
            <li><a href="{!! url('dashboard') !!}">Dashboard</a></li>
            <li><a href="{!! url('clients') !!}">Clients</a></li>
            <li class="active">Client Details</li>
          </ol>
        </div>
  </div>
  <div class="clearfix"></div>
    <div class="row">
      <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
          <div class="x_title">
            <h2>Client Details </h2>

            <div class="clearfix"></div>
            @include('commons.notifications')
          </div>
            <div class="x_content">
              <div class="col-md-12">
                
              </div>
              <div class="col-md-3 col-sm-3 col-xs-12 profile_left">
                <div class="profile_img">
                  <div id="crop-avatar">
                    <!-- Current avatar -->
                    @if($showclient->country_flag_info !== null)
                      <img class="img-responsives avatar-views" src="{{ url($showclient->country_flag_info->url) }}" alt="Generic Client Icon" title="Country Flag" width="100px">
                    @else

                      <img class="img-responsive avatar-view" src="{{ url('public/assets/img/generic-client.png') }}" alt="Generic Client Icon" title="Change the avatar" width="100px">
                    @endif
                  </div>
                </div>
                <h3>{{ $showclient->name }}</h3>
                <div class="well" style="border-radius: 25px;">
                  Click Account Manager <br>
                  <strong>
                    <em> <?php echo $showclient->auth_user_info->name ?? 'N/A' ?> </em>
                  </strong>
                </div>
                <h4>
                  Status :  <span class="label label-{{ $status_bg }}">{{ $showclient->status }}</span>&nbsp;
                  <span role="button" id="progressIndicatorBtn" class="label label-{{ $progress_status_bg }}"> Progress: {{ $showclient->progress_indicator_score }}%</span>
                </h4>
                <ul class="list-unstyled user_data">
                  <li><i class="fa fa-phone user-profile-icon"></i> <?php echo $showclient->phone ?? "N/A";  ?></li>
                  <li><i class="fa fa-envelope user-profile-icon"></i> <?php echo $showclient->email ?? "N/A";  ?> </li>
                  <li class="m-top-xs"><i class="fa fa-skype user-profile-icon"></i> <?php echo $showclient->skype_name ?? "N/A";  ?></li>
                  <li class="m-top-xs"><i class="fa fa-linkedin user-profile-icon"></i> <?php echo $showclient->linkedin_name ?? "N/A";  ?></li>
                </ul>

                <h5 style="text-decoration: underline;">Highlights</h5>
                @if(!$show_notes->isEmpty())
                <ul class="legend list-unstyled">
                    <li>
                      <p>
                        <span class="icon"><i class="fa fa-square blue"></i></span> <span class="name">
                        <?php for ($i = 0; $i < $show_notes->count(); $i++) {  ?>

                        <?php if ($show_notes[$i]->highlight == 'NO'): continue; endif; ?>
                          <strong> {{ $i+1 . "." }}</strong> {{ $show_notes[$i]->notes_body }}
                        <?php } ?>
                        </span>
                      </p>
                    </li>
                </ul>
                @endif
                @if(session('current_user.id') == $showclient->auth_user_id)
                  <a class="btn btn-success" href="{{ url('clients/'. $showclient->id . '/edit') }}"><i class="fa fa-edit m-right-xs"></i> Edit Client</a>
                  <a class="btn btn-primary" href="{{ url('clients/onboarding', $showclient->id) }}"><i class="fa fa-edit m-right-xs"></i> Onboarding Checklist</a>
                @endif
                <a class="btn btn-primary" href="{{ url('clients/readonly/'. $showclient->id) }}"><i class="fa fa-eye m-right-xs"></i> Full Details (Readonly)</a>

                <br />

                <!-- start skills -->
                <!-- <h4>Finance</h4>
                <ul class="list-unstyled user_data">
                  <li><i class="fa fa-phone user-profile-icon"></i> [Phone Number here]</li>
                  <li><i class="fa fa-envelope user-profile-icon"></i>  [email here] </li>
                  <li class="m-top-xs"><i class="fa fa-skype user-profile-icon"></i> [Skype ID Here]</li>
                </ul> -->
                <!-- end of skills -->
              </div>
              
              <div class="col-md-9 col-sm-9 col-xs-12" style="border: 1px solid; min-height: 500px;">
                <div class="row">
                  <div class="col-md-12">
                    <div class="" role="tabpanel" data-example-id="togglable-tabs">
                      <div class="col-xs-3">
                      <ul id="myTab" class="nav nav-tabs bar_tabs tabs-left" role="tablist">
                        <li role="presentation" class=""><a href="#tabContract" role="tab" id="contract-tab2" class="text-info bg-info" data-toggle="tab" aria-expanded="false">Contract</a></li>
                        <li role="presentation" class=""><a href="#tabFinance" role="tab" id="finance-tab2" class="text-success" data-toggle="tab" aria-expanded="false">Finance</a></li>
                        <li role="presentation" class=""><a href="#tabNotes" role="tab" id="notes-tab2" class="text-default" data-toggle="tab" aria-expanded="false">Notes</a></li>
                        <li role="presentation" class=""><a href="#tabSenderIDs" role="tab" id="senderIds-tab2" class="text-warning" data-toggle="tab" aria-expanded="false">Sender IDs</a></li>
                        <li role="presentation" class=""><a href="#tabSmsShortCode" role="tab" id="smsshortcode-tab2" class="text-info" data-toggle="tab" aria-expanded="false">SMS Short Codes</a></li>
                        <li role="presentation" class=""><a href="#tabUssdShortCode" role="tab" id="ussdshortcode-tab2" class="text-success" data-toggle="tab" aria-expanded="false">USSD Short Codes</a></li>
                        <li role="presentation" class=""><a href="#tabVoiceShortCode" role="tab" id="voiceshortcode-tab2" class="text-warning" data-toggle="tab" aria-expanded="false">Voice Short Codes</a></li>
                      </ul>
                    </div>
                    <div class="col-xs-9">
                      <div id="myTabContent" class="tab-content">
                        
                        <div role="tabpanel" class="tab-pane fade" id="tabConnection" aria-labelledby="connection-tab">

                          <h4 class="lead"><strong>Connection Details </strong></h4>
                          <blockquote>
                          <p>Connection Types : <?php if($showclient->connections) { echo implode(", ", json_decode($showclient->connections, true));  } else {echo "N/A"; } ?></p>
                          <br>

                          <p>Partner SMPP Details <br>
                          <?php //if($showclient->smpp_details) { echo $showclient->smpp_details;  } else {echo "N/A"; } ?></p>
                          </blockquote>
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="tabContract" aria-labelledby="contract-tab">
                          <h4 class="lead"> <strong>Contract Details </strong></h4>
                          <blockquote>
                          <p>Contract Type : <strong> {{ ucfirst($showclient->contract_type) ?? 'N/A'}} </strong><br> </p>


                          <p>Contract Validity (Date) : <strong> {{ $showclient->contract_validity or 'N/A'}} </strong></p>
                          <p>Contract Auto Renewal : <strong> {{ $showclient->contract_auto_renew or 'N/A'}} </strong></p>
                          @if($showclient->contract_auto_renew != 'YES')
                          <p>Renewal Due : <strong class="text-<?php echo ($highlight_colour == 'none') ? '' : 'danger'; ?> ">  {{ $renewal_due }} </strong></p>
                          @endif
                        </blockquote>
                        <h4 class="lead"> <strong>Support Fees  </strong></h4>
                        <button type="button" class="btn btn-success btn-sm pull-right" id="addSupportFeesInfoBtn"><i class="fa fa-plus-square"></i> New Support Fee Info</button>
                        <div class="clearfix"></div>
                          @include('client.partials.support_fees')
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="tabFinance" aria-labelledby="finance-tab">
                          <h4 class="lead"><strong>Finance Details </strong></h4>
                          <button type="button" class="btn btn-success btn-sm pull-right" id="createPaymentBtn"><i class="fa fa-plus-square"></i> New Payment Details</button>
                          <div class="clearfix"></div>
                          <hr>
                          @include('client.partials.recent-payments')
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="tabNotes" aria-labelledby="notes-tab">
                            <strong><h3> Notes</h3> </strong>
                            <div class="pull-right">
                              <!-- {{ url('clients/create-notes') }} -->
                              <button type="button" class="btn btn-success btn-sm" id="createNotesBtn">New Notes <i class="fa fa-plus-square"></i> </button>
                            </div>
                            <div class="clearfix"></div>
                            <div style="background-color: #dce2e4; height: 400px; overflow: scroll;">

                                <ul class="messages list-group" style="padding: 15px;">
                                  @if($show_notes->isEmpty())
                                  <li style="" class="">No notes found</li>
                                  @else
                                  <?php for ($i = 0; $i < $show_notes->count(); $i++) {  ?>
                                    <?php if ($show_notes[$i]->highlight == 'YES'): continue; endif; ?>
                                    <li class="list-group-item list-group-item-<?php echo ($i%2 == 0)? "secondary" : "info"; ?>">
                                      <div class="message_date" style="padding-right: 10px;">
                                        <h3 class="date text-info"><?php echo date('d', strtotime($show_notes[$i]->created_at)); ?></h3>
                                        <p class="month"><?php echo date('M', strtotime($show_notes[$i]->created_at)); ?></p>
                                        <p class="year"><?php echo date('Y', strtotime($show_notes[$i]->created_at)); ?></p>
                                      </div>
                                      <div class="message_wrapper">
                                        <h4 class="heading">{{ $show_notes[$i]->client_info->name }}</h4>
                                        <blockquote class="message"><em>Content : </em> {{ $show_notes[$i]->notes_body }}</blockquote>
                                        <br />
                                        <p class="url">
                                          <span class="fs1 text-info" aria-hidden="true" data-icon=""></span>
                                          <input type="hidden" name="notes_id" class="notesRowId" value="{{ $show_notes[$i]->id }}">
                                          <a href="#" class="notesEditBtn"><i class="fa fa-edit"></i>Account Manager :  {{ $show_notes[$i]->created_by_info->name }} </a>
                                        </p>
                                      </div>
                                    </li>
                                  <?php } ?>
                                  @endif
                                </ul>
                            </div>
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="tabSenderIDs" aria-labelledby="senderIds-tab">
                          <h4 class="lead"><strong>Sender IDs </strong></h4>
                          <button type="button" class="btn btn-success btn-sm pull-right" id="createSenderIdBtn"><i class="fa fa-plus-square"></i> New Sender ID</button>
                          <div class="clearfix"></div>
                          @include('client.partials.sender-ids')
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="tabSmsShortCode" aria-labelledby="smsshortcode-tab">
                          <h4 class="lead"><strong>SMS Short Code </strong></h4>
                          <button type="button" class="btn btn-success btn-sm pull-right" id="createSmsShortCodeBtn"><i class="fa fa-plus-square"></i> New Short Code</button>
                          <div class="clearfix"></div>
                          @include('client.partials.sms-codes')
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="tabUssdShortCode" aria-labelledby="ussdshortcode-tab">
                          <h4 class="lead"><strong>USSD Short Codes </strong></h4>
                          <button type="button" class="btn btn-success btn-sm pull-right" id="createUssdShortCodeBtn"><i class="fa fa-plus-square"></i> New Short Code</button>
                          <div class="clearfix"></div>
                          @include('client.partials.ussd-codes')
                        </div>
                        <div role="tabpanel" class="tab-pane fade" id="tabVoiceShortCode" aria-labelledby="voiceshortcode-tab">
                          <h4 class="lead"><strong>Voice Short Code </strong></h4>
                          <button type="button" class="btn btn-success btn-sm pull-right" id="createVoiceShortCodeBtn"><i class="fa fa-plus-square"></i> New Short Code</button>
                          <div class="clearfix"></div>
                          @include('client.partials.voice-codes')
                        </div>
                      </div>
                    </div>
                    </div>
                </div>
                </div>
              </div>
            </div>
        </div>
      </div>
    </div>
  </div>
</div>
@endsection
@section('javascript')
<script src="{{ url('public/assets/vendors/iCheck/icheck.min.js') }}"></script>
<script src="{{ url('public/assets/js/clientshow.js') }}"></script>
<script type="text/javascript">

  // iCheck
$(document).ready(function() {
    if ($("input.flat")[0]) {
        $(document).ready(function () {
            $('input.flat').iCheck({
                checkboxClass: 'icheckbox_flat-green',
                radioClass: 'iradio_flat-green'
            });
        });
    }
});
// /iCheck

// Table
$('table input').on('ifChecked', function () {
    checkState = '';
    $(this).parent().parent().parent().addClass('selected');
    countChecked();
});
$('table input').on('ifUnchecked', function () {
    checkState = '';
    $(this).parent().parent().parent().removeClass('selected');
    countChecked();
});

var checkState = '';

$('.bulk_action input').on('ifChecked', function () {
    checkState = '';
    $(this).parent().parent().parent().addClass('selected');
    countChecked();
});
$('.bulk_action input').on('ifUnchecked', function () {
    checkState = '';
    $(this).parent().parent().parent().removeClass('selected');
    countChecked();
});
$('.bulk_action input#check-all').on('ifChecked', function () {
    checkState = 'all';
    countChecked();
});
$('.bulk_action input#check-all').on('ifUnchecked', function () {
    checkState = 'none';
    countChecked();
});

</script>
@endsection
