@extends('admin.layouts.app')

@section('content')
        <div class="container-fluid py-4">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb bg-transparent mb-0 pb-0 px-0 me-sm-6 me-5">
                    <li class="breadcrumb-item text-sm"><a class="opacity-5 text-dark" href="{{ route('admin.dashboard') }}">Dashboard</a>
                    </li>
                    <li class="breadcrumb-item text-sm text-dark active font-weight-bolder" aria-current="page">
                        Application</li>
                </ol>
            </nav>
            <div class="row">
                <div class="col-12">
                    <div class="row justify-content-between">
                        <div class="col-md-4">
                            {{-- <a class="btn bg-gradient-info mb-3" href="./setting.html">Back</a> --}}
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-12"><form role="form" action="{{ route('admin.applications.store') }}" method="POST" enctype="multipart/form-data" id="application-form">
                      @csrf
                      <input type="hidden" name="admin_id" value="{{ auth('admin')->user()->id }}">
                        <div class="row justify-content-center">
                            <div class="col-md-8 col-sm-12">
                                <div class="card pt-4 mb-4 mt-4">
                                    <div class="card-body pt-0 pb-2">
                                      @if($errors->any())
                                      <div class="alert alert-danger">
                                          <ul>
                                              @foreach($errors->all() as $error)
                                                  <li>{{ $error }}</li>
                                              @endforeach
                                          </ul>
                                      </div>
                                      @endif
                                      @if(session('success'))
                                      <div class="alert alert-success">
                                          {{ session('success') }}
                                      </div>
                                      @endif
                                        {{-- <div class="row">
                                            <div class="col-md-6">
                                                <label>Upload Company Logo</label>
                                                <div class="mb-3">
                                                    <div class="profile-wrap d-flex" style="align-items: end">
                                                        <img id="profile-image" class="profile-upload" src="{{ asset($admin->profile_pic) . '?t=' . time() }}" alt="" />
                                                        <input class="mt-1" style="margin-left: 10px" type="file" name="image" id="profile-upload" accept="image/*" style="">
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="row">
                                                    <div class="col-12">
                                                        <label>Company Name <span class="requered-mark">*</span></label>
                                                        <div class="mb-3">
                                                            <input type="text" class="form-control" placeholder="Company Name" name="company_name" value="{{ @$admin->company_name }}">
                                                        </div>
                                                    </div>
                                                    <div class="col-12">
                                                        <label>Phone <span class="requered-mark">*</span></label>
                                                        <div class="mb-3">
                                                            <input type="number" id="phone_no" class="form-control" placeholder="Phone" name="phone" value="{{ @$admin->phone_two }}" maxlength="10">
                                                        </div>
                                                        <div id="phone_no_error" class="text-danger"></div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <label>Company Address <span class="requered-mark">*</span></label>
                                                <div class="mb-3">
                                                    <textarea style="height: 144px;" class="form-control" placeholder="Company Address" name="company_address">{{ @$admin->company_address }}</textarea>
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="row">
                                                    <div class="col-12">
                                                        <label>Fax No. <span class="requered-mark">*</span></label>
                                                        <div class="mb-3">
                                                            <input type="tel" class="form-control" placeholder="" id="fax_no" name="fax_no" value="{{ $admin->fax_no}}">
                                                        </div>
                                                        <div id="fax_no_error" class="text-danger"></div>
                                                    </div>
                                                    <div class="col-12">
                                                        <label>Official Email <span class="requered-mark">*</span></label>
                                                        <div class="mb-3">
                                                            <input type="email" class="form-control" placeholder="Phone" id="official_email" name="official_email" value="{{ @$admin->official_email }}" required>
                                                        </div>
                                                        <div id="official_email_error" class="text-danger"></div>
                                                    </div>
                                                      
                                                    </div>
                                            </div>
                                            <div class="col-md-6">
                                                <label>GST NO. <span class="requered-mark">*</span></label>
                                                <div class="mb-3">
                                                    <input type="text" class="form-control" placeholder="Gst No" name="gst_no" id="gst_no" value="{{ @$admin->gst_no }}" oninput="this.value = this.value.toUpperCase()" maxlength="15">
                                                </div>
                                                <div id="gst_no_error" class="text-danger"></div>
                                                @error('gst_no')
                                                    <span class="invalid-feedback" role="alert">
                                                        <strong>{{ $message }}</strong>
                                                    </span>
                                                @enderror
                                            </div>
                                            <div class="col-md-6">
                                                <label>GST PERCENTAGE <span class="requered-mark">*</span></label>
                                                <div class="mb-3">
                                                    <input type="text" class="form-control" id="gst_percentage" placeholder="Gst Percentage" name="gst_percentage" value="{{ @$admin->gst_percentage }}" maxlength="2">
                                                </div>
                                                <div id="percentage_error" class="text-danger"></div>
                                                @error('percentage_error')
                                                <span class="invalid-feedback" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                                @enderror
                                            </div>
                                            <div class="col-md-6">
                                                <label>FINANCIAL YEAR <span class="requered-mark">*</span></label>
                                                <div class="mb-3">
                                                    <input type="text" class="form-control" placeholder="Financial Year" id="financial_year" name="financial_year" value="{{ @$admin->financial_year }}" maxlength="4">
                                                </div>
                                                @error('financial_year')
                                                <span class="invalid-feedback" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                                @enderror
                                            </div>
                                            
                                            <div class="col-12">
                                              <input type="button" id="saveButton" value="Update" class="btn bg-gradient-info mb-3" style="float: right;" role="button">
                                            </div>
                                        </div> --}}
                                        <div class="row justify-content-center">
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>Company Name <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <input type="text" class="form-control" placeholder="Company Name" name="company_name" value="{{ @$admin->company_name }}">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>Phone <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <input type="number" id="phone_no" class="form-control" placeholder="Phone" name="phone" value="{{ @$admin->phone_two }}" maxlength="10">
                                                        </div>
                                                        <div id="phone_no_error" class="text-danger"></div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>Company Address <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <textarea style="height: 144px;" class="form-control" placeholder="Company Address" name="company_address">{{ @$admin->company_address }}</textarea>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>Fax No. <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <input type="tel" class="form-control" placeholder="" id="fax_no" name="fax_no" value="{{ $admin->fax_no}}">
                                                        </div>
                                                        <div id="fax_no_error" class="text-danger"></div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>Official Email <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <input type="email" class="form-control" placeholder="Phone" id="official_email" name="official_email" value="{{ @$admin->official_email }}" required>
                                                        </div>
                                                        <div id="official_email_error" class="text-danger"></div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>GST NO. <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <input type="text" class="form-control" placeholder="Gst No" name="gst_no" id="gst_no" value="{{ @$admin->gst_no }}" oninput="this.value = this.value.toUpperCase()" maxlength="15">
                                                        </div>
                                                        <div id="gst_no_error" class="text-danger"></div>
                                                        @error('gst_no')
                                                            <span class="invalid-feedback" role="alert">
                                                                <strong>{{ $message }}</strong>
                                                            </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>GST PERCENTAGE <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <input type="text" class="form-control" id="gst_percentage" placeholder="Gst Percentage" name="gst_percentage" value="{{ @$admin->gst_percentage }}" maxlength="2">
                                                        </div>
                                                        <div id="percentage_error" class="text-danger"></div>
                                                        @error('percentage_error')
                                                        <span class="invalid-feedback" role="alert">
                                                            <strong>{{ $message }}</strong>
                                                        </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>FINANCIAL YEAR <span class="requered-mark">*</span></label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <input type="text" class="form-control" placeholder="Financial Year" id="financial_year" name="financial_year" value="{{ @$admin->financial_year }}" maxlength="4">
                                                        </div>
                                                        @error('financial_year')
                                                        <span class="invalid-feedback" role="alert">
                                                            <strong>{{ $message }}</strong>
                                                        </span>
                                                        @enderror
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-9 mb-3">
                                                <div class="row align-items-center">
                                                    <div class="col-md-4">
                                                        <label>Upload Company Logo</label>
                                                    </div>
                                                    <div class="col-md-8">
                                                        <div class="">
                                                            <div class="profile-wrap d-flex" style="align-items: center">
                                                                <img id="profile-image" class="profile-upload" src="{{ asset($admin->profile_pic) . '?t=' . time() }}" alt="" />
                                                                <input class="mt-1" style="margin-left: 15px" type="file" name="image" id="profile-upload" accept="image/*" style="">
                                                            </div>
                                                            
                                                            {{-- <div class="profile-wrap">
                                                              <img id="profile-image" class="profile-upload" src="{{ asset($admin->profile_pic ) }}" alt="" />
                                                          </div> --}}
                                                          
                                                            {{-- <a class="btn bg-gradient-info mt-3" href="" style="width: 120px; height: 42px; margin-left: 15px;">Upload</a> --}}
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row justify-content-center">
                                              <input type="button" id="saveButton" value="Update" class="btn bg-gradient-info mb-3"  style="max-width: 150px;" role="button">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
         

    <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body pb-0">
                    <h1 class="modal-title fs-5" id="exampleModalLabel">Register</h1>
                    <p><span style="color: #198754;">Data Saved Successfully.</span>
                    </p>
                </div>
                <div class="modal-footer border-0 pt-0">
                    <!-- <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
              <button type="button" class="btn btn-primary">Save changes</button> -->
                    <a class="btn bg-gradient-info mb-0 mr-2 btn-sm" href="./setting.html">Ok</a>
                </div>
            </div>
        </div>
    </div>


