@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.change-am')
<div class="">
  <div class="x_content">
      <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
          <div class="x_title">
            <h2><i class="fa fa-align-left"></i> Client Details : <span class="" style="color: green;"><u>{{ $showclient->name }}</u></span></h2>
            
            <div class="clearfix"></div>
            @include('commons.notifications')
          </div>
          <div class="x_content">

            <!-- start accordion -->
            <div class="accordion" id="accordion" role="tablist" aria-multiselectable="true">
              <div class="panel">
                <a class="panel-heading" role="tab" id="headingZero" data-toggle="collapse" data-parent="#accordion" href="#collapseZero" aria-expanded="true" aria-controls="collapseZero">
                  <h4 class="panel-title">Details Summary</h4>
                </a>
                <div id="collapseZero" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingZero">
                  <div class="panel-body">
                    <div class="col-md-12">
                      <ul class="stats-overview">
                        <li>
                          <span class="name"> Total Payments </span>
                          <span class="value text-success"> {{ number_format($recent_payments->sum('invoice_amount')) }} </span>
                        </li>
                        <li>
                          <span class="name"> Short Codes </span>
                          <span class="value text-success"> 
                            {{ $ussd_codes->count() +  $sms_codes->count() + $voice_codes->count() }}
                           </span>
                        </li>
                        <li class="hidden-phone">
                          <span class="name"> Documents Count </span>
                          <span class="value text-success"> {{ $showdocuments->count() }} </span>
                        </li>
                      </ul>
                    </div>

                    <div class="col-md-5">
                      <div class="text-centerM">
                        <div class="profile_img" style="padding-bottom: 5px;">
                          <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>
                        <p class="text-warning" style="font-size: larger;"><strong>{{ $showclient->name }}</strong></p>
                        <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>
                        <div class="">
                          Client Account Manager : <strong><em> <?php echo $showclient->contact_person ?? 'N/A' ?> </em></strong>
                        </div>
                        <div class="">
                          Click Account Manager : 
                          <strong><em> <?php echo $showclient->auth_user_info->name ?? 'N/A' ?> </em>
                          @if($change_account_mgr_permisson == 'YES' )
                            <button class="btn btn-success btn-xs" id="changeAmTrigBtn"><i class="fa fa-edit m-right-xs"></i></button>
                          @endif
                          </strong>
                        </div>
                        <ul class="list-unstyled user_data">
                          <li>
                            <i class="fa fa-phone user-profile-icon"></i> <?php echo $showclient->phone ?? "N/A";  ?> | <i class="fa fa-envelope user-profile-icon"></i> <?php echo $showclient->email ?? "N/A";  ?> 
                          </li>
                          <li>
                            <i class="fa fa-skype user-profile-icon"></i> <?php echo $showclient->skype_name ?? "N/A";  ?> | <i class="fa fa-linkedin user-profile-icon"></i> <?php echo $showclient->linkedin_name ?? "N/A";  ?>
                          </li>
                        </ul>
                        <ul class="list-unstyled user_data">
                          <li>Country : <strong> {{ $showclient->country or "N/A" }}</strong> | Company Type : <strong> {{ $showclient->company_type or "N/A" }}</strong></li>
                          
                        </ul>
                           @if(session('current_user.id') == $showclient->auth_user_id)
                            <a class="btn btn-success btn-sm" href="{{ url('clients/'. $showclient->id . '/edit') }}"><i class="fa fa-edit m-right-xs"></i> Edit Client</a>
                            <a class="btn btn-primary btn-sm" href="{{ url('clients/onboarding', $showclient->id) }}"><i class="fa fa-edit m-right-xs"></i> Onboarding Checklist</a>
                            <!-- <a class="btn btn-primary btn-sm" href="{{ url('clients/onboarding', $showclient->id) }}"><i class="fa fa-edit m-right-xs"></i> Onboarding Checklist</a> -->
                          @endif
                      </div>
                    </div>
                    <div class="col-md-4">
                      <h5 style="text-decoration: underline;">Contract</h5>
                      <ul class="list-unstyled user_data">
                        <li>Contract Type : <strong> {{ ucfirst($showclient->contract_type) ?? 'N/A'}} </strong></li>
                        <li>Contract Validity (Date) : <strong> {{ $showclient->contract_validity or 'N/A'}} </strong></li>
                        <li>Contract Auto Renewal : <strong> {{ $showclient->contract_auto_renew or 'N/A'}} </strong></li>
                      </ul>
                      @if($showclient->contract_auto_renew != 'YES')
                      <p>Renewal Due : <strong class="text-<?php echo ($highlight_colour == 'none') ? '' : 'danger'; ?> ">  {{ $renewal_due }} </strong></p>
                      @endif

                        <h5 class="" style="text-decoration: underline;"><strong>Connection Details </strong></h5>
                        <p>Connection Types : <em> <?php if($showclient->connections) { echo implode(", ", json_decode($showclient->connections, true));  } else {echo "N/A"; } ?></em></p>
                        <p>SMPP Username  : <em>
                        <?php if($showclient->smpp_username) { echo $showclient->smpp_username;  } else {echo "N/A"; } ?></em></p>
                        <p>Message Types : <em>
                        <?php if($showclient->message_types) {
                            $types_array = json_decode($showclient->message_types);
                            echo implode(', ', $types_array);
                          }
                          else {
                            echo "N/A";
                          } ?>
                          </em>
                        </p>
                    </div>
                    <div class="col-md-3">
                       <h5 style="text-decoration: underline;">Documents</h5>
                        @if(!$showdocuments->isEmpty() == true)
                          @foreach($showdocuments as $docs)
                          <p class="url">
                            <span class="fs1 text-info" aria-hidden="true" data-icon=""></span>
                            <a href="{{ url('clients/downloadfile', $docs->id) }}" title="Click to Download"><i class="fa fa-paperclip"></i> {{ $docs->name }}.{{ $docs->file_extension }}</a>
                          </p>
                          @endforeach
                        @else
                          <p>No Documents uploaded</p>
                        @endif 
                        <div class="" style="padding-top: 10px;">
                        <h5 style="text-decoration: underline;">How We Got This Client</h5>
                        <p class="label label-success">
                          <?php echo $showclient->how_we_got_client  ?? "N/A"  ?>
                        </p>
                        </div>                       
                    </div>
                    <div class="col-md-12">
                      <h5>Notes(Highlights)</h5>
                      <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_highlight->count(); $i++) {  ?>
                              <strong> {{ $i+1 . "." }}</strong> 
                              {{  $show_notes_highlight[$i]->notes_body }}
                            <?php } ?>
                            </span>
                          </p>
                        </li>
                    </ul>
                    </div>
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingOne" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
                  <h3 class="panel-title">Contact & Support Details</h3>
                </a>
                <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
                  <div class="panel-body">
                    <div class="row">
                      
                      <div class="col-md-6">
                         <h5 class=""><strong>Support Phone(s)</strong></h5>
                        @if(!empty($showclient->support_phones))
                          <?php
                            $the_arr = json_decode($showclient->support_phones, true) ?>
                            <ul>
                            <?php foreach ($the_arr as $row): ?>

                              <li>{{ $row }}</li>

                            <?php endforeach ?>
                            </ul>
                        @else
                          N/A
                        @endif
                        <h5 class=""><strong>Support Email(s)</strong></h5>
                        @if(!empty($showclient->support_emails))
                          <?php
                            $the_arr = json_decode($showclient->support_emails, true) ?>
                            <ul>
                            <?php foreach ($the_arr as $row): ?>

                              <li>{{ $row }}</li>

                            <?php endforeach ?>
                            </ul>
                        @else
                          N/A
                        @endif
                        @if(!empty($showclient->rate_emails))
                        <h5 class=""><strong>Rates Email(s)</strong></h5>
                            <?php
                            $the_arr = json_decode($showclient->rate_emails, true) ?>
                            <ul>
                            <?php foreach ($the_arr as $row): ?>

                              <li>{{ $row }}</li>

                            <?php endforeach ?>
                            </ul>
                        @else
                          N/A
                        @endif
                        
                      </div>
                      <div class="col-md-6">
                        <h5 class=""><strong>Finance Email(s)</strong></h5>
                        @if(!empty($showclient->finance_email))
                               <?php
                            $the_arr = json_decode($showclient->finance_email, true) ?>
                            <ul>
                            <?php foreach ($the_arr as $row): ?>

                              <li>{{ $row }}</li>

                            <?php endforeach ?>
                            </ul>
                        @else
                          N/A
                        @endif
                        <h5 class=""><strong>Support Skype ID(s)</strong></h5>
                        @if(!empty($showclient->support_skype))
                               <?php
                            $the_arr = json_decode($showclient->support_skype, true) ?>
                            <ul>
                            <?php foreach ($the_arr as $row): ?>

                              <li>{{ $row }}</li>

                            <?php endforeach ?>
                            </ul>
                        @else
                          N/A
                        @endif
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingTwo" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                  <h4 class="panel-title">Support Fees</h4>
                </a>
                <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                  <div class="panel-body">
                    
                    <h4 class="lead"> <strong>Fees List  </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>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingThree" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                  <h4 class="panel-title">Notes</h4>
                </a>
                <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                  <div class="panel-body">
                    <!-- <p><strong>Collapsible Item 3 data</strong></p> -->
                        <div class="pull-rightMMM">
                          <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>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingFour" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
                  <h4 class="panel-title">Recent Payments</h4>
                </a>
                <div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour">
                  <div class="panel-body">
                    <!-- <p><strong>Collapsible Item Four data</strong></p> -->
                    <button type="button" class="btn btn-success btn-sm pull-rightb" id="createPaymentBtn"><i class="fa fa-plus-square"></i> New Payment Details</button>
                    <div class="clearfix"></div>
                    <div class="" style="background-color: #dce2e4; height: 400px; overflow: scroll;"> 
                       @include('client.partials.recent-payments')
                     </div>
                  </div>
                </div>
              </div>
              
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingSix" data-toggle="collapse" data-parent="#accordion" href="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
                  <h4 class="panel-title">SMS Short Codes</h4>
                </a>
                <div id="collapseSix" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingSix">
                  <div class="panel-body">
                    <!-- <p><strong>Collapsible Item Six data</strong></p> -->
                      <button type="button" class="btn btn-success btn-sm pull-rightE" id="createSmsShortCodeBtn"><i class="fa fa-plus-square"></i> New Short Code</button>
                      <div class="clearfix"></div>
                      @include('client.partials.sms-codes')
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingSeven" data-toggle="collapse" data-parent="#accordion" href="#collapseSeven" aria-expanded="false" aria-controls="collapseSeven">
                  <h4 class="panel-title">USSD Short Codes</h4>
                </a>
                <div id="collapseSeven" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingSeven">
                  <div class="panel-body">
                    <!-- <h4 class="lead"><strong>USSD Short Codes </strong></h4> -->
                      <button type="button" class="btn btn-success btn-sm" id="createUssdShortCodeBtn"><i class="fa fa-plus-square"></i> New Short Code</button>
                      <div class="clearfix"></div>
                      @include('client.partials.ussd-codes')
                  </div>
                </div>
              </div>
              <div class="panel">
                <a class="panel-heading collapsed" role="tab" id="headingVoice" data-toggle="collapse" data-parent="#accordion" href="#collapseVoice" aria-expanded="false" aria-controls="collapseVoice">
                  <h4 class="panel-title">Voice Short Codes</h4>
                </a>
                <div id="collapseVoice" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingVoice">
                  <div class="panel-body">
                    <!-- <p><strong>Collapsible Item Voice data</strong></p> -->
                    <button type="button" class="btn btn-success btn-sm" 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>
            
            <!-- end of accordion -->


          </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