@extends('layouts/layoutMaster')

@section('title', 'FRV Evaluation')

<!-- Vendor Styles -->
@section('vendor-style')
@vite([
  'resources/assets/vendor/libs/datatables-bs5/datatables.bootstrap5.scss',
  'resources/assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.scss',
  'resources/assets/vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.scss',
  'resources/assets/vendor/libs/select2/select2.scss',
  'resources/assets/vendor/libs/@form-validation/form-validation.scss',
  'resources/assets/vendor/libs/animate-css/animate.scss',
  'resources/assets/vendor/libs/sweetalert2/sweetalert2.scss'
])
@endsection

<!-- Vendor Scripts -->
@section('vendor-script')
@vite([
  'resources/assets/vendor/libs/moment/moment.js',
  'resources/assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js',
  'resources/assets/vendor/libs/select2/select2.js',
  'resources/assets/vendor/libs/@form-validation/popular.js',
  'resources/assets/vendor/libs/@form-validation/bootstrap5.js',
  'resources/assets/vendor/libs/@form-validation/auto-focus.js',
  'resources/assets/vendor/libs/cleavejs/cleave.js',
  'resources/assets/vendor/libs/cleavejs/cleave-phone.js',
  'resources/assets/vendor/libs/sweetalert2/sweetalert2.js'
])
@endsection

<!-- Page Scripts -->
@section('page-script')
@vite(['resources/js/price_evaluation.js'])
@endsection

