@extends('layouts.app')
@php
$userRole = \Session::get('role');
$userPermission = \Session::get('userPermission');
@endphp
@section('content')
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>

<div class="nk-block-head nk-block-head-sm">
	<div class="nk-block-between">
		<div class="nk-block-head-content">
			<h3 class="nk-block-title page-title">
				<a href="javascript:history.back()" class="pt-3"><em class="icon ni ni-chevron-left back-icon"></em> </a>
				Customer : View
			</h3>
		</div><!-- .nk-block-head-content -->
	</div><!-- .nk-block-between -->
</div><!-- .nk-block-head -->
    <div class="nk-block">
        <div class="row g-3">
            <div class="col-md-12">
                <div class="accordion">
                    <div class="accordion-item">
                        <a href="#" class="accordion-head collapsed" data-toggle="collapse" data-target="#campaign-summary">
                            <h6 class="title">Customer Detail</h6>
                            <span class="accordion-icon"></span>
                        </a>
                        <div class="accordion-body collapse" id="campaign-summary">
                            <div class="accordion-inner">
                                <div class="row g-4">
                                    <div class="col-lg-6">
                                        <ul class="details-list">
                                            <li>
                                                <div class="left">Customer Name</div>
                                                <div class="right">
                                                    {{$customer->customer_name!='' ? $customer->customer_name : 'N/A'}}
                                                </div>
                                            </li>
                                            <li>
                                                <div class="left">Customer Type</div>
                                                <div class="right">
                                                    {{$customer->customer_type!='' ? $customer->customer_type : 'N/A'}}
                                                </div>
                                            </li>
                                            <li>
                                                <div class="left">Site Name</div>
                                                <div class="right">
                                                    {{$customer->site_name!='' ? $customer->site_name : 'N/A'}}
                                                </div>
                                            </li>
                                            <li>
                                                <div class="left">Mode Of Support</div>
                                                <div class="right">
                                                    {{ $customer->mode_of_support!='' ? $customer->mode_of_support : 'N/A' }}
                                                </div>
                                            </li>
                                            <li>
                                                <div class="left">Area</div>
                                                <div class="right">
                                                    {{$customer->area!='' ? $customer->area : 'N/A'}}
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="col-lg-6">
                                        <ul class="details-list">
                                            <li>
                                                <div class="left">Organisation</div>
                                                <div class="right">
                                                    {{$customer->company!='' ? $customer->company : 'N/A'}}
                                                </div>
                                            </li>
                                            <!-- <li>
                                                <div class="left">Product</div>
                                                <div class="right">
                                                    <select class="form-select form-select-sm bg-white" id="product" name="product" data-search="off" multiple data-placeholder="Select" disabled>
                                                        <option value="">Select</option>
                                                        @foreach($allProducts as $product)
                                                        <option value="{{$product->product_id}}" @if(in_array($product->product_id, $customerProducts)) selected @endif>{{$product->name}}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </li> -->
                                            <li>
                                                <div class="left">Fleet Size</div>
                                                <div class="right">
                                                    {{$customer->fleet_size!='' ? $customer->fleet_size : 'N/A'}}
                                                </div>
                                            </li>
                                            <li>
                                                <div class="left">Region</div>
                                                <div class="right">
                                                    {{$customer->region!='' ? $customer->region : 'N/A'}}
                                                </div>
                                            </li>
                                            <li>
                                                <div class="left">Dealer Name</div>
                                                <div class="right">
                                                    {{$customer->dealer_name!='' ? $customer->dealer_name : 'N/A'}}
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- <div class="col-md-12">
                <div class="card card-bordered h-100">
                    <div class="card-body border-bottom">
                        <div class="card-title-group">
                            <div class="card-title">
                                <h6 class="title">Customer Detail</h6>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="row g-3">
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="customerId">Customer ID</label>
                                    <div class="form-control-wrap">
                                        <input type="text" class="form-control" id="customerId" name="customerId" placeholder="Customer ID" value="{{$customer->customer_id}}" disabled/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="organization">Organisation</label>
                                    <div class="form-control-wrap">
                                    <select class="form-select form-select-sm bg-white" name="company" data-search="off" data-placeholder="Select" disabled>
                                        <option value="">Select</option>
                                        @foreach($companies as $company)
                                        <option value="{{$company->company_id}}" @if($company->company_id==$customer->company_id) selected @endif>{{$company->company_name}}</option>
                                        @endforeach
                                    </select>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="customrtType">Customer Type</label>
                                    <div class="form-control-wrap">
                                        <input type="text" class="form-control" id="customrtType" name="customrtType" placeholder="Customer Type" value="{{$customer->customer_type}}" disabled/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="product">Product</label>
                                    <div class="form-control-wrap">
                                        <select class="form-select form-select-sm bg-white" id="product" name="product" data-search="off" multiple data-placeholder="Select" disabled>
                                            <option value="">Select</option>
                                            @foreach($allProducts as $product)
                                            <option value="{{$product->product_id}}" @if(in_array($product->product_id, $customerProducts)) selected @endif>{{$product->name}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="siteName">Site Name</label>
                                    <div class="form-control-wrap">
                                        <input type="text" class="form-control" id="siteName" name="siteName" placeholder="Site Name" value="{{$customer->site_name}}" disabled/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="fleetSize">Fleet Size</label>
                                    <div class="form-control-wrap">
                                    <input type="text" class="form-control" id="fleetSize" name="fleetSize" placeholder="Fleet Size" value="{{$customer->fleet_size}}" disabled/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="modeOfSupport">Mode Of Support</label>
                                    <div class="form-control-wrap">
                                        <select class="form-select form-select-sm bg-white" id="modeOfSupport" name="modeOfSupport" data-search="off" multiple data-placeholder="Mode Of Support" disabled>
                                            <option value="">Select</option>
                                            <option value="Workshop" @if($customer->mode_of_support=='Workshop') selected @endif>Workshop</option>
                                            <option value="Site Support" @if($customer->mode_of_support=='Site Support') selected @endif>Site Support</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="region">Region</label>
                                    <div class="form-control-wrap">
                                        <input type="text" class="form-control" id="region" name="region" placeholder="Region" value="{{$customer->region}}" disabled/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="area">Area</label>
                                    <div class="form-control-wrap">
                                        <input type="text" class="form-control" id="area" name="area" placeholder="Area" value="{{$customer->area}}" disabled/>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group">
                                    <label class="form-label" for="dealerName">Dealer Name</label>
                                    <div class="form-control-wrap">
                                        <input type="text" class="form-control" id="dealerName" name="dealerName" placeholder="Dealer Name" value="{{$customer->dealer_name}}" disabled/>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div> -->


            <div class="col-md-12">
                <div class="card card-bordered">
                    <div class="card-body border-bottom">
                        <div class="card-title-group">
                            <div class="card-title">
                                <h6 class="title">Customer Contact</h6>
                            </div>
                        </div>
                    </div>
                    <form action="{{url('campaign/contact/update')}}" method="post" id="contact_form">
                    @csrf
                    <div class="card-body">
                        <table class="table table-bordered table-striped bg-white" id="contact_table">
                            <thead>
                                <tr class="nk-tb-item nk-tb-head">
                                    <th class="nk-tb-col"><span class="sub-text">Default Contact</span></th>
                                    <th class="nk-tb-col"><span class="sub-text">Contact Name</span></th>
                                    <th class="nk-tb-col"><span class="sub-text">Phone No.</span></th>
                                    <th class="nk-tb-col"><span class="sub-text">WhatsApp No.</span></th>
                                    <th class="nk-tb-col"><span class="sub-text">Email</span></th>
                                    <th class="nk-tb-col"><span class="sub-text">Designation</span></th>
                                    <th class="nk-tb-col"><span class="sub-text">Language</span></th>
                                    <th class="nk-tb-col text-center" id="action-col-head"><span class="sub-text">Action</span></th>
                                </tr>
                            </thead>
                            <tbody>
                                <input type="hidden" class="form-control" id="customerId" name="customer_id" value="{{$customer->id}}"/>
                                @if(count($customerContacts)>0)
                                @foreach($customerContacts as $key => $customerContact)
                                <tr class="nk-tb-item">
                                    <td class="nk-tb-col nk-tb-col-check text-center">
                                        <div class="custom-control custom-control-sm custom-radio">
                                            <input type="radio" name="is_default" id="default_first_{{$key}}" value="{{$key}}" class="custom-control-input" @if($customerContact->is_default==1) checked @endif/>
                                            <label class="custom-control-label" for="default_first_{{$key}}"></label>
                                        </div>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="text" class="form-control" id="name_first" name="name[{{ $key }}]" value="{{$customerContact->name}}" data-contactindex="{{ $key }}" placeholder="Enter Name"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="number" class="form-control" id="phone_first" name="phone_number[{{ $key }}]" value="{{$customerContact->phone_number}}" placeholder="Enter phone"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="number" class="form-control" id="whatsapp_first" name="whatsapp_number[{{ $key }}]" value="{{$customerContact->whatsapp_number}}" placeholder="Enter Whatsapp Number"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="email" class="form-control" id="email_first" name="email[{{ $key }}]" value="{{$customerContact->email}}" placeholder="Enter Email"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="text" class="form-control" id="designation_first" name="designation[{{ $key }}]" value="{{$customerContact->designation}}" placeholder="Enter Designation"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="text" class="form-control" id="language_first" name="language[{{ $key }}]" value="{{$customerContact->language}}" placeholder="Enter Language"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md action-col-row text-center"></td>
                                </tr>
                                @endforeach
                                @else
                                <tr class="nk-tb-item">
                                    <td class="nk-tb-col nk-tb-col-check text-center">
                                        <div class="custom-control custom-control-sm custom-radio">
                                            <input type="radio" name="is_default" id="default_first_0" value="0" class="custom-control-input" checked/>
                                            <label class="custom-control-label" for="default_first_0"></label>
                                        </div>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="text" class="form-control" id="name_first" name="name[0]" data-contactindex="0" placeholder="Enter Name"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="number" class="form-control" id="phone_first" name="phone_number[0]" placeholder="Enter phone"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="number" class="form-control" id="whatsapp_first" name="whatsapp_number[0]" placeholder="Enter Whatsapp Number"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="email" class="form-control" id="email_first" name="email[0]"  placeholder="Enter Email"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="text" class="form-control" id="designation_first" name="designation[0]" placeholder="Enter Designation"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md">
                                        <input type="text" class="form-control" id="language_first" name="language[0]" placeholder="Enter Language"/>
                                    </td>
                                    <td class="nk-tb-col tb-col-md action-col-row text-center"></td>
                                </tr>
                                @endif
                            </tbody>
                        </table>
                            
                        <div class="row mt-2">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <button type="button" class="btn btn-primary btn-custom-icon-left" id="add_customer_contact"><em class="icon ni ni-plus"></em><span>Add Contact</span></button>
                                </div>
                            </div>
                            @if($userRole == 'rsm' || $userRole == 'asm')
                            <div class="col-lg-6 text-right">
                                <div class="form-group">
                                    <!-- <a href="javascript:void(0)" class="btn btn-primary" id="customer_update">Update</a> -->
                                    <button type="button" id="customer_update" class="btn btn-primary">Update</button>
                                </div><!-- .col -->
                            </div><!-- .row -->
                            @endif
                        </div>
                    </div>
                    </form>
                </div>
            </div>


            <!-- @if($userRole == 'rsm' || $userRole == 'asm')
            <div class="row">
                <div class="col-lg-12 text-right">
                    <div class="form-group">
                        <a href="javascript:void(0)" class="btn btn-primary" id="customer_update">Update</a>
                    </div>
                </div>
            </div>                       
            @endif -->
            

            <div class="col-md-12" style="display: none;">
                <div class="card card-bordered h-100">
                    <div class="card-body border-bottom">
                        <div class="card-title-group">
                            <div class="card-title">
                                <h6 class="title">Recent Complaints</h6>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                    <table class="broadcast-init dataTable table table-bordered table-striped">
                        <thead>
                            <tr class="nk-tb-item nk-tb-head">
                                <th class="nk-tb-col"><span class="sub-text">Complaint Number</span></th>
                                <th class="nk-tb-col"><span class="sub-text">Complaint Type</span></th>
                                <th class="nk-tb-col"><span class="sub-text">Open Days</span></th>
                                <th class="nk-tb-col"><span class="sub-text">Case Owner</span></th>
                                <th class="nk-tb-col"><span class="sub-text">Action</span></th>
                            </tr>
                        </thead>
                        <tbody>
                            <!-- @foreach($customerComplaints as $key => $complain) -->

                            <!-- <tr class="nk-tb-item">
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{$complain->complaint_number}}</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{$complain->complaint_category}}</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{ $complain->open_days}}</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>Vikram P.</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    {{-- <span><a href="#">Click to View Complaint</a></span> --}}
                                    <span><a href="#" data-toggle="modal" data-target="#complaintModal">Click to View Complaint</a></span>

                                    <div class="modal fade" id="complaintModal" tabindex="-1" role="dialog" aria-labelledby="complaintModalLabel" aria-hidden="true">
                                        <div class="modal-dialog" role="document">
                                           <div class="modal-content">
                                              <div class="modal-header">
                                                 <h5 class="modal-title" id="complaintModalLabel">Complaint Detail</h5>
                                                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                 </button>
                                              </div>
                                              <div class="modal-body">
                                                 <p><span>{{$complain->complaint_number}}</span>
                                                 </p>
                                                 <p><span>{{$complain->description}}</span></p>

                                              </div>
                                              <div class="modal-footer">
                                                 <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                              </div>
                                           </div>
                                        </div>
                                     </div>

                                </td>
                            </tr> -->
                            <!-- .nk-tb-item  -->

                            <!-- @endforeach -->
                        </tbody>
                    </table>
                    <div class="hr-line"></div>
                    </div>
                </div>
            </div>        
        </div>
    </div>
<script type="text/javascript">
$(document).ready(function(){
    $(function() {
		var root_url = "