@extends('template.app') 

@section('meta')
@endsection

@section('title')
Obf Insurance
@endsection

@section('styles')
    <link href="{{ asset('assets/css/dropify.min.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/css/sweetalert2.bundle.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/css/select2.css') }}" rel="stylesheet">
    <style type="text/css">
        #galeria img{
            width: 85px;
            height: 85px;
            border-radius: 10px;
            box-shadow: 0 0 8px rgba(0,0,0,0.2);
            opacity: 85%;
            padding: 3px;
        }
    
        #pan_image_multi img{
            width: 85px;
            height: 85px;
            border-radius: 10px;
            box-shadow: 0 0 8px rgba(0,0,0,0.2);
            opacity: 85%;
            padding: 3px;
        }
    
        #adhar_image_multi img{
            width: 85px;
            height: 85px;
            border-radius: 10px;
            box-shadow: 0 0 8px rgba(0,0,0,0.2);
            opacity: 85%;
            padding: 3px;
        }

        #documents_multi img{
            width: 85px;
            height: 85px;
            border-radius: 10px;
            box-shadow: 0 0 8px rgba(0,0,0,0.2);
            opacity: 85%;
            padding: 3px;
        }
    
        #licance_image_multi img{
            width: 85px;
            height: 85px;
            border-radius: 10px;
            box-shadow: 0 0 8px rgba(0,0,0,0.2);
            opacity: 85%;
            padding: 3px;
        }
    
        .row > .column {
          padding: 0 8px;
        }
    
        .row:after {
          content: "";
          display: table;
          clear: both;
        }
    
        /* Create four equal columns that floats next to eachother */
        .column {
          float: left;
          width: 25%;
        }
    
        /* The Modal (background) */
        .modal {
          display: none;
          position: fixed;
          z-index: 1;
          padding-top: 100px;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          overflow: auto;
          background-color: black;
        }
    
        /* Modal Content */
        .modal-content {
          position: relative;
          background-color: #fefefe;
          margin: auto;
          padding: 0;
          width: 100%;
          max-width: 700px;
        }
    
        /* The Close Button */
        .close {
          color: white;
          position: absolute;
          top: 10px;
          right: 25px;
          font-size: 35px;
          font-weight: bold;
        }
    
        .close:hover,
        .close:focus {
          color: #999;
          text-decoration: none;
          cursor: pointer;
        }
    
        /* Hide the slides by default */
        .mySlides {
          display: none;
        }
    
        /* Next & previous buttons */
        .prev,
        .next {
          cursor: pointer;
          position: absolute;
          top: 50%;
          width: auto;
          padding: 16px;
          margin-top: -50px;
          color: white;
          font-weight: bold;
          font-size: 20px;
          transition: 0.6s ease;
          border-radius: 0 3px 3px 0;
          user-select: none;
          -webkit-user-select: none;
        }
    
        /* Position the "next button" to the right */
        .next {
          right: 0;
          border-radius: 3px 0 0 3px;
        }
    
        /* On hover, add a black background color with a little bit see-through */
        .prev:hover,
        .next:hover {
          background-color: rgba(0, 0, 0, 0.8);
        }
    
        /* Number text (1/3 etc) */
        .numbertext {
          color: #f2f2f2;
          font-size: 12px;
          padding: 8px 12px;
          position: absolute;
          top: 0;
        }
    
        /* Caption text */
        .caption-container {
          text-align: center;
          background-color: black;
          padding: 2px 16px;
          color: white;
        }
    
        img.demo {
          opacity: 0.6;
        }
    
        .active,
        .demo:hover {
          opacity: 1;
        }

        .hover-shadow:hover {
          box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        }
        
        .uploaded_images{
            border:1px solid white;
            border-style: dashed;
            margin-bottom: 20px;
            border-radius: 5px;
        }
        
        .mt-5{
            margin-top: 6rem !important;
        }

    </style>
@endsection

@section('content')
<div class="page-breadcrumb">
    <div class="row">
        <div class="col-7 align-self-center">
            <h4 class="page-title text-truncate text-dark font-weight-medium mb-1">OBF View</h4>
            <div class="d-flex align-items-center">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb m-0 p-0">
                        <li class="breadcrumb-item"><a href="{{ route('dashboard') }}" class="text-muted">Dashboard</a></li>
                        <li class="breadcrumb-item"><a href="{{ route('obf') }}" class="text-muted">OBF</a></li>
                        <li class="breadcrumb-item text-muted active" aria-current="page">Insurance</li>
                    </ol>
                </nav>
            </div>
        </div>
        <div class="col-5 align-self-center">
            <div class="customize-input float-right">
            </div>
        </div>
    </div>