<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<script>

    
document.getElementById('fax_no').addEventListener('input', function () {
        // Get the input value and remove non-numeric characters
        var inputValue = this.value.replace(/\D/g, '');
        // Ensure the input value does not exceed 10 digits
        if (inputValue.length > 10) {
            inputValue = inputValue.substring(0, 10);
        }
        // Update the input value with only numeric characters
        this.value = inputValue;
    });

document.getElementById('financial_year').addEventListener('input', function () {
    // Get the input value and remove non-numeric characters
    var inputValue = this.value.replace(/\D/g, '');
    // Ensure the input value does not exceed 10 digits
    if (inputValue.length > 10) {
        inputValue = inputValue.substring(0, 4);
    }
    // Update the input value with only numeric characters
    this.value = inputValue;
});

document.getElementById('gst_percentage').addEventListener('input', function () {
    // Get the input value and remove non-numeric characters
    var inputValue = this.value.replace(/\D/g, '');
    // Ensure the input value does not exceed 10 digits
    if (inputValue.length > 10) {
        inputValue = inputValue.substring(0, 4);
    }
    // Update the input value with only numeric characters
    this.value = inputValue;
});


document.getElementById("profile-upload").addEventListener("change", function(e) {
  const fileInput = e.target;
  const image = document.getElementById("profile-image");

  if (fileInput.files && fileInput.files[0]) {
    const reader = new FileReader();

    reader.onload = function(e) {
      image.src = e.target.result;
    };

    reader.readAsDataURL(fileInput.files[0]);
  }
});