@section('content')
<section id="data-list-view" class="data-table-custom">
    @if (Permit::isPermit(Route::current()->uri(),'create'))
    <form action="/admin/frv" class="form-horizontal" method="POST" autocomplete="off" enctype="multipart/form-data">
        @csrf
    <div class="row">
        <div class="col-12 mb-4">
            <div class="card">
                <div class="card-content">
                    <div class="card-body card-dashboard">
                        {{-- vehicle Price Evaluation --}}
                        <div class="row">
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Vin')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                        <input type="text" name="vin" class="form-control" id="vin"  value="{{old('vin')}}">
                                            <div class="form-control-position">
                                                <i class="feather icon-home"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        {{-- <span>{{__('Vin')}}</span> --}}
                                        <span class="text-danger" id="alert-error"></span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <span id="btn-fill" class="btn btn-primary">Fill From System</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Vehicle Manufacturer')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="manufacturer_id" id="manufacturer_id" class="form-control select2" onchange="getmodel(this.value)" >
                                                <option value="">--select--</option>
                                                @foreach($manufacturer as $msngle)
                                                    <option value="{{$msngle->id}}">{{$msngle->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Vehicle Model')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="model_id" id="model_id"  class="form-control select2" >
                                                <option value="">--select--</option>
                                                 {{-- @foreach($vehiclemodel as $msngle)
                                                    <option  value="{{$msngle->id}}">{{$msngle->name}}</option>
                                                @endforeach --}}
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Vehicle Year')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="year_id" id="year_id" class="form-control select2" onchange="gettrim()" >
                                                <option value="">--select--</option> @foreach($vechileyear as $ysngle)
                                                    <option  value="{{$ysngle->id}}">{{$ysngle->name}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Vehicle Trim')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="trim_id" id="trim_id" class="form-control select2" >
                                                <option value="">--select--</option>
                                                {{-- @foreach($vechiletrims as $trim)
                                                    <option  value="{{$trim->id}}">{{$trim->name}}</option>
                                                @endforeach --}}
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 mb-4">
                                <div class="form-group row">

                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <span id="btn-next" class="btn btn-primary">Next</span>
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        {{-- <span>{{__('Vin')}}</span> --}}
                                        <span class="text-danger" id="next-error"></span>
                                        @if (!auth()->user()->partner_id)
                                        <span class="text-success" id="next-success"></span>
                                        <div class="row">
                                        <div class="col-md-6" id="addBasePrice" style="display: none">
                                            <button class="btn btn-warning"  onclick="return false;" id="btn-addBasePrice" >Add Price</button>
                                        </div>
                                        <div class="col-md-6" id="addImage" style="display: none">
                                            <button class="btn btn-primary" onclick="return false;" id="btn-addImage" >Add Image</button>
                                        </div>
                                    </div>
                                    @endif

                                    </div>
                                </div>
                            </div>
                            <div class="col-12 row" id="show-next-data" style="display: none">
                                <div class="col-6 mb-4">
                                    <div class="form-group row">
                                        <div class="col-md-4">
                                            <span>{{__('Vehicle Type')}}</span>
                                        </div>
                                        <div class="col-md-8">
                                            <div class="position-relative has-icon-left">
                                                <input type="radio" name="vehicle_type" checked value="pre-owned">
                                                <label>Pre-owned</label>
                                                <input type="radio" name="vehicle_type" value="new">
                                                <label>New</label>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-12 row" id="show-pre-next-data" style="display: none">
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Vehicle Mileage')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="number" name="mileage" class="form-control" value="{{old('mileage')}}" step="0.01" min="0">
                                            <div class="form-control-position">
                                                <i class="feather icon-home"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Origin')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="origin" id="origin" class="form-control select2" >
                                                <option value="">--select--</option> @foreach($origins as $origin)
                                                    <option  value="{{$origin->id}}">{{$origin->title}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Market Demand')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <input type="hidden" name="dealer" id="dealer"  value="9">
                                        <label id="lb-dealer">Not determined</label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Color')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="color" id="color" class="form-control select2" >
                                                <option value="">--select--</option> @foreach($colors as $color)
                                                    <option  value="{{$color->id}}">{{$color->title}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('purposeOfUses')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="purposeOfUse" id="purposeofuse" class="form-control select2" >
                                                <option value="">--select--</option> @foreach($purposeOfUses as $purposeofuse)
                                                    <option  value="{{$purposeofuse->id}}">{{$purposeofuse->title}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Accidents')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="radio" name="accidents" checked value="Low">
                                            <label>Low</label>
                                            <input type="radio" name="accidents" value="Medium">
                                            <label>Medium</label>
                                            <input type="radio" name="accidents"  value="Major">
                                            <label>Major</label>
                                            <input type="radio" name="accidents" checked value="No">
                                            <label>No</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 repairedBy" style="display: none">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Repaired By')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <select name="repaired_by" id="repaired_by" class="form-control select2" >
                                                <option value="">--select--</option> @foreach($repairDealers as $repairDealer)
                                                    <option  value="{{$repairDealer->id}}">{{$repairDealer->title}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Defect type(s)')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                            <select name="defect_type[]" id="defect_type" class="form-control select2" multiple >
                                                <option value="" disabled>--select--</option> @foreach($defectTypes as $defectType)
                                                    <option  value="{{$defectType->id}}">{{$defectType->title}}</option>
                                                @endforeach
                                            </select>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Select Maintenance History')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="radio" name="Maintenance_History"  value="Available">
                                            <label>Available</label>
                                            <input type="radio" name="Maintenance_History" checked value="Not_Available">
                                            <label>Not Available</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('FaceLift')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <input type="hidden" name="FaceLift" id="face-lift"  value="no">
                                        <label id="lb-face-lift">No</label>

                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('NewModel')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="col-md-8">
                                            <input type="hidden" name="NewModel" id="new-model"  value="no">
                                            <label id="lb-new-model">No</label>

                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Select Certified')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="radio" name="certified"  value="yes">
                                            <label>Yes</label>
                                            <input type="radio" name="certified" checked value="no">
                                            <label>No</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Select Modified')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="radio" name="modified"  value="yes">
                                            <label>Yes</label>
                                            <input type="radio" name="modified" checked value="no">
                                            <label>No</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Select Service Contract')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="radio" name="Service_Contract"  value="yes">
                                            <label>Yes</label>
                                            <input type="radio" name="Service_Contract" checked value="no">
                                            <label>No</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Select Warranty')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="radio" name="warranty"  value="Manufacturer">
                                            <label>Manufacturer</label>
                                            <input type="radio" name="warranty"  value="Car Trust">
                                            <label>Car Trust</label>
                                            <input type="radio" name="warranty"  value="Others">
                                            <label>Others</label>
                                            <input type="radio" name="warranty" checked value="No">
                                            <label>NO WARRANTY</label>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('Plate#')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="text" name="plate_no" class="form-control" value="{{old('plate_no')}}">
                                            <div class="form-control-position">
                                                <i class="feather icon-home"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-6 mb-4">
                                <div class="form-group row">
                                    <div class="col-md-4">
                                        <span>{{__('CT Score')}}</span>
                                    </div>
                                    <div class="col-md-8">
                                        <div class="position-relative has-icon-left">
                                            <input type="number" name="ct_score" class="form-control" value="{{old('ct_score')}}" step="0.01" min="0">
                                            <div class="form-control-position">
                                                <i class="feather icon-home"></i>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>


                            </div>

                            <div class="col-12 row" id="show-new-next-data" style="display: none">
                                <div class="col-6 mb-4">
                                    <div class="form-group row">
                                        <div class="col-md-4">
                                            <span>{{__('Base Price')}}</span>
                                        </div>
                                        <div class="col-md-8">
                                            <div class="position-relative has-icon-left">
                                                <input type="number" name="new_base_price" id="new-base-price" class="form-control" value="{{old('new_base_price')}}" step="0.01" min="0">
                                                <div class="form-control-position">
                                                    <i class="feather icon-home"></i>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-12 mb-4">
                            <div class="block-content block-content-full text-right border-top pt-1">
                                <button type="submit" disabled class="btn btn-primary btn-evaluate "><i
                                            class="fa fa-check mr-1" ></i>{{__('Evaluate')}}</button>
                                <button type="reset" class="btn btn-secondary">{{__('Reset')}}</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    </form>
    @endif

    <h4>Recent FRV Evaluation(s)</h4>
    <div class="row">
        <div class="col-12 mb-4">
            <div class="card">
                <div class="card-content">
                    <div class="card-body card-dashboard">
                        <div class="table-responsive">
                            <table id="recent_evaluation_table" class="table table-striped .data-list-view">
                                <thead>
                                <tr>
                                    <th style="width: 10%;">{{__('VPE-ID')}}</th>
                                    <th style="width: 15%;">{{__('Vin')}}</th>
                                    <th style="width: 15%;">{{__('Make')}}</th>
                                    <th style="width: 15%;">{{__('Model')}}</th>
                                    <th style="width: 15%;">{{__('Year')}}</th>
                                    <th style="width: 15%;">{{__('Trim')}}</th>
                                    <th style="width: 15%;">{{__('Vehicle Type')}}</th>
                                    @if(!auth()->user()->partner_id)
                                    <th style="width: 15%;">{{__('Base Price(SAR)')}}</th>
                                    @endif
                                    <th style="width: 15%;">{{__('Evaluated Price(SAR)')}}</th>
                                    <th style="width: 15%;">{{__('Final Price(SAR)')}}</th>
                                    <th style="width: 15%;">{{__('Upper Limit(SAR)')}}</th>
                                    <th style="width: 15%;">{{__('Lower Limit(SAR)')}}</th>
                                    @if(!auth()->user()->partner_id)
                                    <th style="width: 15%;">{{__('Formulas Applied')}}</th>
                                    @endif
                                    <th style="width: 15%;">{{__('Date')}}</th>
                                    @if(!auth()->user()->partner_id)
                                    <th style="width: 15%;">{{__('Partner Title')}}</th>
                                    @endif
                                    <th style="width: 15%;">{{__('Created By')}}</th>
                                    <th class="d-none d-sm-table-cell">{{__('Actions')}}</th>
                                </tr>
                                </thead>

                                <tfoot>
                                <tr>
                                    <th style="width: 10%;">{{__('VPE-ID')}}</th>
                                    <th style="width: 15%;">{{__('Vin')}}</th>
                                    <th style="width: 15%;">{{__('Make')}}</th>
                                    <th style="width: 15%;">{{__('Model')}}</th>
                                    <th style="width: 15%;">{{__('Year')}}</th>
                                    <th style="width: 15%;">{{__('Trim')}}</th>
                                    <th style="width: 15%;">{{__('Vehicle Type')}}</th>
                                    @if(!auth()->user()->partner_id)
                                    <th style="width: 15%;">{{__('Base Price(SAR)')}}</th>
                                    @endif
                                    <th style="width: 15%;">{{__('Evaluated Price(SAR)')}}</th>
                                    <th style="width: 15%;">{{__('Final Price(SAR)')}}</th>
                                    <th style="width: 15%;">{{__('Upper Limit(SAR)')}}</th>
                                    <th style="width: 15%;">{{__('Lower Limit(SAR)')}}</th>
                                    @if(!auth()->user()->partner_id)
                                    <th style="width: 15%;">{{__('Formulas Applied')}}</th>
                                    @endif
                                    <th style="width: 15%;">{{__('Date')}}</th>
                                    @if(!auth()->user()->partner_id)
                                    <th style="width: 15%;">{{__('Partner Title')}}</th>
                                    @endif
                                    <th style="width: 15%;">{{__('Created By')}}</th>
                                    <th class="d-none d-sm-table-cell">{{__('Actions')}}</th>
                                </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</section>

<style>
    div.detail {
    overflow: auto;
    }
</style>
<div class="modal fade" id="inspectionDetail-modal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-centered1 modal-simple">
    <div class="modal-content">
      <div class="modal-body">
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        <div class="text-center mb-6">
          <h4 class="mb-2">Evaluation Details</h4>
        </div>
        <div class="col-12 mb-4">
            <div class="d-flex justify-content-center">

                <img src="/images/loader.gif" id="loader" alt="" width="50%" height="50%">
            </div>
            <div class="detail" style="height: 500px">
            </div>
        </div>
        </div>
    </div>
</div>
</div>
{{-- basePriceAdd --}}
<div class="modal fade" id="basePriceAdd-modal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-centered1 modal-simple">
    <div class="modal-content">
      <div class="modal-body">
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        <div class="text-center mb-6">
          <h4 class="mb-2">Add Base Price</h4>
        </div>
        <div class="col-12 mb-4">
           <span class="text-success mb-2" id="base_price_success"></span>
            <span class="text-danger mb-2" id="base_price_error"></span>
            <input type="number" step="0.1" placeholder="Base price i.e 150000" id="base_price" class="form-control">
            <button class="btn btn-primary mt-3 mb-3" id="btn-base-price">Add Now!</button>
        </div>
        </div>
    </div>
</div>
</div>
{{-- imageAdd --}}
<div class="modal fade" id="imageAdd-modal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-centered1 modal-simple">
    <div class="modal-content">
      <div class="modal-body">
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        <div class="text-center mb-6">
          <h4 class="mb-2">Add Base Price Image</h4>
        </div>
        <div class="col-12 mb-4">
            <form id="form-image" enctype="multipart/form-data" method="post" action="/admin/price-evaluation/set-base-price-image">
                @csrf
                <span class="text-success mb-2" id="base_price_image_success"></span>
                <span class="text-danger mb-2" id="base_price_image_error"></span>
                <input type="hidden" name="image_make" id="image_make">
                <input type="hidden" name="image_model" id="image_model">
                <input type="hidden" name="image_year" id="image_year">
                <input type="hidden" name="image_trim" id="image_trim">
                <input type="file"  placeholder="Attach Image" name="vehicle_image" class="form-control" accept="image/*" required>
                <button class="btn btn-primary mt-3 mb-3" type="submit" id="btn-base-price-image">Save Now!</button>
            </form>
        </div>
        </div>
    </div>
</div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/sweetalert2@10"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.3.1/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/buttons/1.3.1/js/buttons.html5.min.js"></script>

<script>
    $(document).ready(function () {
        load_data();

    });
    function load_data(vendorId = -1){

table = $('#recent_evaluation_table').DataTable({
    dom: '<"top"<"actions action-btns"B><"action-filters"lf>>rt<"d-flex justify-content-between"ip>'
    , oLanguage: {
        sLengthMenu: "_MENU_"
        , sSearch: ""
    }
    , lengthMenu: [
        [10, 25, 50,10000, -1]
        , [10, 25, 50,10000, "All"]
    ]
    , buttons: [{
            extend: 'csvHtml5'
            , exportOptions: {
                columns: ':visible'
            }
        },
                    {
                        extend: 'excelHtml5',
                        text:'Excel',
                        exportOptions: {
                            columns: ':visible'
                        }
                    }
    ]
    , initComplete: function (settings, json) {
        $(".dt-buttons .btn-primary").removeClass("btn-secondary");
    }
    , processing: true
    , serverSide: true
    , "language": {
        "processing": "<div class='fa-3x'><i class='fa fa-circle-notch fa-spin text-success'></i></div>"
    }
    , "ajax": {
        "url": "/admin/frv/show-recent"
        ,
        data:{vendorId:vendorId}
    },
    "columnDefs": [{
    "defaultContent": "-",
    "targets": "_all"
    }]
    , order: [0, 'desc']
    , columns: @json($columns)
});
}
</script>
<script>
    function changeTable(vendorId){
        $('#recent_evaluation_table').DataTable().destroy();
        load_data(vendorId);
    }
    function getmodel(value) {
       // alert(value);
        $.ajax({
        headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        url: '/admin/get/vechile/op/modelbyid/ajx',
        type: 'GET',
        data: {manufr_id:value},
        success: function (res) {

          $('#model_id').html(res);
        }
        });
    }
    function gettrim() {
        var make=$( "#manufacturer_id" ).val();
        var model=$( "#model_id" ).val();
        var year=$( "#year_id" ).val();
        $.ajax({
        headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        url: '/admin/get/vechile/trim/ajx',
        type: 'GET',
        data: {make:make,model:model,year:year,pg:true},
        success: function (res) {

          $('#trim_id').html(res);
        }
        });
    }
$(function(){
    $("#btn-fill").click(function(){
        $("#alert-error").text('');
        var vin=$("#vin").val();
        if(vin.length<=0){
            $("#alert-error").text('Please enter the proper vin');
            return false;
        }
        //get vehicle info
        $.ajax({
        headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        url: '/admin/price-evaluation/get-vehicle-info',
        type: 'GET',
        data: {vin:vin},
        success: function (res) {
            if(res.success==false){
                $("#alert-error").text('Vin Not found!');
            return false;
            }
            $( "#manufacturer_id" ).val(res.vehicle.make_id);
            $( "#manufacturer_id" ).trigger("change");
            $( "#model_id" ).val(res.vehicle.make_id);
            $( "#model_id" ).trigger("change");
            $( "#year_id" ).val(res.vehicle.year_id);
            $( "#year_id" ).trigger("change");
            $( "#trim_id" ).val(res.vehicle.trim_id);
            $( "#trim_id" ).trigger("change");
            // $( "#manufacturer_id option:selected" ).text(res.vehicle.make);
            // $( "#manufacturer_id option:selected" ).val(res.vehicle.make_id);
            // $( "#model_id option:selected" ).text(res.vehicle.model);
            // $( "#model_id option:selected" ).val(res.vehicle.model_id);
            // $( "#year_id option:selected" ).text(res.vehicle.year);
            // $( "#year_id option:selected" ).val(res.vehicle.year_id);
            // $( "#trim_id option:selected" ).text(res.vehicle.trim);
            // $( "#trim_id option:selected" ).val(res.vehicle.trim_id);
            // $("#manufacturer_id").filter(function() {
          console.log(res);
        //   $('#model_id').html(res);
        }
        });

    });
    $("#btn-base-price").click(function(){
        $("#base_price_error").text('');
        $("#base_price_success").text('');
        var make=$( "#manufacturer_id option:selected" ).val();
        var model=$( "#model_id option:selected" ).val();
        var year=$( "#year_id option:selected" ).val();
        var trim=$( "#trim_id option:selected" ).val();
        var base_price=$( "#base_price" ).val();
        if(make<=0 || model<=0 || year<=0 || trim<=0){
            $("#base_price_error").text('Please select vehicle details.');
            return false;
        }
        if(base_price<=0){
            $("#base_price_error").text('Please add a base price greater than 0.');
            return false;
        }
        $.ajax({
        headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        url: '/admin/price-evaluation/set-base-price',
        type: 'GET',
        data: {make:make,model:model,year:year,trim:trim,base_price:base_price},
        success: function (res) {
            if(res.success==false){
                $("#base_price_error").text('This Make Model Year are not added Yet!');
            return false;
            }
            $("#base_price_success").text("Base price added!");
            $("#basePriceAdd-modal").modal('hide');
            $("#btn-next").trigger( "click" );
        }
        });
    });
    $("#form-image").submit(function(e){
        e.preventDefault();
        $("#base_price_image_error").text('');
        $("#base_price_image_success").text('');
        var make=$( "#manufacturer_id option:selected" ).val();
        var model=$( "#model_id option:selected" ).val();
        var year=$( "#year_id option:selected" ).val();
        var trim=$( "#trim_id option:selected" ).val();

        if(make<=0 || model<=0 || year<=0 || trim<=0){
            $("#base_price_image_error").text('Please select vehicle details first.');
            return false;
        }
        $("#image_make").val(make);
        $("#image_model").val(model);
        $("#image_year").val(year);
        $("#image_trim").val(trim);


        $.ajax({
            url: "/admin/price-evaluation/set-base-price-image",
            type: "POST",
            data:  new FormData(this),
            contentType: false,
            cache: false,
            processData:false,
            success: function(res){

            if(res.success==false){
                $("#base_price_image_error").text('This Make Model Year trim are not added Yet!');
            return false;
            }
            $("#base_price_image_success").text("Base price Image added!");
            $("#imageAdd-modal").modal('hide');
            $("#addImage").hide()
            },
            error: function(){}
        });

    })
    $("#btn-next").click(function(){
        $("#addBasePrice").hide();
        $("#addImage").hide();
        $("#show-next-data").hide();
        $("#show-pre-next-data").hide();
        $("#next-error").text('');
        $("#next-success").text('');
        $("#alert-error").text('');
        var make=$( "#manufacturer_id option:selected" ).val();
        var model=$( "#model_id option:selected" ).val();
        var year=$( "#year_id option:selected" ).val();
        var trim=$( "#trim_id option:selected" ).val();
        if(make<=0 || model<=0 || year<=0 || trim <= 0){
            $("#next-error").text('Please select vehicle details.');
            return false;
        }

        $.ajax({
        headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        url: '/admin/price-evaluation/get-base-price',
        type: 'GET',
        data: {make:make,model:model,year:year,trim:trim},
        success: function (res) {
            if(res.face_lift==1){
                    $("#lb-face-lift").text("Yes")
                    $("#face-lift").val("yes")
            }else{
                $("#lb-face-lift").text("No")
                $("#face-lift").val("no")
            }
            if(res.new_model==1){
                $("#lb-new-model").text("Yes")
                $("#new-model").val("yes")
            }else{
                $("#lb-new-model").text("No")
                $("#new-model").val("no")
            }

            if(res.market_demand==1){
                    $("#lb-dealer").text("High")
                    $("#dealer").val("9")
            }else{
                $("#lb-dealer").text("Not determined")
                $("#dealer").val("10")
            }
            if(res.vehicle_image==false){
                $("#addImage").show();
            }

            if(res.success==false){
                $("#next-error").text('Base price Not added yet for this combination.');
                $("#addBasePrice").show();
            return false;
            }
            $("#show-next-data").show();
            $("#show-pre-next-data").show();
            $("#next-success").text("Base Price(SAR): "+res.base_price);
            var givenBasePrice=res.base_price
            var fiftyPercent = givenBasePrice * 0.5
            $("#new-base-price").val(givenBasePrice);
            $("#new-base-price").attr("min",fiftyPercent);
            $(".btn-evaluate").prop('disabled',false);
            // $( "#manufacturer_id option:selected" ).text(res.vehicle.make);
            // $( "#manufacturer_id option:selected" ).val(res.vehicle.make_id);
            // $( "#model_id option:selected" ).text(res.vehicle.model);
            // $( "#model_id option:selected" ).val(res.vehicle.model_id);
            // $( "#year_id option:selected" ).text(res.vehicle.year);
            // $( "#year_id option:selected" ).val(res.vehicle.year_id);
            // $("#manufacturer_id").filter(function() {
        //   $('#model_id').html(res);
        }
        });

    });
    $('input[type=radio][name=vehicle_type]').change(function() {
        if (this.value == 'new') {
            $("#show-pre-next-data").hide()
            $("#show-new-next-data").show()

        }
        else if (this.value == 'pre-owned') {
            $("#show-pre-next-data").show()
            $("#show-new-next-data").hide()
        }
    });
    //

    $(document).on('click', '.change-price', function (e) {
        $("#loader").hide();
        var vpeId=$(this).attr('data');
        var finalPrice=$(this).attr('data-price');
        $(".detail").html(`<div>
                        <h4>Change Price</h4>
                        <form action="/admin/frv/change-price" method="post">
                        @csrf
                        <div class="p-2">
                        <input type="number" name="final_price" class="form-control" value="`+finalPrice+`" required min="0" step="0.01" placeholder="Enter price">
                        <input type="hidden" name="frv_id" value="`+vpeId+`">
                        <button class="btn btn-primary mt-2"><i class="feather icon-check-circle"></i> Change price</button>
                        </div>

                        </form>
                        </div>`
                    );
    });
    $(document).on('click', '.inspection-detail', function (e) {
                $("#inspectionDetail-modal").modal("show");
                $("#loader").show();
                $(".detail").html('');
                var vpeId=$(this).attr('data');
                $.ajax({
                    url:"/admin/frv/show-details",
                    type:'get',
                    data: {vpeId: vpeId,_token: "{{ csrf_token() }}",},
                    dataType: 'json',
                    "headers": {
                    "accept": "application/json",
                    "Access-Control-Allow-Origin":"*"
                    },
                    success: function (res) {
                        $("#loader").hide();
                        $(".detail").html('');
                        var mileage=res.mileage==undefined ?'NA':res.mileage;
                        var origin=res.origin==undefined ?'NA':res.origin;
                        var dealer=res.dealer==undefined ?'NA':res.dealer;
                        var accidents=res.accidents==undefined ?'NA':res.accidents;
                        var warranty=res.warranty==undefined ?'NA':res.warranty;
                        var ct_score=res.ct_score==undefined ?'NA':res.ct_score;
                        // var Vat_Purchase=res.Vat_Purchase==undefined ?'NA':res.Vat_Purchase;
                        // var location=res.location==undefined ?'NA':res.location;
                        var FaceLift=res.FaceLift==undefined ?'NA':res.FaceLift;
                        var NewModel=res.NewModel==undefined ?'NA':res.NewModel;
                        var certified=res.certified==undefined ?'NA':res.certified;
                        var modified=res.modified==undefined ?'NA':res.modified;
                        var Service_Contract=res.Service_Contract==undefined ?'NA':res.Service_Contract;
                        var maintenanceHistory=res.maintenanceHistory==undefined ?'NA':res.maintenanceHistory;
                        var color=res.maintenanceHistory==undefined ?'NA':res.color;
                        var purposeOfUse=res.maintenanceHistory==undefined ?'NA':res.purposeOfUse;
                        $(".detail").html(`

                            <table class="table table-hover">
            <thead>
            <tr>
            <th scope="col">#</th>
            <th scope="col">Evaluation Criteria</th>
            <th scope="col">Selection</th>
            </tr>
            </thead>
            <tbody>
            <tr>
            <th scope="row">1</th>
            <td>Vehicle Mileage</td>
            <td>`+ mileage +`</td>
            </tr>
            <tr>
            <th scope="row">2</th>
            <td>Origin </td>
            <td>`+ origin +`</td>
            </tr>
            <tr>
            <th scope="row">3</th>
            <td>Market Demand</td>
            <td>`+ dealer +`</td>
            </tr>
            <tr>
            <th scope="row">4</th>
            <td>Accidents</td>
            <td>`+ accidents +`</td>
            </tr>
            <tr>
            <th scope="row">5</th>
            <td>Maintenance History</td>
            <td>`+maintenanceHistory+`</td>
            </tr>
            <tr>
            <th scope="row">6</th>
            <td>FaceLift</td>
            <td>`+FaceLift+`</td>
            </tr>
            <tr>
            <th scope="row">7</th>
            <td>NewModel</td>
            <td>`+NewModel+`</td>
            </tr>
            <tr>
            <th scope="row">8</th>
            <td>Certified</td>
            <td>`+certified+`</td>
            </tr>
            <tr>
            <th scope="row">8</th>
            <td>Modified</td>
            <td>`+modified+`</td>
            </tr>
            <tr>
            <th scope="row">8</th>
            <td>Service Contract</td>
            <td>`+Service_Contract+`</td>
            </tr>
            <tr>
            <th scope="row">9</th>
            <td>Warranty</td>
            <td>`+warranty+`</td>
            </tr>
            <tr>
            <th scope="row">11</th>
            <td>CT Score</td>
            <td>`+ct_score+`</td>
            </tr>
            <tr>
            <th scope="row">13</th>
            <td>Color</td>
            <td>`+color+`</td>
            </tr>
            <tr>
            <th scope="row">14</th>
            <td>Purpose of Use</td>
            <td>`+purposeOfUse+`</td>
            </tr>
            </tbody>
            </table>` );
                    },
                    error: function (error) {
                        console.log(error);
                        $("#loader").hide();
                        $(".detail").html('');
                    }
                });

        });
        $('input[type=radio][name=accidents]').change(function() {
            console.log(this.value);
            if (this.value == 'No') {
                $(".repairedBy").hide()
            }
            else{
                $(".repairedBy").show()
            }
        });
$("#btn-addBasePrice").on("click", function(e) {
    e.preventDefault();
    $("#basePriceAdd-modal").modal("show");
})
$("#btn-addImage").on("click", function(e) {
    e.preventDefault();
    $("#imageAdd-modal").modal("show");
})

});

</script>
@endsection