</div>
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    <div class="stepwizard col-md-offset-3">
                        <div class="stepwizard-row setup-panel">
                            <div class="stepwizard-step">
                                <a href="#step-1" type="button" class="btn btn-primary btn-circle text-white">1</a>
                                <p>Personal Details</p>
                            </div>
                            <div class="stepwizard-step">
                                <a href="#step-2" type="button" class="btn btn-default btn-circle text-white">2</a>
                                <p>Car Details</p>
                            </div>
                            @canany(['Process Insurance'])
                                <div class="stepwizard-step">
                                    <a href="#step-3" id="thrid_new" type="button" class="btn btn-default btn-circle text-white">3</a>
                                    <p>Insurance Details</p>
                                </div>
                            @endcanany  
                        </div>
                    </div>
                    <form method="POST" action="{!! route('obf.processinsurancedms') !!}" enctype="multipart/form-data">
                      @csrf
                        <input type="hidden" name="id" value="{{ $id }}">
                        <div class="row setup-content" id="step-1">
                            <div class="col-lg-12 ">
                                <div class="col-md-12">
                                    <h3> Personal Details</h3>
                                    <div class="row">
                                        
                                        <div class="form-group col-md-3">
                                            <label class="control-label">Booking Date</label>
                                            <input type="date" id="booking_date" class="form-control" value="{{ $data->booking_date ?? '' }}" disabled>
                                            <span class="kt-form__help error booking_date"></span>
                                        </div>
                                        
                                        <div class="form-group col-md-3">
                                            <label class="control-label">Customer Name</label>
                                            <input type="text"  id="customer_name" class="form-control" placeholder="Enter Customer Name" value="{{ $data->customer_name ?? '' }}" disabled>
                                            <span class="kt-form__help error customer_name"></span>
                                        </div>
                                    
                                        <div class="form-group col-md-3">
                                            <label class="control-label">Branch</label>
                                            <select id="branch" class="form-control" disabled>
                                                <option value="">Select Branch</option>
                                                @if(isset($branch) && $branch->isNotEmpty())
                                                    @foreach($branch AS $branch)
                                                        <option value="{{ $branch->id }}" @if($data->branch_id == $branch->id) selected @endif >{{ $branch->name }}</option>
                                                    @endforeach
                                                @endif
                                            </select>
                                            <span class="kt-form__help error branch"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">RTO Type</label>
                                            <select  name="customer_type" id="customer_type" class="form-control" placeholder="Enter RTO Type" disabled>
                                                <option value="regular_rto" @if($data->rto_type == 'regular_rto') selected @endif>Regular RTO</option>
                                                <option value="handicap" @if($data->rto_type == 'handicap') selected @endif>Handicap</option>
                                                <option value="taxi" @if($data->rto_type == 'taxi') selected @endif>M-Drive(Taxi)</option>
                                                <option value="electric" @if($data->rto_type == 'electric') selected @endif>Electric</option>
                                                <option value="crtem" @if($data->rto_type == 'crtem') selected @endif>Crtem</option>
                                                <option value="bh_parsing" @if($data->rto_type == 'bh_parsing') selected @endif>BH Parsing</option>
                                            </select>
                                            <span class="kt-form__help error customer_type"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Customer Type</label>
                                            <select id="customer_type_new" class="form-control" disabled>
                                             <option value="">Please Customer Type</option>
                                                @if(isset($CustomerTypeMaster) && $CustomerTypeMaster->isNotEmpty())
                                                    @foreach($CustomerTypeMaster AS $row)
                                                        <option value="{{ $row->id }}" @if($data->customer_type_new == $row->id) selected @endif>{{ $row->name ??'' }}</option>
                                                    @endforeach
                                                @endif
                                            </select>
                                            <span class="kt-form__help error customer_type_new"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Company Name</label>
                                            <input type="text"  id="company_name" class="form-control" placeholder="Enter Company Name" value="{{ $data->company_name ?? '' }}" disabled>
                                            <span class="kt-form__help error company_name"></span>
                                        </div>
                                       
                                        <div class="form-group col-md-3">
                                            <!-- <label class="control-label">EInvoicing Applicable</label> -->
                                            <label class="control-label">e-Invoice Applicable</label>
                                            <select id="einvoapp" class="form-control" disabled>
                                                 <option value="{{ $data->einvoicing_applicable }}">{{ $data->einvoicing_applicable ?? '' }}</option>
                                            </select>
                                            <span class="kt-form__help error einvoapp"></span>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <label class="control-label">GST</label>
                                            <input type="text"  id="gst" class="form-control" placeholder="Enter GSTIN" value="{{ $data->gst ?? '' }}" disabled>
                                            <span class="kt-form__help error gst"></span>
                                        </div>
                                        
                                        <div class="form-group col-md-3">
                                            <label class="control-label mt-3">Address Correspondence</label>
                                            <textarea  id="address_1" class="form-control" placeholder="Enter Address Correspondence" disabled>{{ $data->address ?? '' }}</textarea>
                                            <span class="kt-form__help error address_1"></span>
                                        </div>
                                        
                                        <div class="form-group col-md-3">
                                            <label class="control-label">Registration Correspondence</label>
                                            <span class="btn btn-outline-secondary ml-5 mb-2">&nbsp;&nbsp;&nbsp;<input id="chek_address" type="checkbox" class="form-check-input mr-0" value=""><b>Same AS Above</b></span>
                                            <textarea  id="address_2" class="form-control" placeholder="Enter Registration Correspondence" disabled>{{ $data->registration ?? '' }}</textarea>
                                            <span class="kt-form__help error address_2"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">e-Mail</label>
                                            <input type="email"  id="email" class="form-control" placeholder="Enter Email Address" value="{{ $data->email ?? '' }}" disabled>
                                            <span class="kt-form__help error email"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Mobile Number</label>
                                            <input type="number"  id="contact_number" class="form-control" placeholder="Enter Mobile Number" value="{{ $data->contact_number ?? '' }}" disabled>
                                            <span class="kt-form__help error contact_number"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">PAN No.</label>
                                            <input type="pannumber"  id="pan_number" class="form-control" placeholder="Enter PAN Number" value="{{ $data->pan_number ?? '' }}" disabled>
                                            <span class="kt-form__help error pan_number"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Aadhar No.</label>
                                            <input type="number"  id="aadhar_number" class="form-control" placeholder="Enter Aadhar Number" value="{{ $data->adhar_number ?? '' }}" disabled>
                                            <span class="kt-form__help error aadhar_number"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">License No.</label>
                                            <input type="text"  id="license_number" class="form-control" placeholder="Enter License Number" value="{{ $data->licance_number ?? '' }}" disabled>
                                            <span class="kt-form__help error license_number"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Date of Birth</label>
                                            <input type="date"  id="dob" class="form-control" value="{{ $data->dob ?? '' }}" disabled>
                                            <span class="kt-form__help error dob"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Nominee Name</label>
                                            <input type="text"  id="nominee_name" class="form-control" placeholder="Enter Nominee Name" value="{{ $data->nominee_name ?? '' }}" disabled>
                                            <span class="kt-form__help error nominee_name"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Nominee Relation</label>
                                            <input type="text"  id="nominee_relation" class="form-control" placeholder="Enter Nominee Relation" value="{{ $data->nominee_reletion ?? ''}}" disabled>
                                            <span class="kt-form__help error nominee_relation"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Nominee Age</label>
                                            <input type="number"  id="nominee_age" class="form-control" placeholder="Enter Nominee Age" value="{{ $data->nominee_age ?? '' }}" disabled>
                                            <span class="kt-form__help error nominee_age"></span>
                                        </div>

                                        <div class="form-group col-md-3">
                                            <label class="control-label">Occupation</label>
                                            <input type="text"  id="occupation" class="form-control" placeholder="Enter Occupation" value="{{ $data->occupation ?? '' }}" disabled>
                                            <span class="kt-form__help error occupation"></span>
                                        </div>
                                        <div class="form-group col-md-3">
                                            <div class="row">
                                                <div class="form-group col-md-12">
                                                     <p>Upload PAN</p>
                                                </div>
                                                <div class="form-group col-md-12">
                                                    <div id="pan_image_multi">
                                                                                                        </div>
                                                </div>
                                            </div>                                           
                                        </div>

                                        <div id="myModal" class="modal">
                                          <span class="close cursor" onclick="closeModal()">&times;</span>
                                          <div class="modal-content">
                                             <img class="image_set" src="" style="width:100%;height:470px;">
                                          </div>
                                        </div>    
                                        
                                        <div class="form-group col-md-3">
                                            <div class="row">
                                                <div class="form-group col-md-12">
                                                     <p>Upload Aadhar</p>
                                                </div>
                                                <div class="form-group col-md-12">
                                                    <div id="adhar_image_multi">
                                                                                                        </div>
                                                </div>
                                            </div>                                           
                                        </div>

                                        <div class="form-group col-md-3">
                                            <div class="row">
                                                <div class="form-group col-md-12">
                                                     <p>Upload Voter ID</p>
                                                </div>
                                                <div class="form-group col-md-12">
                                                    <div id="licance_image_multi">
                                                                                                        </div>
                                                </div>
                                            </div>                                           
                                        </div>
                                        
                                        <div class="form-group col-md-3">
                                            <div class="row">
                                                <div class="form-group col-md-12">
                                                     <p>Upload Other Documents</p>
                                                </div>
                                                <div class="form-group col-md-12">
                                                    <div id="galeria">
                                                                                                        </div>
                                                </div>
                                            </div>                                           
                                        </div>
                                    </div>
                                    <a href="{{ route('obf') }}"><button class="btn btn-outline-secondary btn-lg pull-right" type="button">Back</button></a>
                                    <button class=" btn waves-effect waves-light btn-rounded btn-outline-primary nextBtn btn-lg pull-right" type="button">Next</button>
                                </div>
                            </div>
                        </div>
                        <div class="row setup-content" id="step-2">
                            <div class="col-lg-12 ">
                                <div class="col-md-12">
                                    <h3> Car Details</h3>
                                    <div class="row">
                                        <div class="form-group col-md-3">
                                            <label class="control-label">Sales Person Name</label>
                                            <select id="sales_person_name" class="form-control" disabled>