@extends('layouts.app')
@section('page-title', 'Home')
@section('body-content')
    <!-- #########################################################(Request for quote Start)########################################################### -->
    <section id="requestforquote">

        <div class="requestforquote_wrapper g_in_spacing_inline g_in_spacing_block">

            <div class="auto-container">

                <div class="row">

                    <div class="col-md-12">
                        <div class="RFQ-title">
                            <h1>Request For <span>Quote</span></h1>
                        </div>
                    </div>

                    <div class="col-md-12">

                        <div class="RFQ-text">

                            <p>California Computer Comapny , We are well-versed in a variety of operating systems, networks,
                                and databases. We use this expertise to help our customers with a variety of small to
                                mid-sized projects. Many companies find that constant
                                maintenance eats into their budget for new technology.
                            </p>



                        </div>


                    </div>

                    <div class="col-md-6">

                        <div class="rfq-image">


                            <img src="/images/resource/rfq/rfq.jpg" alt="Request for Quote Image">

                        </div>

                    </div>

                    <div class="col-md-6">

                        <div class="RFQ-form">

                            <div class="RFQ-form_container">

                                <div class="row nested-row">
                                    <div class="col-md-12 col-lg-12 col-xs-12">
                                        @if (session('success'))
                                            <div class="alert alert-success" id="success-alert">
                                                {{ session('success') }}
                                            </div>
                                        @elseif(session('error'))
                                            <div class="alert alert-danger" id="error-alert">
                                                {{ session('error') }}
                                            </div>
                                        @endif
                                        <form action="{{ route('rfq.store') }}" method="POST">
                                            @csrf
                                            <div class="row">

                                                <div class="col-lg-6 col-md-6 col-sm-12">
                                                    <div class="form-group">
                                                        <label for="name">Full Name<span
                                                                class="astrickcolor">*</span></label>
                                                        <input type="text" name="name" class="form-control"
                                                            id="name" placeholder="" value="{{ old('name') }}"
                                                            required>
                                                    </div>
                                                </div>
                                                <div class="col-lg-6 col-md-6 col-sm-12">
                                                    <div class="form-group">
                                                        <label for="cname">Company Name</label>
                                                        <input type="text" class="form-control" id="cname"
                                                            name="cname" placeholder="" value="{{ old('cname') }}">
                                                    </div>
                                                </div>
                                                <div class="col-lg-6 col-md-6 col-sm-12">
                                                    <div class="form-group">
                                                        <label for="email">Email<span
                                                                class="astrickcolor">*</span></label>
                                                        <input type="text" class="form-control" id="email"
                                                            name="email" placeholder="" value="{{ old('email') }}"
                                                            required>
                                                    </div>
                                                </div>
                                                <div class="col-lg-6 col-md-6 col-sm-12">
                                                    <div class="form-group">
                                                        <label for="phone">Phone<span
                                                                class="astrickcolor">*</span></label>
                                                        <input type="type" class="form-control no-spinners"
                                                            id="phone" name="phone" value="{{ old('phone') }}"
                                                            placeholder="" required>
                                                    </div>
                                                </div>
                                                <div class="col-md-12 col-sm-12">
                                                    <div class="form-group">
                                                        <label for="message">Message<span
                                                                class="astrickcolor">*</span></label>
                                                        <textarea type="text" class="form-control" id="message" name="message" placeholder="" required>{{ old('message') }}</textarea>
                                                    </div>
                                                </div>
                                                <div class="col-lg-6 col-md-6 col-sm-12">
                                                    <div class="form-group">
                                                        <label for="security_code">Security Code<span
                                                                class="astrickcolor">*</span></label>
                                                        <input type="text" class="form-control" id="security_code"
                                                            name="security_code" placeholder="" required>

                                                    </div>
                                                </div>

                                                <div class="col-lg-6 col-md-6 col-sm-12 captchaCode">
                                                    <div class="form-group">
                                                        <img style="height:60px; width:140px"
                                                            src="{{ route('captcha.get') }}?rand=1867716676"
                                                            id='captcha'>
                                                        <br>
                                                        <p><br>Need another security code? <a style="color: #ffb103;"
                                                                href="javascript:void(0)" id="reloadCaptcha">Click</a></p>
                                                    </div>

                                                </div>


                                                @if ($errors->any())
                                                    <div class="alert alert-danger">
                                                        <ul>
                                                            @foreach ($errors->all() as $error)
                                                                <li>{{ $error }}</li>
                                                            @endforeach
                                                        </ul>
                                                    </div>
                                                @endif
                                                <div class="col-md-12 col-lg-12 col-xs-12">
                                                    <div class="form-group">
                                                        <input value="Submit" class="RFQ-SubmitBtn btnAfterEffectOnly"
                                                            type="submit">
                                                    </div>
                                                </div>

                                            </div>
                                        </form>
                                    </div>
                                </div>


                            </div>



                        </div>





                    </div>
                </div>




            </div>



        </div>





    </section>
    <!-- #########################################################(Request for quote End)########################################################### -->

@endsection

@section('end-scripts')
    <script>
        $(document).ready(function() {
            $("#reloadCaptcha").click(function() {
                var captchaImage = $('#captcha').attr('src');
                captchaImage = captchaImage.substring(0, captchaImage.lastIndexOf("?"));
                captchaImage = captchaImage + "?rand=" + Math.random() * 1000;
                $('#captcha').attr('src', captchaImage);
            });
        });

        setTimeout(function() {
            document.getElementById('success-alert')?.remove();
            document.getElementById('error-alert')?.remove();
        }, 5000);
    </script>
@endsection