@extends('layouts.app')

@section('content')
<style type="text/css">
.form-check {
  display: flex;
  align-items: center;
}

.form-check-input {
  order: 2; /* move checkbox to the end */
  margin-left: auto; /* space between text and checkbox */
}

.form-check-label::before {
  font-weight: bold;
}

.bg-light {
    background-color: rgb(223 229 255) !important;
}

</style>
<div class="container-fluid">
    <!-- Page Header -->
    <div class="d-md-flex d-block align-items-center justify-content-between my-2 page-header-breadcrumb">
        <div>
        </div>
        <div class="main-dashboard-header-right">

        </div>
    </div>
    <!-- End Page Header -->
    <div class="row">
        <div class="col-xl-6">
            <div class="card custom-card">
                <div class="card-header justify-content-between">
                   <div class="card-title">
                      Helpdesk Update
                   </div>
                </div>
                <div class="card-body">
                  <form id="helpdeskForm" action="{{ route('savepostdata') }}" method="post" novalidate>
                   @csrf
                   <input type="hidden" name="posttype" value="helpdesk">
                   <div class="row">
                      <div class="col-md-12 mb-3">
                          <p class="text-muted">Support Number:</p>
                          <input type="text" name="supportnumber" value="{{@$companydata->number}}" placeholder="Enter Valid Number" class="form-control"> 
                      </div>

                      <div class="col-md-12 mb-3">
                         <label class="form-label">Support Email</label>
                         <input type="email" name="supportemail" value="{{@$companydata->email}}"placeholder="Enter Valid Email" class="form-control"> 
                      </div>

                      <div class="col-md-12 text-right">
                         <button type="submit" class="btn btn-primary">Update</button>
                      </div>
                   </div>
                  </form> 
                  </div>
              </div>
        </div>
    </div>

</div>

@endsection
@section('scripts')
<script type="text/javascript">
$(document).ready(function() {
        $( "#helpdeskForm").validate({
            rules: {
                supportnumber: {
                    required: true
                }
            },
            messages: {
                supportnumber: {
                    required: "Please enter valid value",
                }
            },
            errorElement: "p",
            errorPlacement: function ( error, element ) {
                if ( element.prop("tagName").toLowerCase() === "select" ) {
                    error.insertAfter( element.closest( ".form-group" ).find(".select2") );
                } else {
                    error.insertAfter( element );
                }
            },
            submitHandler: function () {
                var form = $('#helpdeskForm');
                form.ajaxSubmit({
                    dataType:'json',
                    beforeSubmit:function(){
                        form.find('button:submit').button('loading');
                    },
                    complete: function () {
                        form.find('button:submit').button('reset');
                    },
                    success:function(data){
                        if(data.status == "success"){
                            msgalert('success', data.message);
                        }else if(data.status == "failed"){
                            msgalert('warning', data.message);
                        }else{
                             msgalert('warning', data.status);
                        }
                    },
                    error: function(errors) {
                        showError(errors, form);
                    }
                });
            }
        });

});

</script>
@endsection