$("#saveButton").click(function () {
        // Remove any existing error messages
        $(".text-danger").html('');

        // Perform client-side validation
        var isValid = true;

        function validateInput(inputId, errorMessage, validationRule) {
            var value = $(inputId).val();
            if (!value) {
                $(inputId + "_error").text(errorMessage);
                isValid = false;
            } else if (validationRule && !validationRule.test(value)) {
                $(inputId + "_error").text(" " + errorMessage.toLowerCase());
                isValid = false;
            }
        }

        // Validate Mobile
        validateInput("#phone_no", "Required and Must be 10 digits.", /^\d{10}$/);
        validateInput("#phone_no", "Mobile must be 10 digits.", null);

        // Validate Mobile
        validateInput("#fax_no", "Required and Must be 10 digits.", /^\d{10}$/);
        validateInput("#fax_no", "Fax must be 10 digits.", null);

         // Validate Email
        validateInput("#official_email", "required and must be a valid email format.", /^[^@\s]+@[^@\s]+\.[a-zA-Z]{2,}$/);

        //Validate GST
        validateInput("#gst_no", "Required and must be at least 15 digits.", /^\d{15,}$/);

        // Submit the form if no errors
        if (isValid) {
            // Add your form submission logic here
            $("#application-form").submit(); // This submits the form with id "staff-form"
        }
        // Return whether the form is valid
        return isValid;
    });
</script>
@endsection