@extends('layout.default')

@section('styles')@endsection

@section('content')
    <div class="card card-custom card-sticky" id="kt_page_sticky_card">
        <div class="card-header">
            <div class="card-title">
                <h3 class="card-label">{{ $page_title }}</h3>
            </div>
            <div class="card-toolbar">
                @can('complaint.index')
                    <a href="{{ route('complaint.index') }}" class="btn btn-light-primary font-weight-bolder mr-2">
                        <i class="ki ki-long-arrow-back icon-sm"></i>Back(ESC)</a>
                @endPermissionsCan
                @can('complaint.store')
                    <div class="btn-group">
                        <button type="submit" class="btn btn-primary font-weight-bolder" form="complaint_details_form">
                            <i class="ki ki-check icon-sm"></i><u>S</u>ave & Continue
                        </button>
                    </div>
                @endPermissionsCan
            </div>
        </div>

        <div class="card-body" id="load-section-js">
            <table class="table table-bordered" id=""
                   data-url="">
                <tr>
                    <td width="175px;"><strong>Complaint Date :</strong></td>
                    <td width="250px;"> {{ \Carbon\Carbon::createFromFormat('Y-m-d', $complaint->complaint_date)->format('m/d/Y') }}</td>
                    <td width="150px;"><strong>Customer Name :<s/trong></td>
                    <td width="300px;"> {{ $complaint->customer->name }}</td>
                    <td width="150px;"><strong>Distributor Name :</strong></td>
                    <td width="150px;"> {{ $complaint->distributor->name }}</td>
                </tr>
                <tr>
                    <td><strong>Complaint Type :</strong></td>
                    <td> {{  $complaint->complaint_type == 0 ? 'Yes' : 'No'  }}</td>
                    <td><strong>Email :</strong></td>
                    <td> {{ $complaint->email }}</td>
                    <td><strong>Contact :</strong></td>
                    <td> {{ $complaint->contact }}</td>
                </tr>
                <tr>
                    <td><strong>Description :</strong></td>
                    <td> {{ Str::limit($complaint->description,25,'...')  }}</td>
                    <td><strong>Status :</strong></td>
                    <td> {{ $complaint::STATUSES[$complaint->status] }}</td>
                    <td><strong>Invoice No./Sales Order No :</strong></td>
                    <td> {{ isset($complaint->salesOrder) ? $complaint->salesOrder->sales_order_no : '' }}</td>
                </tr>
                <tr>
                    <td><strong>Complaint Taken By :</strong></td>
                    <td> {{  isset($complaint->user) ? $complaint->user->userDetail->first_name : '' }}</td>
                </tr>
            </table>
            <form class="form" id="complaint_details_form" data-method="post"
                  data-url="{{ route('complaint.complaint_details_submit',$complaint->id) }}">
                <input type="hidden" name="complaint_id" value="{{ $complaint->id }}"/>
                <div class="row">
                    <div class="col-md-12 mb-10">
                        <div class="card card-custom card-border card-shadow" data-card="true" id="kt_card_3">
                            <div class="card-header bg-secondary">
                                <div class="card-title">
                                    <h3 class="card-label">Complaint Details</h3>
                                </div>
                                <div class="card-toolbar">
                                    <a href="#" class="btn btn-icon btn-circle btn-sm btn-light-primary mr-1"
                                       data-card-tool="toggle">
                                        <i class="ki ki-arrow-down icon-nm"></i>
                                    </a>
                                </div>
                            </div>
                            <div class="card-body" kt-hidden-height="384">
                                <div class="row">
                                    <div class="col-xl-12">
                                        <div class="tab-content">
                                            <div class="table-responsive" id="complaint_detail_repeater">
                                                <table class="table table-sm table-foot-custom table-foot-bg table-bordered"
                                                       id="kt_table_repeater">
                                                    <thead class="thead-light">
                                                    <tr class="text-left">
                                                        <th scope="col" style="min-width: 150px;">Action Taken By</th>
                                                        <th scope="col" style="min-width: 150px;">Action Date</th>
                                                        <th scope="col" style="min-width: 150px;">Action Type</th>
                                                        <th scope="col" style="min-width: 150px;">Action Description
                                                        </th>
                                                        <th scope="col" style="min-width: 50px;">Delete</th>
                                                    </tr>
                                                    </thead>
                                                    <tbody data-repeater-list="complaint_detail">
                                                    @if(!empty($complaint->complaintDetail) and isset($complaint->complaintDetail) && $complaint->complaintDetail()->count() > 0)
                                                        @foreach($complaint->complaintDetail as $key => $complaintDetail)