@extends('library.layout')

@section('title')
    KEMAUS Contact
@endsection

@section('include_script')
<script src="{{ asset('/js/contactus.js') }}"></script>
@endsection

@section('include_style')
<link rel="stylesheet" type="text/css" href="{{ asset('/css/contactus.css') }}">
@endsection

@section('content')
@csrf
<div class="wrapallctn winheight">

    <div class="teaserbg" style="background: url({{ asset('/assets/images/banner2.jpg') }}) center center / cover;">
        <div class="container">
            <div class="row">
                <div class="textteaser">
                    <span>Contact</span>
                    <hr style="width:30%">
                </div>
            </div>
        </div>
    </div>

    <div class="">
        <div class="container">
            <div class="row">
                <div class="box">
                    <div class="ttlcontact">
                        <span>Request for services</span>
                    </div>
                    <div class="captioncontact">
                        <span>Please complete all fields marked with an asterik.</span>
                    </div>
                    <br>    
                    <form id="form-data" name="form-data">
                        <div class="inputgroup">
                            <div class="row">
                                <div class="col-sm-12">
                                    <input type="text" class="" id="con_name" name="con_name" maxlength="100" />
                                    <label for="con_name">Name<span style="color:red;">*</span></label>
                                </div>
                            </div>
                            <p id="error-con_name" style="color: red;"></p>
                        </div>
                        <div class="inputgroup">
                            <div class="row">
                                <div class="col-sm-12">
                                    <input type="text" class="" id="con_com" name="con_com" maxlength="100" />
                                    <label for="con_com">Company<span style="color:red;">*</span></label>
                                </div>
                            </div>
                            <p id="error-con_com" style="color: red;"></p>
                        </div>
                        <div class="inputgroup">
                            <div class="row">
                                <div class="col-sm-12">
                                    <input type="text" class="" id="con_mail" name="con_mail" maxlength="100" />
                                    <label for="con_mail">Email<span style="color:red;">*</span></label>
                                </div>
                            </div>
                            <p id="error-con_mail" style="color: red;"></p>
                        </div>
                        <div class="inputgroup">
                            <div class="row">
                                <div class="col-sm-12">
                                    <input type="text" class="" id="con_cotnum" name="con_cotnum" maxlength="16" onkeypress="return onlyNumberKey(event)"  />
                                    <label for="con_cotnum">Contact Number<span style="color:red;">*</span></label>
                                </div>
                            </div>
                            <p id="error-con_cotnum" style="color: red;"></p>
                        </div>
                        <div class="inputgroup">
                            <div class="row">
                                <div class="col-sm-12">
                                    <input type="text" class="" id="con_det" name="con_det" maxlength="250" />
                                    <label for="con_det">Details<span style="color:red;">*</span></label>
                                </div>
                            </div>
                            <p id="error-con_det" style="color: red;"></p>
                        </div>
                        <div class="inputgroup" style="display:none;">
                            <div class="row">
                                <div class="col-sm-12">
                                    <input type="text" class="" id="con_cotcode" name="con_cotcode" maxlength="16" />
                                    <label for="con_cotcode">Contact Code<span style="color:red;">*</span></label>
                                </div>
                            </div>
                            <p id="error-con_cotcode" style="color: red;"></p>
                        </div>
                        <div class="">
                            <a class="btn" href="javascript: lastvalidate();">SUBMIT</a>
                        </div>
                    </from>

                    <hr>    

                    <div class="block1">
                        <div class="iconfont"><span>
                            <img src="{{ asset('/assets/images/location.png') }}" alt="" /></span></div>
                        <div class="ttladdress">
                            <span>Register Office</span>
                        </div>
                        <div class="dscaddress">
                            <span>Elago Enterprises Pty Ltd.
                                <br />
                                5 the Cloisters Cherrybrook N.S.W. 2126,Australia
                            <!-- <br />
                                Email : info@kemauschemical.com</span> -->
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
@endsection


@section('script')
<script>
    function submitContact() {
        var formData = new FormData($('#form-data')[0]);
        $.ajax({
            type: 'POST',
            url: "{{ route('contact_us_save') }}",
            data: formData,
            dataType: 'json',
            processData: false,  // tell jQuery not to process the data
            contentType: false,   // tell jQuery not to set contentType
            success: function (data) {
                status_submit = false;
                if(data.status){
                    swal.fire({
                        title: data.title,
                        text: data.text,
                        confirmButtonColor: "#66BB6A",
                        icon: "success",
                        confirmButtonText: "OK",
                    }).then(function () {
                        window.location.href = "{{ route('contactus') }}";
                    }, function (dismiss) {});
                }else{
                    swal.fire({
                        title: data.message,
                        confirmButtonColor: "#EF5350",
                        icon: "error"
                    }).then(function (dismiss) {});
                }
            },
            error: function (xhr, type) {
            status_submit = false;
            }
        });
    }
</script>
@endsection