@extends('admin/institute-management/institute-profile/index')

@section('main-content-tab')
<form action="{{route('institute.profile.contact-person.update', ['slug'=>$slug,'id'=>$contact_person_item->id])}}" name="institute" class="form mb-15" method="POST" id="kt_contact_form" enctype="multipart/form-data">
    @csrf
    <h1 class="fw-bolder text-dark mb-9">Update Contact Person</h1>
    <input type="hidden" name="avatar_data" value="{{$contact_person_item->avatar}}">
    <!--begin::Input group-->
    <div class="row mb-3">
    <!--begin::Col-->
        <div class="col-md-6 pe-lg-10">
            <!--begin::Form-->
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="required fs-5 fw-bold mb-2">Name</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{$contact_person_item->name}}" type="text" class="form-control form-control-solid" placeholder="Enter Name" name="name" autocomplete="off"/>
                @if($errors->has('name'))
                    <span class="text-danger">{{ $errors->first('name') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class=" fs-5 fw-bold mb-2">Designation</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{$contact_person_item->designation}}" type="text" class="form-control form-control-solid" placeholder="Enter Designation" name="designation" autocomplete="off"/>
                @if($errors->has('designation'))
                    <span class="text-danger">{{ $errors->first('designation') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="required fs-5 fw-bold mb-2">Phone Number</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{$contact_person_item->phone_number}}" type="text" class="form-control form-control-solid" placeholder="Enter Phone Number" name="phone_number" autocomplete="off"/>
                @if($errors->has('phone_number'))
                    <span class="text-danger">{{ $errors->first('phone_number') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="fs-5 fw-bold mb-2">Alternative Phone Number</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{$contact_person_item->alternative_phone_number}}" type="text" class="form-control form-control-solid" placeholder="Enter Alternative Phone Number" name="alternative_phone_number" autocomplete="off"/>
                @if($errors->has('alternative_phone_number'))
                    <span class="text-danger">{{ $errors->first('alternative_phone_number') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class=" fs-5 fw-bold mb-2">Email</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{$contact_person_item->email}}" type="text" class="form-control form-control-solid" placeholder="Enter Email" name="email" autocomplete="off"/>
                @if($errors->has('email'))
                    <span class="text-danger">{{ $errors->first('email') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class="fs-5 fw-bold mb-2">Alternative Email</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input value="{{$contact_person_item->alternative_email}}" type="text" class="form-control form-control-solid" placeholder="Enter Alternative Email" name="alternative_email" autocomplete="off"/>
                @if($errors->has('alternative_email'))
                    <span class="text-danger">{{ $errors->first('alternative_email') }}</span>
                @endif

                <!--end::Input-->
            </div>
            <div class="row">
                <div class="col-md-4">
                    <div class="d-flex mb-5 fv-row">
                        <label class="form-check form-switch form-check-custom form-check-solid">
                            <span class="required form-check-label fw-bold text-muted" style="margin-right: 10px;margin-left: 0px;">Is Primary</span>
                            <input class="form-check-input radio-btn" name="is_primary"  type="checkbox" value="1" {{$contact_person_item->is_primary == 0 ? '' : 'checked'}}/>
                        </label>
                        <!--end::Switch-->
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="d-flex mb-5 fv-row">
                        <label class="form-check form-switch form-check-custom form-check-solid">
                            <span class="required form-check-label fw-bold text-muted" style="margin-right: 10px;margin-left: 0px;">Is Academic</span>
                            <input class="form-check-input radio-btn" name="is_academic" type="checkbox" value="1" {{$contact_person_item->is_academic == 0 ? '' : 'checked'}}/>
                        </label>
                        <!--end::Switch-->
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="d-flex mb-5 fv-row">
                        <label class="form-check form-switch form-check-custom form-check-solid">
                            <span class="required form-check-label fw-bold text-muted" style="margin-right: 10px;margin-left: 0px;">Is Billing</span>
                            <input class="form-check-input radio-btn" name="is_billing" type="checkbox" value="1" {{$contact_person_item->is_billing == 0 ? '' : 'checked'}}/>
                        </label>
                        <!--end::Switch-->
                    </div>
                </div>
            </div>
            <div class="d-flex mb-5 fv-row">
                <label class="form-check form-switch form-check-custom form-check-solid">
                    <span class="required form-check-label fw-bold text-muted" style="margin-right: 10px;margin-left: 0px;">Status</span>
                    <input class="form-check-input radio-btn" name="status" type="checkbox" value="1" {{$contact_person_item->status == 0 ? '' : 'checked'}} />
                </label>
                <!--end::Switch-->
            </div>
            <div class="d-flex">
                <a style="margin-right:5px;" href="{{route('institute.profile.contact-person', $slug)}}" class="btn btn-secondary">Back</a>
                <button type="submit" class="btn btn-primary" id="kt_contact_submit_button">
                    <!--begin::Indicator-->
                    <span class="indicator-label">Update</span>
                </button>
            </div>
            <!--end::Form-->
        </div>

        <div class="col-md-6 pe-lg-10">
            <div class="d-flex flex-column mb-5 fv-row">
                <!--begin::Label-->
                <label class=" fs-5 fw-bold mb-2">Avatar</label>
                <!--end::Label-->
                <!--begin::Input-->
                <input accept="image/*" id="avatar" type="file" name="avatar" class="form-control dropify" placeholder="Enter Avatar">
                <span style="font-size: 12px;color: red;">Suggested Image ratio: 400 x 400 | max-size: 500 KB</span>
                @if($errors->has('avatar'))
                    <span class="text-danger">{{ $errors->first('avatar') }}</span>
                @endif

                <!--end::Input-->
            </div>
        </div>
    </div>

    <!--end::Submit-->
</form>
@endsection

@section('extra-extra-css')
    <link rel="stylesheet" href="{{ asset('css/dropify.min.css') }}">
@endsection

@section('extra-extra-script')
    <script src="{{ asset('js/jquery.validate.js') }}"></script>
    <script src="{{ asset('js/dropify.min.js') }}"></script>

    //validate form
    <script>
        $(function() {
            $("form[name='institute']").validate({
                rules: {
                    name:'required',
                    // designation:'required',
                    // email: {
                    //     required: true,
                    //     email: true
                    // },
                    phone_number: 'required',
                },
                messages: {
                    name: "Name is required.",
                    designation: "Designation is required.",
                    email: "Email is required.",
                    phone_number: "Phone is required.",
                },
                submitHandler: function(form) {
                form.submit();
                }
            });
        });
    </script>

    <script type="text/javascript">
        $(document).ready(function(){
          var editData = {!! json_encode($contact_person_item) !!};
          if(editData && editData.avatar)
          {
            var imageUrl = "{{URL::asset($contact_person_item->avatar)}}";
            var drEvent = $('#avatar').dropify(
            {
                defaultFile: imageUrl
            });
            drEvent = drEvent.data('dropify');
            drEvent.resetPreview();
            drEvent.clearElement();
            drEvent.settings.defaultFile = imageUrl;
            drEvent.destroy();
            drEvent.init();
          }
          else{
            var drEvent = $('#avatar').dropify();
            drEvent = drEvent.data('dropify');
            drEvent.resetPreview();
            drEvent.clearElement();
          }
        });
    </script>
    <script>
        $(document).ready(function(){
            $('.institute-profile-tab-contact-person').addClass('active');
        });
    </script>
@endsection